skeletor_backbone 0.0.5 → 0.0.6

Sign up to get free protection for your applications and to get access to all the features.
Files changed (43) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +3 -0
  3. data/app/assets/images/skeletor/skeletor.png +0 -0
  4. data/app/assets/stylesheets/skeletor-preview.sass +17 -0
  5. data/app/assets/stylesheets/skeletor.sass +64 -13
  6. data/app/assets/stylesheets/skeletor/_css3.sass +16 -16
  7. data/app/assets/stylesheets/skeletor/_functions.sass +8 -8
  8. data/app/assets/stylesheets/skeletor/_mixins.sass +20 -18
  9. data/app/assets/stylesheets/skeletor/_modules.sass +6 -8
  10. data/app/assets/stylesheets/skeletor/_settings.sass +15 -8
  11. data/app/assets/stylesheets/skeletor/{base/debug.sass → core/_debug.sass} +10 -18
  12. data/app/assets/stylesheets/skeletor/{layout → core}/_grid.sass +0 -0
  13. data/app/assets/stylesheets/skeletor/core/_helpers.sass +142 -0
  14. data/app/assets/stylesheets/skeletor/{base/print.sass → core/_print.sass} +3 -1
  15. data/app/assets/stylesheets/skeletor/{base/reset.sass → core/_reset.sass} +6 -3
  16. data/app/assets/stylesheets/skeletor/{base/foundation.sass → core/base.sass} +81 -148
  17. data/app/assets/stylesheets/skeletor/core/content.sass +93 -0
  18. data/app/assets/stylesheets/skeletor/{layout/skeleton.sass → core/layout.sass} +45 -6
  19. data/app/assets/stylesheets/skeletor/globals/css3/_prefixer.sass +14 -14
  20. data/app/assets/stylesheets/skeletor/globals/functions/_calculate_em.sass +8 -19
  21. data/app/assets/stylesheets/skeletor/globals/functions/_calculate_modular_scale.sass +6 -16
  22. data/app/assets/stylesheets/skeletor/globals/functions/_calculate_percent.sass +9 -20
  23. data/app/assets/stylesheets/skeletor/globals/functions/_calculate_rem.sass +9 -20
  24. data/app/assets/stylesheets/skeletor/globals/functions/_strip_units.sass +6 -16
  25. data/app/assets/stylesheets/skeletor/globals/mixins/_font_size.sass +31 -0
  26. data/app/assets/stylesheets/skeletor/globals/mixins/_media_query.sass +2 -6
  27. data/app/assets/stylesheets/skeletor/globals/mixins/_rem.sass +6 -61
  28. data/app/assets/stylesheets/skeletor/globals/mixins/_vertical_spacing.sass +29 -0
  29. data/app/assets/stylesheets/skeletor/modules/_forms.sass +27 -0
  30. data/app/assets/stylesheets/skeletor/modules/_rules.sass +54 -0
  31. data/app/assets/stylesheets/skeletor/modules/_tables.sass +43 -0
  32. data/app/controllers/skeletor_backbone/skeletor_controller.rb +10 -0
  33. data/app/views/skeletor_backbone/skeletor/index.html.erb +445 -0
  34. data/config/routes.rb +5 -0
  35. data/lib/generators/skeletor/install_generator.rb +2 -1
  36. data/lib/skeletor_backbone.rb +2 -2
  37. data/lib/skeletor_backbone/version.rb +1 -1
  38. data/skeletor_backbone.gemspec +2 -2
  39. data/vendor/assets/stylesheets/normalize.css +177 -160
  40. data/vendor/assets/stylesheets/pesticide.sass +206 -0
  41. metadata +36 -25
  42. data/app/assets/stylesheets/skeletor/_all.sass +0 -5
  43. data/app/assets/stylesheets/skeletor/base/helpers.sass +0 -203
@@ -0,0 +1,5 @@
1
+ Rails.application.routes.draw do
2
+ if Rails.env.development?
3
+ get 'skeletor-preview', to: 'skeletor_backbone/skeletor#index'
4
+ end
5
+ end
@@ -12,7 +12,8 @@ module Skeletor
12
12
  # create_file "app/assets/stylesheets/skeletor_and_settings.sass", File.read(settings_file)
13
13
  `sass-convert --from sass --to scss "#{SkeletorBackbone::css_path}/_settings.sass" "app/assets/stylesheets/skeletor_backbone.scss"`
14
14
  append_to_file "app/assets/stylesheets/skeletor_backbone.scss", "\n@import \"skeletor\";\n"
15
- insert_into_file "app/assets/stylesheets/application#{detect_css_format[0]}", "\n#{detect_css_format[1]} require normalize \n#{detect_css_format[1]} require skeletor_backbone", :after => "require_self"
15
+ #insert_into_file "app/assets/stylesheets/application#{detect_css_format[0]}", "\n#{detect_css_format[1]} require normalize \n#{detect_css_format[1]} require skeletor_backbone", :after => "require_self"
16
+ insert_into_file "app/assets/stylesheets/application#{detect_css_format[0]}", "\n#{detect_css_format[1]} require skeletor_backbone", :after => "require_self"
16
17
  end
17
18
 
18
19
  def detect_js_format
@@ -14,10 +14,10 @@ module SkeletorBackbone
14
14
  File.expand_path("#{root_path}/app/assets/stylesheets/skeletor", __FILE__)
15
15
  end
16
16
 
17
- class Engine < Rails::Engine
17
+ class Engine < ::Rails::Engine
18
18
  # require 'sass'
19
19
  initializer "normalize.css and modernizr.js asset precompile" do |app|
20
- app.config.assets.precompile += %w( vendor/normalize.css vendor/modernizr.js vendor/modernizr-custom.js)
20
+ app.config.assets.precompile += %w( normalize.css modernizr.js modernizr-custom.js skeletor-preview.css)
21
21
  end
22
22
  end
23
23
  end
@@ -1,3 +1,3 @@
1
1
  module SkeletorBackbone
2
- VERSION = "0.0.5"
2
+ VERSION = "0.0.6"
3
3
  end
@@ -18,9 +18,9 @@ Gem::Specification.new do |spec|
18
18
  spec.test_files = spec.files.grep(%r{^(test|spec|features)/})
19
19
  spec.require_paths = ["lib"]
20
20
 
21
- spec.add_development_dependency "bundler", "~> 1.5"
21
+ spec.add_development_dependency "bundler", "~> 1.6"
22
22
  spec.add_development_dependency "rake"
23
23
 
24
24
  spec.add_runtime_dependency "sass", ">= 3.2.0"
25
- spec.add_dependency "railties", ">= 3.1.0"
25
+ spec.add_dependency "railties", ">= 4.0.0"
26
26
  end
@@ -1,7 +1,26 @@
1
- /*! normalize.css v2.1.3 | MIT License | git.io/normalize */
1
+ /*! normalize.css v3.0.0 | MIT License | git.io/normalize */
2
2
 
3
- /* ==========================================================================
4
- HTML5 display definitions
3
+ /**
4
+ * 1. Set default font family to sans-serif.
5
+ * 2. Prevent iOS text size adjust after orientation change, without disabling
6
+ * user zoom.
7
+ */
8
+
9
+ html {
10
+ font-family: sans-serif; /* 1 */
11
+ -ms-text-size-adjust: 100%; /* 2 */
12
+ -webkit-text-size-adjust: 100%; /* 2 */
13
+ }
14
+
15
+ /**
16
+ * Remove default margin.
17
+ */
18
+
19
+ body {
20
+ margin: 0;
21
+ }
22
+
23
+ /* HTML5 display definitions
5
24
  ========================================================================== */
6
25
 
7
26
  /**
@@ -20,17 +39,20 @@ main,
20
39
  nav,
21
40
  section,
22
41
  summary {
23
- display: block;
42
+ display: block;
24
43
  }
25
44
 
26
45
  /**
27
- * Correct `inline-block` display not defined in IE 8/9.
46
+ * 1. Correct `inline-block` display not defined in IE 8/9.
47
+ * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
28
48
  */
29
49
 
30
50
  audio,
31
51
  canvas,
52
+ progress,
32
53
  video {
33
- display: inline-block;
54
+ display: inline-block; /* 1 */
55
+ vertical-align: baseline; /* 2 */
34
56
  }
35
57
 
36
58
  /**
@@ -39,8 +61,8 @@ video {
39
61
  */
40
62
 
41
63
  audio:not([controls]) {
42
- display: none;
43
- height: 0;
64
+ display: none;
65
+ height: 0;
44
66
  }
45
67
 
46
68
  /**
@@ -50,35 +72,10 @@ audio:not([controls]) {
50
72
 
51
73
  [hidden],
52
74
  template {
53
- display: none;
75
+ display: none;
54
76
  }
55
77
 
56
- /* ==========================================================================
57
- Base
58
- ========================================================================== */
59
-
60
- /**
61
- * 1. Set default font family to sans-serif.
62
- * 2. Prevent iOS text size adjust after orientation change, without disabling
63
- * user zoom.
64
- */
65
-
66
- html {
67
- font-family: sans-serif; /* 1 */
68
- -ms-text-size-adjust: 100%; /* 2 */
69
- -webkit-text-size-adjust: 100%; /* 2 */
70
- }
71
-
72
- /**
73
- * Remove default margin.
74
- */
75
-
76
- body {
77
- margin: 0;
78
- }
79
-
80
- /* ==========================================================================
81
- Links
78
+ /* Links
82
79
  ========================================================================== */
83
80
 
84
81
  /**
@@ -86,15 +83,7 @@ body {
86
83
  */
87
84
 
88
85
  a {
89
- background: transparent;
90
- }
91
-
92
- /**
93
- * Address `outline` inconsistency between Chrome and other browsers.
94
- */
95
-
96
- a:focus {
97
- outline: thin dotted;
86
+ background: transparent;
98
87
  }
99
88
 
100
89
  /**
@@ -103,29 +92,18 @@ a:focus {
103
92
 
104
93
  a:active,
105
94
  a:hover {
106
- outline: 0;
95
+ outline: 0;
107
96
  }
108
97
 
109
- /* ==========================================================================
110
- Typography
98
+ /* Text-level semantics
111
99
  ========================================================================== */
112
100
 
113
- /**
114
- * Address variable `h1` font-size and margin within `section` and `article`
115
- * contexts in Firefox 4+, Safari 5, and Chrome.
116
- */
117
-
118
- h1 {
119
- font-size: 2em;
120
- margin: 0.67em 0;
121
- }
122
-
123
101
  /**
124
102
  * Address styling not present in IE 8/9, Safari 5, and Chrome.
125
103
  */
126
104
 
127
105
  abbr[title] {
128
- border-bottom: 1px dotted;
106
+ border-bottom: 1px dotted;
129
107
  }
130
108
 
131
109
  /**
@@ -134,7 +112,7 @@ abbr[title] {
134
112
 
135
113
  b,
136
114
  strong {
137
- font-weight: bold;
115
+ font-weight: bold;
138
116
  }
139
117
 
140
118
  /**
@@ -142,17 +120,17 @@ strong {
142
120
  */
143
121
 
144
122
  dfn {
145
- font-style: italic;
123
+ font-style: italic;
146
124
  }
147
125
 
148
126
  /**
149
- * Address differences between Firefox and other browsers.
127
+ * Address variable `h1` font-size and margin within `section` and `article`
128
+ * contexts in Firefox 4+, Safari 5, and Chrome.
150
129
  */
151
130
 
152
- hr {
153
- -moz-box-sizing: content-box;
154
- box-sizing: content-box;
155
- height: 0;
131
+ h1 {
132
+ font-size: 2em;
133
+ margin: 0.67em 0;
156
134
  }
157
135
 
158
136
  /**
@@ -160,36 +138,8 @@ hr {
160
138
  */
161
139
 
162
140
  mark {
163
- background: #ff0;
164
- color: #000;
165
- }
166
-
167
- /**
168
- * Correct font family set oddly in Safari 5 and Chrome.
169
- */
170
-
171
- code,
172
- kbd,
173
- pre,
174
- samp {
175
- font-family: monospace, serif;
176
- font-size: 1em;
177
- }
178
-
179
- /**
180
- * Improve readability of pre-formatted text in all browsers.
181
- */
182
-
183
- pre {
184
- white-space: pre-wrap;
185
- }
186
-
187
- /**
188
- * Set consistent quote types.
189
- */
190
-
191
- q {
192
- quotes: "\201C" "\201D" "\2018" "\2019";
141
+ background: #ff0;
142
+ color: #000;
193
143
  }
194
144
 
195
145
  /**
@@ -197,7 +147,7 @@ q {
197
147
  */
198
148
 
199
149
  small {
200
- font-size: 80%;
150
+ font-size: 80%;
201
151
  }
202
152
 
203
153
  /**
@@ -206,22 +156,21 @@ small {
206
156
 
207
157
  sub,
208
158
  sup {
209
- font-size: 75%;
210
- line-height: 0;
211
- position: relative;
212
- vertical-align: baseline;
159
+ font-size: 75%;
160
+ line-height: 0;
161
+ position: relative;
162
+ vertical-align: baseline;
213
163
  }
214
164
 
215
165
  sup {
216
- top: -0.5em;
166
+ top: -0.5em;
217
167
  }
218
168
 
219
169
  sub {
220
- bottom: -0.25em;
170
+ bottom: -0.25em;
221
171
  }
222
172
 
223
- /* ==========================================================================
224
- Embedded content
173
+ /* Embedded content
225
174
  ========================================================================== */
226
175
 
227
176
  /**
@@ -229,7 +178,7 @@ sub {
229
178
  */
230
179
 
231
180
  img {
232
- border: 0;
181
+ border: 0;
233
182
  }
234
183
 
235
184
  /**
@@ -237,11 +186,10 @@ img {
237
186
  */
238
187
 
239
188
  svg:not(:root) {
240
- overflow: hidden;
189
+ overflow: hidden;
241
190
  }
242
191
 
243
- /* ==========================================================================
244
- Figures
192
+ /* Grouping content
245
193
  ========================================================================== */
246
194
 
247
195
  /**
@@ -249,68 +197,82 @@ svg:not(:root) {
249
197
  */
250
198
 
251
199
  figure {
252
- margin: 0;
200
+ margin: 1em 40px;
253
201
  }
254
202
 
255
- /* ==========================================================================
256
- Forms
257
- ========================================================================== */
203
+ /**
204
+ * Address differences between Firefox and other browsers.
205
+ */
206
+
207
+ hr {
208
+ -moz-box-sizing: content-box;
209
+ box-sizing: content-box;
210
+ height: 0;
211
+ }
258
212
 
259
213
  /**
260
- * Define consistent border, margin, and padding.
214
+ * Contain overflow in all browsers.
261
215
  */
262
216
 
263
- fieldset {
264
- border: 1px solid #c0c0c0;
265
- margin: 0 2px;
266
- padding: 0.35em 0.625em 0.75em;
217
+ pre {
218
+ overflow: auto;
267
219
  }
268
220
 
269
221
  /**
270
- * 1. Correct `color` not being inherited in IE 8/9.
271
- * 2. Remove padding so people aren't caught out if they zero out fieldsets.
222
+ * Address odd `em`-unit font size rendering in all browsers.
272
223
  */
273
224
 
274
- legend {
275
- border: 0; /* 1 */
276
- padding: 0; /* 2 */
225
+ code,
226
+ kbd,
227
+ pre,
228
+ samp {
229
+ font-family: monospace, monospace;
230
+ font-size: 1em;
277
231
  }
278
232
 
233
+ /* Forms
234
+ ========================================================================== */
235
+
279
236
  /**
280
- * 1. Correct font family not being inherited in all browsers.
281
- * 2. Correct font size not being inherited in all browsers.
237
+ * Known limitation: by default, Chrome and Safari on OS X allow very limited
238
+ * styling of `select`, unless a `border` property is set.
239
+ */
240
+
241
+ /**
242
+ * 1. Correct color not being inherited.
243
+ * Known issue: affects color of disabled elements.
244
+ * 2. Correct font properties not being inherited.
282
245
  * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
283
246
  */
284
247
 
285
248
  button,
286
249
  input,
250
+ optgroup,
287
251
  select,
288
252
  textarea {
289
- font-family: inherit; /* 1 */
290
- font-size: 100%; /* 2 */
291
- margin: 0; /* 3 */
253
+ color: inherit; /* 1 */
254
+ font: inherit; /* 2 */
255
+ margin: 0; /* 3 */
292
256
  }
293
257
 
294
258
  /**
295
- * Address Firefox 4+ setting `line-height` on `input` using `!important` in
296
- * the UA stylesheet.
259
+ * Address `overflow` set to `hidden` in IE 8/9/10.
297
260
  */
298
261
 
299
- button,
300
- input {
301
- line-height: normal;
262
+ button {
263
+ overflow: visible;
302
264
  }
303
265
 
304
266
  /**
305
267
  * Address inconsistent `text-transform` inheritance for `button` and `select`.
306
268
  * All other form control elements do not inherit `text-transform` values.
307
- * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
308
- * Correct `select` style inheritance in Firefox 4+ and Opera.
269
+ * Correct `button` style inheritance in Firefox, IE 8+, and Opera
270
+ * Correct `select` style inheritance in Firefox.
309
271
  */
310
272
 
311
273
  button,
312
274
  select {
313
- text-transform: none;
275
+ text-transform: none;
314
276
  }
315
277
 
316
278
  /**
@@ -325,8 +287,8 @@ button,
325
287
  html input[type="button"], /* 1 */
326
288
  input[type="reset"],
327
289
  input[type="submit"] {
328
- -webkit-appearance: button; /* 2 */
329
- cursor: pointer; /* 3 */
290
+ -webkit-appearance: button; /* 2 */
291
+ cursor: pointer; /* 3 */
330
292
  }
331
293
 
332
294
  /**
@@ -335,18 +297,51 @@ input[type="submit"] {
335
297
 
336
298
  button[disabled],
337
299
  html input[disabled] {
338
- cursor: default;
300
+ cursor: default;
339
301
  }
340
302
 
341
303
  /**
304
+ * Remove inner padding and border in Firefox 4+.
305
+ */
306
+
307
+ button::-moz-focus-inner,
308
+ input::-moz-focus-inner {
309
+ border: 0;
310
+ padding: 0;
311
+ }
312
+
313
+ /**
314
+ * Address Firefox 4+ setting `line-height` on `input` using `!important` in
315
+ * the UA stylesheet.
316
+ */
317
+
318
+ input {
319
+ line-height: normal;
320
+ }
321
+
322
+ /**
323
+ * It's recommended that you don't attempt to style these elements.
324
+ * Firefox's implementation doesn't respect box-sizing, padding, or width.
325
+ *
342
326
  * 1. Address box sizing set to `content-box` in IE 8/9/10.
343
327
  * 2. Remove excess padding in IE 8/9/10.
344
328
  */
345
329
 
346
330
  input[type="checkbox"],
347
331
  input[type="radio"] {
348
- box-sizing: border-box; /* 1 */
349
- padding: 0; /* 2 */
332
+ box-sizing: border-box; /* 1 */
333
+ padding: 0; /* 2 */
334
+ }
335
+
336
+ /**
337
+ * Fix the cursor style for Chrome's increment/decrement buttons. For certain
338
+ * `font-size` values of the `input`, it causes the cursor style of the
339
+ * decrement button to change from `default` to `text`.
340
+ */
341
+
342
+ input[type="number"]::-webkit-inner-spin-button,
343
+ input[type="number"]::-webkit-outer-spin-button {
344
+ height: auto;
350
345
  }
351
346
 
352
347
  /**
@@ -356,44 +351,61 @@ input[type="radio"] {
356
351
  */
357
352
 
358
353
  input[type="search"] {
359
- -webkit-appearance: textfield; /* 1 */
360
- -moz-box-sizing: content-box;
361
- -webkit-box-sizing: content-box; /* 2 */
362
- box-sizing: content-box;
354
+ -webkit-appearance: textfield; /* 1 */
355
+ -moz-box-sizing: content-box;
356
+ -webkit-box-sizing: content-box; /* 2 */
357
+ box-sizing: content-box;
363
358
  }
364
359
 
365
360
  /**
366
- * Remove inner padding and search cancel button in Safari 5 and Chrome
367
- * on OS X.
361
+ * Remove inner padding and search cancel button in Safari and Chrome on OS X.
362
+ * Safari (but not Chrome) clips the cancel button when the search input has
363
+ * padding (and `textfield` appearance).
368
364
  */
369
365
 
370
366
  input[type="search"]::-webkit-search-cancel-button,
371
367
  input[type="search"]::-webkit-search-decoration {
372
- -webkit-appearance: none;
368
+ -webkit-appearance: none;
373
369
  }
374
370
 
375
371
  /**
376
- * Remove inner padding and border in Firefox 4+.
372
+ * Define consistent border, margin, and padding.
377
373
  */
378
374
 
379
- button::-moz-focus-inner,
380
- input::-moz-focus-inner {
381
- border: 0;
382
- padding: 0;
375
+ fieldset {
376
+ border: 1px solid #c0c0c0;
377
+ margin: 0 2px;
378
+ padding: 0.35em 0.625em 0.75em;
383
379
  }
384
380
 
385
381
  /**
386
- * 1. Remove default vertical scrollbar in IE 8/9.
387
- * 2. Improve readability and alignment in all browsers.
382
+ * 1. Correct `color` not being inherited in IE 8/9.
383
+ * 2. Remove padding so people aren't caught out if they zero out fieldsets.
384
+ */
385
+
386
+ legend {
387
+ border: 0; /* 1 */
388
+ padding: 0; /* 2 */
389
+ }
390
+
391
+ /**
392
+ * Remove default vertical scrollbar in IE 8/9.
388
393
  */
389
394
 
390
395
  textarea {
391
- overflow: auto; /* 1 */
392
- vertical-align: top; /* 2 */
396
+ overflow: auto;
397
+ }
398
+
399
+ /**
400
+ * Don't inherit the `font-weight` (applied by a rule above).
401
+ * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
402
+ */
403
+
404
+ optgroup {
405
+ font-weight: bold;
393
406
  }
394
407
 
395
- /* ==========================================================================
396
- Tables
408
+ /* Tables
397
409
  ========================================================================== */
398
410
 
399
411
  /**
@@ -401,6 +413,11 @@ textarea {
401
413
  */
402
414
 
403
415
  table {
404
- border-collapse: collapse;
405
- border-spacing: 0;
416
+ border-collapse: collapse;
417
+ border-spacing: 0;
418
+ }
419
+
420
+ td,
421
+ th {
422
+ padding: 0;
406
423
  }