diff options
Diffstat (limited to 'debian/missing-sources/wyrm/sass/wyrm_core/_grid_settings.sass')
-rw-r--r-- | debian/missing-sources/wyrm/sass/wyrm_core/_grid_settings.sass | 41 |
1 files changed, 41 insertions, 0 deletions
diff --git a/debian/missing-sources/wyrm/sass/wyrm_core/_grid_settings.sass b/debian/missing-sources/wyrm/sass/wyrm_core/_grid_settings.sass new file mode 100644 index 0000000..fc0f614 --- /dev/null +++ b/debian/missing-sources/wyrm/sass/wyrm_core/_grid_settings.sass @@ -0,0 +1,41 @@ +// Grids +// +// Wyrm uses Bourbon's [Neat grid system](http://neat.bourbon.io) with `$border-box-sizing: true`. Please visit their site +// for full documenation. Wyrm's `+media()` breakpoint settings are set as follows in +// `wyrm_core/_grid_settings.sass`. +// +// * `+media($desktop-wide)` is 12 columns, min-width: 1400px wide. +// * `+media($desktop)` is 12 columns, min-width: 769px wide. +// * `+media($tablet)` is 8 columns, max-width: 768px. +// * `+media($mobile)` is 4 columns, max-width: 480px. +// +// Because Wyrm is used in a couple different Ember setups, we added the `+omega-type` mixin to `wyrm_core/neat_extra.sass`. +// It's essentially the same as Neat's `+omega` mixin, but uses nth-of-type to make play nice with Ember's love of adding +// additional DOM objects in between your constructed markup. +// +// Markup: +// <div class="grid-example"> +// <p>+outer-container applied to this wrapping grid.</p> +// <aside>+span-columns(4)</aside> +// <section>+span-columns(8) +omega-type</section> +// </div> +// +// Styleguide 5.0 + + +@import "neat-helpers" + +$column: golden-ratio(1em, 3) !default +$gutter: golden-ratio(1em, 1) !default +$grid-columns: 12 !default +$max-width: 100% !default +$border-box-sizing: true !default +$default-feature: min-width +$default-layout-direction: LTR !default + +$mobile: new-breakpoint(max-width 480px 4) +$tablet: new-breakpoint(max-width 768px 8) +$desktop: new-breakpoint(min-width 769px 12) +$desktop-wide: new-breakpoint(min-width 1200px 12) +$desktop-wider: new-breakpoint(min-width 1400px 12) + |