X-Git-Url: https://jasonwoof.com/gitweb/?p=crayon_mockup.git;a=blobdiff_plain;f=style.styl;fp=style.styl;h=ae2bdc4aead213982de53cdf0a312d634a0a250f;hp=0000000000000000000000000000000000000000;hb=2d902775d3b9f916b5a38ac8874a734ca586e6b3;hpb=5a5d608f1cf57587e6acf1f83f98c1ae5aa48938

diff --git a/style.styl b/style.styl
new file mode 100644
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