Permalink
Browse files

Converted to Sass w guard-sass.

  • Loading branch information...
matthewcopeland committed Nov 1, 2012
1 parent 0519ea2 commit ce4a4458a461147e36c5480fec5a809d999ee0a1
View
@@ -1,2 +1,3 @@
*.DS_Store
.powenv
+.sass-cache
View
@@ -5,3 +5,4 @@ gem 'sinatra'
gem 'haml'
gem 'guard-haml'
gem 'guard-coffeescript'
+gem 'guard-sass'
View
@@ -17,6 +17,9 @@ GEM
guard-haml (0.4)
guard (>= 1.1)
haml (>= 3.0)
+ guard-sass (1.0.1)
+ guard (>= 1.1.0)
+ sass (>= 3.1)
haml (3.1.6)
listen (0.4.7)
rb-fchange (~> 0.0.5)
@@ -31,6 +34,7 @@ GEM
rb-fsevent (0.9.1)
rb-inotify (0.8.8)
ffi (>= 0.5.0)
+ sass (3.2.1)
sinatra (1.3.2)
rack (~> 1.3, >= 1.3.6)
rack-protection (~> 1.2)
@@ -44,5 +48,6 @@ PLATFORMS
DEPENDENCIES
guard-coffeescript
guard-haml
+ guard-sass
haml
sinatra
View
@@ -3,3 +3,10 @@ guard 'coffeescript', :input => 'bundle'
guard 'haml', :input => 'bundle', :output => 'bundle' do
watch(/^.+(\.html\.haml)/)
end
+
+guard 'sass',
+ :input => 'bundle/stylesheets/sass',
+ :output => 'bundle/stylesheets/css',
+ :smart_partials => true,
+ :load_paths => ['bundle/stylesheets/sass'],
+ :style => :compressed
View
@@ -12,10 +12,8 @@
<script src='js/lib/backbone.js'></script>
<script src='js/lib/json2.js'></script>
<script data-main='/js/main' src='js/lib/require.js'></script>
- <link href='reset.css' rel='stylesheet' />
+ <link href='/stylesheets/css/symbiote.css' rel='stylesheet' />
<link href='pictos/pictos.css' rel='stylesheet' />
- <link href='jquery.treeview.css' rel='stylesheet' />
- <link href='symbiote.css' rel='stylesheet' />
</head>
<body>
<header id='header'>
View
@@ -15,10 +15,8 @@
%script(data-main="/js/main" src="js/lib/require.js")
- %link(href="reset.css" rel="stylesheet")
+ %link(href="/stylesheets/css/symbiote.css" rel="stylesheet")
%link(href="pictos/pictos.css" rel="stylesheet")
- %link(href="jquery.treeview.css" rel="stylesheet")
- %link(href="symbiote.css" rel="stylesheet")
%body
%header#header

Some generated files are not rendered by default. Learn more.

Oops, something went wrong.
@@ -0,0 +1,137 @@
+@mixin center-align($height: "", $width: "")
+ top: 50%
+ margin-top: -$height/2
+ left: 50%
+ margin-left: -$width/2
+
+@mixin absolute-fill
+ position: absolute
+ top: 0
+ right: 0
+ bottom: 0
+ left: 0
+ height: 100%
+ width: 100%
+
+@mixin clearfix-after
+ &:after
+ content: ""
+ display: block
+ height: 1px
+ width: 1px
+ clear: both
+ position: relative
+
+@mixin transition ( $trans )
+ -webkit-transition: ( $trans )
+ -moz-transition: ( $trans )
+ transition: ( $trans )
+
+@mixin transition-two ( $trans, $trans2 )
+ -webkit-transition: ( $trans, $trans2 )
+ -moz-transition: ( $trans, $trans2 )
+ transition: ( $trans, $trans2 )
+
+@mixin transition-transform( $duration )
+ -webkit-transition: -webkit-transform $duration
+ -moz-transition: -moz-transform $duration
+ -ms-transition: -ms-transform $duration
+ -o-transition: -o-transform $duration
+ transition: transform $duration
+
+@mixin transition-delay ( $delay )
+ -webkit-transition-delay: ( $delay )
+ -moz-transition-delay: ( $delay )
+ transition-delay: ( $delay )
+
+@mixin transition-property ( $property )
+ -webkit-transition-property: ( $property )
+ -moz-transition-property: ( $property )
+ transition-property: ( $property )
+
+@mixin transition-property-two ( $property1, $property2 )
+ -webkit-transition-property: ( $property1, $property2 )
+ -moz-transition-property: ( $property1, $property2 )
+ transition-property: ( $property1, $property2 )
+
+@mixin transition-duration ( $duration )
+ -webkit-transition-duration: ( $duration )
+ -moz-transition-duration: ( $duration )
+ transition-duration: ( $duration )
+
+@mixin animation ( $animation )
+ -webkit-animation: ( $animation )
+ -moz-animation: ( $animation )
+ -ms-animation: ( $animation )
+ animation: ( $animation )
+
+@mixin text-shadow( $shadow )
+ -webkit-text-shadow: ( $shadow )
+ -moz-text-shadow: ( $shadow )
+ text-shadow: ( $shadow )
+
+@mixin box-shadow( $shadow )
+ -webkit-box-shadow: ( $shadow )
+ -moz-box-shadow: ( $shadow )
+ box-shadow: ( $shadow )
+
+@mixin box-shadow-two( $shadow1, $shadow2 )
+ -webkit-box-shadow: ( $shadow1, $shadow2 )
+ -moz-box-shadow: ( $shadow1, $shadow2 )
+ box-shadow: ( $shadow1, $shadow2 )
+
+@mixin transform ( $transform )
+ -webkit-transform: ( $transform )
+ -moz-transform: ( $transform )
+ -ms-transform: ( $transform )
+ -o-transform: ( $transform )
+ transform: ( $transform )
+
+@mixin transform-style ( $style )
+ -webkit-transform-style: ( $style )
+ -moz-transform-style: ( $style )
+ -ms-transform-style: ( $style )
+ transform-style: ( $style )
+
+@mixin backface-visibility ( $visibility )
+ -webkit-backface-visibility: ( $visibility )
+ -moz-backface-visibility: ( $visibility )
+ -ms-backface-visibility: ( $visibility )
+ backface-visibility: ( $visibility )
+
+@mixin perspective ( $perspective )
+ -webkit-perspective: ( $perspective )
+ -moz-perspective: ( $perspective )
+ -ms-perspective: ( $perspective )
+ perspective: ( $perspective )
+
+@mixin perspective-origin( $origin )
+ -webkit-perspective-origin: ( $origin )
+ -moz-perspective-origin: ( $origin )
+ -ms-perspective-origin: ( $origin )
+ perspective-origin: ( $origin )
+
+@mixin border-radius ( $radius )
+ -webkit-border-radius: ( $radius )
+ -moz-border-radius: ( $radius )
+ border-radius: ( $radius )
+
+@mixin box-sizing( $box-size )
+ -webkit-box-sizing: ( $box-size )
+ -khtml-box-sizing: ( $box-size )
+ -icab-box-sizing: ( $box-size )
+ -moz-box-sizing: ( $box-size )
+ -o-box-sizing: ( $box-size )
+ box-sizing: ( $box-size )
+
+@mixin user-select ( $user-select )
+ -webkit-user-select: ( $user-select )
+ -moz-user-select: ( $user-select )
+ -ms-user-select: ( $user-select )
+ user-select: ( $user-select )
+
+@mixin linear-gradient ( $start-point, $stop1, $stop2 )
+ background-image: -webkit-linear-gradient( $start-point, $stop1, $stop2 )
+ background-image: -moz-linear-gradient( $start-point, $stop1, $stop2 )
+ background-image: -ms-linear-gradient( $start-point, $stop1, $stop2 )
+ background-image: linear-gradient( $start-point, $stop1, $stop2 )
@@ -22,11 +22,11 @@ article, aside, details, figcaption, figure, footer, header, hgroup, nav, sectio
h1,h2,h3,h4,h5,h6 {font-size: 1.0em; }
/* save your sanity */
-* {
+* {
-webkit-box-sizing: border-box;
-khtml-box-sizing: border-box;
-icab-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
- box-sizing: border-box;
+ box-sizing: border-box;
}
Oops, something went wrong.

0 comments on commit ce4a445

Please sign in to comment.