add license, fix filenames

[crayon_mockup.git] / style.styl

diff --git a/style.styl b/style.styl
new file mode 100644 (file)
index 0000000..ae2bdc4
--- /dev/null
+++ b/style.styl
@@ -0,0 +1,53 @@
+body
+       margin: 0px
+       padding: 10px
+       font: 15 Arimo, Arial, sans-serif
+h1
+       font-size: 28px
+       margin: 0
+p
+       margin: 0
+* p
+       margin-top: 10px
+
+color_crayon = #8c8c8c
+color_selected = #544c4c
+color_hover = #777
+color_dragging = #9e9373
+color_controls = #000
+.crayon_mockup
+       svg
+               path.polyline
+                       fill: none
+                       stroke-width: 5
+                       stroke-linecap: butt
+                       stroke-linejoin: round
+                       stroke-miterlimit: 4
+                       stroke-opacity: 1
+                       stroke-dasharray: none
+                       // fails in firefox (must be inline) filter: url(#crayon)
+               rect
+                       fill: none
+               rect.canvas_border
+                       overflow: hidden
+                       stroke: #ccc
+                       stroke-width: 2
+                       stroke-linecap: butt
+                       stroke-linejoin:miter
+                       stroke-dasharray:2 4
+                       stroke-dashoffset:1
+                       //stroke-opacity:1;marker:none;enable-background:accumulate
+               rect.box
+                       stroke: color_crayon
+                       stroke-width: 4
+                       stroke-linecap: butt
+                       stroke-linejoin:miter
+                       // this doesn't work in firefox: filter: url(#crayon)
+               rect.box, path.polyline
+                       stroke: color_crayon
+               rect.box.hover, path.polyline.hover
+                       stroke: color_hover
+               rect.box.dragging, path.polyline.dragging
+                       stroke: color_dragging
+               rect.box.selected, path.polyline.selected
+                       stroke: color_selected