cimma 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (48) hide show
  1. data/lib/cimma.rb +4 -0
  2. data/stylesheets/_cimma.scss +6 -0
  3. data/stylesheets/cimma/_baseline.scss +5 -0
  4. data/stylesheets/cimma/_util.scss +4 -0
  5. data/stylesheets/cimma/baseline/_core.scss +5 -0
  6. data/stylesheets/cimma/baseline/_forms.scss +2 -0
  7. data/stylesheets/cimma/baseline/_html5.scss +1 -0
  8. data/stylesheets/cimma/baseline/_lists.scss +1 -0
  9. data/stylesheets/cimma/baseline/_tables.scss +2 -0
  10. data/stylesheets/cimma/baseline/_typography.scss +4 -0
  11. data/stylesheets/cimma/baseline/forms/_core.scss +141 -0
  12. data/stylesheets/cimma/baseline/forms/_status-backgrounds.scss +20 -0
  13. data/stylesheets/cimma/baseline/html5/_core.scss +25 -0
  14. data/stylesheets/cimma/baseline/lists/_core.scss +11 -0
  15. data/stylesheets/cimma/baseline/tables/_adaptive.scss +83 -0
  16. data/stylesheets/cimma/baseline/tables/_core.scss +52 -0
  17. data/stylesheets/cimma/baseline/tables/_extra-wide.scss +9 -0
  18. data/stylesheets/cimma/baseline/typography/_annotations.scss +44 -0
  19. data/stylesheets/cimma/baseline/typography/_core.scss +51 -0
  20. data/stylesheets/cimma/baseline/typography/_headlines.scss +30 -0
  21. data/stylesheets/cimma/baseline/typography/_quotes.scss +17 -0
  22. data/stylesheets/cimma/misc/_effects.scss +32 -0
  23. data/stylesheets/cimma/widgets/_buttons.scss +196 -0
  24. data/stylesheets/cimma/widgets/_dialog-boxes.scss +129 -0
  25. data/stylesheets/cimma/widgets/_dialog-boxes2.scss +238 -0
  26. data/stylesheets/cimma/widgets/_dialog.scss +85 -0
  27. data/stylesheets/cimma/widgets/_font-awesome.scss +264 -0
  28. data/stylesheets/cimma/widgets/_test.scss +31 -0
  29. data/templates/dialog-boxes/example.scss +42 -0
  30. data/templates/dialog-boxes/example2.scss +29 -0
  31. data/templates/dialog-boxes/images/old/dialog-error.png +0 -0
  32. data/templates/dialog-boxes/images/old/dialog-info.png +0 -0
  33. data/templates/dialog-boxes/images/old/dialog-success.png +0 -0
  34. data/templates/dialog-boxes/images/old/dialog-validation.png +0 -0
  35. data/templates/dialog-boxes/images/old/dialog-warning.png +0 -0
  36. data/templates/dialog-boxes/images/spritemap - 1pt.svg +76 -0
  37. data/templates/dialog-boxes/images/spritemap.png +0 -0
  38. data/templates/dialog-boxes/images/spritemap.svg +73 -0
  39. data/templates/dialog-boxes/manifest.rb +7 -0
  40. data/templates/drop-menu/drop-menu.js +124 -0
  41. data/templates/drop-menu/manifest.rb +7 -0
  42. data/templates/forms/images/spritemap - Copy.svg +66 -0
  43. data/templates/forms/images/spritemap.svg +104 -0
  44. data/templates/forms/manifest.rb +7 -0
  45. data/templates/project/_cimma.scss +3 -0
  46. data/templates/project/_variables.scss +24 -0
  47. data/templates/project/manifest.rb +13 -0
  48. metadata +140 -0
data/stylesheets/cimma/widgets/_test.scss ADDED
@@ -0,0 +1,31 @@
1
+ @mixin sassy-button-text-style($base-color, $second-color, $text-color, $text-style: "inset") {
2
+ $text-lightness: lightness($text-color);
3
+ $text-color-shift: 0;
4
+ $diff: lightness($base-color) - lightness($second-color);
5
+ @if $diff > 40 {
6
+ $text-color-shift: 35 + $diff / 10;
7
+ }
8
+ @else if $diff > 18 {
9
+ $text-color-shift: 30 + $diff / 10;
10
+ }
11
+ @else {
12
+ $text-color-shift: 25 + $diff / 10;
13
+ }
14
+ color: $text-color;
15
+ @if $text-style == "inset" {
16
+ @if $text-lightness < 50 {
17
+ @include text-shadow(lighten($second-color, $text-color-shift / 1.5) 0 1px 0);
18
+ }
19
+ @else {
20
+ @include text-shadow(darken($base-color, $text-color-shift) 0 -1px 0);
21
+ }
22
+ }
23
+ @if $text-style == "raised" {
24
+ @if $text-lightness < 50 {
25
+ @include text-shadow(lighten($second-color, $text-color-shift / 1.5) 0 -1px 0);
26
+ }
27
+ @else {
28
+ @include text-shadow(darken($base-color, $text-color-shift) 0 1px 0);
29
+ }
30
+ }
31
+ }
data/templates/dialog-boxes/example.scss ADDED
@@ -0,0 +1,42 @@
1
+ @import "cimma/widgets/dialog-boxes";
2
+
3
+ // ---------- Color/image definitions
4
+ $dialog-namespace: d;
5
+ $dialog-icon-width: 24px;
6
+ $dialog-icon-height: 24px;
7
+ $dialog-padding: 1em;
8
+ $dialog-border: 2px solid;
9
+ $dialog-fc-multiplier: 1.4;
10
+
11
+ // class name | color | bg-color | image
12
+ $dialog-attributes:
13
+ ( help #2E3192 #B9C2E1 // yellow
14
+ , info #005FB4 #BDE5F8 // blue
15
+ , success #6F7D03 #DFE5B0 // green
16
+ , warning #A0410D #EFBBA0 // orange
17
+ , error #C41616 #F8AAAA // red
18
+ );
19
+
20
+ @include dialog-box((image-url("cimma/dialog-boxes/spritemap.svg"), image-url("cimma/dialog-boxes/spritemap.png"))) {
21
+ @include border-radius(.5em);
22
+ margin: 1em 0 0 0;
23
+ padding: 1em;
24
+
25
+ &:first-child {
26
+ margin-top: 0;
27
+ }
28
+ }
29
+
30
+ aside.dialog {
31
+ @extend div.dialog;
32
+ @extend %dialog-colors;
33
+ }
34
+
35
+ ol.dialog {
36
+ @extend ul.dialog;
37
+ @extend %dialog-colors;
38
+ }
39
+
40
+ tr {
41
+ @extend %dialog-colors;
42
+ }
data/templates/dialog-boxes/example2.scss ADDED
@@ -0,0 +1,29 @@
1
+ @import "cimma/widgets/dialog-boxes2";
2
+
3
+ // ---------- Color/image definitions
4
+ $dialog-namespace: d;
5
+ $dialog-icon-width: 24px;
6
+ $dialog-icon-height: 24px;
7
+ $dialog-padding: 1em;
8
+ $dialog-border: 2px solid;
9
+ $dialog-fc-multiplier: 1.4;
10
+
11
+ // class name | color | bg-color | image
12
+ $dialog-attributes:
13
+ ( help #2E3192 #B9C2E1 url(icons/dialog-help.png) // yellow
14
+ , info #005FB4 #BDE5F8 url(icons/dialog-info.png) // blue
15
+ , success #6F7D03 #DFE5B0 url(icons/dialog-success.png) // green
16
+ , warning #A0410D #EFBBA0 url(icons/dialog-warning.png) // orange
17
+ , error #C41616 #F8AAAA url(icons/dialog-error.png) // red
18
+ );
19
+
20
+ @include dialog-box-sprite((image-url("cimma/dialog-boxes/spritemap.svg"), image-url("cimma/dialog-boxes/spritemap.png"))) {
21
+ border: 2px solid;
22
+ }
23
+
24
+ @include dialog-box-simple((ul, ol)) {
25
+ padding: 1em 1em 1em 3em;
26
+ border: 2px solid;
27
+ }
28
+
29
+ @include dialog-box-simple((tr));
data/templates/dialog-boxes/images/spritemap - 1pt.svg ADDED
@@ -0,0 +1,76 @@
1
+ <?xml version="1.0" encoding="UTF-8" standalone="no"?>
2
+ <!-- Generator: Adobe Illustrator 14.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 43363) -->
3
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
4
+ <svg version="1.1"
5
+ id="svg2" inkscape:version="0.48.2 r9819" sodipodi:docname="spritemap.svg" inkscape:export-ydpi="43.200001" inkscape:export-xdpi="43.200001" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:osb="http://www.openswatchbook.org/uri/2009/osb" inkscape:export-filename="Z:\compass-extensions\css\icons\spritemap.png"
6
+ xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="250px" height="50px"
7
+ viewBox="0 0 250 50" enable-background="new 0 0 250 50" xml:space="preserve">
8
+ <metadata
9
+ id="metadata84">
10
+ <rdf:RDF>
11
+ <cc:Work rdf:about="">
12
+ <dc:format>image/svg+xml</dc:format>
13
+ <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
14
+ <dc:title />
15
+ </cc:Work>
16
+ </rdf:RDF>
17
+ </metadata>
18
+ <defs id="gradients">
19
+ <linearGradient id="helpGradient" x1="0" y1="0" x2="0" y2="150%" gradientUnits="userSpaceOnUse">
20
+ <stop offset="0" style="stop-color:#FFFFFF" />
21
+ <stop offset="1" style="stop-color:#2E3192" />
22
+ </linearGradient>
23
+ <linearGradient id="infoGradient" x1="0" y1="0" x2="0" y2="150%" gradientUnits="userSpaceOnUse">
24
+ <stop offset="0" style="stop-color:#FFFFFF" />
25
+ <stop offset="1" style="stop-color:#005FB4" />
26
+ </linearGradient>
27
+ <linearGradient id="successGradient" x1="0" y1="0" x2="0" y2="150%" gradientUnits="userSpaceOnUse">
28
+ <stop offset="0" style="stop-color:#FFFFFF" />
29
+ <stop offset="1" style="stop-color:#6F7D03" />
30
+ </linearGradient>
31
+ <linearGradient id="warningGradient" x1="0" y1="0" x2="0" y2="150%" gradientUnits="userSpaceOnUse">
32
+ <stop offset="0" style="stop-color:#FFFFFF" />
33
+ <stop offset="1" style="stop-color:#A0410D" />
34
+ </linearGradient>
35
+ <linearGradient id="errorGradient" x1="0" y1="0" x2="0" y2="150%" gradientUnits="userSpaceOnUse">
36
+ <stop offset="0" style="stop-color:#FFFFFF" />
37
+ <stop offset="1" style="stop-color:#C41616" />
38
+ </linearGradient>
39
+ </defs>
40
+ <g id="help">
41
+ <circle fill="#2E3192" cx="25" cy="25" r="25"/>
42
+ <circle fill="url(#helpGradient)" cx="25" cy="25" r="24"/>
43
+ <g id="question mark" transform="matrix(0.85761374,0,0,0.85761374,11.147324,4.3153273)">
44
+ <path fill="#FFFFFF" stroke="#2E3192" d="M12.834,32.324c0,0-0.049-1.724,0-3.277 c0.117-3.719,0.383-5.331,4.269-8.368c4.028-2.94,4.919-4.259,5.325-6.792c1.262-7.88-11.948-7.655-11.143-2.207 c0.459,3.106-1.642,4.166-3.749,4.246c-2.793,0.105-4.518-2.554-3.778-5.314c0.927-3.456,6.477-6.202,9.683-6.719 c6.635-0.83,11.916,1.006,14.862,4.297c4.095,4.575,3.216,12.189-5.49,15.298c-2.636,0.941-4.682,2.587-4.796,5.884 c-0.039,1.148-0.075,2.954-0.075,2.954H12.834L12.834,32.324z"/>
45
+ <circle fill="#FFFFFF" stroke="#2E3192" cx="15.317" cy="40.899" r="3.861"/>
46
+ </g>
47
+ </g>
48
+ <g id="info">
49
+ <circle fill="#005DB4" cx="75" cy="25" r="25"/>
50
+ <circle fill="url(#infoGradient)" cx="75" cy="25" r="24"/>
51
+ <g id="i" transform="matrix(0.85761374,0,0,0.85761374,11.147324,4.3153273)">
52
+ <path fill="#FFFFFF" stroke="#005DB4" d="M71.508,34.413c-0.006,0.861-0.036,1.585-0.036,2.58c0,0.699-0.026,2.093-1.013,2.093c-0.855,0-2.566,0-2.566,0 c-0.178-0.002-0.318,0.032-0.423,0.102c-0.104,0.066-0.158,0.189-0.161,0.362v2.849c0.002,0.23,0.043,0.385,0.124,0.467 c0.081,0.083,0.196,0.123,0.343,0.117c0.357-0.008,1.072-0.035,2.144-0.089c1.072-0.05,2.457-0.082,4.156-0.089
53
+ c1.975,0.007,3.581,0.035,4.819,0.089c1.238,0.05,1.984,0.081,2.238,0.089c0.173-0.001,0.294-0.057,0.364-0.163 c0.071-0.1,0.104-0.245,0.102-0.421v-2.906c0.005-0.145-0.034-0.248-0.117-0.312c-0.083-0.066-0.238-0.098-0.466-0.096 c0,0-1.555,0-2.333,0c-0.919,0-1.035-1.118-1.035-1.713c0-1.041-0.012-2.052-0.015-3.077c-0.005-2.102,0-6.299,0-6.299 c-0.002-2.455,0.003-4.53,0.015-6.222c0.012-1.69,0.046-2.783,0.102-3.286c0.049-0.465-0.107-0.699-0.466-0.699
54
+ c-0.35,0-0.816,0.116-1.4,0.351c-0.391,0.157-1.132,0.433-2.225,0.829c-1.093,0.396-2.175,0.79-3.249,1.18 c-1.073,0.389-1.776,0.656-2.108,0.79c-0.145,0.057-0.249,0.121-0.314,0.19c-0.064,0.069-0.096,0.163-0.095,0.277v0.642 c-0.009,0.116,0.023,0.219,0.095,0.305c0.072,0.088,0.235,0.162,0.489,0.219c1.3,0.348,2.141,0.82,2.523,1.414 c0.381,0.597,0.552,1.33,0.51,2.202C71.508,26.189,71.527,31.672,71.508,34.413L71.508,34.413z"/>
55
+ <circle fill="#FFFFFF" stroke="#005DB4" cx="73.972" cy="8.56" r="3.734"/>
56
+ </g>
57
+ </g>
58
+ <g id="success">
59
+ <circle fill="#6F7D03" cx="125" cy="25" r="25"/>
60
+ <circle fill="url(#successGradient)" cx="125" cy="25" r="24"/>
61
+ <path id="Checkmark" fill="#FFFFFF" stroke="#6F7D03" d="M119.596,39.592 c-0.192-0.268-1.313-1.361-2.488-2.428c-3.153-2.863-5.662-4.428-9.899-6.174l-0.77-0.316l1.442-1.534 c0.793-0.843,1.924-2.114,2.513-2.825l1.072-1.291l1.675,1.083c1.771,1.146,3.819,3.056,5.594,5.222l1.073,1.309l1.705-3.053 c4.622-8.272,9.994-15.314,14.103-18.483l1.462-1.127l1.543,1.546c0.85,0.851,2.309,2.125,3.242,2.833l1.697,1.286l-1.307,0.663 c-3.444,1.745-9.368,7.069-13.771,12.378c-2.054,2.477-5.974,7.856-7.378,10.125C120.229,40.225,120.099,40.291,119.596,39.592 L119.596,39.592L119.596,39.592z"/>
62
+ </g>
63
+ <g id="warning">
64
+ <path fill="#A0410D" d="M174.998,2.938c-0.969,0-1.938,0.638-2.674,1.911 l-21.697,37.583c-1.471,2.547-0.268,4.631,2.675,4.631h43.396c2.942,0,4.146-2.084,2.675-4.631l-21.7-37.583 C176.938,3.574,175.969,2.938,174.998,2.938L174.998,2.938z"/>
65
+ <path fill="url(#warningGradient)" d="M174.998,3.937L174.998,3.937 c0.633,0,1.291,0.515,1.809,1.412l21.701,37.583c0.518,0.896,0.635,1.726,0.318,2.271c-0.316,0.547-1.092,0.859-2.127,0.859 h-43.396c-1.035,0-1.811-0.313-2.126-0.859s-0.2-1.375,0.317-2.271l21.697-37.583C173.707,4.452,174.367,3.937,174.998,3.937"/>
66
+ <g id="exclaimation mark" transform="matrix(0.85761374,0,0,0.85761374,11.147324,4.3153273)">
67
+ <path fill="#FFFFFF" stroke="#A0410D" d="M191.056,9.614c1.432,0,4.907,0.276,4.907,3.052c0,2.805-2.922,17.866-3.335,20.1h-1.571 h-1.57c-0.413-2.234-3.335-17.295-3.335-20.1C186.149,9.89,189.624,9.614,191.056,9.614z"/>
68
+ <path fill="#FFFFFF" stroke="#A0410D" d="M195.32,40.336c0,5.436-8.528,5.436-8.528,0C186.793,34.836,195.32,34.839,195.32,40.336"/>
69
+ </g>
70
+ </g>
71
+ <g id="error">
72
+ <circle fill="#C41616" cx="225" cy="25" r="25"/>
73
+ <circle fill="url(#errorGradient)" cx="225" cy="25" r="24"/>
74
+ <polygon id="x" fill="#FFFFFF" stroke="#C41616" points="224.999,29.758 235.233,39.991 239.991,35.234 229.757,25 239.991,14.765 235.233,10.009 224.999,20.242 214.766,10.009 210.009,14.765 220.242,25 210.009,35.234 214.766,39.991"/>
75
+ </g>
76
+ </svg>
data/templates/dialog-boxes/images/spritemap.svg ADDED
@@ -0,0 +1,73 @@
1
+ <?xml version="1.0" encoding="UTF-8" standalone="no"?>
2
+ <!-- Generator: Adobe Illustrator 14.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 43363) -->
3
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
4
+ <svg
5
+ width="250"
6
+ height="50"
7
+ version="1.1"
8
+ xmlns="http://www.w3.org/2000/svg">
9
+ <defs id="gradients">
10
+ <linearGradient id="helpGradient" x1="0" y1="0" x2="0" y2="150%" gradientUnits="userSpaceOnUse">
11
+ <stop offset="0" style="stop-color:#FFFFFF" />
12
+ <stop offset="1" style="stop-color:#2E3192" />
13
+ </linearGradient>
14
+ <linearGradient id="infoGradient" x1="0" y1="0" x2="0" y2="150%" gradientUnits="userSpaceOnUse">
15
+ <stop offset="0" style="stop-color:#FFFFFF" />
16
+ <stop offset="1" style="stop-color:#005FB4" />
17
+ </linearGradient>
18
+ <linearGradient id="successGradient" x1="0" y1="0" x2="0" y2="150%" gradientUnits="userSpaceOnUse">
19
+ <stop offset="0" style="stop-color:#FFFFFF" />
20
+ <stop offset="1" style="stop-color:#6F7D03" />
21
+ </linearGradient>
22
+ <linearGradient id="warningGradient" x1="0" y1="0" x2="0" y2="150%" gradientUnits="userSpaceOnUse">
23
+ <stop offset="0" style="stop-color:#FFFFFF" />
24
+ <stop offset="1" style="stop-color:#A0410D" />
25
+ </linearGradient>
26
+ <linearGradient id="errorGradient" x1="0" y1="0" x2="0" y2="150%" gradientUnits="userSpaceOnUse">
27
+ <stop offset="0" style="stop-color:#FFFFFF" />
28
+ <stop offset="1" style="stop-color:#C41616" />
29
+ </linearGradient>
30
+ </defs>
31
+ <g id="help">
32
+ <circle fill="#2E3192" cx="25" cy="25" r="25"/>
33
+ <circle fill="url(#helpGradient)" cx="25" cy="25" r="23"/>
34
+ <g id="question mark" transform="matrix(0.85761374,0,0,0.85761374,11.147324,4.3153273)">
35
+ <path fill="#FFFFFF" stroke="#2E3192" stroke-width="2" d="M12.834,32.324c0,0-0.049-1.724,0-3.277 c0.117-3.719,0.383-5.331,4.269-8.368c4.028-2.94,4.919-4.259,5.325-6.792c1.262-7.88-11.948-7.655-11.143-2.207 c0.459,3.106-1.642,4.166-3.749,4.246c-2.793,0.105-4.518-2.554-3.778-5.314c0.927-3.456,6.477-6.202,9.683-6.719 c6.635-0.83,11.916,1.006,14.862,4.297c4.095,4.575,3.216,12.189-5.49,15.298c-2.636,0.941-4.682,2.587-4.796,5.884 c-0.039,1.148-0.075,2.954-0.075,2.954H12.834L12.834,32.324z"/>
36
+ <circle fill="#FFFFFF" stroke="#2E3192" stroke-width="2" cx="15.317" cy="40.899" r="3.861"/>
37
+ </g>
38
+ </g>
39
+ <g id="info">
40
+ <circle fill="#005DB4" cx="75" cy="25" r="25"/>
41
+ <circle fill="url(#infoGradient)" cx="75" cy="25" r="23"/>
42
+ <g id="i" transform="matrix(0.85761374,0,0,0.85761374,11.147324,4.3153273)">
43
+ <path fill="#FFFFFF" stroke="#005DB4" stroke-width="2" d="M71.508,34.413c-0.006,0.861-0.036,1.585-0.036,2.58c0,0.699-0.026,2.093-1.013,2.093c-0.855,0-2.566,0-2.566,0 c-0.178-0.002-0.318,0.032-0.423,0.102c-0.104,0.066-0.158,0.189-0.161,0.362v2.849c0.002,0.23,0.043,0.385,0.124,0.467 c0.081,0.083,0.196,0.123,0.343,0.117c0.357-0.008,1.072-0.035,2.144-0.089c1.072-0.05,2.457-0.082,4.156-0.089
44
+ c1.975,0.007,3.581,0.035,4.819,0.089c1.238,0.05,1.984,0.081,2.238,0.089c0.173-0.001,0.294-0.057,0.364-0.163 c0.071-0.1,0.104-0.245,0.102-0.421v-2.906c0.005-0.145-0.034-0.248-0.117-0.312c-0.083-0.066-0.238-0.098-0.466-0.096 c0,0-1.555,0-2.333,0c-0.919,0-1.035-1.118-1.035-1.713c0-1.041-0.012-2.052-0.015-3.077c-0.005-2.102,0-6.299,0-6.299 c-0.002-2.455,0.003-4.53,0.015-6.222c0.012-1.69,0.046-2.783,0.102-3.286c0.049-0.465-0.107-0.699-0.466-0.699
45
+ c-0.35,0-0.816,0.116-1.4,0.351c-0.391,0.157-1.132,0.433-2.225,0.829c-1.093,0.396-2.175,0.79-3.249,1.18 c-1.073,0.389-1.776,0.656-2.108,0.79c-0.145,0.057-0.249,0.121-0.314,0.19c-0.064,0.069-0.096,0.163-0.095,0.277v0.642 c-0.009,0.116,0.023,0.219,0.095,0.305c0.072,0.088,0.235,0.162,0.489,0.219c1.3,0.348,2.141,0.82,2.523,1.414 c0.381,0.597,0.552,1.33,0.51,2.202C71.508,26.189,71.527,31.672,71.508,34.413L71.508,34.413z"/>
46
+ <circle fill="#FFFFFF" stroke="#005DB4" stroke-width="2" cx="73.972" cy="8.56" r="3.734"/>
47
+ </g>
48
+ </g>
49
+ <g id="success">
50
+ <circle fill="#6F7D03" cx="125" cy="25" r="25"/>
51
+ <circle fill="url(#successGradient)" cx="125" cy="25" r="23"/>
52
+ <path id="Checkmark" fill="#FFFFFF" stroke="#6F7D03" stroke-width="2" d="M119.596,39.592 c-0.192-0.268-1.313-1.361-2.488-2.428c-3.153-2.863-5.662-4.428-9.899-6.174l-0.77-0.316l1.442-1.534 c0.793-0.843,1.924-2.114,2.513-2.825l1.072-1.291l1.675,1.083c1.771,1.146,3.819,3.056,5.594,5.222l1.073,1.309l1.705-3.053 c4.622-8.272,9.994-15.314,14.103-18.483l1.462-1.127l1.543,1.546c0.85,0.851,2.309,2.125,3.242,2.833l1.697,1.286l-1.307,0.663 c-3.444,1.745-9.368,7.069-13.771,12.378c-2.054,2.477-5.974,7.856-7.378,10.125C120.229,40.225,120.099,40.291,119.596,39.592 L119.596,39.592L119.596,39.592z"/>
53
+ </g>
54
+ <g id="warning">
55
+ <path fill="#A0410D" d="M174.998,2.938c-0.969,0-1.938,0.638-2.674,1.911 l-21.697,37.583c-1.471,2.547-0.268,4.631,2.675,4.631h43.396c2.942,0,4.146-2.084,2.675-4.631l-21.7-37.583 C176.938,3.574,175.969,2.938,174.998,2.938L174.998,2.938z"/>
56
+ <path fill="url(#warningGradient)" d="M174.998,4.937c-0.167,0-0.556,0.243-0.939,0.911L152.36,43.432
57
+ c-0.386,0.668-0.401,1.126-0.317,1.271c0.083,0.145,0.487,0.359,1.26,0.359h43.396c0.772,0,1.178-0.216,1.262-0.36
58
+ s0.067-0.601-0.319-1.271L175.94,5.849C175.555,5.18,175.165,4.937,174.998,4.937L174.998,4.937z"/>
59
+ <g id="exclaimation_mark" transform="matrix(0.85761374,0,0,0.85761374,11.147324,4.3153273)"/>
60
+ <g id="exclaimation mark" transform="matrix(0.85761374,0,0,0.85761374,11.147324,4.3153273)">
61
+ <path fill="#FFFFFF" stroke="#A0410D" stroke-width="2" d="M191.056,9.614c1.432,0,4.907,0.276,4.907,3.052c0,2.805-2.922,17.866-3.335,20.1h-1.571 h-1.57c-0.413-2.234-3.335-17.295-3.335-20.1C186.149,9.89,189.624,9.614,191.056,9.614z"/>
62
+ <path fill="#FFFFFF" stroke="#A0410D" stroke-width="2" d="M195.32,40.336c0,5.436-8.528,5.436-8.528,0C186.793,34.836,195.32,34.839,195.32,40.336"/>
63
+ </g>
64
+ </g>
65
+ <g id="error">
66
+ <!-- <circle fill="#C41616" cx="225" cy="25" r="25"/>
67
+ <circle fill="url(#errorGradient)" cx="225" cy="25" r="23"/>-->
68
+ <polygon fill="#C41616" points="214.646,50 200,35.355 200,14.645 214.646,0 235.354,0 250,14.645 250,35.355 235.354,50"/>
69
+ <polygon fill="url(#errorGradient)" points="215.474,48 202,34.527 202,15.473 215.474,2 234.526,2 248,15.473 248,34.527 234.526,48"/> <!--<rect x="203" y="3" fill="#C41616" width="44" height="44"/>
70
+ <rect x="205" y="5" fill="url(#errorGradient)" width="40" height="40"/>-->
71
+ <polygon id="x" fill="#FFFFFF" stroke="#C41616" stroke-width="2" points="224.999,29.758 235.233,39.991 239.991,35.234 229.757,25 239.991,14.765 235.233,10.009 224.999,20.242 214.766,10.009 210.009,14.765 220.242,25 210.009,35.234 214.766,39.991"/>
72
+ </g>
73
+ </svg>
data/templates/dialog-boxes/manifest.rb ADDED
@@ -0,0 +1,7 @@
1
+ # Make sure you list all the project template files here in the manifest.
2
+ #stylesheet 'screen.sass', :media => 'screen, projection'
3
+
4
+ image 'images/spritemap.svg', :to => 'cimma/dialog-boxes/spritemap.svg'
5
+ image 'images/spritemap.png', :to => 'cimma/dialog-boxes/spritemap.png'
6
+
7
+ stylesheet 'example.scss', :to => 'cimma/examples/_dialog-boxes.scss'
data/templates/drop-menu/drop-menu.js ADDED
@@ -0,0 +1,124 @@
1
+ function cimmaDropMenu(el) {
2
+ var ua = navigator.userAgent;
3
+ var isTouch = hasTouchEvents() || ua.match(/(iPhone|iPod|iPad)/) || ua.match(/BlackBerry/) || ua.match(/Android/);
4
+
5
+ var childMenus = el.getElementsByTagName('section');
6
+
7
+ if (isTouch) {
8
+ el.className = el.className.length ? el.className + ' touch' : 'touch';
9
+ }
10
+
11
+ if (hasTouchEvents()) {
12
+ el.addEventListener('touchstart', handleEvent, false);
13
+ } else {
14
+ el.addEventListener('click', handleEvent, false);
15
+ el.addEventListener('mouseover', openFirstMenu, false);
16
+ el.addEventListener('mouseout', closeFirstMenu, false);
17
+ }
18
+
19
+ function handleEvent(e) {
20
+ switch(e.type) {
21
+ case 'touchstart': onTouchStart(e); break;
22
+ case 'touchmove': onTouchMove(e); break;
23
+ case 'touchend': onTouchEnd(e); break;
24
+ case 'click': toggleMenu(e); break;
25
+ case 'mouseover': openFirstMenu(e); break;
26
+ case 'mouseout': closeFirstMenu(e); break;
27
+ }
28
+ }
29
+
30
+ function onTouchStart(e) {
31
+ if (!e.target.href) {
32
+ e.preventDefault();
33
+ }
34
+ el.addEventListener('touchmove', handleEvent, false);
35
+ el.addEventListener('touchend', handleEvent, false);
36
+ }
37
+
38
+ function onTouchMove(e) {
39
+ // do nothing?
40
+ }
41
+
42
+ function onTouchEnd(e) {
43
+ el.removeEventListener('touchmove', handleEvent, false);
44
+ el.removeEventListener('touchend', handleEvent, false);
45
+
46
+ toggleMenu(e);
47
+ }
48
+
49
+ function toggleMenu(e) {
50
+ if (e.target instanceof HTMLHeadingElement) {
51
+
52
+ var parent = e.target.parentNode;
53
+ if (parent.className.match('opened')) {
54
+ setElementClosed(parent);
55
+ closeMenu(false);
56
+ } else {
57
+ closeMenu(false);
58
+ setElementOpened(parent);
59
+ }
60
+ } else if (e.target == el) {
61
+ if (e.target.className.match('opened')) {
62
+ closeMenu(true);
63
+ } else {
64
+ openMainMenu();
65
+ }
66
+ }
67
+ }
68
+
69
+ function openMainMenu() {
70
+ setElementOpened(el);
71
+ openFirstMenu(true);
72
+ }
73
+
74
+ function openFirstMenu(e) { // ensures our first element is highlighted
75
+ if (e.target == el || e === true) {
76
+ var m = childMenus[0];
77
+ setElementOpened(m);
78
+ }
79
+ }
80
+
81
+ function closeFirstMenu(e) {
82
+ if (e.target != el && e.target != childMenus[0].firstChild) {
83
+ closeMenu();
84
+ } else {
85
+ //console.log(e.target.constructor);
86
+ }
87
+ }
88
+
89
+ function closeMenu(all) {
90
+ // close all of the submenus
91
+ for (var i = 0, len = childMenus.length; i < len; i++) {
92
+ setElementClosed(childMenus[i]);
93
+ }
94
+
95
+ if (all) {
96
+ setElementClosed(el);
97
+ }
98
+ }
99
+
100
+ function setElementOpened(e) {
101
+ setElementState(e, 'closed', 'opened');
102
+ }
103
+
104
+ function setElementClosed(e) {
105
+ setElementState(e, 'opened', 'closed');
106
+ }
107
+
108
+ function setElementState(e, oldStatus, newStatus) {
109
+ if (e.className.match(oldStatus)) {
110
+ e.className = e.className.replace(oldStatus, newStatus);
111
+ } else if (!e.className.match(newStatus)) {
112
+ e.className = e.className.length ? e.className + ' ' + newStatus : newStatus;
113
+ }
114
+ }
115
+
116
+ function hasTouchEvents() {
117
+ try {
118
+ document.createEvent("TouchEvent");
119
+ return true;
120
+ } catch (e) {
121
+ return false;
122
+ }
123
+ }
124
+ };
data/templates/drop-menu/manifest.rb ADDED
@@ -0,0 +1,7 @@
1
+ # Make sure you list all the project template files here in the manifest.
2
+ #stylesheet 'screen.sass', :media => 'screen, projection'
3
+
4
+ #image 'images/spritemap.svg', :to => 'cimma/dialog-boxes/spritemap.svg'
5
+ #image 'images/spritemap.png', :to => 'cimma/dialog-boxes/spritemap.png'
6
+
7
+ #stylesheet 'example.scss', :to => 'cimma/examples/_dialog_boxes.scss'
data/templates/forms/images/spritemap - Copy.svg ADDED
@@ -0,0 +1,66 @@
1
+ <?xml version="1.0" encoding="utf-8"?>
2
+ <!-- Generator: Adobe Illustrator 14.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 43363) -->
3
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
4
+ <svg version="1.1"
5
+ id="svg2" inkscape:version="0.48.2 r9819" sodipodi:docname="spritemap.svg" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
6
+ xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="90px" height="210px"
7
+ viewBox="0 0 90 210" enable-background="new 0 0 90 210" xml:space="preserve">
8
+ <path id="valid" inkscape:connector-curvature="0" fill="#FFFFFF" stroke="#788703" d="M68.468,114.725
9
+ c-0.122-0.172-0.831-0.865-1.575-1.537c-2-1.814-3.591-2.808-6.271-3.916l-0.491-0.196l0.915-0.974
10
+ c0.502-0.533,1.219-1.34,1.592-1.791l0.682-0.814l1.061,0.686c1.124,0.727,2.42,1.938,3.545,3.312l0.684,0.829l1.076-1.938
11
+ c2.934-5.241,6.336-9.706,8.938-11.714l0.927-0.714l0.979,0.98c0.539,0.541,1.462,1.349,2.054,1.794l1.073,0.816l-0.823,0.42
12
+ c-2.185,1.106-5.94,4.48-8.729,7.846c-1.297,1.57-3.783,4.979-4.677,6.416C68.869,115.127,68.787,115.168,68.468,114.725
13
+ L68.468,114.725L68.468,114.725L68.468,114.725z"/>
14
+ <polygon id="invalid" fill="#FFFFFF" stroke="#C41616" points="71.545,194.477 65.044,200.979 68.066,204 74.568,197.499
15
+ 81.072,204 84.092,200.979 77.589,194.477 84.092,187.975 81.072,184.952 74.568,191.454 68.066,184.952 65.044,187.975 "/>
16
+ <g id="optional" transform="matrix(0.40442342,0,0,0.40442342,41.944703,478.23152)">
17
+ <path id="path3146" inkscape:connector-curvature="0" d="M-77.07-1148.387c0-6.033,1.619-10.76,4.862-14.173
18
+ c3.238-3.413,7.419-5.123,12.548-5.123c3.355,0,6.383,0.8,9.073,2.409c2.696,1.602,4.757,3.836,6.164,6.706
19
+ c1.416,2.871,2.125,6.121,2.125,9.76c0,3.687-0.745,6.987-2.236,9.898c-1.485,2.906-3.592,5.113-6.319,6.609
20
+ c-2.732,1.497-5.676,2.242-8.831,2.242c-3.422,0-6.485-0.827-9.176-2.481c-2.701-1.653-4.738-3.912-6.122-6.771
21
+ C-76.374-1142.169-77.07-1145.193-77.07-1148.387z M-72.111-1148.311c0,4.379,1.177,7.832,3.533,10.353
22
+ c2.359,2.522,5.317,3.783,8.868,3.783c3.624,0,6.604-1.271,8.94-3.816c2.341-2.549,3.51-6.159,3.51-10.836
23
+ c0-2.963-0.496-5.544-1.5-7.751c-0.997-2.207-2.462-3.918-4.389-5.135c-1.927-1.218-4.088-1.822-6.491-1.822
24
+ c-3.404,0-6.333,1.17-8.794,3.505C-70.883-1157.689-72.111-1153.784-72.111-1148.311z"/>
25
+ <path id="path3148" inkscape:connector-curvature="0" d="M-36.696-1120.583v-36.434h4.076v3.423
26
+ c0.956-1.34,2.033-2.343,3.243-3.015c1.209-0.666,2.672-1.003,4.392-1.003c2.253,0,4.231,0.581,5.951,1.736
27
+ c1.718,1.157,3.016,2.79,3.895,4.898c0.879,2.108,1.311,4.419,1.311,6.93c0,2.696-0.483,5.124-1.451,7.278
28
+ c-0.961,2.159-2.365,3.814-4.215,4.961c-1.845,1.152-3.781,1.724-5.813,1.724c-1.49,0-2.824-0.313-4.011-0.943
29
+ c-1.177-0.628-2.153-1.421-2.911-2.38v12.821h-4.467V-1120.583z M-32.653-1143.698c0,3.389,0.686,5.893,2.061,7.517
30
+ c1.375,1.618,3.034,2.427,4.985,2.427c1.985,0,3.685-0.834,5.095-2.515c1.415-1.677,2.119-4.279,2.119-7.802
31
+ c0-3.355-0.687-5.865-2.067-7.54c-1.38-1.666-3.034-2.504-4.949-2.504c-1.905,0-3.582,0.89-5.05,2.67
32
+ C-31.916-1149.671-32.653-1147.088-32.653-1143.698z"/>
33
+ <path id="path3150" inkscape:connector-curvature="0" d="M1.327-1134.669l0.645,3.942c-1.256,0.264-2.378,0.397-3.371,0.397
34
+ c-1.62,0-2.881-0.256-3.772-0.769c-0.891-0.512-1.524-1.187-1.886-2.02c-0.357-0.838-0.541-2.596-0.541-5.271v-15.155h-3.278
35
+ v-3.472h3.278v-6.522l4.436-2.678v9.2h4.489v3.472h-4.489v15.402c0,1.274,0.08,2.089,0.234,2.456
36
+ c0.157,0.362,0.413,0.653,0.773,0.867c0.355,0.214,0.862,0.32,1.526,0.32C-0.141-1134.497,0.518-1134.554,1.327-1134.669z"/>
37
+ <path id="path3152" inkscape:connector-curvature="0" d="M5.693-1161.902v-5.134h4.472v5.134H5.693z M5.693-1130.677v-26.341h4.472
38
+ v26.341H5.693z"/>
39
+ <path id="path3154" inkscape:connector-curvature="0" d="M15.316-1143.848c0-4.88,1.352-8.491,4.064-10.837
40
+ c2.277-1.95,5.032-2.924,8.29-2.924c3.617,0,6.578,1.187,8.881,3.558c2.299,2.371,3.448,5.648,3.448,9.835
41
+ c0,3.389-0.512,6.056-1.526,7.999c-1.024,1.94-2.497,3.449-4.443,4.525c-1.939,1.075-4.059,1.609-6.358,1.609
42
+ c-3.69,0-6.667-1.182-8.944-3.548C16.453-1135.994,15.316-1139.397,15.316-1143.848L15.316-1143.848z M19.906-1143.848
43
+ c0,3.373,0.734,5.899,2.207,7.577c1.473,1.676,3.323,2.516,5.556,2.516c2.212,0,4.057-0.843,5.527-2.529
44
+ c1.473-1.685,2.209-4.26,2.209-7.714c0-3.256-0.741-5.723-2.222-7.4c-1.478-1.677-3.318-2.52-5.515-2.52
45
+ c-2.236,0-4.086,0.833-5.559,2.504C20.64-1149.742,19.906-1147.222,19.906-1143.848z"/>
46
+ <path id="path3156" inkscape:connector-curvature="0" d="M45.248-1130.677v-26.341h4.025v3.745c1.932-2.893,4.728-4.34,8.384-4.34
47
+ c1.584,0,3.04,0.29,4.371,0.856c1.333,0.57,2.333,1.32,2.994,2.244c0.657,0.925,1.118,2.026,1.384,3.297
48
+ c0.167,0.827,0.256,2.272,0.256,4.343v16.193h-4.467v-16.023c0-1.818-0.174-3.179-0.519-4.081
49
+ c-0.353-0.902-0.959-1.619-1.852-2.159c-0.884-0.536-1.917-0.808-3.11-0.808c-1.893,0-3.54,0.604-4.921,1.811
50
+ c-1.381,1.205-2.077,3.494-2.077,6.866v14.384h-4.462v0.005h-0.005V-1130.677L45.248-1130.677z"/>
51
+ <path id="path3158" inkscape:connector-curvature="0" d="M90.71-1133.927c-1.647,1.405-3.238,2.399-4.767,2.976
52
+ c-1.526,0.577-3.173,0.867-4.931,0.867c-2.888,0-5.114-0.705-6.669-2.118c-1.553-1.414-2.333-3.224-2.333-5.423
53
+ c0-1.286,0.295-2.467,0.884-3.529c0.584-1.065,1.357-1.922,2.306-2.569c0.956-0.645,2.024-1.132,3.219-1.463
54
+ c0.864-0.233,2.19-0.455,3.965-0.667c3.598-0.431,6.254-0.944,7.959-1.543c0.017-0.611,0.027-0.996,0.027-1.164
55
+ c0-1.817-0.423-3.098-1.26-3.849c-1.14-1.007-2.84-1.509-5.085-1.509c-2.106,0-3.651,0.368-4.656,1.101
56
+ c-1,0.736-1.739,2.04-2.217,3.908l-4.366-0.595c0.391-1.868,1.058-3.377,1.956-4.525c0.913-1.148,2.226-2.032,3.946-2.654
57
+ c1.724-0.622,3.709-0.93,5.979-0.93c2.246,0,4.076,0.264,5.477,0.793c1.415,0.529,2.446,1.197,3.11,1.996
58
+ c0.664,0.803,1.12,1.817,1.376,3.038c0.159,0.764,0.232,2.136,0.232,4.117v5.953c0,4.152,0.092,6.776,0.285,7.873
59
+ c0.193,1.101,0.57,2.154,1.13,3.161h-4.66C91.149-1131.604,90.848-1132.688,90.71-1133.927L90.71-1133.927z M90.34-1143.896
60
+ c-1.618,0.659-4.047,1.223-7.283,1.684c-1.84,0.264-3.139,0.564-3.902,0.892c-0.758,0.332-1.345,0.82-1.758,1.451
61
+ c-0.415,0.636-0.618,1.344-0.618,2.119c0,1.193,0.444,2.185,1.345,2.977c0.903,0.793,2.224,1.189,3.953,1.189
62
+ c1.719,0,3.255-0.377,4.593-1.129c1.343-0.756,2.328-1.782,2.951-3.087c0.478-1.008,0.715-2.497,0.715-4.466v-1.635h0.005
63
+ V-1143.896L90.34-1143.896z"/>
64
+ <path id="path3160" inkscape:connector-curvature="0" d="M101.702-1130.677v-36.358h4.462v36.358H101.702z"/>
65
+ </g>
66
+ </svg>