Support NeoGAF

[PetriP-TNT]

Yeah, so when you embed from YouTube you get something that looks like this

I'm looking to get this though

As near as I can tell, it's not an option in any embed setting in YouTube. Am I just crazy missing something?

You should be able to it via CSS quite easily, the playlist on the main page isn't quite the same as the one in the embed player.

Styling the div with class "ytp-playlist-menu" is the key here.

 

[WanderingWind]

Hahahaha, yeah. Just inspected with Firebug. I wish it was just as simple as that! There is a lot going on there that I'm unfamiliar with at the moment. Maybe I'll look for a jquery plugin to mimic the functionality instead.

 

[Bots are better than you]

Would embedding the video and the playlist in seperate containers/iframes be a possible workaround?

 

[WanderingWind]

Would embedding the video and the playlist in seperate containers/iframes be a possible workaround?

I thought of that, but the issue is getting the video in say, the second link, to fire in the large window.

So, like this

 

[Ikuu]

Switched from Brackets to Atom exclusively for working JSX highlighting.

Redux hurts my head, but I finally figured it out, I think.

ES6 is pretty cool.

Tried to set up eslint with Atom. Gave up. 2 much configuration 4 me.

Been messing around with Redux too, someone said it was easier than Flux but I'm just not seeing that. I think I prefer it to Flux but I'm not sure if I'm just telling myself that after I spent so long trying to understand it.

 

[Haly]

For me the hardest part was accounting for all the functions like combineReducer, createStore, connect, <Provider>, mapStateToProps, etc. While connections between entities in Flux is simply a matter of importing the object and using it, Redux relies on so many blackbox functions to glue things together.

 

[megarockexe]

I have a JavaScript that gets the text of something. How do I only get the first 3 numbers that appear in this string it gets? It looks like this:

$('#menu_rcp').text()

 

[Copons]

I have a JavaScript that gets the text of something. How do I only get the first 3 numbers that appear in this string it gets? It looks like this:

$('#menu_rcp').text()

If you mean you need the first three characters of the string (regardless of them being numbers or not), it's as easy as

$('#menu_rcp').text().substring(0, 3);

If instead you actually need the first three numbers in a string containing any kind of characters, then you'll need a regular expression and a proper programmer to help you, because regexps always make my head dizzy.

 

[PetriP-TNT]

If instead you actually need the first three numbers in a string containing any kind of characters, then you'll need a regular expression and a proper programmer to help you, because regexps always make my head dizzy.

You can just use .replace(/\D/g) to remove non-digit characters

$("#menu_rcp").text().replace(/\D/g, "").substring(0, 3);

 

[Copons]

You can just use .replace(/\D/g) to remove non-digit characters

$("#menu_rcp").text().replace(/\D/g, "").substring(0, 3);

But that's a regexp! Oh my poor head! I'll totally have to call in sick now.

 

[PetriP-TNT]

But that's a regexp! Oh my poor head! I'll totally have to call in sick now.

RegExp rules man.

Sorta.

Kinda.

 

[WanderingWind]

I think I've figured out how to tackle my problem from yesterday, but does anybody know of a good place to get tutorials for stuff like making lightboxs and sliders and other web ..widgets? ...components?

 

[PetriP-TNT]

but does anybody know of a good place to get tutorials for stuff like making lightboxs and sliders and other web ..widgets? ...components?

Well, the first tutorial is to: don't if one good one already exists. With stuff like Lightboxes and Sliders, seemingly trivial but often used components there are already thousand implementations and couple of good ones out there. I said seemingly, because many times they aren't that trivial under the hood, just look like this popular carousel library

For building new components, reading Addy Osmanis Javascript Module Patterns could be a good way to dive in.

 

[Copons]

Well, the first tutorial is to: don't if one good one already exists. With stuff like Lightboxes and Sliders, seemingly trivial but often used components there are already thousand implementations and couple of good ones out there. I said seemingly, because many times they aren't that trivial under the hood, just look like this popular carousel library

Yeah, as someone who did write lightboxes and sliders by himself back when I was learning JS, I can testify that, while lightboxes are nowadays fairly easy to create, sliders are a huge pain in the ass.

My advice in these matters is to find a quick tutorial, try doing it once by yourself, learn how it actually works, and then go get a pre-made one as fast as you can.

 

[WanderingWind]

That's how I've been doing things, but I'm running into gaps in my knowledge. I don't expect to be able to make say, a slider that is better than something on Envato or anything, but I would at least like to know how and why they work.

I've been using third-party lightboxes for a while. Sliders are more difficult to find good ones, actually. All of them want to do all this crazy shit, or they're focused solely on photos. I want to learn how to do one that does something different.

For instance, I have a grid of 6 photos that are links to deeper content. I want those sitting centered in the div with 6 more on another "slide." So, I have say, 24 of those links, the user can slide to the right one without me having a grid of 24 sitting on a page.

If that makes like, any sense at all.

 

[Copons]

That's how I've been doing things, but I'm running into gaps in my knowledge. I don't expect to be able to make say, a slider that is better than something on Envato or anything, but I would at least like to know how and why they work.

I've been using third-party lightboxes for a while. Sliders are more difficult to find good ones, actually. All of them want to do all this crazy shit, or they're focused solely on photos. I want to learn how to do one that does something different.

For instance, I have a grid of 6 photos that are links to deeper content. I want those sitting centered in the div with 6 more on another "slide." So, I have say, 24 of those links, the user can slide to the right one without me having a grid of 24 sitting on a page.

If that makes like, any sense at all.

If I understood right, you basically need a slider for a certain number of, let's say, thumbnails (linking to some content NOT related to the slider), that slides of a fixed number of thumbnails (in your example, 6 at a time).

Something like this? http://bxslider.com/examples/carousel-demystified


EDIT: in the examples they usually use images for the slides content, but you should be able to fill it with anything you want.

 

[WanderingWind]

If I understood right, you basically need a slider for a certain number of, let's say, thumbnails (linking to some content NOT related to the slider), that slides of a fixed number of thumbnails (in your example, 6 at a time).

Something like this? http://bxslider.com/examples/carousel-demystified


EDIT: in the examples they usually use images for the slides content, but you should be able to fill it with anything you want.

Yeah, exactly. Except for that I've used bxslider and it doesn't work with content that is in its own div. So, it'll do photos, videos and even iframes fairly well, but it won't work with a grid of 6 thumbnails (that as you better put it, link to content not related to the slider).

Like so:

 

[Bots are better than you]

Where does the content of that slideshow will come from? Is it fixed HTML you write/can alter or does it come dynamically, from a database or something?

From all Plugins i used, none should fill your needs ... the only that i think comes close to what you want is Slick.
Maybe you won't dodge doing it yourself, but that shouldn't be too hard.

 

[Copons]

Yeah, exactly. Except for that I've used bxslider and it doesn't work with content that is in its own div. So, it'll do photos, videos and even iframes fairly well, but it won't work with a grid of 6 thumbnails (that as you better put it, link to content not related to the slider).

Like so:

Ah, got it.

So, what you're trying to do is inserting that 3x2 grid inside a single slide.
I guess it's the correct course of action for what you want.

I cannot try it right now, but I vividly remember to be able to put whatever I wanted in bxSlider.

Spoiler

On the other hand, I could also confuse it with another random slider...

Could it be a floats-clearing problem?

 

[WanderingWind]

Where does the content of that slideshow will come from? Is it fixed HTML you write/can alter or does it come dynamically, from a database or something?

From all Plugins i used, none should fill your needs ... the only that i think comes close to what you want is Slick.
Maybe you won't dodge doing it yourself, but that shouldn't be too hard.

All the content will just be be <a><img> tags with a <p> of text underneath those. Maybe each in their own div? I dunno. But yeah, no premade solution is coming to mind, but it's hard to Google exactly what I'm looking for.

Ah, got it.

So, what you're trying to do is inserting that 3x2 grid inside a single slide.
I guess it's the correct course of action for what you want.

I cannot try it right now, but I vividly remember to be able to put whatever I wanted in bxSlider.

Spoiler

On the other hand, I could also confuse it with another random slider...

Could it be a floats-clearing problem?

I'll take another look at it, but it didn't really work that way the last time I used it (like 6 months ago). bxslider is pretty nice otherwise, even if it's a bit older looking. Trying to update the buttons is what got me into learning sprites.

 

[Bots are better than you]

Hmm, i definitively would wrap the content of a slide thumb in a container.

Basic structure could be:

Wrapper (section or div) --> Visible Area Wrapper --> Wrapper for the content --> Slide structure (ul with li or divs ... both should work) --> Single slide content aka your Wrapper with img/video/whatever, link and text.

Feel free to use, comment, enhance, optimize.

 

[megarockexe]

If you mean you need the first three characters of the string (regardless of them being numbers or not), it's as easy as

$('#menu_rcp').text().substring(0, 3);

If instead you actually need the first three numbers in a string containing any kind of characters, then you'll need a regular expression and a proper programmer to help you, because regexps always make my head dizzy.

You can just use .replace(/D/g) to remove non-digit characters

$("#menu_rcp").text().replace(/D/g, "").substring(0, 3);

Thanks. I'll try these soon.

 

[sharkmuncher]

Ok so I've been fighting this for a while now and for whatever reason can't get the carousel buttons to light up with the images (or work). They just appear at the top portion of the screen while the rest is at the bottom. Also, this is pretty much my first time trying something like this, so if there's any other more general recommendations, they would be greatly appreciated.

EDIT: So
section {
clear: both;
}
got the positioning right. Still doesn't change pictures.


html:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
  <meta name="description" content="">
  <meta name="author" content="">
  <link rel="icon" href="assets/img/favicon.ico">

  <title>Dental</title>

  <!-- Bootstrap core CSS -->
  <link href="assets/css/bootstrap.css" rel="stylesheet">

  <!-- Custom styles for this template -->
  <link href="assets/css/app.css" rel="stylesheet">


  <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
      <![endif]-->
</head>

    <body>
      <div class="background">
        <header>
        <div class="top-header">
          <div class="transbox">
            <div class="col-md-5 col-md-offset-1">
                <img src="assets/img/dental-logo.png" width="100%">
            </div>
            <div class="col-md-6">
              <row>
                <div class="col-md-3 col-xs-12 col-sm-3 col-sm-offset-1">
                  <div class="text-right">
                    <p class ="address-top">
                      <strong>Shopping Center</strong>
                      <br>
                      <strong>1000 S Broadway</strong>
                      <br>
                      <strong>City, ST 11111</strong>
                    </p>
                    <div style="white-space: nowrap;">
                      <p class="phone">P: <a href="tel:1-555-555-5555">(555) 555-5555</a></p>
                      <p><strong>Office Hours:</strong></p>
                      <p class="hours">
                        M 8:00 am - 5:00 pm
                        <br>
                        T 8:00 am - 5:00 pm
                        <br>
                        W 8:00 am - 5:00 pm
                        <br>
                        Th 8:00 am - 5:00 pm
                        <br>
                        F 8:00 am - noon
                        <br>
                      </p>
                    </div>
                    <p class="hours">Closed Saturday and Sunday</p>
                  </div>
                </div>
                <div class="col-md-8 col-xs-12 col-sm-8">
                  <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
                  Google Maps with address
                </script>
                </div>
              </row>
              </div>
          </div>
        </div>
      </header>

        <section class="about-us">
          <div class="col-md-3 col-sm-offset-1">
            <img src=assets/img/dr.jpg>
            <h3> Dr. the First</h3>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam malesuada, arcu et sodales ullamcorper, tellus velit elementum tellus, vitae eleifend tellus turpis eget tellus. Quisque ut venenatis diam. Etiam condimentum elit neque, at porttitor justo laoreet sed. Vivamus sed porttitor turpis, sed luctus dolor. Etiam eu cursus neque. Fusce in mi vel magna aliquet mollis. Nam non neque sed libero tempor vehicula. Fusce eros neque, luctus eget ante id, pretium viverra massa. Sed malesuada, eros ac dignissim interdum, nulla urna iaculis diam, ac vulputate lorem enim eu purus. Nulla dictum ligula ut est feugiat, sit amet ornare tellus posuere. Praesent ac diam eu justo placerat eleifend id sit amet libero. Donec nunc nunc, suscipit at ante et, rutrum scelerisque massa. Sed tincidunt auctor magna sed mollis.

            </p>
          </div>

          <div class="col-md-3">
            <img src=assets/img/drs-2.jpg>
            <h3> Dr. One </h3>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam malesuada, arcu et sodales ullamcorper, tellus velit elementum tellus, vitae eleifend tellus turpis eget tellus. Quisque ut venenatis diam. Etiam condimentum elit neque, at porttitor justo laoreet sed. Vivamus sed porttitor turpis, sed luctus dolor. Etiam eu cursus neque. Fusce in mi vel magna aliquet mollis. Nam non neque sed libero tempor vehicula. Fusce eros neque, luctus eget ante id, pretium viverra massa. Sed malesuada, eros ac dignissim interdum, nulla urna iaculis diam, ac vulputate lorem enim eu purus. Nulla dictum ligula ut est feugiat, sit amet ornare tellus posuere. Praesent ac diam eu justo placerat eleifend id sit amet libero. Donec nunc nunc, suscipit at ante et, rutrum scelerisque massa. Sed tincidunt auctor magna sed mollis.
            </p>
          </div>
          <div class="col-md-3">
            <h3> Dr. Other  </h3>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam malesuada, arcu et sodales ullamcorper, tellus velit elementum tellus, vitae eleifend tellus turpis eget tellus. Quisque ut venenatis diam. Etiam condimentum elit neque, at porttitor justo laoreet sed. Vivamus sed porttitor turpis, sed luctus dolor. Etiam eu cursus neque. Fusce in mi vel magna aliquet mollis. Nam non neque sed libero tempor vehicula. Fusce eros neque, luctus eget ante id, pretium viverra massa. Sed malesuada, eros ac dignissim interdum, nulla urna iaculis diam, ac vulputate lorem enim eu purus. Nulla dictum ligula ut est feugiat, sit amet ornare tellus posuere. Praesent ac diam eu justo placerat eleifend id sit amet libero. Donec nunc nunc, suscipit at ante et, rutrum scelerisque massa. Sed tincidunt auctor magna sed mollis.
            </p>
          </div>
        </section>
        

        <section class="photos">
        <div class="pictures">
          <div id="myCarousel" class="carousel slide" data-ride="carousel">
            <!-- Indicators -->
            <ol class="carousel-indicators">
              <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
              <li data-target="#myCarousel" data-slide-to="1"></li>
              <li data-target="#myCarousel" data-slide-to="2"></li>
              <li data-target="#myCarousel" data-slide-to="3"></li>
              <li data-target="#myCarousel" data-slide-to="4"></li>
            </ol>

            <!-- Wrapper for slides -->
            <div class="carousel-inner" role="listbox">
              
              <div class="item active">
                <img src="assets/img/clean.jpg" alt="Cleaning" class="rotate90" >
              </div>

              <div class="item">
                <img src="assets/img/front-desk.jpg" alt="Friendly Staff">
              </div>

              <div class="item">
                <img src="assets/img/front.jpg" alt="Waiting Room">
              </div>

              <div class="item">
                <img src="assets/img/hall.jpg" alt="Hallway">
              </div>

              <div class="item">
                <img src="assets/img/lab.jpg" alt="State of the Art Laboratory">
              </div>
            </div>

          <!-- Left and right controls -->
          <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
            <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
            
          </a>
          <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
            <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
            
          </a>
        </div>
      </div>
    </section>
      <div id="push"></div>


    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->

  </body>

  <!--Google Analytics-->
  <script>
code removed

</script>
</html>

css:

body {
    background: url(../img/toothbrush-opq.jpg);
    background-size: cover;
    background-repeat: no-repeat;
}
section {
  clear:all;
}
.phone {
    font-size: 14px;
    font-weight: bold;
}

.address-top {
    font-size: 12px;
}

.hours {
    font-size: 11px;
}

.top-header {
	padding-top: 50px;
    padding-bottom: 50px;
}

.about-us {
    background-color: red;
}

.pictures {
    padding-top: 50px;
    padding-bottom: 100px;
    margin: 25px;

    width: 85%;
    left: 50%;
}

.rotate90 {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

div img {
    padding: 0;
    max-width: 100%;
}
#header, #content, #footer, .widget {
    overflow: hidden;
}

div.transbox p {
    margin: 5%;
    font-weight: bold;
    color: black;
}

#map-canvas {
    width: 300;
    height: 300;
    background-color: #CCC;
}
/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
  height: 500px;
  margin-bottom: 60px;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel .item {
  height: 500px;
  background-color: #777;
}
.carousel-inner > .item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 500px;
}

 

[cyborg009]

Looks like I have to wipe up a website real quick for a student club. Should I use wix or wordpress? I haven't used any of them before. I've started to get into website development but I feel like I'm too new to get something up quickly.

Asking again.

 

[Starphoenix]

Asking again.

I know nothing about Wix, but Wordpress isn't too hard to use, if you're just wanting to put together a static site without much of the blogging elements in place.

 

[WanderingWind]

Asking again.

If it's just for a student club, might as well just grab a WordPress theme and go with it. Unless you're experienced, it'll be better than anything you can whip up in a short amount of time.

 

[Copons]

And after only 10 hours of swearing and raging against both my cats, I've finally got why NOT A SINGLE webpack tutorial was working for me.

Basically, I was using something like

var PATH = __dirname + '/app';

on Windows.


Goddamit.
I feel so stupid, yet I feel MS is so stupid. They already have a case-insensitive system, why not extend it to be slash-insensitive too?

 

[PetriP-TNT]

And after only 10 hours of swearing and raging against both my cats, I've finally got why NOT A SINGLE webpack tutorial was working for me.

Basically, I was using something like

var PATH = __dirname + '/app';

on Windows.


Goddamit.
I feel so stupid, yet I feel MS is so stupid. They already have a case-insensitive system, why not extend it to be slash-insensitive too?

The slashes shouldn't matter, even if Windows uses backwards slashes (\). Are you sure that was your issue? What's your Node version?

 

[Copons]

The slashes shouldn't matter, even if Windows uses backwards slashes (\). Are you sure that was your issue? What's your Node version?

Node 4.0, Webpack and Webpack Dev Server both 1.12

It actually took me by surprise too, considering it was the very first time I actually had to change the slashes in a Node thing.
But I'm pretty sure that was the issue, because as soon as I changed / into \\, everything worked like a charm.
Even though, I'm actually still using / in every other path except the one I've mentioned before.


Detailing:
I was trying to setup a super simple Webpack hot server with a SASS loader.
Webpack itself was working fine, outputting the bundle with no problems at all, but the server wasn't watching at file changes (thus not hot-reloading) and all the various style-, css- and sass-loaders were throwing an error because Webpack was trying to load them from the wrong directory.
Namely, its path was relative to the webpack.config instead of the mentioned PATH variable (context of the webpack module).

Anyway, for no real good reasons, inverted the slash and immediately both the loaders and the hot reloading started working perfectly.

 

[grmlin]

Well, Webpack is a feature-rich monster Browserify is way more simple to use, but does not offer a lot of the cool things one might want.

If I know that I will be fine with a single JS-File (Building multiple files is a not as easy as in Webpack, on demand loading not possible), I use browserify for sure.


Windows really is bonkers in times. We have one project where I had to "fix" the node-modules directory, because Windows could not handle the long pathnames created by nested modules.

 

[Copons]

Well, Webpack is a feature-rich monster Browserify is way more simple to use, but does not offer a lot of the cool things one might want.

If I know that I will be fine with a single JS-File (Building multiple files is a not as easy as in Webpack, on demand loading not possible), I use browserify for sure.


Windows really is bonkers in times. We have one project where I had to "fix" the node-modules directory, because Windows could not handle the long pathnames created by nested modules.

Yeah, I just had to decide between learning Webpack or Browserify, and decided for the former, especially because I see it used all over the place in React tutorials.


As for the long pathnames, I hate it so so so much, like when you want to delete a directory containing Node stuff, and you basically have to start renaming all the fucking subdirectories with one-char-long names to finally delete them.

But I blame Node even more than Win, because I strongly believe the current system, where every module has its own absurdly nested module-tree of modules having their own module tree, is bonkers.


Actually though, and I may be totally wrong, but since i updated to Win 10, I didn't get the long pathname error anymore.
It may be because I finally decided to shorten the dev folder path, or Win 10 actually allowing long paths, I dunno, but so far I'm happy anyway.

Also, does Win 10 (Pro) have a C++ compiler preinstalled?
Cause, when installing node-gyp, I think I only got the missing Python error, but not the compilation one.
I installed Visual Studio anyway, and I got to install everything fine even without setting the --msvs_version flag to the actual version I have.

 

[PetriP-TNT]

Protips for the long paths:

- If you want a GUI, install 7zip: it can delete long paths without any problems plus it's a great zipping program
- If you are okay with command line: install rimraf globally with npm

npm install -g rimraf

Then delete the node_modules with

rimraf node_modules

 

[Copons]

Protips for the long paths:

- If you want a GUI, install 7zip: it can delete long paths without any problems plus it's a great zipping program
- If you are okay with command line: install rimraf globally with npm

npm install -g rimraf

Then delete the node_modules with

rimraf node_modules

Those are great suggestions thanks!

I've actually used 7zip for years, but I honestly don't think I've ever opened it, only used it via context menu, so it's an awesome new I can use it for yet another essential task!

 

[WanderingWind]

Meanwhile in n00b land, I just discovered what CTRL+/ does. I've been doing it the stupid way for a solid year now.

 

[Haly]

I remember struggling with paths on Windows. A tutorial for building via npm wasn't working for me because of this issue. Scroll down to "The Windows Problem".

Eventually I gave up and went back to Gulp.

 

[grmlin]

The problem my workmate faced had something to do with his git client. I think it refused to work at all.

I will tell him about you tips, thank you for that @Petrip-TNT! (hopefully, he will leave Windows behind soon)

 

[Copons]

Btw what I was doing some random learning to build up an Angular 1 app, but with a full module loading support (with Webpack), written in ES6 just for fun and skinned in Material Design.

What I didn't consider was Material itself.
I've written a simple button, and now I've wasted a good half hour just clicking on it and saying "woah" everytime the ripple effect fires.

 

[Haly]

I read over the Material doc the other day. It really is a great design language.

 

[grmlin]

The problem with material and all other frameworks like this: it gets old fast if everyone uses it. And especially mobile app developers use material a lot lately.

I like it though and it's way better than all the custom UIs normally used in mobile apps

 

[Copons]

I read over the Material doc the other day. It really is a great design language.

That was a really awesome reading indeed!
One could agree or not with some of that, but the thought given to it is amazing.

What was even more interesting was the timing.
IIRC it was published just before the infamous iOS flat redesign, that for my tastes was and still is an utter mess, and (Material) contributed to my goodbye to the Apple world after several years of actually happy OSX use.

The problem with material and all other frameworks like this: it gets old fast if everyone uses it. And especially mobile app developers use material a lot lately.

I like it though and it's way better than all the custom UIs normally used in mobile apps

That's my fear too.
For how beautiful it is, it's really basic, maybe even bland (except the ripple effect, which is the best thing ever), and it relies too much on the media (ie. images) content of the apps themselves.
I don't blame Material: being basic and universal is its very purpose and it pulls it off admirably.
Luckily, as far as my most used apps go, they all managed to give it enough personality to not tire me at all.

 

[Haly]

I want a laptop for development work. What goes into choosing a mobile workstation?

I'm thinking of something with an ultrabook profile, a decent CPU, a nice chunk of RAM, integrated graphics (so I'm not tempted to game on it), with some kind of *nix installation. Do I have the right idea?

 

[grmlin]

I want a laptop for development work. What goes into choosing a mobile workstation?

I'm thinking of something with an ultrabook profile, a decent CPU, a nice chunk of RAM, integrated graphics (so I'm not tempted to game on it), with some kind of *nix installation. Do I have the right idea?

Macbook Pro

 

[Syphon Filter]

I need help making a website responsive. I want things to change at max-width:959px for tablets. The changes are there but i notice that there is white space on the right for some strange reason. So it won't look right on a tablet since that white space is still there. Anyone know what the issue could be?

 

[Maiar_m]

I need help making a website responsive. I want things to change at max-width:959px for tablets. The changes are there but i notice that there is white space on the right for some strange reason. So it won't look right on a tablet since that white space is still there. Anyone know what the issue could be?

It's usually an element that's not fluid (its size isn't set to be inherited from its container or not set in percentages / fluid values). It's often painstaking to find which element is doing that though.

 

[Copons]

It's usually an element that's not fluid (its size isn't set to be inherited from its container or not set in percentages / fluid values). It's often painstaking to find which element is doing that though.

Definitely this.
Try resizing your browser's width to below the breakpoint, go all the way to the right and then start scrolling up and down. You should notice most of your layout stopping at the correct point, except, possibly, the culprit element (to me, it usually happens with images, embedded stuff or a footer I temporary styled a month earlier and then I forgot to responsivize).

 

[Wolf Akela]

Gotta love Safari iOS giving me so many stupid bugs to fix! Like being able to taphold on any other device/browser combo except that one.

I dont have to support IE so at least I have that going for me.

 

[StopMakingSense]

I need help making a website responsive. I want things to change at max-width:959px for tablets. The changes are there but i notice that there is white space on the right for some strange reason. So it won't look right on a tablet since that white space is still there. Anyone know what the issue could be?

Yeah, use Web Inspector on the site at that width and go down the DOM tree to see where the element that's causing the problem. Something is pushing the content wider.

 

[Syphon Filter]

Yeah, use Web Inspector on the site at that width and go down the DOM tree to see where the element that's causing the problem. Something is pushing the content wider.

Thanks! Took so long but it worked! Appreciate it.

 

[kodecraft]

Thanks! Took so long but it worked! Appreciate it.

So is this solved? What was the exact issue?

 

[cyborg009]

Does anyone know any good sites for color combinations? I only know of http://www.colorcombos.com/ but I know there's better ones out around.