... move variables from main skeleton file into _variables.scss module and put rest of source code into _base.scss module. Main skeleton file should then include them ...

This way you can keep source code as it is and you do not have problems updating to the latest version when using skeleton as a dependency ...

Hi,

The install says that I need to run npm install, but there is no package.json. What am I missing here?

Cheers,
ed

Hello. I love this repo, but when i switched my html from regular skeleton to this one, the letters "æ, ø and å" did not show. Do you know what causes it?

All I did was put this in an empty .sass file:

@import "bower_components/skeleton-scss/scss/skeleton"

And I get this error:

Seems like a great way to categorize the contents, IMO.

Skeleton it's a amazing and simple grid system, and that's awesome.

Maybe we could divide the files by definition like the "Table of contents" int the main file.

What you say about it?

Hi,

This is more of a question - but how come the column widths in this SASS (and also LESS) project seem to be so different to those in the original CSS?

For example, the original skeleton.css reads:

  .one.column,
  .one.columns                    { width: 4.66666666667%; }
  .two.columns                    { width: 13.3333333333%; }
  .three.columns                  { width: 22%;            }
  .four.columns                   { width: 30.6666666667%; }
  .five.columns                   { width: 39.3333333333%; }
  .six.columns                    { width: 48%;            }
  .seven.columns                  { width: 56.6666666667%; }
  .eight.columns                  { width: 65.3333333333%; }
  .nine.columns                   { width: 74.0%;          }
  .ten.columns                    { width: 82.6666666667%; }
  .eleven.columns                 { width: 91.3333333333%; }
  .twelve.columns                 { width: 100%; margin-left: 0; }

But the SCSS file compiles to:

  .container .one.column,
  .container .one.columns {
    width: 6.83333%;
  }
  .container .two.columns {
    width: 15.16667%;
  }
  .container .three.columns {
    width: 23.5%;
  }
  .container .four.columns {
    width: 31.83333%;
  }
  .container .five.columns {
    width: 40.16667%;
  }
  .container .six.columns {
    width: 48.5%;
  }
  .container .seven.columns {
    width: 56.83333%;
  }
  .container .eight.columns {
    width: 65.16667%;
  }
  .container .nine.columns {
    width: 73.5%;
  }
  .container .ten.columns {
    width: 81.83333%;
  }
  .container .eleven.columns {
    width: 90.16667%;
  }
  .container .twelve.columns {
    width: 100%;
    margin-left: 0;
  }

The current function for column-offset-length is missing the addition of $column-margin

Should we include normalize.css as dependency in the bower install??

"Dependancies" should be "Dependencies"

Not sure if this is intended, I noticed it after redownloading a project of mine, bower downloaded the latest version of this project, which in turn broke the typography of the page because it was based on the old version where typography was part of skeleton.scss

https://github.com/nDmitry/grunt-autoprefixer

Include Normalize and @import into the skeleton file.

Hello! It would be great if you'd pack this into a gem!
So that i can install/update the package via terminal gem install skeleton-sass
and then just require it in my main scss file @import "skeleton-sass"

In this way I can actually include the modules I need and not the whole project

I've seen you're using the 62.5% font size 'trick' on the html element to simplify the mathematical aspect of converting px to rem. Using a rem-calc function (like Foundation has one) would solve your "problem" without messing around with the base font-size.
(Besides the point that setting type sizes in px is considered bad practice for legitimate reasons anyway.)

@function strip-unit($num) {
  @return $num / ($num * 0 + 1);
}

@function convert-to-rem($value, $base-value: $rem-base)  {
  $value: strip-unit($value) / strip-unit($base-value) * 1rem;
  @if ($value == 0rem) { $value: 0; } // Turn 0rem into 0
  @return $value;
}

@function rem-calc($values, $base-value: $rem-base) {
  $max: length($values);
  @if $max == 1 { @return convert-to-rem(nth($values, 1), $base-value); }
  $remValues: ();
  @for $i from 1 through $max {
    $remValues: append($remValues, convert-to-rem(nth($values, $i), $base-value));
  }
  @return $remValues;
}

So you could simply type margin-bottom: rem-calc(20px);
If you're interested in this I could submit a pull request.

Hey, I noticed that I couldn't use grunt's wiredep for this package, turns out the "main" property in bower.json doesn't point to the file. It says "skeleton.scss", however, it should say "scss/skeleton.scss". (as the file resides in the /scss directory)

Good day,

Sorry to be abrupt, just found Skeleton-Sass.
Am quite happy playing around with it, and would like to contribute.

I would highly suggest libsass integration.
From experience, trading ruby sass engine with libsass is beneficial because:

• a LOT faster than ruby sass on larger projects
• does not need ruby as a dependency

The change is quite simple and easy, (I've done and tested it on local test pages)
You should be able to have a look here:
master...tenshi13:master.add.libsass

The change is basically using:

• node-sass (the node wrapper for libsass )
• then grunt-sass (allows us to interface to node-sass via grunt)

would like to hear what you think?

regards,
Ethan HO

Hi,

Inputs with type set as date are not styles as the other inputs.

Cheers,
Jerome

Would it be a good idea for this fork, to create it as a bower package, so we can include dependencies etc. Or should we just add in normalize.css and manage the version updates ourselves?

From what I can tell Grunt offers no real benefit over a basic npm script so why not get rid of it and reduce the number of dependencies?

Citing: https://medium.freecodecamp.org/why-i-left-gulp-and-grunt-for-npm-scripts-3d6853dd22b8