pixarea-compass-themes 0.2.3 → 0.3.1

data/lib/pixarea-compass-themes/version.rb

@@ -1,7 +1,7 @@
 module Pixarea
   module Compass
     module Themes
-      VERSION = "0.2.3"
+      VERSION = "0.3.1"
     end
   end
 end

data/sass/pixarea/_themes.sass

@@ -1,2 +1,3 @@
 @import pixarea/themes/shapy
 @import pixarea/themes/minipane
+@import pixarea/themes/cabinet

data/sass/pixarea/modules/menus/_inline-blocks.sass

@@ -1,11 +1,11 @@
-=menu-inline-blocks($item-span:4)
+=menu-inline-blocks($item-span:4, $padding:5px, $margin-bottom:10px)
   ul
     +inline-block-list
     li
-      margin-bottom: 10px
+      margin-bottom: $margin-bottom
       +column($item-span)
       a
-        padding: 5px
+        padding: $padding
         display: block
         text-align: center
       &.selected > a 

data/sass/pixarea/themes/_cabinet.sass

@@ -0,0 +1,32 @@
+// @import /stylesheets/refinery/application.css
+
+@import compass
+@import blueprint
+@import blueprint/reset/utilities
+
+@import compass/css3/pie
+$pie-behavior: stylesheet-url("../theme/stylesheets/PIE.htc") 
+
+@import pixarea/lib
+@import pixarea/modules
+
+@import pixarea/themes/cabinet/formatting
+@import pixarea/themes/cabinet/structure
+@import pixarea/themes/cabinet/tones
+@import pixarea/themes/cabinet/shapes
+@import pixarea/themes/cabinet/shadows
+
+=theme-cabinet($tones: graysand)
+  /* RESET ---------------------------------------------------------------------*/
+  +blueprint-global-reset
+  /* STRUCTURE -----------------------------------------------------------------*/
+  +cabinet-structure
+  /* FORMATTING-----------------------------------------------------------------*/
+  +cabinet-formatting
+  /* TONES ---------------------------------------------------------------------*/
+  +cabinet-tones($tones)
+  /* SHAPES --------------------------------------------------------------------*/
+  //+cabinet-shapes
+  /* SHADOWS -------------------------------------------------------------------*/
+  //+cabinet-shadows
+

data/sass/pixarea/themes/cabinet/_formatting.sass

@@ -0,0 +1,4 @@
+//@import /stylesheets/refinery/formatting.css    
+
+=cabinet-formatting
+  +formatting-base

data/sass/pixarea/themes/cabinet/_shadows.sass

@@ -0,0 +1,16 @@
+$shadow-color: black !default
+
+=cabinet-shadows
+
+  $default-box-shadow-color: $shadow-color
+  $default-box-shadow-blur: 15px
+  #{$_body_content_1},
+  #{$_menu_1} a,
+  #{$_header} h1,
+  #{$_header} h1 a     
+    +single-box-shadow
+  #{$_header} h1 a     
+    +text-shadow(0,0,4px,transparentize($shadow-color, 0.7))
+    //filter: Shadow(Color=$shadow-color, Direction=135, Strength=5)
+  #{$_body_content_2} #{$_inner}
+    +box-shadow(transparentize(black, 0.6), -6px, 6px, 14px, 0)

data/sass/pixarea/themes/cabinet/_shapes.sass

@@ -0,0 +1,32 @@
+=cabinet-shapes-form
+  form
+    input[type=text],
+    input[type=submit],
+    textarea
+      +pie
+      +border-radius
+
+=cabinet-shapes-
+  $default-border-radius: 10px
+  +cabinet-shapes-form
+  #{$_header} h1,
+  #{$_header} h1 a,
+  #{$_menu_1} a,
+  #{$_body_content_left}
+    +pie
+    +border-radius
+
+
+=cabinet-shapes
+  $b: 10px
+  +cabinet-shapes-form
+  h1
+    +border-radius-pie(50px $b)
+    a
+      +border-radius-pie(50px $b)
+  #{$_body_content_2} #{$_inner}
+    +border-radius-pie($b $b*4 $b*4 $b)
+  #{$_body_content_1}
+    +border-radius-pie($b)      
+  #{$_menu_1} a
+    +border-radius-pie($b $b 0 0)

data/sass/pixarea/themes/cabinet/_structure.sass

@@ -0,0 +1,45 @@
+=cabinet-structure
+  #{$_page_title}
+    +visually-hide
+    
+  #{$_inner}
+    +box
+  #{$_page}
+  #{$_header}
+  #{$_body_content}
+    +container-alt
+    #{$_body_content_1}
+      +column(17)
+      #{$_inner}
+        padding-right: 100px
+    #{$_no_body_content_2} #{$_body_content_1}
+      +column(22)
+    #{$_body_content_2}
+      +column(8)
+      +last
+      +pull(1.5)
+      +prepend-top(40px)
+    
+  #{$_menu_1}
+    +menu-inline-blocks(4, 0, 0)   
+    ul
+      +container-alt
+
+  #{$_header}
+    h1
+      +container-alt
+      a
+        +unstyled-link
+        +inline-block
+        padding: 20px 10px
+
+  #{$_footer}
+    +container-alt
+    padding-top:  10px
+    padding-left: 40px
+        
+  /* FORMS ------------------------------*/
+  .inquiries 
+    form
+      +form-basic
+        

data/sass/pixarea/themes/cabinet/_tones.sass

@@ -0,0 +1,62 @@
+
+
+// DEFAULT BP VALUES:
+
+// $font_color:     #333333 !default
+// $quiet_color:    $font_color + #333333 !default
+// $loud_color:     $font_color - #222222 !default
+// $header_color:   $font_color - #111111 !default
+// $alt_text_color: #666666 !default
+// $blueprint_background_color: #eeeeee !default
+// 
+// $link_color:         #000099               !default
+// $link_hover_color:   black                 !default
+// $link_focus_color:   $link_hover_color     !default
+// $link_active_color:  $link_color + #cc0000 !default
+// $link_visited_color: $link_color - #333333 !default
+// 
+// $feedback_border_color: #dddddd !default
+// $success_color:         #264409 !default
+// $success_bg_color:      #e6efc2 !default
+// $success_border_color:  #c6d880 !default
+// $notice_color:          #514721 !default
+// $notice_bg_color:       #fff6bf !default
+// $notice_border_color:   #ffd324 !default
+// $error_color:           #8a1f11 !default
+// $error_bg_color:        #fbe3e4 !default
+// $error_border_color:    #fbc2c4 !default
+// 
+// $highlight_color:        yellow !default
+// $added_color:             white !default
+// $added_bg_color:        #006600 !default
+// $removed_color:           white !default
+// $removed_bg_color:      #990000 !default
+// 
+// $blueprint_table_header_color: #c3d9ff !default
+// $blueprint_table_stripe_color: #e5ecf9 !default
+
+@import pixarea/lib
+
+@import pixarea/themes/cabinet/tones/circus
+@import pixarea/themes/cabinet/tones/burma
+@import pixarea/themes/cabinet/tones/dark
+@import pixarea/themes/cabinet/tones/firen
+@import pixarea/themes/cabinet/tones/rusty
+@import pixarea/themes/cabinet/tones/graysand
+
+=cabinet-tones($tones: dark)
+  @if $tones == circus
+    +cabinet-tones-circus
+  @if $tones == burma
+    +cabinet-tones-burma
+  @if $tones == dark
+    +cabinet-tones-dark
+  @if $tones == firen
+    +cabinet-tones-firen
+  @if $tones == rusty
+    +cabinet-tones-rusty
+  @if $tones == graysand
+    +cabinet-tones-graysand
+
+  #{$_menu_1} a
+    +unstyled-link

data/sass/pixarea/themes/cabinet/tones/_burma.sass

@@ -0,0 +1,30 @@
+=cabinet-tones-burma
+  
+  $darkblue:  $burma-darkblue
+  $clearblue: $burma-clearblue
+  $sable:     $burma-sable      
+  $palegreen: $burma-palegreen 
+  $deepgreen: $burma-deepgreen
+  $lightsable:$burma-lightsable
+  
+  html, body  
+    height: 100%
+  body
+    +linear-gradient-pie(#333 0%, #999 100%)             
+  #{$_header}
+    h1
+      background: $darkblue
+      a
+        +linear-gradient-pie($palegreen 0%, $deepgreen 100%)
+  #{$_body_content_1}
+    background: $lightsable
+  #{$_menu_1} a
+    background: $lightsable - 30
+  #{$_body_content_2} #{$_inner}
+    $framb:     #A83438
+    $bg-sub:    $framb 
+    background: $bg-sub
+    color:      $bg-sub / 4
+
+    border:    ($bg-sub / 1.5) 2px solid
+

data/sass/pixarea/themes/cabinet/tones/_circus.sass

@@ -0,0 +1,34 @@
+=cabinet-tones-circus
+ 
+  $brown:    $circ-brown
+  $red:      $circ-red   
+  $yellow:   $circ-yellow
+  $green:    $circ-green  
+  $white:    $circ-white
+  
+  html, body  
+    height: 100%
+  body     
+    +linear-gradient-pie(#222 0%, #777 100%)      
+  #{$_header}
+    h1
+      $mix: mix($yellow, $white, 50) 
+      +linear-gradient-pie($mix 0%, $yellow 100%)      
+      a
+        +linear-gradient-pie($green +#222 0%, $green -#222 100%)      
+  #{$_body_content_1}
+    $mix: mix($brown, $white, 50)       
+    +linear-gradient-pie($mix 50px, $white 300px)      
+  #{$_menu_1} li
+    $mix: mix($brown, $white, 80)       
+    +linear-gradient-pie($mix 70%, $mix - #222 100%)      
+    color: $white !important
+  #{$_body_content_2} .box
+    background: $red
+    border: 5px solid mix($red,$brown - #333 ,50)
+
+
+
+  
+
+

data/sass/pixarea/themes/cabinet/tones/_dark.sass

@@ -0,0 +1,70 @@
+=cabinet-tones-dark
+  
+  // PALETTE
+  
+  $neutral:     (blue/9) + (gray) + 70     
+  $dark:        $neutral / 8
+  $light:       $neutral * 1.5
+  $lighter:     $neutral * 2
+  
+  $bg:   $dark
+  $text: $neutral
+  
+  // ASSIGNEMENTS
+
+  body
+    background: $bg
+    color:      $text
+
+  a
+    +link-colors($lighter, $lighter + 30, $lighter, $lighter, $lighter)
+    +hover-link
+
+  #{$_header} 
+    +linear-gradient-pie($bg + 25, $bg + 10)
+    h1
+      color: $neutral
+    a
+      +link-colors(inherit, inherit)
+      text-decoration: none
+    li a      
+      //+linear-gradient-pie($bg + 45, $bg + 20)
+      &.selected,
+      &:hover
+        +linear-gradient-pie($bg + 65, $bg + 40)
+        color: $light
+        
+  #{$_footer}
+    color: ($bg / 2) + ($neutral / 2.5)
+    
+  #{$_body_content_1}
+    //background: $dark + 30
+  
+  #{$_body_content_2} 
+    background: $dark + 20
+    border: 2px solid $dark - 10
+    
+  
+  #{headers()}
+    color: $light
+
+  input[type=text], 
+  input[type=submit], 
+  textarea
+    background: $dark + 20
+    &:focus
+      background: $dark + 60
+      border: none
+      outline: none
+
+  input[type=submit]
+    color: $neutral
+    font-weight: bold
+    cursor: pointer
+    &:hover
+      background: $dark + 60
+      color: $lighter
+
+
+
+

data/sass/pixarea/themes/cabinet/tones/_firen.sass

@@ -0,0 +1,25 @@
+=cabinet-tones-firen
+
+  $blue:       $firen-blue     
+  $egg:        $firen-egg      
+  $deepegg:    $firen-deepegg
+  $brick:      $firen-brick   
+  $deepbrick:  $firen-deepbrick
+  
+  html, body  
+    height: 100%
+  body     
+    +linear-gradient-pie($deepbrick 0%, $egg 100%)
+  #{$_header}
+    h1
+      $mix1: mix($egg, $brick, 50)
+      +linear-gradient-pie($mix1 30%, $brick 95%)
+      a
+        background: $blue
+  #{$_body_content_1}
+    +linear-gradient-pie($egg 0%, $deepegg 100%)
+  #{$_menu_1} li
+    background: $egg
+    &:hover
+  #{$_body_content_2} .box
+    background: $egg 

data/sass/pixarea/themes/cabinet/tones/_graysand.sass

@@ -0,0 +1,23 @@
+// palette: graysand
+$graysand-sable:    lighten(red/3 + yellow/2, 40) 
+$graysand-gray:     #ddd
+
+=cabinet-tones-graysand
+ 
+  $sable:     $graysand-sable
+  $gray:      $graysand-gray
+  
+  html, body  
+    height: 100%
+  body
+    background: image-url("page-shadow-centered-white-950.png") top no-repeat
+  #{$_header}
+    background: $sable
+  #{$_body_content_1}
+  #{$_menu_1}
+    background: $gray
+  #{$_body_content_2} #{$_inner}
+
+
+
+

data/sass/pixarea/themes/cabinet/tones/_rusty.sass

@@ -0,0 +1,30 @@
+
+=cabinet-tones-rusty
+
+  $brown: $rusty-brown
+  $red: $rusty-red
+  $orange: $rusty-orange
+  $green: $rusty-green
+  $young-green: $rusty-young-green  
+  $brownish-orange: $rusty-brownish-orange
+  $mix1: mix($brownish-orange,white,50)
+  $shadow-color: $rusty-brown !default
+  
+  html, body  
+    height: 100%
+  body     
+    +linear-gradient-pie($brown, $brownish-orange)
+  #{$_header}
+    h1
+      +linear-gradient-pie(saturate(lighten($young-green, 20),100) 0%,saturate(darken($green,10),30) 100%)
+      a
+        +linear-gradient(color-stops(lighten($orange, 30), lighten($orange, 20), $orange, $red))
+        color: darken($brownish-orange, 5)
+  #{$_body_content_1}
+    +linear-gradient-pie($mix1 0%, white 100%)
+  #{$_menu_1} li
+    +linear-gradient-pie($mix1 0%, darken($mix1,20) 100%)
+    &:hover
+      +linear-gradient-pie($mix1 0%, $mix1 100%)
+  #{$_body_content_2} .box
+    background: mix($young-green, $brownish-orange, 30)

data/templates/project/theme.sass

@@ -1,30 +1,35 @@
-@import base
-@import pixarea/themes
-
-+theme-minipane(burma)
-
-
-// LIST OF AVAILABLE PRECONFIGURED THEMES:
-
-// +theme-minipane(dark)
-// +theme-minipane(burma)
-// +theme-shapy(burma)
-// +theme-shapy(circus)
-// +theme-shapy(dark)
-// +theme-shapy(firen)
-// +theme-shapy(rusty)
-
-
-// NOTES:
-
-// All themes are supra-modular, so you can use all or only parts of any theme.
-// Add your own themes, create your own color-palettes, shadows, ...
-// Learn here how a theme is structured, so you can use only parts of it, and 
-// build your own themes in minutes:
-// https://github.com/danielres/pixarea-compass-themes/blob/master/sass/pixarea/themes/_minipane.sass
-
-// The themes use configurable, reusable elements, called "modules":
-// https://github.com/danielres/pixarea-compass-themes/tree/master/sass/pixarea/modules
-
-// Modules and themes use preconfigured values and mixins, which you can find in the "lib" folder:
-// https://github.com/danielres/pixarea-compass-themes/tree/master/sass/pixarea/lib
+@import base
+@import pixarea/themes
+
++theme-minipane(dark)
+
+
+// LIST OF AVAILABLE PRECONFIGURED THEMES:
+
+// +theme-minipane(dark)
+// +theme-minipane(burma)
+// +theme-shapy(burma)
+
+// +theme-shapy(circus)
+
+// +theme-shapy(dark)
+
+// +theme-shapy(firen)
+
+// +theme-shapy(rusty)
+
+
+
+// NOTES:
+
+// All themes are supra-modular, so you can use all or only parts of any theme.
+// Add your own themes, create your own color-palettes, shadows, ...
+// Learn here how a theme is structured, so you can use only parts of it, and 
+// build your own themes in minutes:
+// https://github.com/danielres/pixarea-compass-themes/blob/master/sass/pixarea/themes/_minipane.sass
+
+// The themes use configurable, reusable elements, called "modules":
+// https://github.com/danielres/pixarea-compass-themes/tree/master/sass/pixarea/modules
+
+// Modules and themes use preconfigured values and mixins, which you can find in the "lib" folder:
+// https://github.com/danielres/pixarea-compass-themes/tree/master/sass/pixarea/lib

metadata

@@ -2,7 +2,7 @@
 name: pixarea-compass-themes
 version: !ruby/object:Gem::Version 
   prerelease: 
-  version: 0.2.3
+  version: 0.3.1
 platform: ruby
 authors: 
 - Daniel Reszka
@@ -10,7 +10,7 @@ autorequire:
 bindir: bin
 cert_chain: []
 
-date: 2011-04-19 00:00:00 +02:00
+date: 2011-04-20 00:00:00 +02:00
 default_executable: 
 dependencies: 
 - !ruby/object:Gem::Dependency 
@@ -58,8 +58,20 @@ files:
 - sass/pixarea/modules/forms/_basic.sass
 - sass/pixarea/modules/menus/_inline-blocks.sass
 - sass/pixarea/theme.sass
+- sass/pixarea/themes/_cabinet.sass
 - sass/pixarea/themes/_minipane.sass
 - sass/pixarea/themes/_shapy.sass
+- sass/pixarea/themes/cabinet/_formatting.sass
+- sass/pixarea/themes/cabinet/_shadows.sass
+- sass/pixarea/themes/cabinet/_shapes.sass
+- sass/pixarea/themes/cabinet/_structure.sass
+- sass/pixarea/themes/cabinet/_tones.sass
+- sass/pixarea/themes/cabinet/tones/_burma.sass
+- sass/pixarea/themes/cabinet/tones/_circus.sass
+- sass/pixarea/themes/cabinet/tones/_dark.sass
+- sass/pixarea/themes/cabinet/tones/_firen.sass
+- sass/pixarea/themes/cabinet/tones/_graysand.sass
+- sass/pixarea/themes/cabinet/tones/_rusty.sass
 - sass/pixarea/themes/minipane/_formatting.sass
 - sass/pixarea/themes/minipane/_shadows.sass
 - sass/pixarea/themes/minipane/_shapes.sass
@@ -78,6 +90,7 @@ files:
 - sass/pixarea/themes/shapy/tones/_firen.sass
 - sass/pixarea/themes/shapy/tones/_rusty.sass
 - templates/project/_base.sass
+- templates/project/images/page-shadow-centered-white-950.png
 - templates/project/manifest.rb
 - templates/project/stylesheets/PIE.htc
 - templates/project/theme.sass