example code for scaling spritesheets

[wfpl-cms.git] / style.styl

diff --git a/style.styl b/style.styl
index 81159f1..a758cd5 100644 (file)
--- a/style.styl
+++ b/style.styl
@@ -89,10 +89,52 @@ content_bg = #fff
 content_fg = #000
 window_bg = #fff
 
+// sprites
+wfpl_spritesheets({
+       main: {
+               image: sha1['images/sprites.min.svg']
+               y_origin: 'bottom' // inkscape rulers are backwards
+               w: 200
+               h: 408
+               sprites: {
+                       ".icon": {
+                               y: 408
+                               w: 50
+                               h: 50
+                               gap: 1
+                               hover: 'right'
+                               column: 'three' 'four' 'five' 'six' 'seven'
+                       }
+                       ".top_button": {
+                               y: 153
+                               w: 25
+                               h: 25
+                               gap: 1
+                               row: '0' '1' '2' '3' '4'
+                               hover: 'down'
+                       }
+                       ".main_logo": {
+                               y: 101
+                               w: 200
+                               h: 50
+                               gap: 1
+                               hover: 'down'
+                       }
+               }
+       }
+})
+
+
 ////////////////////
 // } END SETTINGS //
 ////////////////////
 
+.icon
+       display: inline-block
+       width: 40%
+.top_button
+       display: inline-block
+       width: 30%
 
 
 // always show vertical scrollbar, so content doesn't shift around when