toadstool 0.0.0.1 → 0.0.0.3

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 (163) hide show
  1. data/lib/bin/toadstool +80 -33
  2. data/lib/stylesheets/_toadstool-styleguide.scss +33 -0
  3. data/lib/stylesheets/toadstool/_buttons.scss +22 -0
  4. data/lib/stylesheets/toadstool/_config.scss +228 -0
  5. data/lib/stylesheets/toadstool/_design.scss +55 -0
  6. data/lib/stylesheets/toadstool/_forms.scss +18 -0
  7. data/lib/stylesheets/toadstool/_grids.scss +48 -0
  8. data/lib/stylesheets/toadstool/_modules.scss +3 -0
  9. data/{sass → lib/stylesheets/toadstool}/_typography.scss +43 -11
  10. data/lib/stylesheets/toadstool/_ui_patterns.scss +3 -0
  11. data/lib/stylesheets/toadstool/_web_fonts.scss +11 -0
  12. data/lib/stylesheets/toadstool/modules/_footer.scss +7 -0
  13. data/lib/stylesheets/toadstool/modules/_header.scss +41 -0
  14. data/lib/stylesheets/toadstool/modules/_main_nav.scss +49 -0
  15. data/lib/stylesheets/toadstool/ui_patterns/_color_grid.scss +220 -0
  16. data/lib/stylesheets/toadstool/ui_patterns/_emBox.scss +16 -0
  17. data/lib/stylesheets/toadstool/ui_patterns/_prettify.scss +136 -0
  18. data/lib/templates/module/sass/_example_module.scss +4 -0
  19. data/{sass/modules/example_module → lib/templates/module/sass}/_extends.scss +0 -0
  20. data/{sass/modules/example_module → lib/templates/module/sass}/_mixins.scss +0 -0
  21. data/{views/modules/example_module → lib/templates/module/views}/module.erb +0 -0
  22. data/{views/modules/example_module → lib/templates/module/views}/module.js +0 -0
  23. data/{views/modules/example_module → lib/templates/module/views}/view.erb +0 -0
  24. data/{Gemfile → lib/templates/project/Gemfile} +1 -3
  25. data/lib/templates/project/Rakefile +21 -0
  26. data/{config.rb → lib/templates/project/config.rb} +5 -3
  27. data/lib/templates/project/config.ru +8 -0
  28. data/{doc-src → lib/templates/project/doc-src}/SASS-Guidelines.md +0 -0
  29. data/lib/templates/project/doc-src/changelog.md +22 -0
  30. data/{doc-src → lib/templates/project/doc-src}/mit_license.md +0 -0
  31. data/{sass/modules/example_module/readme.md → lib/templates/project/doc-src/module-sass-readme.md} +0 -0
  32. data/{public → lib/templates/project/public}/images/toadstool-logo.png +0 -0
  33. data/{public → lib/templates/project/public}/javascripts/application.js +12 -1
  34. data/lib/templates/project/public/javascripts/jquery-1.8.3.min.js +2 -0
  35. data/{public → lib/templates/project/public}/javascripts/lang-css.js +0 -0
  36. data/{public → lib/templates/project/public}/javascripts/lang-yaml.js +0 -0
  37. data/lib/templates/project/public/javascripts/modernizr-2.6.1.js +1384 -0
  38. data/{public → lib/templates/project/public}/javascripts/modernizr.mods.js +0 -0
  39. data/{public → lib/templates/project/public}/javascripts/prettify.js +0 -0
  40. data/lib/templates/project/readme.md +79 -0
  41. data/lib/templates/project/sass/_buttons.scss +37 -0
  42. data/{sass → lib/templates/project/sass}/_config.scss +81 -74
  43. data/{sass → lib/templates/project/sass}/_design.scss +0 -0
  44. data/lib/templates/project/sass/_forms.scss +41 -0
  45. data/{sass → lib/templates/project/sass}/_reset.scss +0 -0
  46. data/lib/templates/project/sass/_typography.scss +98 -0
  47. data/lib/templates/project/sass/buttons/_extends.scss +3 -0
  48. data/lib/templates/project/sass/buttons/_mixins.scss +2 -0
  49. data/lib/templates/project/sass/color/_color_defaults.scss +98 -0
  50. data/{sass → lib/templates/project/sass}/color/_color_math.scss +1 -1
  51. data/lib/templates/project/sass/color/_extends.scss +109 -0
  52. data/{sass → lib/templates/project/sass}/color/_grayscale_math.scss +0 -0
  53. data/lib/templates/project/sass/color/readme.md +63 -0
  54. data/lib/templates/project/sass/forms/_extends.scss +3 -0
  55. data/lib/templates/project/sass/forms/_mixins.scss +3 -0
  56. data/{sass/_ui_patterns.scss → lib/templates/project/sass/layouts/_example_layout.scss} +0 -0
  57. data/lib/templates/project/sass/readme.md +142 -0
  58. data/{sass → lib/templates/project/sass}/style.scss +6 -10
  59. data/{sass → lib/templates/project/sass}/toadstool.scss +1 -1
  60. data/lib/templates/project/sass/typography/_extends.scss +13 -0
  61. data/lib/templates/project/sass/typography/_mixins.scss +2 -0
  62. data/{sass → lib/templates/project/sass/typography}/_web_fonts.scss +2 -5
  63. data/lib/templates/project/toadstool.rb +94 -0
  64. data/lib/templates/project/views/color_palettes.erb +371 -0
  65. data/lib/templates/project/views/forms.erb +40 -0
  66. data/lib/templates/project/views/forms/disabled_button.erb +18 -0
  67. data/lib/templates/project/views/forms/password_input.erb +22 -0
  68. data/lib/templates/project/views/forms/primary_button.erb +18 -0
  69. data/lib/templates/project/views/forms/readme.md +2 -0
  70. data/{views → lib/templates/project/views}/forms/username_input.erb +0 -0
  71. data/{views → lib/templates/project/views}/grid.erb +0 -0
  72. data/{views → lib/templates/project/views}/grid24.erb +0 -0
  73. data/{views → lib/templates/project/views}/grids/grid_arguments.erb +0 -0
  74. data/{views → lib/templates/project/views}/grids/use_definition.erb +0 -0
  75. data/{views → lib/templates/project/views}/layout.erb +2 -2
  76. data/{views/modules/example_module → lib/templates/project/views/modules}/readme.md +6 -4
  77. data/lib/templates/project/views/shared/_code_toggle.erb +10 -0
  78. data/lib/templates/project/views/shared/_html_example.erb +5 -0
  79. data/{views → lib/templates/project/views}/shared/_main_footer.erb +0 -0
  80. data/{views → lib/templates/project/views}/shared/_main_header.erb +0 -0
  81. data/{views → lib/templates/project/views}/shared/_main_nav.erb +0 -0
  82. data/{views → lib/templates/project/views}/shared/_toadstool_subheader.erb +0 -0
  83. data/lib/templates/project/views/typography.erb +35 -0
  84. data/lib/templates/project/views/typography/body_copy.erb +2 -0
  85. data/{views → lib/templates/project/views}/typography/body_links.erb +0 -0
  86. data/{sass/ui_patterns/_example.scss → lib/templates/project/views/typography/general_typography.erb} +0 -0
  87. data/{views → lib/templates/project/views}/typography/headings.erb +0 -0
  88. data/{views → lib/templates/project/views}/typography/vertical_rhythm.erb +0 -0
  89. data/{views → lib/templates/project/views}/typography/web_fonts.erb +0 -0
  90. data/lib/templates/project/views/ui_patterns/forms/primary_buttons.erb +8 -0
  91. data/lib/templates/project/views/ui_patterns/forms/text_input.erb +11 -0
  92. data/lib/templates/project/views/ui_patterns/forms/text_input_error.erb +11 -0
  93. data/{views → lib/templates/project/views}/ui_patterns/readme.md +4 -3
  94. data/lib/templates/project/views/ui_patterns/typography/_body_copy.erb +2 -0
  95. data/lib/templates/project/views/ui_patterns/typography/_headings.erb +6 -0
  96. data/lib/templates/ui_pattern/sass/_example_pattern.scss +4 -0
  97. data/lib/templates/ui_pattern/sass/_extends.scss +0 -0
  98. data/lib/templates/ui_pattern/sass/_mixins.scss +0 -0
  99. data/{views/ui_patterns → lib/templates/ui_pattern/views}/example.erb +0 -0
  100. data/lib/toadstool.rb +4 -0
  101. data/lib/toadstool/version.rb +3 -0
  102. metadata +120 -109
  103. data/Rakefile +0 -4
  104. data/config.ru +0 -6
  105. data/doc-src/What-Is-Toadstool.md +0 -44
  106. data/doc-src/changelog.md +0 -29
  107. data/doc-src/config.md +0 -18
  108. data/doc-src/mixin_directory.md +0 -17
  109. data/doc-src/sass.md +0 -4
  110. data/lib/RackServer.rb +0 -93
  111. data/public/fonts/fontawesome-webfont.eot +0 -0
  112. data/public/fonts/fontawesome-webfont.svg +0 -255
  113. data/public/fonts/fontawesome-webfont.ttf +0 -0
  114. data/public/fonts/fontawesome-webfont.woff +0 -0
  115. data/public/fonts/zocial-regular-webfont.eot +0 -0
  116. data/public/fonts/zocial-regular-webfont.svg +0 -138
  117. data/public/fonts/zocial-regular-webfont.ttf +0 -0
  118. data/public/fonts/zocial-regular-webfont.woff +0 -0
  119. data/public/javascripts/css_browser_selector.js +0 -8
  120. data/public/javascripts/lang-apollo.js +0 -2
  121. data/public/javascripts/lang-clj.js +0 -18
  122. data/public/javascripts/lang-go.js +0 -1
  123. data/public/javascripts/lang-hs.js +0 -2
  124. data/public/javascripts/lang-lisp.js +0 -3
  125. data/public/javascripts/lang-lua.js +0 -2
  126. data/public/javascripts/lang-ml.js +0 -2
  127. data/public/javascripts/lang-n.js +0 -4
  128. data/public/javascripts/lang-proto.js +0 -1
  129. data/public/javascripts/lang-scala.js +0 -2
  130. data/public/javascripts/lang-sql.js +0 -2
  131. data/public/javascripts/lang-tex.js +0 -1
  132. data/public/javascripts/lang-vb.js +0 -2
  133. data/public/javascripts/lang-vhdl.js +0 -3
  134. data/public/javascripts/lang-wiki.js +0 -2
  135. data/public/javascripts/lang-xq.js +0 -3
  136. data/public/javascripts/selectivizr-min.js +0 -5
  137. data/public/stylesheets/style.css +0 -615
  138. data/public/stylesheets/toadstool.css +0 -1643
  139. data/readme.md +0 -37
  140. data/sass/_buttons.scss +0 -20
  141. data/sass/_forms.scss +0 -18
  142. data/sass/_modules.scss +0 -12
  143. data/sass/buttons/_cupid_config.scss +0 -20
  144. data/sass/buttons/_minimal_config.scss +0 -15
  145. data/sass/color/_extends.scss +0 -291
  146. data/sass/ui_patterns/_color_grid.scss +0 -286
  147. data/toadstool.rb +0 -84
  148. data/views/abstract_colors.erb +0 -1
  149. data/views/alerts.erb +0 -1
  150. data/views/buttons.erb +0 -1
  151. data/views/color_palettes.erb +0 -221
  152. data/views/forms.erb +0 -24
  153. data/views/forms/disabled_button.erb +0 -18
  154. data/views/forms/password_input.erb +0 -22
  155. data/views/forms/primary_button.erb +0 -18
  156. data/views/modules/readme.md +0 -10
  157. data/views/semantic_colors.erb +0 -1
  158. data/views/shared/_html_example.erb +0 -31
  159. data/views/shared/_sass_example.erb +0 -10
  160. data/views/typography.erb +0 -17
  161. data/views/typography/body_copy.erb +0 -19
  162. data/views/typography/general_typography.erb +0 -19
  163. data/views/ui_patterns/forms/text_input.erb +0 -10
data/lib/stylesheets/toadstool/_forms.scss ADDED
@@ -0,0 +1,18 @@
1
+ // Styled drop down menues
2
+ [class*="toadstool"] {
3
+ select {
4
+ border: 1px solid #555;
5
+ padding: 0.5em;
6
+ line-height: 1.2em;
7
+ padding: 0.5em 1em 0.5em 0.75em;
8
+ margin-top: em(3);
9
+ @include border_radius(0.5em);
10
+ .flexbox & {
11
+ -webkit-appearance: none;
12
+ background: #fff url("data:image/png,%89PNG%0D%0A%1A%0A%00%00%00%0DIHDR%00%00%0C%80%00%00%00%40%08%02%00%00%00W%AEz%EF%00%00%00%19tEXtSoftware%00Adobe%20ImageReadyq%C9e%3C%00%00%04%E5IDATx%DA%EC%DD%3DN%E3Z%18%06%E0%B1oD%82%A8%E8(%A8%D2Q%D2%D0%40%83%C4%12%D8%01%3Db%09P%81%A0%40%A2%60%05%D9%05%BB%A0%04%09!B%3A%9A%10%07%F2g%E7%22%90f(%98%E09%23Y7%E7%3EOi%1F%1FK_%FD%EA%FD%92%E9t%FA%03%00%00%00%00%00%00%00%00%80%3F%97%1A%01%00%00%00%00%00%00%00%00%40%98%9A%06%2C%00%00%00%00%00%00%00%00%20%0E%D5%A7%A14%60%01%00%00%00%00%00%00%00%00%04%D2%80%05%00%00%00%00%00%00%00%00DB%03%16%00%00%00%00%00%00%00%00%C0%DC%D0%80%05%00%00%00%00%00%00%00%00D%A2(%8A%8A%FF(%80%05%00%00%00%00%00%00%00%00D%C2%0AB%00%00%00%00%00%00%00%00%80%B9%A1%01%0B%00%00%00%00%00%00%00%00%88%84%15%84%00%00%00%00%00%00%00%00%00%81%AC%20%04%00%00%00%00%00%00%00%00%98%1B%1A%B0%00%00%00%00%00%00%00%00%80HXA%08%00%00%00%00%00%00%00%00%10%A8%FA4%94%00%16%00%00%00%00%00%00%00%00%10%09%0DX%00%00%00%00%00%00%00%00%00%81%AAOC%A5%86%0E%00%00%00%00%00%00%00%00%10F%03%16%00%00%00%00%00%00%00%00%10%09%2B%08%01%00%00%00%00%00%00%00%00%02U%9F%86%12%C0%02%00%00%00%00%00%00%00%00%22!%80%05%00%00%00%00%00%00%00%00%10%C8%0AB%00%00%00%00%00%00%00%00%80%40%1A%B0%00%00%00%00%00%00%00%00%00%02i%C0%02%00%00%00%00%00%00%00%00%08%A4%01%0B%00%00%00%00%00%00%00%00%20%90%06%2C%00%00%00%00%00%00%00%00%80%40%02X%00%00%00%00%00%00%00%00%00%81%AC%20%04%00%00%00%00%00%00%00%00%08%24%80%05%00%00%00%00%00%00%00%00%10%C8%0AB%00%00%00%00%00%00%00%00%80%40%1A%B0%00%00%00%00%00%00%00%00%00%02i%C0%02%00%00%00%00%00%00%00%00%084%3B%0Du%7B%7B%7Bzz%3A%18%0C%CA_%D8h4%F6%F6%F6677%F3%3C%FF%F2%40%D2%E9t%CC%1D%00%00%00%00%00%00%00%00%88%40%96e3%DE%26I2%18%0C%8E%8F%8F%EF%EE%EE%CA%DC%B6%BC%BC%7Cxx%D8l6_%5E%5EF%A3%D1%97%E9%AE%D4%D0%01%00%00%00%00%00%00%00%80%FF%83%E9t%BA%B8%B8xvv%B6%B3%B3%F3%ED%E1%F5%F5%F5V%AB%B5%B6%B66%99L~W%7F%F5%26y%7C%7C4Y%00%00%00%00%00%00%00%00%20%02%BD%5E%EF%DB3i%9A%D6%EB%F5%AB%AB%ABV%AB%F5%BBu%84%BB%BB%BB%FB%FB%FB%FD~%3F%CB%B2%B73%B3%02X%EDv%DB%DC%01%00%00%00%00%00%00%00%80%08%94%09%60%FDx%DFE%B8%B0%B0%D0n%B7%2F..%3A%9D%CE%E7W%8DF%E3%E8%E8hcc%23%7B7%1C%0E%BF%DC%3C%F8%EB%AA%87%87%07s%07%00%00%00%00%00%00%00%00%22%F0%FC%FC%5C%F2d%9A%A6%B5Zm2%99%9C%9F%9F___%7F%3C%5C%5D%5D%3D99YYY%E9%F5z%FD~%7F%3C%1E%17E1%FB%9E%7F%0E%0E%0E%CC%1D%00%00%00%00%00%00%00%00%88%C0p8%2Cyr%3A%9D%E6y%9E%A6%E9%F6%F6%F6h4%BA%B9%B9%D9%DA%DA%BA%BC%BC%AC%D5j%DDn7%CB%B2%B7%87%B3%BB%AF%3E%24%F7%F7%F7%E6%0E%00%00%00%00%00%00%00%00D%A0%7C%03%D6Oi%9A%D6%EB%F5n%B7%DBl6%C7%E3q%96e%AF%AF%AF%DF%16_%FDT%2B%93%D2%02%00%00%00%00%00%00%00%00%F8%EF%2B%1F%9C%FA%FC%C9%9B%A5%A5%A5%A7%A7%A7%3C%CF%CB%AC%1D%FCL%00%0B%00%00%00%00%00%00%00%00%88DX%1A*%7F%97%24I%C0%E7%02X%00%00%00%00%00%00%00%00%40%24%FE%26%0D%15%F6%AD%00%16%00%00%00%00%00%00%00%00%10%89%80%15%84%7FI%00%0B%00%00%00%00%00%00%00%00%88D%F5i(%01%2C%00%00%00%00%00%00%00%00%20%12%1A%B0%00%00%00%00%00%00%00%00%00%02i%C0%02%00%00%00%00%00%00%00%00%08%24%80%05%00%00%00%00%00%00%00%00%10%C8%0AB%00%00%00%00%00%00%00%00%80%40%D5%A7%A1RC%07%00%00%00%00%00%00%00%00%08%A3%01%0B%00%00%00%00%00%00%00%00%88%84%15%84%00%00%00%00%00%00%00%00%00%81%AAOC%09%60%01%00%00%00%00%00%00%00%00%91%10%C0%02%00%00%00%00%00%00%00%00%08T%FD%0A%C2%D4%D0%01%00%00%00%00%00%00%00%00%C2h%C0%02%00%00%00%00%00%00%00%00%22a%05!%00%00%00%00%00%00%00%00%40%A0%EA%D3PV%10%02%00%00%00%00%00%00%00%00%04%D2%80%05%00%00%00%00%00%00%00%00D%A2(%8A%8A%FF(%80%05%00%00%00%00%00%00%00%00D%C2%0AB%00%00%00%00%00%00%00%00%80%B9%A1%01%0B%00%00%00%00%00%00%00%00%88%84%06%2C%00%00%00%00%00%00%00%00%80%B9%A1%01%0B%00%00%00%00%00%00%00%00%88DQ%14%15%FF%F1_%01%06%00md%E2%BF%C9%C3%19%DA%00%00%00%00IEND%AEB%60%82") no-repeat right center;
13
+ background-size: 1600px 32px;
14
+ }
15
+ }
16
+ }
17
+
18
+
data/lib/stylesheets/toadstool/_grids.scss ADDED
@@ -0,0 +1,48 @@
1
+
2
+ .col_4_grid, .col_10_grid {
3
+ display: none;
4
+ }
5
+
6
+ @media #{$tablet_portrait} {
7
+ .col_10_grid {
8
+ display: block;
9
+ }
10
+ .col_12_grid {
11
+ display: none;
12
+ }
13
+ }
14
+
15
+ @media #{$mobile} {
16
+ .col_4_grid {
17
+ display: block;
18
+ }
19
+ .col_12_grid, .col_10_grid {
20
+ display: none;
21
+ }
22
+ }
23
+
24
+
25
+
26
+ // grid ----------------------
27
+ @for $i from 1 through 12 {
28
+ .grid-#{$i} {
29
+ @extend %grid_#{$i};
30
+ @extend %grid_display;
31
+ }
32
+ }
33
+
34
+ .grid-full {
35
+ @include full_width_block(12, $main_grid_align: left);
36
+ }
37
+
38
+ .grid-full_center {
39
+ @include full_width_block(12);
40
+ }
41
+
42
+
43
+ @for $i from 1 through 24 {
44
+ .grid-#{$i}-24 {
45
+ @extend %grid_#{$i}_24;
46
+ @extend %grid_display;
47
+ }
48
+ }
data/lib/stylesheets/toadstool/_modules.scss ADDED
@@ -0,0 +1,3 @@
1
+ @import "modules/header";
2
+ @import "modules/footer";
3
+ @import "modules/main_nav";
data/{sass → lib/stylesheets/toadstool}/_typography.scss RENAMED
@@ -20,7 +20,7 @@
20
20
 
21
21
  // Import of default text bootstrap settings
22
22
  // -----------------------------------------------------------------------
23
- @import "stipe/typography/default"; // Comment out if unwanted
23
+ // @import "stipe/typography/default"; // Comment out if unwanted
24
24
 
25
25
 
26
26
 
@@ -28,21 +28,43 @@
28
28
  // Commented out styles represent Toadstool's default bootstrap styles
29
29
  // -----------------------------------------------------------------------
30
30
  html {
31
- // font: em($font_size, 16) $primary_font_family;
32
- // line-height: baseline($font_size);
31
+ // font: #{$font_size / 16 * 1em}/$line_height $primary_font_family;
33
32
  // color: $primary_text;
34
33
  }
35
34
 
36
- h1 {
37
- // font-size: 2em; // user agent default
38
- // @extend %headings_1;
35
+ [class*="toadstool"] {
36
+ h1 {
37
+ @extend %headings_1;
38
+ font-weight: bold;
39
+ }
40
+ h2 {
41
+ @extend %headings_2;
42
+ color: $charlie_gray;
43
+ a {
44
+ font-size: 0.8em;
45
+ margin-left: em(5);
46
+ }
47
+ }
48
+ p, ul {
49
+ color: $charlie_gray;
50
+ @include text(14);
51
+ }
39
52
  }
40
53
 
41
- h2 {
42
- // font-size: 1.5em; // user agent default
43
- // @extend %headings_2;
54
+ // This is used to keep heading examples from poorly wrapping in mobile
55
+ .element_example {
56
+ @media #{$mobile} {
57
+ h1, h2, h3, h4, h5, h6 {
58
+ width: auto;
59
+ white-space: nowrap;
60
+ overflow: hidden;
61
+ text-overflow: ellipsis;
62
+ }
63
+ }
44
64
  }
45
65
 
66
+
67
+
46
68
  h3 {
47
69
  // font-size: 1.17em; // user agent default
48
70
  // @extend %headings_3;
@@ -66,8 +88,11 @@ h6 {
66
88
  // Standard body text support
67
89
  // --------------------------------
68
90
  p {
69
- // margin-bottom: baseline-margin($font_size);
91
+ // margin-bottom: 1em;
70
92
  // text-indent: 0;
93
+ // &:last-child {
94
+ // margin-bottom: 0;
95
+ // }
71
96
  }
72
97
 
73
98
  b {
@@ -90,4 +115,11 @@ a {
90
115
  // &:visited {
91
116
  // color: $href_color;
92
117
  // }
93
- }
118
+ }
119
+
120
+ // .toadstool_header {
121
+ // h1 {
122
+ // color: $bravo_primary;
123
+ // font-size: em($heading_1);
124
+ // }
125
+ // }
data/lib/stylesheets/toadstool/_ui_patterns.scss ADDED
@@ -0,0 +1,3 @@
1
+ @import "ui_patterns/prettify";
2
+ @import "ui_patterns/emBox";
3
+ @import "ui_patterns/color_grid";
data/lib/stylesheets/toadstool/_web_fonts.scss ADDED
@@ -0,0 +1,11 @@
1
+
2
+ // -----------------------------------------------------------
3
+ @import "stipe/typography/mixins"; // Do not edit, needed to pull in necessary mixin
4
+ $webfont_directory: "/fonts/" !default; // edit this directory in the '_config.scss' file if needed.
5
+
6
+
7
+ // Install your own
8
+ // -----------------------------------------------------------
9
+ //@font-face {
10
+ // @include font-face ($font_family: [name of family], $font-file: [name of file], $font_weight: [value], $font_style: [value]);
11
+ //}
data/lib/stylesheets/toadstool/modules/_footer.scss ADDED
@@ -0,0 +1,7 @@
1
+ .toadstool_main_footer {
2
+ padding: em(10) 0;
3
+ border-top: 1px solid $border_color;
4
+ @include grid(12, $grid_align: center);
5
+ clear: both;
6
+ text-align: center;
7
+ }
data/lib/stylesheets/toadstool/modules/_header.scss ADDED
@@ -0,0 +1,41 @@
1
+ .toadstool_main_header {
2
+ @extend %clearfix;
3
+ h1 {
4
+ color: $white;
5
+ float: left;
6
+ margin-bottom: 0;
7
+ }
8
+ background: $bravo_gray;
9
+ padding: rem(10) rem(10) rem(15) rem(10);
10
+ form {
11
+ display: inline-block;
12
+ float: right;
13
+ select {
14
+ min-width: rem(100);
15
+ }
16
+ @media #{$mobile} {
17
+ margin-top: em(10);
18
+ margin-right: em(10);
19
+ margin-left: em(2);
20
+ width: 80%;
21
+ float: none;
22
+ }
23
+ }
24
+ }
25
+
26
+ .toadstool_header {
27
+ h1 {
28
+ margin-top: rem(24);
29
+ }
30
+ }
31
+
32
+ .toadstool_subheader {
33
+ h2 {
34
+ margin-bottom: 0;
35
+ }
36
+ }
37
+
38
+
39
+
40
+
41
+
data/lib/stylesheets/toadstool/modules/_main_nav.scss ADDED
@@ -0,0 +1,49 @@
1
+ .toadstool_nav {
2
+ ol {
3
+ @include flexbox(100%, auto);
4
+ background: $bravo_gray;
5
+ font-weight: bold;
6
+ @media #{$mobile} {
7
+ @include flexbox(100%, auto, $orient: vertical);
8
+ @include linear_gradient_w3c ($bravo_gray, #{$bravo_gray 30%,$delta_gray 100%});
9
+ }
10
+ }
11
+ li {
12
+ @include flex(1);
13
+ text-align: center;
14
+ line-height: 3em;
15
+ background: $white;
16
+ color: $alpha_gray;
17
+ border-radius: em(5) em(5) 0 0;
18
+ @media #{$mobile} {
19
+ width: 100%;
20
+ border-radius: 0;
21
+ font-size: 1.2em;
22
+ background: transparent;
23
+ color: $echo_gray;
24
+ border-top: 1px solid $echo_gray;
25
+ }
26
+ }
27
+ a {
28
+ color: $white;
29
+ @include linear_gradient_w3c ($bravo_gray, #{$bravo_gray 50%,$delta_gray 100%});
30
+ .no-flexbox & {
31
+ padding: 0 em(10);
32
+ }
33
+ @media #{$mobile} {
34
+ background: transparent;
35
+ }
36
+ display: block;
37
+ &:hover {
38
+ text-decoration: none;
39
+ background: $white;
40
+ color: $alpha_gray;
41
+ border-radius: em(5) em(5) 0 0;
42
+ @media #{$mobile} {
43
+ border-radius: 0;
44
+ background: transparent;
45
+ color: $echo_gray;
46
+ }
47
+ }
48
+ }
49
+ }
data/lib/stylesheets/toadstool/ui_patterns/_color_grid.scss ADDED
@@ -0,0 +1,220 @@
1
+ // Toadstool's view
2
+ // ----------------------------------------------
3
+ .colorcode {
4
+ margin-bottom: 1.5em;
5
+ @extend %clearfix;
6
+ @media #{$mobile} {
7
+ @include grid(4, $grid_context: 4);
8
+ }
9
+ .toadstool_subheader {
10
+ margin-bottom: 1em;
11
+ }
12
+ section {
13
+ padding: em(10) 0 0 em(10);
14
+ margin: em(-10) 0 0 em(-10);
15
+ }
16
+ div {
17
+ @include box_sizing;
18
+ text-align: center;
19
+ float: left;
20
+ font-weight: bold;
21
+ width: em(75);
22
+ height: em(75);
23
+ border-radius: 50%;
24
+ margin: 0 em(50) em(70) em(50);
25
+ border: 1px solid $white;
26
+ box-shadow: 0 0 em(10) em(3) $shadow_color;
27
+ span {
28
+ display: block;
29
+ font-weight: normal;
30
+ }
31
+ }
32
+ p {
33
+ margin-bottom: 0;
34
+ margin-left: -25px;
35
+ width: 125px;
36
+ margin-top: 85px;
37
+ }
38
+ .border {
39
+ @include box_shadow (inset $alpha_gray, 0 0 1px);
40
+ }
41
+ @media #{$mobile} {
42
+ div {
43
+ width: 100%;
44
+ border-radius: 0;
45
+ margin-bottom: em(10);
46
+ box-shadow: 0 0 em(7) em(0) $shadow_color;
47
+ margin-left: 0;
48
+ text-align: left;
49
+ span {
50
+ margin: 0;
51
+ }
52
+ }
53
+ section {
54
+ position: relative;
55
+ top: em(-10);
56
+ }
57
+ p {
58
+ color: $white;
59
+ left: 0;
60
+ margin: em(10) 0 em(10) em(10);
61
+ line-height: 1.5em;
62
+ text-shadow: 2px 2px 4px black;
63
+ }
64
+ }
65
+ }
66
+
67
+
68
+ /////// OOCSS color blocks ////////
69
+ // ----------------------------------------------
70
+ @mixin extend_color_loop {
71
+ @each $name in $color_names {
72
+ $i: index($color_names, $name);
73
+ .#{$name} {
74
+ @extend %#{nth($color_names, $i)} !optional;
75
+ }
76
+ }
77
+ }
78
+
79
+
80
+ // To add new colors to the extended color loops below, simply add to the appropiate list
81
+
82
+ // Standard grayscale objects - in color view
83
+ // ----------------------------------------------
84
+ $color_names: alpha_gray
85
+ bravo_gray
86
+ charlie_gray
87
+ delta_gray
88
+ echo_gray
89
+ fox_gray
90
+ golf_gray
91
+ hotel_gray
92
+ india_gray;
93
+ @include extend_color_loop;
94
+
95
+
96
+ // Standard color objects - in color view
97
+ // ----------------------------------------------
98
+ $color_names:
99
+ alpha_color
100
+ alpha_color_bravo
101
+ alpha_color_charlie
102
+ alpha_color_delta
103
+ alpha_color_echo
104
+ alpha_color_fox
105
+ alpha_color_golf
106
+ alpha_color_hotel
107
+ alpha_color_india
108
+ alpha_color_juliet;
109
+ @include extend_color_loop;
110
+
111
+ $color_names:
112
+ bravo_color
113
+ bravo_color_bravo
114
+ bravo_color_charlie
115
+ bravo_color_delta
116
+ bravo_color_echo
117
+ bravo_color_fox
118
+ bravo_color_golf
119
+ bravo_color_hotel
120
+ bravo_color_india
121
+ bravo_color_juliet;
122
+ @include extend_color_loop;
123
+
124
+ $color_names:
125
+ charlie_color
126
+ charlie_color_bravo
127
+ charlie_color_charlie
128
+ charlie_color_delta
129
+ charlie_color_echo
130
+ charlie_color_fox
131
+ charlie_color_golf
132
+ charlie_color_hotel
133
+ charlie_color_india
134
+ charlie_color_juliet;
135
+ @include extend_color_loop;
136
+
137
+ $color_names:
138
+ delta_color
139
+ delta_color_bravo
140
+ delta_color_charlie
141
+ delta_color_delta
142
+ delta_color_echo
143
+ delta_color_fox
144
+ delta_color_golf
145
+ delta_color_hotel
146
+ delta_color_india
147
+ delta_color_juliet;
148
+ @include extend_color_loop;
149
+
150
+ $color_names:
151
+ echo_color
152
+ echo_color_bravo
153
+ echo_color_charlie
154
+ echo_color_delta
155
+ echo_color_echo
156
+ echo_color_fox
157
+ echo_color_golf
158
+ echo_color_hotel
159
+ echo_color_india
160
+ echo_color_juliet;
161
+ @include extend_color_loop;
162
+
163
+
164
+ /////// semantic color blocks ////////
165
+ // ----------------------------------------------
166
+ // Typography, borders, rules and shadows
167
+ $color_names:
168
+ 'white'
169
+ primary_header_color
170
+ primary_text
171
+ secondary_text href_color
172
+ shadow_color border_color
173
+ standard_hr_color
174
+ standard_border_color;
175
+ @include extend_color_loop;
176
+
177
+
178
+ /////// Config defaults for forms ///////
179
+ // ----------------------------------------------
180
+ $color_names:
181
+ alert_background_color
182
+ primary_button_border_color
183
+ secondary_button_border_color
184
+ button_text
185
+ input_disabled
186
+ input_disabled_bkg
187
+ input_disabled_border
188
+ input_disabled_text
189
+ form_field_background_color
190
+ form_field_focus_color
191
+ form_field_fail_bkg
192
+ form_field_border
193
+ form_field_border_fail
194
+ form_field_focus_border_color
195
+ form_field_text_fail
196
+ form_label_color
197
+ optional_field_text_color
198
+ instructional_text
199
+ placeholder_text
200
+ inline_alert_bkg_color
201
+ inline_alert_text_color;
202
+ @include extend_color_loop;
203
+
204
+ /////// Config defaults for buttons ///////
205
+ // ----------------------------------------------
206
+ $color_names:
207
+ button_color
208
+ primary_button_border_color
209
+ secondary_button_border_color
210
+ button_text;
211
+ @include extend_color_loop;
212
+
213
+ // HTML5 colors
214
+ $color_names:
215
+ webkit_tap_hightlight
216
+ ins_color
217
+ selection_color
218
+ selection_text_color
219
+ mark_color;
220
+ @include extend_color_loop;