zen-grids 2.0.0.beta.1 → 2.0.0.beta.2

data/templates/project/_layout.scss

@@ -1,117 +0,0 @@
-/**
- * @file
- * Layout styles.
- *
- * We use example breakpoints of 444px, 666px, 777px, 999px and 1111px. The
- * right breakpoints to use for your site depend on your content.
- */
-
-.centered {
-  @include zen-grid-background();
-  padding: {
-    top: 1.5em;
-    bottom: 1.5em;
-  }
-  margin: {
-    left: auto;
-    right: auto;
-  }
-  max-width: 1111px;
-}
-
-/* Set the shared properties for all grid items. */
-%grid-item,
-.grid-item {
-  @include zen-grid-item-base();
-}
-
-/* Set the container for our grid items. */
-.main {
-  @include zen-grid-container();
-}
-
-/* Horizontal navigation bar */
-@media all and (min-width: 444px) {
-  $zen-columns: 1;
-  $navbar-height: 5em;
-
-  .main {
-    padding-top: $navbar-height;
-  }
-  .grid-item__menu {
-    @include zen-grid-item(1, 1);
-    margin-top: -$navbar-height;
-    height: $navbar-height;
-  }
-}
-
-@media all and (min-width: 444px) and (max-width: 665px) {
-  $zen-columns: 2;
-
-  .centered {
-    @include zen-grid-background();
-  }
-  .grid-item__content {
-    @include zen-grid-item(2, 1);
-  }
-  .grid-item__aside1 {
-    @include zen-new-row(); // Clear left-floated elements (.grid-item__content)
-    @include zen-grid-item(1, 1);
-  }
-  .grid-item__aside2 {
-    @include zen-grid-item(1, 2);
-  }
-}
-
-@media all and (min-width: 666px) and (max-width: 776px) {
-  $zen-columns: 3;
-
-  .centered {
-    @include zen-grid-background();
-  }
-  .grid-item__content {
-    @include zen-grid-item(2, 1);
-  }
-  .grid-item__aside1 {
-    @include zen-grid-item(1, 1, right); // Position from the right
-  }
-  .grid-item__aside2 {
-    @include zen-new-row(); // Clear left-floated elements (.grid-item__content)
-    @include zen-grid-item(2, 1);
-  }
-}
-
-@media all and (min-width: 777px) and (max-width: 998px) {
-  $zen-columns: 3;
-
-  .centered {
-    @include zen-grid-background();
-  }
-  .grid-item__content {
-    @include zen-grid-item(2, 1);
-  }
-  .grid-item__aside1 {
-    @include zen-grid-item(1, 1, right); // Position from the right
-  }
-  .grid-item__aside2 {
-    @include zen-new-row(right); // Clear right-floated elements (.grid-item__aside1)
-    @include zen-grid-item(1, 1, right);
-  }
-}
-
-@media all and (min-width: 999px) {
-  $zen-columns: 5;
-
-  .centered {
-    @include zen-grid-background();
-  }
-  .grid-item__content {
-    @include zen-grid-item(3, 2);
-  }
-  .grid-item__aside1 {
-    @include zen-grid-item(1, 1);
-  }
-  .grid-item__aside2 {
-    @include zen-grid-item(1, 5);
-  }
-}

data/templates/project/_modules.scss

@@ -1,78 +0,0 @@
-/**
- * @file
- * Modular styles.
- */
-
-
-html {
-  font-size: 16px;
-  line-height: 1.5em;
-}
-
-p {
-  margin: {
-    top: 1.5em;
-    bottom: 1.5em;
-  }
-}
-
-/* Skip link styling */
-.skip-link {
-  margin: 0;
-}
-.skip-link__link,
-.skip-link__link:visited {
-  display: block;
-  width: 100%;
-  padding: 2px 0 3px 0;
-  text-align: center;
-  background-color: #666;
-  color: #fff;
-}
-/* The skip-link link will be completely hidden until a user tabs to the link. */
-@media all and (min-width: 444px) {
-  .skip-link__link {
-    @include visually-focusable();
-  }
-}
-
-/* Set a consistent padding around all containers */
-.header,
-.footer {
-  @extend %grid-item;
-}
-.grid-item,
-.footer {
-  padding-top: 1.5em;
-}
-
-/* Source-order meta info */
-header {
-  h1,
-  h2 {
-    display: inline;
-  }
-  p {
-    display: inline;
-    text-transform: uppercase;
-    font-size: 0.8em;
-    color: #c00;
-  }
-}
-
-.pull-quote {
-  $font-size: 1.2em;
-
-  @include zen-float();
-  @include zen-grid-flow-item(1, 2);
-  @media all and (min-width: 999px) {
-    @include zen-grid-flow-item(1, 3);
-  }
-  margin: {
-    top: 1em*(1.5em/$font-size);
-  }
-  font-size: $font-size;
-  line-height: 1em*(1.5em/$font-size);
-  font-weight: bold;
-  font-style: italic;
-}

data/templates/unit-tests/README.txt

@@ -1,16 +0,0 @@
-UNIT TESTS FOR ZEN GRIDS
-------------------------
-
-To run the unit tests for Zen Grids:
-
-1. Create a "tests" Compass project using the unit-tests pattern:
-
-   compass create tests -r zen-grids --using=zen-grids/unit-tests
-
-2. From inside the "tests" project, compare the compiled stylesheets to the
-   previous unit test results in the test-results directory:
-
-   diff -r test-results/ stylesheets/
-
-   If the unit tests were successful, the above command should report no
-   differences.

data/templates/unit-tests/manifest.rb

@@ -1,37 +0,0 @@
-description "Unit tests for the Zen Grids system."
-
-stylesheet 'sass/function-zen-direction-switch.scss', :media => 'all', :to => 'function-zen-direction-switch.scss'
-stylesheet 'sass/function-zen-grid-item-width.scss',  :media => 'all', :to => 'function-zen-grid-item-width.scss'
-stylesheet 'sass/function-zen-half-gutter.scss',      :media => 'all', :to => 'function-zen-half-gutter.scss'
-stylesheet 'sass/function-zen-unit-width.scss',       :media => 'all', :to => 'function-zen-unit-width.scss'
-stylesheet 'sass/zen-new-row.scss',                   :media => 'all', :to => 'zen-new-row.scss'
-stylesheet 'sass/zen-float.scss',                     :media => 'all', :to => 'zen-float.scss'
-stylesheet 'sass/zen-grid-background.scss',           :media => 'all', :to => 'zen-grid-background.scss'
-stylesheet 'sass/zen-grid-container.scss',            :media => 'all', :to => 'zen-grid-container.scss'
-stylesheet 'sass/zen-grid-flow-item.scss',            :media => 'all', :to => 'zen-grid-flow-item.scss'
-stylesheet 'sass/zen-grid-item-base.scss',            :media => 'all', :to => 'zen-grid-item-base.scss'
-stylesheet 'sass/zen-grid-item.scss',                 :media => 'all', :to => 'zen-grid-item.scss'
-
-file 'test-results/function-zen-direction-switch.css'
-file 'test-results/function-zen-grid-item-width.css'
-file 'test-results/function-zen-half-gutter.css'
-file 'test-results/function-zen-unit-width.css'
-file 'test-results/zen-new-row.css'
-file 'test-results/zen-float.css'
-file 'test-results/zen-grid-background.css'
-file 'test-results/zen-grid-container.css'
-file 'test-results/zen-grid-flow-item.css'
-file 'test-results/zen-grid-item-base.css'
-file 'test-results/zen-grid-item.css'
-
-file 'README.txt'
-
-help %Q{
-To run the unit tests, simply run "compass compile" and compare the generated
-CSS to those in the results directory.
-  diff -r results css
-}
-
-welcome_message %Q{
-You rock! The unit tests for the Zen Grids system are now installed.
-}

data/templates/unit-tests/sass/zen-grid-background.scss

@@ -1,80 +0,0 @@
-/**
- * @file
- * Test zen-grid-background()
- */
-
-@import "zen-grids/background";
-
-#test-zen-grid-background {
-  /* Test zen-grid-background() with 1 column grid and 20px gutter */
-  $zen-grid-numbers: top;
-  @include zen-grid-background();
-  $zen-grid-numbers: both;
-
-  /* Test zen-grid-background() with margin gutter method, 5 column grid and 5% gutter */
-  $zen-columns: 5;
-  $zen-gutters: 5%;
-  $zen-gutter-method: margin;
-  $zen-grid-numbers: top;
-  @include zen-grid-background();
-  $zen-columns: 1;
-  $zen-gutters: 20px;
-  $zen-gutter-method: padding;
-  $zen-grid-numbers: both;
-
-  // Turn off numbers for all other tests.
-  $zen-grid-numbers: none;
-
-  /* Test zen-grid-background() with 12 column grid and 20px gutter */
-  $zen-columns: 12;
-  @include zen-grid-background();
-  $zen-columns: 1;
-
-  /* Test zen-grid-background(), 5 column grid, 10% gutter and black grid color */
-  $zen-columns: 5;
-  $zen-gutters: 10%;
-  $zen-grid-color: #000;
-  @include zen-grid-background();
-  $zen-columns: 1;
-  $zen-gutters: 20px;
-  $zen-grid-color: rgba(#ffdede, 0.8);
-
-  /* Test zen-grid-background() with 5 column grid and 40px gutter */
-  $zen-columns: 5;
-  $zen-gutters: 40px;
-  @include zen-grid-background();
-  $zen-columns: 1;
-  $zen-gutters: 20px;
-
-  /* Test zen-grid-background(), 5 column grid and 10% gutter and $zen-switch-direction */
-  $zen-columns: 5;
-  $zen-gutters: 10%;
-  $zen-switch-direction: true;
-  @include zen-grid-background();
-  $zen-columns: 1;
-  $zen-gutters: 20px;
-  $zen-switch-direction: false;
-
-  /* Test zen-grid-background() with 5 column grid and 40px gutter and $zen-switch-direction */
-  $zen-columns: 5;
-  $zen-gutters: 40px;
-  $zen-switch-direction: true;
-  @include zen-grid-background();
-  $zen-columns: 1;
-  $zen-gutters: 20px;
-  $zen-switch-direction: false;
-
-  /* Test zen-grid-background() with $zen-grid-width: 1000px, 5 column grid and 40px gutter */
-  $zen-grid-width: 1000px;
-  $zen-columns: 5;
-  $zen-gutters: 40px;
-  @include zen-grid-background();
-  $zen-grid-width: 100%;
-  $zen-columns: 1;
-  $zen-gutters: 20px;
-
-  /* Test zen-grid-background() with all 24 grid numbers */
-  $zen-columns: 24;
-  @include zen-grid-background();
-  $zen-columns: 1;
-}

data/templates/unit-tests/sass/zen-grid-container.scss

@@ -1,44 +0,0 @@
-/**
- * @file
- * Test zen-grid-container()
- */
-
-@import "zen-grids";
-
-#test-zen-grid-container {
-  /* Test zen-grid-container() */
-  @include zen-grid-container();
-}
-
-#test-zen-grid-container-2 {
-  /* Test zen-grid-container() with $legacy-support-for-ie7: true */
-  $legacy-support-for-ie7: true;
-  @include zen-grid-container();
-  $legacy-support-for-ie7: false;
-}
-
-#test-zen-grid-container-3 {
-  /* Test zen-grid-container() with $legacy-support-for-ie6: true */
-  $legacy-support-for-ie6: true;
-  $legacy-support-for-ie7: true;
-  @include zen-grid-container();
-  $legacy-support-for-ie6: false;
-  $legacy-support-for-ie7: false;
-}
-
-#test-zen-grid-container-4 {
-  /* Test zen-grid-container() with $context: grid-item */
-  @include zen-grid-container(grid-item);
-}
-
-#test-zen-grid-container-5 {
-  /* Test zen-grid-container() with $context: flow */
-  @include zen-grid-container(flow);
-}
-
-#test-zen-grid-container-6 {
-  /* Test zen-grid-container() with $zen-gutter-method: margin */
-  $zen-gutter-method: margin;
-  @include zen-grid-container();
-  $zen-gutter-method: padding;
-}

data/templates/unit-tests/sass/zen-grid-flow-item.scss

@@ -1,78 +0,0 @@
-/**
- * @file
- * Test zen-grid-flow-item()
- */
-
-@import "zen-grids/flow";
-
-#test-zen-grid-flow-item {
-  // We will use a 5 column grid for all tests.
-  $zen-columns: 5;
-
-  /* Test zen-grid-flow-item(1) without setting $parent-column-span */
-  @include zen-grid-flow-item(1);
-
-  /* Test zen-grid-flow-item(1, 4) with 20px gutter */
-  @include zen-grid-flow-item(1, 4);
-
-  /* Test zen-grid-flow-item(1, 4) with 15px gutter */
-  $zen-gutters: 15px;
-  @include zen-grid-flow-item(1, 4);
-  $zen-gutters: 20px;
-
-  /* Test zen-grid-flow-item(1) with 5 columns, 20px gutter and $zen-grid-width: 1000px */
-  $zen-grid-width: 1000px;
-  @include zen-grid-flow-item(1);
-  $zen-grid-width: 100%;
-
-  /* Test zen-grid-flow-item(1) with 5 columns, 20px gutter, $zen-grid-width: 1000px, $alpha-gutter: true and $omega-gutter: false */
-  $zen-grid-width: 1000px;
-  @include zen-grid-flow-item(1, $alpha-gutter: true, $omega-gutter: false);
-  $zen-grid-width: 100%;
-
-  /* Test zen-grid-flow-item(1) with 5 columns, 20px gutter, $zen-grid-width: 1000px and $omega-gutter: false */
-  $zen-grid-width: 1000px;
-  @include zen-grid-flow-item(1, $omega-gutter: false);
-  $zen-grid-width: 100%;
-
-  /* Test zen-grid-flow-item(1, 4) with 15px gutter and $zen-direction: right */
-  $zen-gutters: 15px;
-  $zen-direction: right;
-  @include zen-grid-flow-item(1, 4);
-  $zen-gutters: 20px;
-  $zen-direction: left;
-
-  /* Test zen-grid-flow-item(1, 4) with 15px gutter and $alpha-gutter: true */
-  $zen-gutters: 15px;
-  @include zen-grid-flow-item(1, 4, $alpha-gutter: true);
-  $zen-gutters: 20px;
-
-  /* Test zen-grid-flow-item(1, 4) with 15px gutter and $omega-gutter: false */
-  $zen-gutters: 15px;
-  @include zen-grid-flow-item(1, 4, $omega-gutter: false);
-  $zen-gutters: 20px;
-
-  /* Test zen-grid-flow-item(3, 4) with 20px gutter and $alpha-gutter: true */
-  @include zen-grid-flow-item(3, 4, $alpha-gutter: true);
-
-  /* Test zen-grid-flow-item(3, 4) with 20px gutter and $omega-gutter: false */
-  @include zen-grid-flow-item(3, 4, $omega-gutter: false);
-
-  /* Test zen-grid-flow-item(1, 4) with 15px gutter, $zen-direction: right and $alpha-gutter: true */
-  $zen-gutters: 15px;
-  $zen-direction: right;
-  @include zen-grid-flow-item(1, 4, $alpha-gutter: true);
-  $zen-gutters: 20px;
-  $zen-direction: left;
-
-  /* Test zen-grid-flow-item(1, 4) with $zen-box-sizing: content-box and 10% gutter */
-  $zen-gutters: 10%;
-  $zen-box-sizing: content-box;
-  @include zen-grid-flow-item(1, 4);
-  $zen-gutters: 20px;
-  $zen-box-sizing: border-box;
-
-  /* Test zen-grid-flow-item(1, 4) with $zen-auto-include-flow-item-base: false */
-  $zen-auto-include-flow-item-base: false;
-  @include zen-grid-flow-item(1, 4);
-}