zurb-foundation 3.2.5 → 4.0.0.rc1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (239) hide show
  1. data/.gitignore +6 -2
  2. data/CHANGELOG.md +1 -26
  3. data/CONTRIBUTING.md +18 -0
  4. data/Gemfile.lock +19 -0
  5. data/Gruntfile.js +27 -0
  6. data/README.md +5 -6
  7. data/{Capfile → docs/Capfile} +0 -1
  8. data/docs/Gemfile +8 -0
  9. data/docs/Gemfile.lock +43 -0
  10. data/docs/Procfile +2 -0
  11. data/docs/README.md +1 -0
  12. data/docs/_sidebar-components.html.erb +109 -0
  13. data/docs/_sidebar.html.erb +109 -0
  14. data/docs/_zurb-jobs.html.erb +5 -0
  15. data/docs/changelog.html.erb +185 -0
  16. data/docs/compile.rb +43 -0
  17. data/docs/components/alert-boxes.html.erb +202 -0
  18. data/docs/components/block-grid.html.erb +118 -0
  19. data/docs/components/breadcrumbs.html.erb +146 -0
  20. data/docs/components/button-groups.html.erb +174 -0
  21. data/docs/components/buttons.html.erb +220 -0
  22. data/docs/components/clearing.html.erb +152 -0
  23. data/docs/components/custom-forms.html.erb +306 -0
  24. data/docs/components/dropdown-buttons.html.erb +233 -0
  25. data/docs/components/dropdown.html.erb +186 -0
  26. data/docs/components/flex-video.html.erb +93 -0
  27. data/docs/components/forms.html.erb +468 -0
  28. data/docs/components/grid.html.erb +355 -0
  29. data/docs/components/inline-lists.html.erb +89 -0
  30. data/docs/components/joyride.html.erb +178 -0
  31. data/docs/components/keystrokes.html.erb +74 -0
  32. data/docs/components/labels.html.erb +98 -0
  33. data/docs/components/magellan.html.erb +84 -0
  34. data/docs/components/orbit.html.erb +262 -0
  35. data/docs/components/pagination.html.erb +181 -0
  36. data/docs/components/panels.html.erb +121 -0
  37. data/docs/components/pricing-tables.html.erb +154 -0
  38. data/docs/components/progress-bars.html.erb +120 -0
  39. data/docs/components/reveal.html.erb +147 -0
  40. data/docs/components/section.html.erb +156 -0
  41. data/docs/components/side-nav.html.erb +122 -0
  42. data/docs/components/split-buttons.html.erb +218 -0
  43. data/docs/components/sub-nav.html.erb +120 -0
  44. data/docs/components/switch.html.erb +288 -0
  45. data/docs/components/tables.html.erb +123 -0
  46. data/docs/components/thumbnails.html.erb +87 -0
  47. data/docs/components/tooltips.html.erb +73 -0
  48. data/docs/components/top-bar.html.erb +219 -0
  49. data/docs/components/type.html.erb +359 -0
  50. data/docs/components/visibility.html.erb +102 -0
  51. data/docs/config.ru +12 -0
  52. data/docs/config/deploy.rb +33 -0
  53. data/docs/controller.rb +43 -0
  54. data/docs/css/_coderay.scss +116 -0
  55. data/docs/css/_settings.scss +1 -0
  56. data/docs/css/docs.scss +174 -0
  57. data/docs/css/normalize.scss +396 -0
  58. data/docs/css/qunit-composite.css +13 -0
  59. data/docs/css/qunit.css +235 -0
  60. data/docs/faq.html.erb +61 -0
  61. data/docs/img/demos/demo1-th.png +0 -0
  62. data/docs/img/demos/demo1.png +0 -0
  63. data/docs/img/demos/demo2-th.png +0 -0
  64. data/docs/img/demos/demo2.png +0 -0
  65. data/docs/img/demos/demo3-th.png +0 -0
  66. data/docs/img/demos/demo3.png +0 -0
  67. data/docs/img/demos/demo4-th.png +0 -0
  68. data/docs/img/demos/demo4.png +0 -0
  69. data/docs/img/demos/demo5-th.png +0 -0
  70. data/docs/img/demos/demo5.png +0 -0
  71. data/docs/index.html.erb +299 -0
  72. data/docs/javascript.html.erb +133 -0
  73. data/docs/js/docs.js +3 -0
  74. data/docs/js/qunit-composite.js +105 -0
  75. data/docs/js/qunit.js +1977 -0
  76. data/docs/js/tests/tabs/simple_tabs.html +57 -0
  77. data/docs/js/tests/tabs/simple_tabs.js +54 -0
  78. data/docs/js/tests/tooltips/tooltips.html +39 -0
  79. data/docs/js/tests/tooltips/tooltips.js +11 -0
  80. data/docs/layout.html.erb +99 -0
  81. data/docs/rails.html.erb +66 -0
  82. data/docs/sass.html.erb +299 -0
  83. data/docs/support.html.erb +134 -0
  84. data/foundation.gemspec +2 -4
  85. data/index.html +3 -23
  86. data/js/foundation/foundation.alerts.js +50 -0
  87. data/js/foundation/foundation.clearing.js +478 -0
  88. data/{vendor/assets/javascripts/foundation/jquery.cookie.js → js/foundation/foundation.cookie.js} +3 -1
  89. data/js/foundation/foundation.dropdown.js +122 -0
  90. data/js/foundation/foundation.forms.js +403 -0
  91. data/js/foundation/foundation.joyride.js +613 -0
  92. data/js/foundation/foundation.js +331 -0
  93. data/js/foundation/foundation.magellan.js +130 -0
  94. data/js/foundation/foundation.orbit.js +355 -0
  95. data/{vendor/assets/javascripts/foundation/jquery.placeholder.js → js/foundation/foundation.placeholder.js} +4 -2
  96. data/js/foundation/foundation.reveal.js +264 -0
  97. data/js/foundation/foundation.section.js +180 -0
  98. data/js/foundation/foundation.tooltips.js +195 -0
  99. data/js/foundation/foundation.topbar.js +187 -0
  100. data/js/foundation/index.js +16 -0
  101. data/{vendor/assets/javascripts/foundation/modernizr.foundation.js → js/vendor/custom.modernizr.js} +0 -0
  102. data/js/vendor/jquery.js +9597 -0
  103. data/js/vendor/zepto.js +1782 -0
  104. data/lib/foundation/engine.rb +8 -1
  105. data/lib/foundation/generators/install_generator.rb +24 -1
  106. data/lib/foundation/generators/templates/application.html.erb +20 -6
  107. data/lib/foundation/generators/templates/application.html.haml +2 -6
  108. data/lib/foundation/generators/templates/application.html.slim +2 -5
  109. data/lib/foundation/version.rb +1 -1
  110. data/lib/zurb-foundation.rb +7 -9
  111. data/package.json +9 -0
  112. data/scss/foundation.scss +42 -15
  113. data/scss/foundation/_foundation-global.scss +226 -0
  114. data/scss/foundation/components/_alert-boxes.scss +106 -0
  115. data/scss/foundation/components/_block-grid.scss +63 -0
  116. data/scss/foundation/components/_breadcrumbs.scss +117 -0
  117. data/scss/foundation/components/_button-groups.scss +59 -0
  118. data/scss/foundation/components/_buttons.scss +217 -0
  119. data/scss/foundation/components/_clearing.scss +209 -0
  120. data/scss/foundation/components/_custom-forms.scss +232 -0
  121. data/scss/foundation/components/_dropdown-buttons.scss +114 -0
  122. data/scss/foundation/components/_dropdown.scss +137 -0
  123. data/scss/foundation/components/_flex-video.scss +45 -0
  124. data/scss/foundation/components/_forms.scss +309 -0
  125. data/scss/foundation/components/_grid.scss +149 -71
  126. data/scss/foundation/components/_inline-lists.scss +47 -0
  127. data/scss/foundation/components/_joyride.scss +193 -0
  128. data/scss/foundation/components/_keystrokes.scss +56 -0
  129. data/scss/foundation/components/_labels.scss +81 -0
  130. data/scss/foundation/components/_magellan.scss +15 -0
  131. data/scss/foundation/components/_orbit.scss +193 -0
  132. data/scss/foundation/components/_pagination.scss +99 -0
  133. data/scss/foundation/components/_panels.scss +76 -0
  134. data/scss/foundation/components/_pricing-tables.scss +130 -0
  135. data/scss/foundation/components/_progress-bars.scss +68 -0
  136. data/scss/foundation/components/_reveal.scss +131 -0
  137. data/scss/foundation/components/_section.scss +194 -0
  138. data/scss/foundation/components/_side-nav.scss +68 -0
  139. data/scss/foundation/components/_split-buttons.scss +159 -0
  140. data/scss/foundation/components/_sub-nav.scss +67 -0
  141. data/scss/foundation/components/_switch.scss +242 -0
  142. data/scss/foundation/components/_tables.scss +80 -0
  143. data/scss/foundation/components/_thumbs.scss +45 -0
  144. data/scss/foundation/components/_tooltips.scss +113 -0
  145. data/scss/foundation/components/_top-bar.scss +443 -0
  146. data/scss/foundation/components/_type.scss +411 -0
  147. data/scss/foundation/components/_visibility.scss +117 -0
  148. data/scss/normalize.scss +396 -0
  149. data/templates/project/config.rb +26 -0
  150. data/templates/project/index.html +28 -43
  151. data/templates/project/manifest.rb +21 -28
  152. data/templates/project/scss/_settings.scss +4 -243
  153. data/templates/project/scss/app.scss +37 -44
  154. data/templates/project/scss/normalize.scss +396 -0
  155. data/test/stylesheets/styles.css +955 -0
  156. metadata +144 -153
  157. data/config/deploy.rb +0 -42
  158. data/lib/foundation/generators/layout_generator.rb +0 -28
  159. data/scss/foundation/_settings.scss +0 -281
  160. data/scss/foundation/common/_base.scss +0 -4
  161. data/scss/foundation/common/_forms.scss +0 -117
  162. data/scss/foundation/common/_globals.scss +0 -35
  163. data/scss/foundation/common/_ratios.scss +0 -19
  164. data/scss/foundation/common/_typography.scss +0 -104
  165. data/scss/foundation/components/modules/_all.scss +0 -10
  166. data/scss/foundation/components/modules/_buttons.scss +0 -178
  167. data/scss/foundation/components/modules/_clearing.scss +0 -61
  168. data/scss/foundation/components/modules/_joyride.scss +0 -33
  169. data/scss/foundation/components/modules/_mqueries.scss +0 -458
  170. data/scss/foundation/components/modules/_navbar.scss +0 -74
  171. data/scss/foundation/components/modules/_offcanvas.scss +0 -55
  172. data/scss/foundation/components/modules/_orbit.scss +0 -90
  173. data/scss/foundation/components/modules/_reveal.scss +0 -34
  174. data/scss/foundation/components/modules/_tabs.scss +0 -67
  175. data/scss/foundation/components/modules/_topbar.scss +0 -167
  176. data/scss/foundation/components/modules/_ui.scss +0 -292
  177. data/scss/foundation/functions/_all.scss +0 -2
  178. data/scss/foundation/functions/_convert-number-to-word.scss +0 -10
  179. data/scss/foundation/functions/_grid-calc.scss +0 -5
  180. data/scss/foundation/functions/modular-scale.scss +0 -3
  181. data/scss/foundation/mixins/_all.scss +0 -5
  182. data/scss/foundation/mixins/_clearfix.scss +0 -13
  183. data/scss/foundation/mixins/_css-triangle.scss +0 -22
  184. data/scss/foundation/mixins/_font-size.scss +0 -13
  185. data/scss/foundation/mixins/_respond-to.scss +0 -11
  186. data/scss/foundation/mixins/_semantic-grid.scss +0 -66
  187. data/test/buttons.html +0 -189
  188. data/test/clearing.html +0 -85
  189. data/test/config.rb +0 -11
  190. data/test/elements.html +0 -490
  191. data/test/forms.html +0 -371
  192. data/test/grid.html +0 -543
  193. data/test/images/orbit-demo/demo1.jpeg +0 -0
  194. data/test/images/orbit-demo/demo2.jpeg +0 -0
  195. data/test/images/orbit-demo/demo3.jpeg +0 -0
  196. data/test/images/orbit-demo/slider-background.jpeg +0 -0
  197. data/test/index.html +0 -83
  198. data/test/joyride.html +0 -127
  199. data/test/magellan.html +0 -112
  200. data/test/navigation.html +0 -269
  201. data/test/orbit.html +0 -112
  202. data/test/reveal.html +0 -91
  203. data/test/scss/_settings.scss +0 -245
  204. data/test/scss/styles.scss +0 -50
  205. data/test/tabs.html +0 -197
  206. data/test/template.html +0 -52
  207. data/test/topbar-login.html +0 -194
  208. data/test/topbar.html +0 -139
  209. data/test/type.html +0 -188
  210. data/vendor/assets/images/foundation/orbit/bullets.jpg +0 -0
  211. data/vendor/assets/images/foundation/orbit/left-arrow-small.png +0 -0
  212. data/vendor/assets/images/foundation/orbit/left-arrow.png +0 -0
  213. data/vendor/assets/images/foundation/orbit/loading.gif +0 -0
  214. data/vendor/assets/images/foundation/orbit/mask-black.png +0 -0
  215. data/vendor/assets/images/foundation/orbit/pause-black.png +0 -0
  216. data/vendor/assets/images/foundation/orbit/right-arrow-small.png +0 -0
  217. data/vendor/assets/images/foundation/orbit/right-arrow.png +0 -0
  218. data/vendor/assets/images/foundation/orbit/rotator-black.png +0 -0
  219. data/vendor/assets/images/foundation/orbit/timer-black.png +0 -0
  220. data/vendor/assets/javascripts/foundation/app.js +0 -41
  221. data/vendor/assets/javascripts/foundation/index.js +0 -19
  222. data/vendor/assets/javascripts/foundation/jquery.event.move.js +0 -580
  223. data/vendor/assets/javascripts/foundation/jquery.event.swipe.js +0 -130
  224. data/vendor/assets/javascripts/foundation/jquery.foundation.accordion.js +0 -47
  225. data/vendor/assets/javascripts/foundation/jquery.foundation.alerts.js +0 -20
  226. data/vendor/assets/javascripts/foundation/jquery.foundation.buttons.js +0 -83
  227. data/vendor/assets/javascripts/foundation/jquery.foundation.clearing.js +0 -413
  228. data/vendor/assets/javascripts/foundation/jquery.foundation.forms.js +0 -502
  229. data/vendor/assets/javascripts/foundation/jquery.foundation.joyride.js +0 -639
  230. data/vendor/assets/javascripts/foundation/jquery.foundation.magellan.js +0 -96
  231. data/vendor/assets/javascripts/foundation/jquery.foundation.mediaQueryToggle.js +0 -27
  232. data/vendor/assets/javascripts/foundation/jquery.foundation.navigation.js +0 -55
  233. data/vendor/assets/javascripts/foundation/jquery.foundation.orbit.js +0 -919
  234. data/vendor/assets/javascripts/foundation/jquery.foundation.reveal.js +0 -794
  235. data/vendor/assets/javascripts/foundation/jquery.foundation.tabs.js +0 -66
  236. data/vendor/assets/javascripts/foundation/jquery.foundation.tooltips.js +0 -211
  237. data/vendor/assets/javascripts/foundation/jquery.foundation.topbar.js +0 -174
  238. data/vendor/assets/javascripts/foundation/jquery.js +0 -9555
  239. data/vendor/assets/javascripts/foundation/jquery.offcanvas.js +0 -50
data/lib/foundation/engine.rb CHANGED
@@ -1,5 +1,12 @@
1
1
  module Foundation
2
2
  class Engine < Rails::Engine
3
- # auto wire assets
3
+ # auto wire assets
4
+ initializer 'foundation.update_asset_paths' do |app|
5
+ app.config.assets.paths << File.expand_path("../../../scss", __FILE__)
6
+ app.config.assets.paths << File.expand_path("../../../js", __FILE__)
7
+
8
+ # Ensure Zepto and Modernizr are precompiled in production
9
+ app.config.assets.precompile += %w(vendor/zepto.js vendor/custom.modernizr.js)
10
+ end
4
11
  end
5
12
  end
data/lib/foundation/generators/install_generator.rb CHANGED
@@ -4,9 +4,16 @@ module Foundation
4
4
  module Generators
5
5
  class InstallGenerator < Rails::Generators::Base
6
6
  source_root File.join(File.dirname(__FILE__), 'templates')
7
+ argument :layout_name, :type => :string, :default => 'application', :banner => 'layout_name'
8
+
9
+ class_option :haml, :desc => 'Generate HAML layout instead of ERB.', :type => :boolean
10
+ class_option :slim, :desc => 'Generate Slim layout instead of ERB.', :type => :boolean
7
11
 
8
- def add_assets
12
+ def add_assets
13
+ # rails_ujs breaks, need to incorporate rails-behavior plugin for this to work seamlessly
14
+ # gsub_file "app/assets/javascripts/application#{detect_js_format[0]}", /\/\/= require jquery\n/, ""
9
15
  insert_into_file "app/assets/javascripts/application#{detect_js_format[0]}", "#{detect_js_format[1]} require foundation\n", :after => "jquery_ujs\n"
16
+ append_to_file "app/assets/javascripts/application#{detect_js_format[0]}", "\n$(document).foundation();\n"
10
17
  settings_file = File.join(File.dirname(__FILE__),"..","..","..","templates","project","scss","_settings.scss")
11
18
  create_file "app/assets/stylesheets/foundation_and_overrides.scss", File.read(settings_file)
12
19
  append_to_file "app/assets/stylesheets/foundation_and_overrides.scss", "\n@import 'foundation';\n"
@@ -25,6 +32,22 @@ module Foundation
25
32
  return ['.css.scss', ' //='] if File.exist?('app/assets/stylesheets/application.css.scss')
26
33
  return ['.scss', ' //='] if File.exist?('app/assets/stylesheets/application.scss')
27
34
  end
35
+
36
+ def create_layout
37
+ if options.haml?
38
+ template 'application.html.haml', "app/views/layouts/#{file_name}.html.haml"
39
+ elsif options.slim?
40
+ template 'application.html.slim', "app/views/layouts/#{file_name}.html.slim"
41
+ else
42
+ template 'application.html.erb', "app/views/layouts/#{file_name}.html.erb"
43
+ end
44
+ end
45
+
46
+ private
47
+
48
+ def file_name
49
+ layout_name.underscore.downcase
50
+ end
28
51
  end
29
52
  end
30
53
  end
data/lib/foundation/generators/templates/application.html.erb CHANGED
@@ -14,16 +14,30 @@
14
14
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
15
15
 
16
16
  <title><%%= content_for?(:title) ? yield(:title) : "Untitled" %></title>
17
-
18
- <!-- Included CSS Files -->
17
+
19
18
  <%%= stylesheet_link_tag "application" %>
20
-
21
- <!-- Included JS Files -->
22
- <%%= javascript_include_tag "application" %>
23
-
19
+ <%%= javascript_include_tag "vendor/custom.modernizr" %>
24
20
  <%%= csrf_meta_tags %>
25
21
  </head>
26
22
  <body>
27
23
  <%%= yield %>
24
+ <% if false %>
25
+ <script>
26
+ document.write('<script src=' +
27
+ ('__proto__' in {} ? '<%%= asset_path("vendor/zepto") %>' : '<%%= asset_path("jquery") %>') +
28
+ '><\/script>');
29
+ </script>
30
+
31
+ <script>
32
+ // Ensure rails_ujs works with Zepto
33
+ $.fn.ajaxSend = function(callback) {
34
+ return this.each(function(){
35
+ $(this).on('ajaxBeforeSend', callback);
36
+ });
37
+ };
38
+ var jQuery = $;
39
+ </script>
40
+ <% end %>
41
+ <%%= javascript_include_tag "application" %>
28
42
  </body>
29
43
  </html>
data/lib/foundation/generators/templates/application.html.haml CHANGED
@@ -17,13 +17,9 @@
17
17
 
18
18
  %title= content_for?(:title) ? yield(:title) : "Untitled"
19
19
 
20
- -# Included CSS Files
21
20
  = stylesheet_link_tag "application"
22
-
23
- -# Included JS Files
24
- = javascript_include_tag "application"
25
-
26
21
  = csrf_meta_tag
27
22
 
28
23
  %body
29
- = yield
24
+ = yield
25
+ = javascript_include_tag "application"
data/lib/foundation/generators/templates/application.html.slim CHANGED
@@ -17,14 +17,11 @@ head
17
17
 
18
18
  title= content_for?(:title) ? yield(:title) : "Untitled"
19
19
 
20
- / Included CSS Files
21
20
  = stylesheet_link_tag "application"
22
21
 
23
- / Included JS Files
24
- = javascript_include_tag "application"
25
-
26
22
  = csrf_meta_tag
27
23
 
28
24
  body
29
25
  .container
30
- == yield
26
+ == yield
27
+ = javascript_include_tag "application"
data/lib/foundation/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module Foundation
2
- VERSION = "3.2.5"
2
+ VERSION = "4.0.0.rc1"
3
3
  end
data/lib/zurb-foundation.rb CHANGED
@@ -1,19 +1,17 @@
1
1
  root = File.join(File.dirname(__FILE__), "..")
2
2
  require "foundation/version"
3
- require "compass"
4
- require "modular-scale"
5
-
6
- Compass::Frameworks.register("foundation",
7
- :stylesheets_directory => File.join(root,"scss"),
8
- :templates_directory => File.join(root,"templates"),
9
- :images_dir => File.join(root,"vendor","assets","images","foundation")
10
- )
11
3
 
12
4
  if defined?(Rails)
13
- require "foundation/generators/layout_generator"
14
5
  require "foundation/generators/install_generator"
15
6
  end
16
7
 
17
8
  module Foundation
18
9
  require "foundation/engine" if defined?(Rails)
19
10
  end
11
+
12
+ if defined?(Compass)
13
+ Compass::Frameworks.register("foundation",
14
+ :stylesheets_directory => File.join(root,"scss"),
15
+ :templates_directory => File.join(root,"templates")
16
+ )
17
+ end
data/package.json ADDED
@@ -0,0 +1,9 @@
1
+ {
2
+ "name": "zurb-foundation",
3
+ "version": "4.0.0-wip",
4
+ "devDependencies": {
5
+ "grunt": "~0.4.0",
6
+ "grunt-contrib-watch": "~0.1.0",
7
+ "grunt-contrib-qunit": "~0.1.1"
8
+ }
9
+ }
data/scss/foundation.scss CHANGED
@@ -1,20 +1,47 @@
1
+ // Make sure the charset is set appropriately
1
2
  @charset "UTF-8";
2
- // Foundation Features
3
- // =============
4
3
 
5
- @import "compass/css3";
4
+ // This includes all of the foundation global elements that are needed to work with any of the other files.
5
+ //
6
+ // RENAME THIS TO _foundation-global.scss ONCE ALL THE OLD VARIABLES ARE OUT OF THE FILE.
7
+ @import "foundation/foundation-global";
8
+
9
+ // Foundation Components
10
+ @import
11
+ "foundation/components/grid",
12
+ "foundation/components/visibility",
13
+ "foundation/components/block-grid",
14
+ "foundation/components/type",
15
+ "foundation/components/buttons",
16
+ "foundation/components/forms",
17
+ "foundation/components/custom-forms",
18
+ "foundation/components/button-groups",
19
+ "foundation/components/dropdown-buttons",
20
+ "foundation/components/split-buttons",
21
+ "foundation/components/flex-video",
22
+ "foundation/components/section",
23
+ "foundation/components/top-bar",
24
+ "foundation/components/orbit",
25
+ "foundation/components/reveal",
26
+ "foundation/components/joyride",
27
+ "foundation/components/clearing",
28
+ "foundation/components/alert-boxes",
29
+ "foundation/components/breadcrumbs",
30
+ "foundation/components/keystrokes",
31
+ "foundation/components/labels",
32
+ "foundation/components/inline-lists",
33
+ "foundation/components/pagination",
34
+ "foundation/components/panels",
35
+ "foundation/components/pricing-tables",
36
+ "foundation/components/progress-bars",
37
+ "foundation/components/side-nav",
38
+ "foundation/components/sub-nav",
39
+ "foundation/components/switch",
40
+ "foundation/components/magellan",
41
+ "foundation/components/tables",
42
+ "foundation/components/thumbs",
43
+ "foundation/components/tooltips",
44
+ "foundation/components/dropdown";
6
45
 
7
- @import "modular-scale";
8
46
 
9
- @import "foundation/functions/all";
10
47
 
11
- @import "foundation/settings";
12
-
13
- @import "foundation/mixins/all";
14
-
15
- @import "foundation/common/base";
16
-
17
- @import "foundation/components/grid", "foundation/components/modules/all";
18
-
19
- // Media Queries Overrides
20
- @import "foundation/components/modules/mqueries";
data/scss/foundation/_foundation-global.scss ADDED
@@ -0,0 +1,226 @@
1
+ // Foundation Global Function, Variables and Mixins
2
+ //
3
+ // Variables
4
+ //
5
+
6
+ // This is the default html and body font-size for the base em value.
7
+ $em-base: 16px !default;
8
+
9
+ // We use these to control various global styles
10
+ $body-bg: #fff !default;
11
+ $body-font-color: #222 !default;
12
+ $body-font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif !default;
13
+ $body-font-weight: normal !default;
14
+ $body-font-style: normal !default;
15
+
16
+ // We use this to control font-smoothing
17
+ $font-smoothing: antialiased !default;
18
+
19
+ // We use these to control text direction settings
20
+ $text-direction: ltr !default; // Controls default global text direction, 'rtl' or 'ltr'
21
+ $default-float: left !default;
22
+ $default-opposite: right !default;
23
+ // No need to change this conditional statement, $text-direction variable controls it all.
24
+ @if $text-direction == ltr {
25
+ $default-float: left;
26
+ $default-opposite: right;
27
+ } @else {
28
+ $default-float: right;
29
+ $default-opposite: left;
30
+ }
31
+
32
+ // We use these as default colors throughout
33
+ $primary-color: #2ba6cb !default;
34
+ $secondary-color: #e9e9e9 !default;
35
+ $alert-color: #c60f13 !default;
36
+ $success-color: #5da423 !default;
37
+
38
+ // We use these to make sure border radius matches unless we want it different.
39
+ $global-radius: 3px !default;
40
+ $global-rounded: 1000px !default;
41
+
42
+ // We use these to control inset shadow shiny edges and depressions.
43
+ $shiny-edge-size: 0 1px 0 !default;
44
+ $shiny-edge-color: rgba(#fff, .5) !default;
45
+ $shiny-edge-active-color: rgba(#000, .2) !default;
46
+
47
+ // We use this to control whether or not CSS classes come through in the gem files.
48
+ $include-html-classes: true !default;
49
+ $include-print-styles: true !default;
50
+
51
+
52
+ //
53
+ // Functions
54
+ //
55
+
56
+ // Working in ems is annoying. Think in pixels by using this handy function, emCalc(#px)
57
+ @function emCalc($pxWidth) {
58
+ @return $pxWidth / $em-base * 1em;
59
+ }
60
+
61
+ // Creating rems and pixels
62
+ @function remCalc($pxWidth) {
63
+ @return $pxWidth / $em-base * 1rem;
64
+ }
65
+
66
+ // Grid Calculation for Percentages
67
+ @function gridCalc($colNumber, $totalColumns) {
68
+ @return percentage(($colNumber / $totalColumns));
69
+ }
70
+
71
+
72
+ //
73
+ // Mixins
74
+ //
75
+
76
+ // We use this to control border radius.
77
+ @mixin radius($radius:$global-radius) {
78
+ @if $radius {
79
+ -webkit-border-radius: $radius;
80
+ border-radius: $radius;
81
+ }
82
+ }
83
+
84
+ // We use this to create equal side border radius on elements.
85
+ @mixin side-radius($side, $radius) {
86
+ @if $side == left {
87
+ -webkit-border-radius: $radius 0 0 $radius;
88
+ border-radius: $radius 0 0 $radius;
89
+ }
90
+ @else if $side == right {
91
+ -webkit-border-radius: 0 $radius $radius 0;
92
+ border-radius: 0 $radius $radius 0;
93
+ }
94
+ @else if $side == top {
95
+ -webkit-border-radius: $radius $radius 0 0;
96
+ border-radius: $radius $radius 0 0;
97
+ }
98
+ @else if $side == bottom {
99
+ -webkit-border-radius: 0 0 $radius $radius;
100
+ border-radius: 0 0 $radius $radius;
101
+ }
102
+ }
103
+
104
+ // We can control whether or not we have inset shadows edges.
105
+ @mixin inset-shadow($active:true) {
106
+ -webkit-box-shadow: $shiny-edge-size $shiny-edge-color inset;
107
+ box-shadow: $shiny-edge-size $shiny-edge-color inset;
108
+
109
+ @if $active { &:active {
110
+ -webkit-box-shadow: $shiny-edge-size $shiny-edge-active-color inset;
111
+ box-shadow: $shiny-edge-size $shiny-edge-active-color inset; } }
112
+ }
113
+
114
+ // We use this to add transitions to elements
115
+ @mixin single-transition($property:all, $speed:300ms, $ease:ease-out) {
116
+ -webkit-transition: $property $speed $ease;
117
+ -moz-transition: $property $speed $ease;
118
+ transition: $property $speed $ease;
119
+ }
120
+
121
+ // We use this to add box-sizing across browser prefixes
122
+ @mixin box-sizing($type:border-box) {
123
+ -moz-box-sizing: $type;
124
+ -webkit-box-sizing: $type;
125
+ box-sizing: $type;
126
+ }
127
+
128
+ // We use this to create equalateral triangles
129
+ @mixin css-triangle($triangle-size, $triangle-color, $triangle-direction) {
130
+ content: "";
131
+ display: block;
132
+ width: 0;
133
+ height: 0;
134
+ border: solid $triangle-size;
135
+ @if ($triangle-direction == top) {
136
+ border-color: $triangle-color transparent transparent transparent;
137
+ }
138
+ @if ($triangle-direction == bottom) {
139
+ border-color: transparent transparent $triangle-color transparent;
140
+ }
141
+ @if ($triangle-direction == left) {
142
+ border-color: transparent transparent transparent $triangle-color;
143
+ }
144
+ @if ($triangle-direction == right) {
145
+ border-color: transparent $triangle-color transparent transparent;
146
+ }
147
+ }
148
+
149
+ // We use this to do clear floats
150
+ @mixin clearfix() {
151
+ *zoom:1;
152
+ &:before, &:after { content: " "; display: table; }
153
+ &:after { clear: both; }
154
+ }
155
+
156
+
157
+ // Set box-sizing globally to handle padding and border widths
158
+ *,
159
+ *:before,
160
+ *:after {
161
+ @include box-sizing(border-box);
162
+ }
163
+
164
+ html,
165
+ body { font-size: $em-base; }
166
+
167
+ // Default body styles
168
+ body {
169
+ background: $body-bg;
170
+ color: $body-font-color;
171
+ padding: 0;
172
+ font-family: $body-font-family;
173
+ font-weight: $body-font-weight;
174
+ font-style: $body-font-style;
175
+ line-height: 1;
176
+ -webkit-font-smoothing: $font-smoothing;
177
+ }
178
+
179
+ // Grid Defaults to get images and embeds to work properly
180
+ img,
181
+ object,
182
+ embed { max-width: 100%; height: auto; }
183
+
184
+ object,
185
+ embed { height: 100%; }
186
+ img { -ms-interpolation-mode: bicubic; }
187
+
188
+ #map_canvas,
189
+ .map_canvas {
190
+ img,
191
+ embed,
192
+ object { max-width: none !important;
193
+ }
194
+ }
195
+
196
+ // Miscellaneous useful HTML classes
197
+ .left { float: left; }
198
+ .right { float: right; }
199
+ .text-left { text-align: left; }
200
+ .text-right { text-align: right; }
201
+ .text-center { text-align: center; }
202
+ .text-justify { text-align: justify; }
203
+ .hide { display: none; }
204
+
205
+ // Get rid of gap under images by making them display: block; by default
206
+ img { display: block; }
207
+
208
+ //
209
+ // Global resets for forms
210
+ //
211
+
212
+ // Make sure textarea takes on height automatically
213
+ textarea { height: auto; min-height: 50px; }
214
+
215
+ // Make select elements 100% width by default
216
+ select { width: 100%; }
217
+
218
+
219
+ // Media Queries
220
+ $small-screen: emCalc(768px) !default;
221
+ $medium-screen: emCalc(1280px) !default;
222
+ $large-screen: emCalc(1440px) !default;
223
+
224
+ $small: "only screen and (min-width:"#{$small-screen}")" !default;
225
+ $medium: "only screen and (min-width:"#{$medium-screen}")" !default;
226
+ $large: "only screen and (min-width:"#{$large-screen}")" !default;