zurb-foundation 2.2.1.2 → 3.0.3

Sign up to get free protection for your applications and to get access to all the features.
Files changed (86) hide show
  1. data/.gitignore +17 -2
  2. data/Capfile +5 -0
  3. data/Gemfile +1 -1
  4. data/LICENSE +22 -0
  5. data/README.md +87 -0
  6. data/Rakefile +1 -0
  7. data/config/deploy.rb +42 -0
  8. data/foundation.gemspec +17 -21
  9. data/index.html +138 -0
  10. data/lib/foundation/engine.rb +2 -2
  11. data/lib/foundation/sass_script_functions.rb +29 -0
  12. data/lib/foundation/version.rb +1 -2
  13. data/lib/zurb-foundation.rb +6 -3
  14. data/stylesheets/_foundation.scss +14 -0
  15. data/stylesheets/foundation/_base.scss +6 -0
  16. data/stylesheets/foundation/_mixins.scss +46 -0
  17. data/stylesheets/foundation/_modular-scale.sass +332 -0
  18. data/stylesheets/foundation/_semantic-grid.scss +67 -0
  19. data/stylesheets/foundation/_settings.scss +71 -0
  20. data/stylesheets/foundation/app.scss +26 -0
  21. data/stylesheets/foundation/buttons.scss +175 -0
  22. data/stylesheets/foundation/forms.scss +130 -0
  23. data/stylesheets/foundation/globals.scss +34 -0
  24. data/stylesheets/foundation/grid.scss +132 -0
  25. data/stylesheets/foundation/ie.scss +16 -0
  26. data/stylesheets/foundation/mobile.scss +32 -0
  27. data/stylesheets/foundation/navbar.scss +107 -0
  28. data/stylesheets/foundation/offcanvas.scss +57 -0
  29. data/{vendor/assets/stylesheets/foundation/orbit.css.scss → stylesheets/foundation/orbit.scss} +68 -68
  30. data/stylesheets/foundation/reveal.scss +54 -0
  31. data/stylesheets/foundation/tabs.scss +89 -0
  32. data/stylesheets/foundation/typography.scss +83 -0
  33. data/stylesheets/foundation/ui.scss +352 -0
  34. data/templates/project/.gitignore +44 -0
  35. data/templates/project/MIT-LICENSE.txt +20 -0
  36. data/templates/project/humans.txt +8 -0
  37. data/templates/project/index.html +133 -0
  38. data/templates/project/manifest.rb +51 -0
  39. data/templates/project/robots.txt +4 -0
  40. data/templates/project/sass/_settings.scss +48 -0
  41. data/templates/project/sass/app.scss +20 -0
  42. data/templates/project/sass/ie.scss +4 -0
  43. data/templates/project/stylesheets/app.css +0 -0
  44. data/templates/project/stylesheets/ie.css +0 -0
  45. data/test.html +758 -0
  46. data/type.html +153 -0
  47. data/vendor/assets/images/foundation/orbit/left-arrow-small.png +0 -0
  48. data/vendor/assets/images/foundation/orbit/right-arrow-small.png +0 -0
  49. data/vendor/assets/images/foundation/orbit/right-arrow.png +0 -0
  50. data/vendor/assets/javascripts/foundation/app.js +92 -71
  51. data/vendor/assets/javascripts/foundation/index.js +8 -7
  52. data/vendor/assets/javascripts/foundation/jquery.customforms.js +74 -73
  53. data/vendor/assets/javascripts/foundation/jquery.min.js +4 -0
  54. data/vendor/assets/javascripts/foundation/jquery.offcanvas.js +50 -0
  55. data/vendor/assets/javascripts/foundation/jquery.orbit-1.4.0.js +103 -101
  56. data/vendor/assets/javascripts/foundation/jquery.placeholder.min.js +0 -1
  57. data/vendor/assets/javascripts/foundation/jquery.reveal.js +39 -15
  58. data/vendor/assets/javascripts/foundation/jquery.tooltips.js +96 -90
  59. data/vendor/assets/javascripts/foundation/modernizr.foundation.js +3 -4
  60. metadata +101 -46
  61. data/README.markdown +0 -163
  62. data/build.rb +0 -49
  63. data/lib/foundation/generators/USAGE +0 -15
  64. data/lib/foundation/generators/install_generator.rb +0 -27
  65. data/lib/foundation/generators/layout_generator.rb +0 -28
  66. data/lib/foundation/generators/templates/application.css +0 -5
  67. data/lib/foundation/generators/templates/application.html.erb +0 -31
  68. data/lib/foundation/generators/templates/application.html.haml +0 -30
  69. data/lib/foundation/generators/templates/application.html.slim +0 -30
  70. data/lib/foundation/generators/templates/application.js +0 -4
  71. data/vendor/assets/images/foundation/misc/button-gloss.png +0 -0
  72. data/vendor/assets/images/foundation/misc/button-overlay.png +0 -0
  73. data/vendor/assets/images/foundation/misc/custom-form-sprites.png +0 -0
  74. data/vendor/assets/images/foundation/misc/input-bg-outset.png +0 -0
  75. data/vendor/assets/images/foundation/misc/input-bg.png +0 -0
  76. data/vendor/assets/images/foundation/misc/modal-gloss.png +0 -0
  77. data/vendor/assets/images/foundation/misc/table-sorter.png +0 -0
  78. data/vendor/assets/stylesheets/foundation/forms.css.scss +0 -134
  79. data/vendor/assets/stylesheets/foundation/globals.css.scss +0 -139
  80. data/vendor/assets/stylesheets/foundation/grid.css.scss +0 -129
  81. data/vendor/assets/stylesheets/foundation/ie.css.scss +0 -13
  82. data/vendor/assets/stylesheets/foundation/index.css +0 -10
  83. data/vendor/assets/stylesheets/foundation/mobile.css.scss +0 -222
  84. data/vendor/assets/stylesheets/foundation/reveal.css.scss +0 -100
  85. data/vendor/assets/stylesheets/foundation/typography.css.scss +0 -63
  86. data/vendor/assets/stylesheets/foundation/ui.css.scss +0 -418
data/README.markdown DELETED
@@ -1,163 +0,0 @@
1
- # WELCOME TO FOUNDATION
2
-
3
- Foundation is a rock-solid, responsive framework for rapidly prototyping and iterating into production code. It includes a 12-column, future-friendly grid and tons of great tools and elements that'll get you up and running in no time.
4
-
5
- Homepage: http://foundation.zurb.com
6
- Documentation: http://foundation.zurb.com/docs
7
-
8
- Foundation is MIT-licensed and absolutely free to use. Foundation wouldn't be possible without the support of the entire ZURB team, our friends and colleagues who gave feedback, and some luminaries who did some heavy lifting that we took advantage of (thanks guys).
9
-
10
- # Installation
11
-
12
-
13
- Inside your Gemfile add the following line:
14
-
15
- ```ruby
16
- gem "zurb-foundation", :group => :assets
17
- ```
18
-
19
- Then run `bundle install` to install the gem.
20
-
21
- ## What now?
22
-
23
- If you want to include Foundation on all of your application pages (and why wouldn't you!) then run the following to append `foundation` to your application sprockets files:
24
-
25
- ```bash
26
- rails g foundation:install
27
- ```
28
-
29
- You can also manually include `foundation` on specific pages using:
30
-
31
- ```ruby
32
- stylesheet_link_tag "foundation"
33
- javascript_include_tag "foundation"
34
- ```
35
-
36
- Or add `require "foundation"` to your sprockets files like so:
37
-
38
- **in application.css**
39
-
40
- ```css
41
- /*= require "foundation" */
42
- ```
43
-
44
- **in application.js**
45
-
46
- ```javascript
47
- //= require "foundation"
48
- ```
49
-
50
- ### Advanced
51
-
52
- If you wish to be more selective about which Foundation files you'd like to use in your project that's possible too! So instead of using `require "foundation"` you can selectively add stylesheets and javascripts to your project like so:
53
-
54
- **in application.css**
55
-
56
- ```css
57
- /*
58
- *= require "foundation/globals"
59
- *= require "foundation/typography"
60
- */
61
- ```
62
-
63
- **in application.js**
64
-
65
- ```javascript
66
- //= require "foundation/forms.jquery"
67
- //= require "foundation/jquery.customforms"
68
- //= require "foundation/app"
69
- ```
70
- This gem contains the same files as the corresponding Foundation release, which currently is:
71
-
72
- **Stylesheets**
73
-
74
- * globals
75
- * typography
76
- * grid
77
- * ui
78
- * forms
79
- * orbit
80
- * reveal
81
- * mobile
82
-
83
- **JavaScripts**
84
-
85
- * jquery.reveal
86
- * jquery.orbit-1.3.0
87
- * forms.jquery
88
- * jquery.customforms
89
- * jquery.placeholder.min
90
- * app
91
-
92
- ### Set the viewport
93
-
94
- Finally you'll also want to add the following line to the `<head>` section in your layout file (i.e. `app/views/layouts/application.html.erb`) so the design will scale for mobile devices:
95
-
96
- ```html
97
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
98
- ```
99
-
100
- You can also use the included generator to accomplish the same thing:
101
-
102
- ```bash
103
- rails g foundation:layout
104
- ```
105
-
106
- # Using foundation in production
107
-
108
- Before pushing your application to production, you'll need to determine how you want your assets served. You can either compile them on-the-fly or precompile them (recommended). Before continuing you'll want to check your Rails application Gemfile and ensure that `gem "zurb-foundation"` is included in the `assets` group.
109
-
110
- ## To compile on-the-fly
111
-
112
- In your Rails application edit `config/application.rb` and change:
113
-
114
- ```ruby
115
- Bundler.require(*Rails.groups(:assets => %w(development test)))
116
- ```
117
-
118
- to:
119
-
120
- ```ruby
121
- Bundler.require(:default, :assets, Rails.env)
122
- ```
123
-
124
- Then in `config/environments/production.rb` make sure the following setting exists:
125
-
126
- ```ruby
127
- config.assets.compile = true
128
- ```
129
-
130
- Now all your assets will be compiled the first time someone visits your site, which can cause some delay. Kind of like the first time Passenger spins up your application after it has been idle for some time.
131
-
132
- ## To precompile assets using Capistrano
133
-
134
- In your Rails application edit `Capfile` and add the following line after `load 'deploy'`:
135
-
136
- ```ruby
137
- load 'deploy/assets'
138
- ```
139
-
140
- Now when you run `cap deploy` the `deploy:assets:precompile` task will be run which takes care of running `bundle exec rake assets:precompile` for you.
141
-
142
- By default assets that are precompiled will be located in the `public/assets/` folder of your application.
143
-
144
- ## Why use this gem?
145
-
146
-
147
- * Easy to setup: Start using Foundation in mere seconds, like a boss
148
- * Paths: All images will work regardless of if you deploy to a sub-uri or not
149
- * Clean: Don't clutter up your assets directory
150
-
151
- # Dependencies
152
-
153
- * rails (~> 3.1)
154
- * jquery-rails (~> 1.0)
155
-
156
- # MIT Open Source License
157
-
158
-
159
- Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
160
-
161
- The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
162
-
163
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
data/build.rb DELETED
@@ -1,49 +0,0 @@
1
- require "fileutils"
2
- require "pathname"
3
-
4
- # Specify path to checked out Foundation repo
5
- FOUNDATION_REPO_PATH = Pathname.new("/Users/mark/Projects/foundation")
6
-
7
- # Specify which files need to be concatenated and in what order
8
- FOUNDATION_CSS = %w(globals.css typography.css grid.css ui.css forms.css orbit.css reveal.css mobile.css ie.css)
9
- FOUNDATION_JS = %w(modernizr.foundation.js jquery.reveal.js jquery.orbit-1.4.0.js jquery.customforms.js jquery.placeholder.min.js jquery.tooltips.js app.js)
10
-
11
- # Clean out vendor/assets
12
- ASSET_PATH = Pathname.new(File.dirname(__FILE__)).join("vendor", "assets")
13
- FileUtils.remove_dir ASSET_PATH, :force => true
14
-
15
- # Recreate vendor/assets
16
- FileUtils.mkdir_p ASSET_PATH.join("stylesheets", "foundation")
17
- FileUtils.mkdir_p ASSET_PATH.join("javascripts", "foundation")
18
- FileUtils.mkdir_p ASSET_PATH.join("images", "foundation")
19
-
20
- # Create SCSS file, so we can usage image-url() helper
21
- File.open(ASSET_PATH.join("stylesheets", "foundation", "index.css"), "w") do |file|
22
- file << "/*\n"
23
- FOUNDATION_CSS.each do |filename|
24
- unless %w(ie.css).include?(filename.downcase)
25
- file << "*= require 'foundation/#{filename.gsub('.css','')}'\n"
26
- end
27
- css_file = File.open(FOUNDATION_REPO_PATH.join("stylesheets", filename))
28
- File.open(ASSET_PATH.join("stylesheets", "foundation", "#{filename}.scss"), "w") do |include_file|
29
- include_file << css_file.read.gsub(/url\('?\.\.\/images\/([^\)']+)'?\)/, 'image-url("foundation/\1")')
30
- include_file << "\n\n"
31
- end
32
- end
33
- file << "*/"
34
- end
35
-
36
- # Create JS file
37
- File.open(ASSET_PATH.join("javascripts", "foundation", "index.js"), "w") do |file|
38
- FOUNDATION_JS.each do |filename|
39
- file << "//= require 'foundation/#{File.basename(filename.gsub('.js',''))}'\n"
40
- js_file = File.open(FOUNDATION_REPO_PATH.join("javascripts", filename))
41
- File.open(ASSET_PATH.join("javascripts", "foundation", filename), "w") do |include_file|
42
- include_file << js_file.read
43
- include_file << "\n\n"
44
- end
45
- end
46
- end
47
-
48
- # Copy Images
49
- FileUtils.cp_r FOUNDATION_REPO_PATH.join("images/."), ASSET_PATH.join("images", "foundation")
data/lib/foundation/generators/USAGE DELETED
@@ -1,15 +0,0 @@
1
- Description:
2
- Setup Foundation assets on your website or generate new layouts preconfigured to use Foundation
3
-
4
- Example:
5
- rails g foundation:install
6
-
7
- This will replace the default application assets:
8
- /app/assets/javascripts/application.js
9
- /app/assets/stylesheets/application.css
10
-
11
- rails generate foundation:layout
12
-
13
- This will create:
14
- /app/views/layouts/application.html.erb
15
-
data/lib/foundation/generators/install_generator.rb DELETED
@@ -1,27 +0,0 @@
1
- require 'rails/generators'
2
-
3
- module Foundation
4
- module Generators
5
- class InstallGenerator < Rails::Generators::Base
6
- source_root File.join(File.dirname(__FILE__), 'templates')
7
-
8
- def add_assets
9
- insert_into_file "app/assets/javascripts/application#{detect_js_format[0]}", "#{detect_js_format[1]} require foundation\n", :after => "jquery_ujs\n"
10
- insert_into_file "app/assets/stylesheets/application#{detect_css_format[0]}", "#{detect_css_format[1]} require foundation\n", :after => "require_self\n"
11
- end
12
-
13
- def detect_js_format
14
- return ['.js.coffee', '#='] if File.exist?('app/assets/javascripts/application.js.coffee')
15
- return ['.js', '//='] if File.exist?('app/assets/javascripts/application.js')
16
- end
17
-
18
- def detect_css_format
19
- return ['.css', ' *='] if File.exist?('app/assets/stylesheets/application.css')
20
- return ['.css.sass', ' //='] if File.exist?('app/assets/stylesheets/application.css.sass')
21
- return ['.sass', ' //='] if File.exist?('app/assets/stylesheets/application.sass')
22
- return ['.css.scss', ' //='] if File.exist?('app/assets/stylesheets/application.css.scss')
23
- return ['.scss', ' //='] if File.exist?('app/assets/stylesheets/application.scss')
24
- end
25
- end
26
- end
27
- end
data/lib/foundation/generators/layout_generator.rb DELETED
@@ -1,28 +0,0 @@
1
- require 'rails/generators'
2
-
3
- module Foundation
4
- module Generators
5
- class LayoutGenerator < Rails::Generators::Base
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
11
-
12
- def create_layout
13
- if options.haml?
14
- template 'application.html.haml', "app/views/layouts/#{file_name}.html.haml"
15
- elsif options.slim?
16
- template 'application.html.slim', "app/views/layouts/#{file_name}.html.slim"
17
- else
18
- template 'application.html.erb', "app/views/layouts/#{file_name}.html.erb"
19
- end
20
- end
21
-
22
- private
23
- def file_name
24
- layout_name.underscore.downcase
25
- end
26
- end
27
- end
28
- end
data/lib/foundation/generators/templates/application.css DELETED
@@ -1,5 +0,0 @@
1
- /*
2
- *= require_self
3
- *= require foundation
4
- *= require_tree .
5
- */
data/lib/foundation/generators/templates/application.html.erb DELETED
@@ -1,31 +0,0 @@
1
- <!DOCTYPE html>
2
- <!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
3
- <!--[if lt IE 7 ]> <html class="ie6" lang="en"> <![endif]-->
4
- <!--[if IE 7 ]> <html class="ie7" lang="en"> <![endif]-->
5
- <!--[if IE 8 ]> <html class="ie8" lang="en"> <![endif]-->
6
- <!--[if (gte IE 9)|!(IE)]><!--> <html lang="en"> <!--<![endif]-->
7
- <head>
8
- <meta charset="utf-8" />
9
-
10
- <!-- Uncomment to make IE8 render like IE7 -->
11
- <!-- <meta http-equiv="X-UA-Compatible" content="IE=7" /> -->
12
-
13
- <!-- Set the viewport width to device width for mobile -->
14
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
15
-
16
- <title><%%= content_for?(:title) ? yield(:title) : "Untitled" %></title>
17
-
18
- <!-- Included CSS Files -->
19
- <%%= stylesheet_link_tag "application" %>
20
-
21
- <!-- Included JS Files -->
22
- <%%= javascript_include_tag "application" %>
23
-
24
- <%%= csrf_meta_tags %>
25
- </head>
26
- <body>
27
- <div class="container">
28
- <%%= yield %>
29
- </div>
30
- </body>
31
- </html>
data/lib/foundation/generators/templates/application.html.haml DELETED
@@ -1,30 +0,0 @@
1
- !!! 5
2
- / paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/
3
- /[if lt IE 7 ] <html class=\"ie6\" lang=\"en\">
4
- /[if IE 7 ] <html class=\"ie7\" lang=\"en\">
5
- /[if IE 8 ] <html class=\"ie8\" lang=\"en\">
6
- /[if IE 9 ] <html class=\"ie9\" lang=\"en\">
7
- /[if (gt IE 9)|!(IE)] <!--> <html lang=\"en\">
8
-
9
- %head
10
- %meta{ :charset => "utf-8" }
11
-
12
- -# Uncomment to make IE8 render like IE7
13
- -# meta http-equiv="X-UA-Compatible" content="IE=7"
14
-
15
- -# Set the viewport width to device width for mobile
16
- %meta{ :name => "viewport", :content => "width=device-width, initial-scale=1.0" }
17
-
18
- %title= content_for?(:title) ? yield(:title) : "Untitled"
19
-
20
- -# Included CSS Files
21
- = stylesheet_link_tag "application"
22
-
23
- -# Included JS Files
24
- = javascript_include_tag "application"
25
-
26
- = csrf_meta_tag
27
-
28
- %body
29
- .container
30
- = yield
data/lib/foundation/generators/templates/application.html.slim DELETED
@@ -1,30 +0,0 @@
1
- doctype html
2
- == "<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->"
3
- == "<!--[if lt IE 7 ]> <html class=\"ie6\" lang=\"en\"> <![endif]-->"
4
- == "<!--[if IE 7 ]> <html class=\"ie7\" lang=\"en\"> <![endif]-->"
5
- == "<!--[if IE 8 ]> <html class=\"ie8\" lang=\"en\"> <![endif]-->"
6
- == "<!--[if IE 9 ]> <html class=\"ie9\" lang=\"en\"> <![endif]-->"
7
- == "<!--[if (gt IE 9)|!(IE)]><!--> <html lang=\"en\"> <!--<![endif]-->"
8
-
9
- head
10
- meta charset="utf-8"
11
-
12
- / Uncomment to make IE8 render like IE7
13
- / meta http-equiv="X-UA-Compatible" content="IE=7"
14
-
15
- / Set the viewport width to device width for mobile
16
- meta name="viewport" content="width=device-width, initial-scale=1.0"
17
-
18
- title= content_for?(:title) ? yield(:title) : "Untitled"
19
-
20
- / Included CSS Files
21
- = stylesheet_link_tag "application"
22
-
23
- / Included JS Files
24
- = javascript_include_tag "application"
25
-
26
- = csrf_meta_tag
27
-
28
- body
29
- .container
30
- == yield
data/lib/foundation/generators/templates/application.js DELETED
@@ -1,4 +0,0 @@
1
- //= require jquery
2
- //= require jquery_ujs
3
- //= require foundation
4
- //= require_tree .
data/vendor/assets/stylesheets/foundation/forms.css.scss DELETED
@@ -1,134 +0,0 @@
1
- /* Artfully masterminded by ZURB
2
- Make sure to include app.js / foundation.js if you are going to use inline label inputs
3
- */
4
-
5
-
6
- /* -----------------------------------------
7
- Standard Forms
8
- ----------------------------------------- */
9
-
10
- form { margin: 0 0 18px; }
11
- form label { display: block; font-size: 13px; line-height: 18px; cursor: pointer; margin-bottom: 9px; }
12
-
13
- input.input-text, textarea { border-right: 1px solid #bbb; border-bottom: 1px solid #bbb; }
14
- input.input-text, textarea, select { display: block; margin-bottom: 9px; }
15
- label + input.input-text, label + textarea, label + select, label + div.dropdown, select + div.dropdown { margin-top: -9px; }
16
- textarea { max-width: 100%; }
17
-
18
- /* Text input and textarea font and padding */
19
- input.input-text, textarea { font-size: 13px; padding: 4px 3px 2px; background: #fff; }
20
- input.input-text:focus, textarea:focus { outline: none !important; }
21
- input.input-text.oversize, textarea.oversize { font-size: 18px !important; padding: 4px 5px !important; }
22
- input.input-text:focus, textarea:focus { background: #f9f9f9; }
23
-
24
- /* Text input and textarea, disabled */
25
- input.input-text[disabled], textarea[disabled] { background-color: #ddd; }
26
-
27
- /* Inlined Label Style */
28
- input.placeholder, textarea.placeholder { color: #888; }
29
-
30
- /* Text input and textarea sizes */
31
- input.input-text, textarea { width: 254px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; }
32
- input.small, textarea.small { width: 134px; }
33
- input.medium, textarea.medium { width: 254px; }
34
- input.large, textarea.large { width: 434px; }
35
- input.expand, textarea.expand { width: 100%; }
36
-
37
- /* Lock textareas so they can't be resized beyond their set width in webkit */
38
- textarea.locked { max-width: 254px; }
39
- textarea.locked.small { max-width: 134px; }
40
- textarea.locked.large { max-width: 434px; }
41
- textarea.locked.expand { max-width: 100%; }
42
-
43
- /* Fieldsets */
44
- form fieldset { padding: 9px 9px 2px 9px; border: solid 1px #ddd; margin: 18px 0; }
45
-
46
- /* Inlined Radio & Checkbox */
47
- .form-field input[type=radio], div.form-field input[type=checkbox] { display: inline; width:auto; margin-bottom:0; }
48
-
49
- /* Errors */
50
- .form-field.error input, input.input-text.red { border-color: #C00000; background-color: rgba(255,0,0,0.15); }
51
- .form-field.error label, label.red { color: #C00000; }
52
- .form-field.error small, small.error { margin-top: -6px; display: block; margin-bottom: 9px; font-size: 11px; color: #C00000; width: 254px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; }
53
-
54
- .small + small.error { width: 134px; }
55
- .medium + small.error { width: 254px; }
56
- .large + small.error { width: 434px; }
57
- .expand + small.error { width: 100%; }
58
-
59
- .small.oversize + small.error { width: 144px; }
60
- .medium.oversize + small.error { width: 264px; }
61
- .large.oversize + small.error { width: 444px; }
62
- .expand.oversize + small.error { width: 100%; }
63
-
64
- /* -----------------------------------------
65
- Nicer Forms
66
- ----------------------------------------- */
67
- form.nice div.form-field input, form.nice input.input-text, form.nice textarea { border: solid 1px #bbb; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; }
68
- form.nice div.form-field input, form.nice input.input-text, form.nice textarea { font-size: 13px; padding: 6px 3px 4px; outline: none !important; background: image-url("foundation/misc/input-bg.png") #fff; }
69
- form.nice div.form-field input:focus, form.nice input.input-text:focus, form.nice textarea:focus { background-color: #f9f9f9; }
70
-
71
- /* Text input and textarea, disabled */
72
- form.nice div.form-field input[disabled], form.nice input.input-text[disabled], form.nice textarea[disabled] { background-color: #ddd; }
73
-
74
- form.nice fieldset { border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; }
75
-
76
- form.nice div.form-field input[type=radio], form.nice div.form-field input[type=checkbox] { display: inline; width:auto; margin-bottom:0; }
77
-
78
- form.nice div.form-field.error small, form.nice small.error { padding: 6px 4px; border: solid 0 #C00000; border-width: 0 1px 1px 1px; margin-top: -10px; background: #C00000; color: #fff; font-size: 12px; font-weight: bold; border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; -webkit-border-bottom-left-radius: 2px; -webkit-border-bottom-right-radius: 2px; -moz-border-radius-bottomleft: 2px; -moz-border-radius-bottomright: 2px; }
79
-
80
- form.nice div.form-field.error .small + small, form.nice .small + small.error { width: 132px; }
81
- form.nice div.form-field.error .medium + small, form.nice .medium + small.error { width: 252px; }
82
- form.nice div.form-field.error .large + small, form.nice .large + small.error { width: 432px; }
83
-
84
- form.nice div.form-field.error .small.oversize + small, form.nice .small.oversize + small.error { width: 136px; }
85
- form.nice div.form-field.error .medium.oversize + small, form.nice .medium.oversize + small.error { width: 256px; }
86
- form.nice div.form-field.error .large.oversize + small, form.nice .large.oversize + small.error { width: 436px; }
87
-
88
- /* -----------------------------------------
89
- Custom Forms
90
- ----------------------------------------- */
91
-
92
- form.custom span.custom { display: inline-block; width: 14px; height: 14px; position: relative; top: 2px; border: solid 1px #ccc; background: image-url("foundation/misc/custom-form-sprites.png") 0 0 no-repeat; }
93
- form.custom span.custom.radio { border-radius: 7px; -webkit-border-radius: 7px; -moz-border-radius: 7px; }
94
- form.custom span.custom.radio.checked { background-position: 0 -14px; }
95
- form.custom span.custom.checkbox.checked { background-position: 0 -28px; }
96
-
97
- form.custom div.custom.dropdown { display: block; position: relative; width: auto; height: 28px; margin-bottom: 9px; margin-top: 2px; }
98
- form.custom div.custom.dropdown a.current { display: block; width: auto; line-height: 26px; min-height: 26px; padding: 0 38px 0 6px; border: solid 1px #ddd; color: #141414; background-color: #fff; word-wrap: nowrap; }
99
- form.custom div.custom.dropdown a.selector { position: absolute; width: 26px; height: 26px; display: block; background: image-url("foundation/misc/custom-form-sprites.png") -14px 1px no-repeat; right: 0; top: 0; border: solid 1px #ddd; }
100
- form.custom div.custom.dropdown:hover a.selector,
101
- form.custom div.custom.dropdown.open a.selector { background-position: -14px -26px; }
102
-
103
- form.custom div.custom.dropdown ul { position: absolute; width: auto; display: none; margin: 0; left: 0; top: 27px; margin: 0; padding: 0; background: #fff; background: rgba(255,255,255,0.95); border: solid 1px #ddd; }
104
- form.custom div.custom.dropdown ul li { cursor: pointer; padding: 3px 38px 3px 6px; min-height: 18px; margin: 0; white-space: nowrap}
105
- form.custom div.custom.dropdown ul li.selected { background: image-url("foundation/misc/custom-form-sprites.png") right -52px no-repeat; }
106
- form.custom div.custom.dropdown ul li:hover { background-color: #2a85e8; color: #fff; }
107
- form.custom div.custom.dropdown ul li.selected:hover { background: image-url("foundation/misc/custom-form-sprites.png") #2a85e8 right -78px no-repeat; }
108
- form.custom div.custom.dropdown ul.show { display: block; }
109
-
110
- form.custom div.custom.dropdown.open ul { display: block; z-index: 10; }
111
-
112
- form.custom div.custom.dropdown.small { width: 134px !important; }
113
- form.custom div.custom.dropdown.medium { width: 254px !important; }
114
- form.custom div.custom.dropdown.large { width: 434px !important; }
115
- form.custom div.custom.dropdown.expand { width: 100% !important; }
116
-
117
- form.custom div.custom.dropdown.open.small ul { width: 132px !important; }
118
- form.custom div.custom.dropdown.open.medium ul { width: 252px !important; }
119
- form.custom div.custom.dropdown.open.large ul { width: 432px !important; }
120
- form.custom div.custom.dropdown.open.expand ul { width: 100% !important; box-sizing: border-box; }
121
-
122
- /* Custom input, disabled */
123
- form.custom .custom.disabled { background-color: #ddd; }
124
-
125
- /* -----------------------------------------
126
- Nicer Custom Forms
127
- ----------------------------------------- */
128
- form.custom.nice span.custom.checkbox { border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; }
129
-
130
- form.custom.nice div.custom.dropdown a.current { border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; background-image: image-url("foundation/misc/input-bg-outset.png"); background-position: bottom right; }
131
- form.custom.nice div.custom.dropdown a.selector { height: 27px; border-width: 0 0 0 1px; }
132
- form.custom.nice div.custom.dropdown ul { border-bottom-left-radius: 2px; border-bottom-right-radius: 2px; -webkit-border-bottom-left-radius: 2px; -webkit-border-bottom-right-radius: 2px; -moz-border-radius-bottomleft: 2px; -moz-border-radius-bottomright: 2px; }
133
-
134
-