kickstart_rails 0.3.411737840873 → 3.0.6

data/app/assets/stylesheets/kickstart_rails/docs.sass

@@ -16,10 +16,10 @@
   +column('third')
 
   h1
-    +xs-heading
+    +heading-xs
 
   h2
-    +xxs-heading
+    +xheading-xs
 
 .fullpane
   +column(12)
@@ -69,19 +69,20 @@
     background-color: map-get($colors, yellow)
 
 .col-example
+  +root-element
   padding: $space/2
-  background: white
+  background: map-get($white, dark)
   margin: $space/2 0
   text-align: center
 
   .gray
-    background: map-get($white, dark)
+    background: map-get($white, darker)
 
 .example
   +root-element
   padding: $space
   margin-bottom: $space
-  border-color: map-get($white, darker)
+  border-color: map-get($white, darkest)
 
   > *:last-child
     margin-bottom: 0
@@ -90,21 +91,21 @@
 
 h1.example-
   &xxl
-    +xxl-heading
+    +heading-xxl
   &xl
-    +xl-heading
+    +heading-xl
   &lg
-    +lg-heading
+    +heading-lg
   &md
-    +md-heading
+    +heading-md
   &rg
-    +rg-heading
+    +heading-rg
   &sm
-    +sm-heading
+    +heading-sm
   &xs
-    +xs-heading
+    +heading-xs
   &xxs
-    +xxs-heading
+    +xheading-xs
 
 .if-jquery, .ifnot-jquery, .if-semantic, .ifnot-semantic
   display: none
@@ -182,3 +183,6 @@ footer.main
     a
       color: white
       text-decoration: underline
+
+.test-a
+  +column('third', 'third', 'third')

data/app/assets/stylesheets/kickstart_rails/kickstart-semantic.sass

@@ -6,5 +6,6 @@
 
 // Choose your theme
 @import themes/_default
+// @import themes/_shabbychic
 
 // Now write your own Sass

data/app/assets/stylesheets/kickstart_rails/kickstart.sass

@@ -77,47 +77,47 @@
   +button-group
 
   &.button-primary
-    > li > *
+    > li > *:not(ul)
       +button-color($primary-color)
 
   &.button-secondary
-    > li > *
+    > li > *:not(ul)
       +button-color($secondary-color)
 
   &.button-clear
-    > li > *
+    > li > *:not(ul)
       +button-color(transparent)
 
   &.button-red
-    > li > *
+    > li > *:not(ul)
       +button-color(map-get($colors, red))
 
   &.button-orange
-    > li > *
+    > li > *:not(ul)
       +button-color(map-get($colors, orange))
 
   &.button-yellow
-    > li > *
+    > li > *:not(ul)
       +button-color(map-get($colors, yellow))
 
   &.button-green
-    > li > *
+    > li > *:not(ul)
       +button-color(map-get($colors, green))
 
   &.button-blue
-    > li > *
+    > li > *:not(ul)
       +button-color(map-get($colors, blue))
 
   &.button-violet
-    > li > *
+    > li > *:not(ul)
       +button-color(map-get($colors, violet))
 
   &.button-small
-    > li > *
+    > li > *:not(ul)
       +button-size($size: 0.85)
 
   &.button-large
-    > li > *
+    > li > *:not(ul)
       +button-size($size: 1.2)
 
 // FORMS
@@ -134,8 +134,8 @@
 .form_group
   +form_group('vertical')
 
-  &.form_group-horizontal, 
-  .form_group-horizontal, 
+  &.form_group-horizontal,
+  .form_group-horizontal,
   .form-horizontal &
     +form_group('horizontal')
 
@@ -162,14 +162,34 @@
 
 [class^="col"]
   // Pulls
-  @for $i from 1 through 12
-    &.col-pull-#{$i}
-      +pull($i)
+  @each $screen in '', 'xs-', 'sm-', 'rg-', 'md-', 'lg-', 'xl-'
+    &.col-pull-#{$screen}third
+      +pull('third')
+
+    &.col-push-#{$screen}twothirds
+      +pull('twothirds')
+
+    &.col-push-#{$screen}half
+      +pull('half')
+
+    @for $i from 1 through 12
+      &.col-pull-#{$screen}#{$i}
+        +pull($i)
 
   // Pushes
-  @for $i from 1 through 12
-    &.col-push-#{$i}
-      +push($i)
+  @each $screen in '', 'xs-', 'sm-', 'rg-', 'md-', 'lg-', 'xl-'
+    &.col-push-#{$screen}third
+      +push('third')
+
+    &.col-push-#{$screen}twothirds
+      +push('twothirds')
+
+    &.col-push-#{$screen}half
+      +push('half')
+
+    @for $i from 1 through 12
+      &.col-push-#{$screen}#{$i}
+        +push($i)
 
 // IMAGES
 // ------
@@ -270,28 +290,28 @@ table
 // ----------
 
 .xxl
-  +xxl-heading
+  +heading-xxl
 
 .xl
-  +xl-heading
+  +heading-xl
 
 .lg
-  +lg-heading
+  +heading-lg
 
 .md
-  +md-heading
+  +heading-md
 
 .rg
-  +rg-heading
+  +heading-rg
 
 .sm
-  +sm-heading
+  +heading-sm
 
 .xs
-  +xs-heading
+  +heading-xs
 
 .xxs
-  +xxs-heading
+  +xheading-xs
 
 .readable
   +p(true)

data/app/assets/stylesheets/kickstart_rails/themes/_default.sass

@@ -25,7 +25,7 @@ $black: (lightest: #444, lighter: #333, light: #222)
 $colors: (red: #CA3518, orange: darkorange, yellow: #ffe312, green: #58AA00, blue: cornflowerblue, violet: darkmagenta)
 
 // Vendor libraries
-@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700,900,400italic)
+@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700,400italic)
 
 // Ten point design variables
 // --------------------------
@@ -44,7 +44,7 @@ $default-line-height: 1.4rem
 
 $scalingFactor: 0.2vw
 
-$rootElement: (paddingV: 5px, paddingH: 12px)
+$rootElement: (paddingV: 5px, paddingH: 12px, border-radius: 3px)
 
 $default-font: $body-font-family
 $default-font-size: $base-font-size  // TODO: Why?
@@ -80,50 +80,50 @@ pre
 =hero
   +hero-default
 
-=xxl-heading
-  +xxl-heading-default
+=heading-xxl
+  +heading-xxl-default
 
-=xl-heading
-  +xl-heading-default
+=heading-xl
+  +heading-xl-default
 
-=lg-heading
-  +lg-heading-default
+=heading-lg
+  +heading-lg-default
 
-=md-heading
-  +md-heading-default
+=heading-md
+  +heading-md-default
 
-=rg-heading
-  +rg-heading-default
+=heading-rg
+  +heading-rg-default
 
-=sm-heading
-  +sm-heading-default
+=heading-sm
+  +heading-sm-default
 
-=xs-heading
-  +xs-heading-default
+=heading-xs
+  +heading-xs-default
 
-=xxs-heading
-  +xxs-heading-default
+=xheading-xs
+  +xheading-xs-default
 
 h1, h2, h3, h4, h5, h6
   font-family: $heading-font-family
 
 h1
-  +lg-heading
+  +heading-lg
 
 h2
-  +md-heading
+  +heading-md
 
 h3
-  +rg-heading
+  +heading-rg
 
 h4
-  +sm-heading
+  +heading-sm
 
 h5
-  +xs-heading
+  +heading-xs
 
 h6
-  +xxs-heading
+  +xheading-xs
 
 =type
   +type-default
@@ -194,6 +194,9 @@ hr
 =navbar($bleed-container: false, $background: map-get($white, dark))
   +navbar-default($bleed-container, $background)
 
+=dropdown_menu
+  +dropdown_menu-default
+
 // Table
 // -----
 

data/app/assets/stylesheets/kickstart_rails/themes/_shabbychic.sass

@@ -0,0 +1,252 @@
+//
+// Theme: Shabby Chic
+// ==============
+// Old but classy.
+//
+
+// TODO: This would be the second time importing in rails. prepend this line
+// via gulp.
+
+@import ../core/_normalize
+
+// Variables
+// ---------
+
+// Grayscale
+$white: (dark: #F7F7F7, darker: #DDD, darkest: #CCC)
+$gray:  (lightest: #BBB, lighter: #AAA, light: #999, dark: #777, darker: #666, darkest: #555)
+$black: (lightest: #444, lighter: #333, light: #222)
+
+// Rainbow
+$colors: (red: #CA3518, orange: darkorange, yellow: #ffe312, green: #58AA00, blue: cornflowerblue, violet: darkmagenta)
+
+// Vendor libraries
+@import url(http://fonts.googleapis.com/css?family=Coming+Soon)
+@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700)
+
+// Ten point design variables
+// --------------------------
+// Modifying just these ten variables will take care of 90% of your theme
+
+$primary-color:       #BED6AB
+$secondary-color:     #F2ECC3
+$space:               50px
+$heading-font-family: 'Coming Soon', helvetica neue, sans-serif
+$body-font-family:    'Open Sans', helvetica neue, sans-serif
+$base-font-size:      16px
+$default-font-color:  map-get($gray, dark)
+$default-line-height: 1.5rem
+
+// --------------------------
+
+$scalingFactor: 0.2vw
+
+$rootElement: (paddingV: 5px, paddingH: 12px, border-radius: 3px)
+
+$default-font: $body-font-family
+$default-font-size: $base-font-size  // TODO: Why?
+
+//
+// Core styling
+// ------------
+// Lowest-level styling meant to be inherited by components.
+//
+
+@import ../core/_index
+
+// Typography
+// ----------
+
+=pre
+  +pre-default
+
+pre
+  +pre
+
+=code
+  +code-default
+
+=p($content-optimized: false)
+  +p-default($content-optimized)
+
+=page-heading
+  +page-heading-default
+  h1, h2, h3, h4, h5, h6
+    // Styles should go here.
+
+=hero
+  +hero-default
+
+=heading-xxl
+  +heading-xxl-default
+
+=heading-xl
+  +heading-xl-default
+
+=heading-lg
+  +heading-lg-default
+
+=heading-md
+  +heading-md-default
+
+=heading-rg
+  +heading-rg-default
+
+=heading-sm
+  +heading-sm-default
+
+=heading-xs
+  +heading-xs-default
+
+=xheading-xs
+  +xheading-xs-default
+
+h1, h2, h3, h4, h5, h6
+  font-family: $heading-font-family
+
+h1
+  +heading-lg
+
+h2
+  +heading-md
+
+h3
+  +heading-rg
+
+h4
+  +heading-sm
+
+h5
+  +heading-xs
+
+h6
+  +xheading-xs
+
+=type
+  +type-default
+
+html
+  +type-default
+
+=list
+  +list-default
+
+=list-unstyled
+  +list-unstyled-default
+
+=list-horizontal
+  +list-horizontal-default
+
+//
+// Base Components
+// ===============
+// Base components get imported first so they can be custom themed and
+// used again in other parts of the core library.
+//
+
+@import ../core/_base_components
+
+// Alerts
+// ------
+
+=alert
+  +alert-default
+
+// Buttons
+// -------
+
+=button($color: map-get($white, dark), $size: 1)
+  +button-default($color, $size)
+
+=button-group($color: map-get($white, dark), $size: 1)
+  +button-group-default($color, $size)
+
+// HR
+// --
+
+=hr
+  +hr-default
+
+hr
+  +hr
+
+// Images
+// ------
+
+=thumbnail-content
+  +thumbnail-content-default
+
+=thumbnail
+  +thumbnail-default
+
+// Labels
+// ------
+
+=label($background-color: map-get($colors, blue))
+  +label-default($background-color)
+
+// Navigation
+// ----------
+
+=navbar($bleed-container: false, $background: map-get($white, dark))
+  +navbar-default($bleed-container, $background)
+
+=dropdown_menu
+  +dropdown_menu-default
+
+// Table
+// -----
+
+=table()
+  +table-default()
+
+//
+// Dependent Components
+// ====================
+// Dependent components keep code DRY by reusing core and base
+// componenets that have already been styled by the theme.
+//
+
+@import ../core/_dependent_components
+
+// Forms
+// -----
+
+=form
+  +form-default
+
+=form-horizontal
+  +form-horizontal-default
+
+=form-left
+  +form-left-default()
+
+=form_group($orientation: 'vertical')
+  +form_group-default($orientation)
+
+
+// Modals
+// ------
+
+=modal()
+  +modal-default()
+
+// Tiles
+// -----
+
+=tile($color: map-get($gray, dark))
+  +tile-default($color)
+
+// Tooltips
+// --------
+
+=tooltip_trigger
+  +tooltip_trigger-default
+
+// Statuses
+// --------
+
+.status-bar
+  +statusBar()
+
+@import ../vendor/_index