skeleton-framework-rails 1.0.7

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,7 @@
1
+ ---
2
+ SHA1:
3
+ metadata.gz: 6a977f4d9b078121bfacc94d31621ee4cd59eebf
4
+ data.tar.gz: 76310c24e7146b763eab612fe4d4fc6bd8309a58
5
+ SHA512:
6
+ metadata.gz: 1853195e592d20a7b5e23e12a1722e4ac21eb3b29f9125f39289337f2e0f50c5d981e09630744149f06ffc5e28ec1f14c4fa3696232a4d963533baefc1a0dbac
7
+ data.tar.gz: 6401784c2579aded13ce15ce3efd606ec87f80af6ab0235c1e57c70b5c5f482917cfc673fecacb2b58629f123078820c1533df110b8e4e91c51f5c8c6b2cff0b
@@ -0,0 +1,11 @@
1
+ /.bundle/
2
+ /.yardoc
3
+ /Gemfile.lock
4
+ /_yardoc/
5
+ /coverage/
6
+ /doc/
7
+ /pkg/
8
+ /spec/reports/
9
+ /tmp/
10
+
11
+ .DS_Store
data/.rspec ADDED
@@ -0,0 +1,2 @@
1
+ --format documentation
2
+ --color
@@ -0,0 +1,4 @@
1
+ language: ruby
2
+ rvm:
3
+ - 2.3.0
4
+ before_install: gem install bundler -v 1.11.2
data/Gemfile ADDED
@@ -0,0 +1,4 @@
1
+ source 'https://rubygems.org'
2
+
3
+ # Specify your gem's dependencies in skeleton-framework-rails.gemspec
4
+ gemspec
@@ -0,0 +1,28 @@
1
+ # Skeleton-Framework-Rails
2
+
3
+ Skeleton-Framework-Rails is a rubygem for Rails.
4
+
5
+ ## Installation
6
+
7
+ Add this line to your application's Gemfile:
8
+
9
+ ```ruby
10
+ gem 'skeleton-framework-rails'
11
+ ```
12
+
13
+ And then execute:
14
+
15
+ $ bundle
16
+
17
+ Or install it yourself as:
18
+
19
+ $ gem install skeleton-framework-rails
20
+
21
+ ## Usage
22
+
23
+ Import Skeleton CSS Frame work into Stylesheet file
24
+ ```ruby
25
+ *= require skeleton
26
+ ```
27
+
28
+ That's it and enjoy it
@@ -0,0 +1,3 @@
1
+ require "bundler/gem_tasks"
2
+
3
+ task :default => :spec
@@ -0,0 +1,14 @@
1
+ #!/usr/bin/env ruby
2
+
3
+ require "bundler/setup"
4
+ require "skeleton/framework/rails"
5
+
6
+ # You can add fixtures and/or initialization code here to make experimenting
7
+ # with your gem easier. You can also use a different console, if you like.
8
+
9
+ # (If you use this, don't forget to add pry to your Gemfile!)
10
+ # require "pry"
11
+ # Pry.start
12
+
13
+ require "irb"
14
+ IRB.start
@@ -0,0 +1,8 @@
1
+ #!/usr/bin/env bash
2
+ set -euo pipefail
3
+ IFS=$'\n\t'
4
+ set -vx
5
+
6
+ bundle install
7
+
8
+ # Do any other automated setup that you need to do here
@@ -0,0 +1,10 @@
1
+ require "skeleton/framework/rails/version"
2
+
3
+ module Skeleton
4
+ module Framework
5
+ module Rails
6
+ class Engine < ::Rails::Engine
7
+ end
8
+ end
9
+ end
10
+ end
@@ -0,0 +1,7 @@
1
+ module Skeleton
2
+ module Framework
3
+ module Rails
4
+ VERSION = "1.0.7"
5
+ end
6
+ end
7
+ end
@@ -0,0 +1,24 @@
1
+ # coding: utf-8
2
+ lib = File.expand_path('../lib', __FILE__)
3
+ $LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
4
+ require 'skeleton/framework/rails/version'
5
+
6
+ Gem::Specification.new do |spec|
7
+ spec.name = "skeleton-framework-rails"
8
+ spec.version = Skeleton::Framework::Rails::VERSION
9
+ spec.authors = ["Zac"]
10
+ spec.email = ["mymengyu@gmail.com"]
11
+
12
+ spec.summary = %q{Skeleton CSS Framework into Rails}
13
+ spec.description = %q{New Skeleton CSS Framework into Rails}
14
+ spec.homepage = "https://github.com/mymengyu/skeleton-framework-rails"
15
+
16
+
17
+ spec.files = `git ls-files -z`.split("\x0").reject { |f| f.match(%r{^(test|spec|features)/}) }
18
+ spec.bindir = "exe"
19
+ spec.executables = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }
20
+ spec.require_paths = ["lib"]
21
+
22
+ spec.add_development_dependency "bundler", "~> 1.11"
23
+ spec.add_development_dependency "rake", "~> 10.0"
24
+ end
@@ -0,0 +1,996 @@
1
+ /*! Skeleton Framework | 1.0.7 | MIT | Feb 9th, 2016 */
2
+
3
+ /* Table of contents
4
+ - Grid
5
+ - Base Styles
6
+ - Typography
7
+ - Links
8
+ - Buttons
9
+ - Forms
10
+ - Lists
11
+ - Code
12
+ - Tables
13
+ - Spacing
14
+ - Utilities
15
+ - Clearing
16
+ - Media Queries
17
+ */
18
+
19
+
20
+ /* Base Styles */
21
+
22
+ html {
23
+ font-size: 1em;
24
+ box-sizing: border-box;
25
+ }
26
+
27
+ *,
28
+ *::before,
29
+ *::after {
30
+ box-sizing: inherit;
31
+ }
32
+
33
+ body {
34
+ font-size: 1rem;
35
+ line-height: 1.6rem;
36
+ font-weight: 400;
37
+ font-family: "Raleway", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
38
+ color: #222;
39
+ }
40
+
41
+ /* Grid */
42
+
43
+ .container {
44
+ margin: 0 auto;
45
+ width: calc(100% - 1rem);
46
+ max-width: 1200px;
47
+ }
48
+
49
+ .container .container {
50
+ margin-top: 0.5rem;
51
+ width: calc(100% - 2rem);
52
+ }
53
+
54
+ .row {
55
+ margin-left: -0.5rem;
56
+ margin-right: -0.5rem;
57
+ }
58
+
59
+ .row::before,
60
+ .row::after {
61
+ content: ' ';
62
+ display: table;
63
+ }
64
+
65
+ .row::after {
66
+ clear: both;
67
+ }
68
+
69
+ .row ~ .row,
70
+ [class*='column'] ~ [class*='column'] {
71
+ margin-top: 1rem;
72
+ }
73
+
74
+ [class*='column'] {
75
+ width: calc(100% - 1rem);
76
+ float: left;
77
+ min-height: 1px;
78
+ margin-left: 0.5rem;
79
+ margin-right: 0.5rem;
80
+ }
81
+
82
+ .xs-one[class*='column'] {
83
+ width: calc(8.3333333333% - 1rem);
84
+ }
85
+
86
+ .xs-two[class*='column'] {
87
+ width: calc(16.6666666666% - 1rem);
88
+ }
89
+
90
+ .xs-three[class*='column'],
91
+ .xs-one-quarter[class*='column'] {
92
+ width: calc(24.9999999999% - 1rem);
93
+ }
94
+
95
+ .xs-four[class*='column'],
96
+ .xs-one-third[class*='column'] {
97
+ width: calc(33.3333333332% - 1rem);
98
+ }
99
+
100
+ .xs-five[class*='column'] {
101
+ width: calc(41.6666666665% - 1rem);
102
+ }
103
+
104
+ .xs-six[class*='column'],
105
+ .xs-one-half[class*='column'] {
106
+ width: calc(49.9999999998% - 1rem);
107
+ }
108
+
109
+ .xs-seven[class*='column'] {
110
+ width: calc(58.3333333331% - 1rem);
111
+ }
112
+
113
+ .xs-eight[class*='column'],
114
+ .xs-two-thirds[class*='column'] {
115
+ width: calc(66.6666666664% - 1rem);
116
+ }
117
+
118
+ .xs-nine[class*='column'] {
119
+ width: calc(74.9999999997% - 1rem);
120
+ }
121
+
122
+ .xs-ten[class*='column'] {
123
+ width: calc(83.333333333% - 1rem);
124
+ }
125
+
126
+ .xs-eleven[class*='column'] {
127
+ width: calc(91.6666666663% - 1rem);
128
+ }
129
+
130
+ .xs-twelve[class*='column'] {
131
+ width: calc(99.9999999996% - 1rem);
132
+ }
133
+
134
+ [class*='xs-'][class*='column'] ~ [class*='xs-'][class*='column'] {
135
+ margin-top: 0;
136
+ }
137
+
138
+ @media screen and (min-width: 560px) {
139
+ [class*='column'] ~ [class*='column'] {
140
+ margin-top: 0;
141
+ }
142
+ .one[class*='column'] {
143
+ width: calc(8.3333333333% - 1rem);
144
+ }
145
+ .two[class*='column'] {
146
+ width: calc(16.6666666666% - 1rem);
147
+ }
148
+ .three[class*='column'],
149
+ .one-quarter[class*='column'] {
150
+ width: calc(24.9999999999% - 1rem);
151
+ }
152
+ .four[class*='column'],
153
+ .one-third[class*='column'] {
154
+ width: calc(33.3333333332% - 1rem);
155
+ }
156
+ .five[class*='column'] {
157
+ width: calc(41.6666666665% - 1rem);
158
+ }
159
+ .six[class*='column'],
160
+ .one-half[class*='column'] {
161
+ width: calc(49.9999999998% - 1rem);
162
+ }
163
+ .seven[class*='column'] {
164
+ width: calc(58.3333333331% - 1rem);
165
+ }
166
+ .eight[class*='column'],
167
+ .two-thirds[class*='column'] {
168
+ width: calc(66.6666666664% - 1rem);
169
+ }
170
+ .nine[class*='column'] {
171
+ width: calc(74.9999999997% - 1rem);
172
+ }
173
+ .ten[class*='column'] {
174
+ width: calc(83.333333333% - 1rem);
175
+ }
176
+ .eleven[class*='column'] {
177
+ width: calc(91.6666666663% - 1rem);
178
+ }
179
+ .twelve[class*='column'] {
180
+ width: calc(99.9999999996% - 1rem);
181
+ }
182
+ .offset-by-one[class*='column'] {
183
+ margin-left: calc(8.3333333333% + 0.5rem);
184
+ }
185
+ .offset-by-two[class*='column'] {
186
+ margin-left: calc(16.6666666666% + 0.5rem);
187
+ }
188
+ .offset-by-three[class*='column'],
189
+ .offset-by-one-quarter[class*='column'] {
190
+ margin-left: calc(24.9999999999% + 0.5rem);
191
+ }
192
+ .offset-by-four[class*='column'],
193
+ .offset-by-one-third[class*='column'] {
194
+ margin-left: calc(33.3333333332% + 0.5rem);
195
+ }
196
+ .offset-by-five[class*='column'] {
197
+ margin-left: calc(41.6666666665% + 0.5rem);
198
+ }
199
+ .offset-by-six[class*='column'],
200
+ .offset-by-one-half[class*='column'] {
201
+ margin-left: calc(49.9999999998% + 0.5rem);
202
+ }
203
+ .offset-by-seven[class*='column'] {
204
+ margin-left: calc(58.3333333331% + 0.5rem);
205
+ }
206
+ .offset-by-eight[class*='column'],
207
+ .offset-by-two-thirds[class*='column'] {
208
+ margin-left: calc(66.6666666664% + 0.5rem);
209
+ }
210
+ .offset-by-nine[class*='column'] {
211
+ margin-left: calc(74.9999999997% + 0.5rem);
212
+ }
213
+ .offset-by-ten[class*='column'] {
214
+ margin-left: calc(83.333333333% + 0.5rem);
215
+ }
216
+ .offset-by-eleven[class*='column'] {
217
+ margin-left: calc(91.6666666663% + 0.5rem);
218
+ }
219
+ .sm-one[class*='column'] {
220
+ width: calc(8.3333333333% - 1rem);
221
+ }
222
+ .sm-two[class*='column'] {
223
+ width: calc(16.6666666666% - 1rem);
224
+ }
225
+ .sm-three[class*='column'],
226
+ .sm-one-quarter[class*='column'] {
227
+ width: calc(24.9999999999% - 1rem);
228
+ }
229
+ .sm-four[class*='column'],
230
+ .sm-one-third[class*='column'] {
231
+ width: calc(33.3333333332% - 1rem);
232
+ }
233
+ .sm-five[class*='column'] {
234
+ width: calc(41.6666666665% - 1rem);
235
+ }
236
+ .sm-six[class*='column'],
237
+ .sm-one-half[class*='column'] {
238
+ width: calc(49.9999999998% - 1rem);
239
+ }
240
+ .sm-seven[class*='column'] {
241
+ width: calc(58.3333333331% - 1rem);
242
+ }
243
+ .sm-eight[class*='column'],
244
+ .sm-two-thirds[class*='column'] {
245
+ width: calc(66.6666666664% - 1rem);
246
+ }
247
+ .sm-nine[class*='column'] {
248
+ width: calc(74.9999999997% - 1rem);
249
+ }
250
+ .sm-ten[class*='column'] {
251
+ width: calc(83.333333333% - 1rem);
252
+ }
253
+ .sm-eleven[class*='column'] {
254
+ width: calc(91.6666666663% - 1rem);
255
+ }
256
+ .sm-twelve[class*='column'] {
257
+ width: calc(99.9999999996% - 1rem);
258
+ }
259
+ .sm-offset-by-one[class*='column'] {
260
+ margin-left: calc(8.3333333333% + 0.5rem);
261
+ }
262
+ .sm-offset-by-two[class*='column'] {
263
+ margin-left: calc(16.6666666666% + 0.5rem);
264
+ }
265
+ .sm-offset-by-three[class*='column'],
266
+ .sm-offset-by-one-quarter[class*='column'] {
267
+ margin-left: calc(24.9999999999% + 0.5rem);
268
+ }
269
+ .sm-offset-by-four[class*='column'],
270
+ .sm-offset-by-one-third[class*='column'] {
271
+ margin-left: calc(33.3333333332% + 0.5rem);
272
+ }
273
+ .sm-offset-by-five[class*='column'] {
274
+ margin-left: calc(41.6666666665% + 0.5rem);
275
+ }
276
+ .sm-offset-by-six[class*='column'],
277
+ .sm-offset-by-one-half[class*='column'] {
278
+ margin-left: calc(49.9999999998% + 0.5rem);
279
+ }
280
+ .sm-offset-by-seven[class*='column'] {
281
+ margin-left: calc(58.3333333331% + 0.5rem);
282
+ }
283
+ .sm-offset-by-eight[class*='column'],
284
+ .sm-offset-by-two-thirds[class*='column'] {
285
+ margin-left: calc(66.6666666664% + 0.5rem);
286
+ }
287
+ .sm-offset-by-nine[class*='column'] {
288
+ margin-left: calc(74.9999999997% + 0.5rem);
289
+ }
290
+ .sm-offset-by-ten[class*='column'] {
291
+ margin-left: calc(83.333333333% + 0.5rem);
292
+ }
293
+ .sm-offset-by-eleven[class*='column'] {
294
+ margin-left: calc(91.6666666663% + 0.5rem);
295
+ }
296
+ }
297
+
298
+ @media screen and (min-width: 720px) {
299
+ .md-one[class*='column'] {
300
+ width: calc(8.3333333333% - 1rem);
301
+ }
302
+ .md-two[class*='column'] {
303
+ width: calc(16.6666666666% - 1rem);
304
+ }
305
+ .md-three[class*='column'],
306
+ .md-one-quarter[class*='column'] {
307
+ width: calc(24.9999999999% - 1rem);
308
+ }
309
+ .md-four[class*='column'],
310
+ .md-one-third[class*='column'] {
311
+ width: calc(33.3333333332% - 1rem);
312
+ }
313
+ .md-five[class*='column'] {
314
+ width: calc(41.6666666665% - 1rem);
315
+ }
316
+ .md-six[class*='column'],
317
+ .md-one-half[class*='column'] {
318
+ width: calc(49.9999999998% - 1rem);
319
+ }
320
+ .md-seven[class*='column'] {
321
+ width: calc(58.3333333331% - 1rem);
322
+ }
323
+ .md-eight[class*='column'],
324
+ .md-two-thirds[class*='column'] {
325
+ width: calc(66.6666666664% - 1rem);
326
+ }
327
+ .md-nine[class*='column'] {
328
+ width: calc(74.9999999997% - 1rem);
329
+ }
330
+ .md-ten[class*='column'] {
331
+ width: calc(83.333333333% - 1rem);
332
+ }
333
+ .md-eleven[class*='column'] {
334
+ width: calc(91.6666666663% - 1rem);
335
+ }
336
+ .md-twelve[class*='column'] {
337
+ width: calc(99.9999999996% - 1rem);
338
+ }
339
+ .md-offset-by-one[class*='column'] {
340
+ margin-left: calc(8.3333333333% + 0.5rem);
341
+ }
342
+ .md-offset-by-two[class*='column'] {
343
+ margin-left: calc(16.6666666666% + 0.5rem);
344
+ }
345
+ .md-offset-by-three[class*='column'],
346
+ .md-offset-by-one-quarter[class*='column'] {
347
+ margin-left: calc(24.9999999999% + 0.5rem);
348
+ }
349
+ .md-offset-by-four[class*='column'],
350
+ .md-offset-by-one-third[class*='column'] {
351
+ margin-left: calc(33.3333333332% + 0.5rem);
352
+ }
353
+ .md-offset-by-five[class*='column'] {
354
+ margin-left: calc(41.6666666665% + 0.5rem);
355
+ }
356
+ .md-offset-by-six[class*='column'],
357
+ .md-offset-by-one-half[class*='column'] {
358
+ margin-left: calc(49.9999999998% + 0.5rem);
359
+ }
360
+ .md-offset-by-seven[class*='column'] {
361
+ margin-left: calc(58.3333333331% + 0.5rem);
362
+ }
363
+ .md-offset-by-eight[class*='column'],
364
+ .md-offset-by-two-thirds[class*='column'] {
365
+ margin-left: calc(66.6666666664% + 0.5rem);
366
+ }
367
+ .md-offset-by-nine[class*='column'] {
368
+ margin-left: calc(74.9999999997% + 0.5rem);
369
+ }
370
+ .md-offset-by-ten[class*='column'] {
371
+ margin-left: calc(83.333333333% + 0.5rem);
372
+ }
373
+ .md-offset-by-eleven[class*='column'] {
374
+ margin-left: calc(91.6666666663% + 0.5rem);
375
+ }
376
+ }
377
+
378
+ @media screen and (min-width: 960px) {
379
+ .lg-one[class*='column'] {
380
+ width: calc(8.3333333333% - 1rem);
381
+ }
382
+ .lg-two[class*='column'] {
383
+ width: calc(16.6666666666% - 1rem);
384
+ }
385
+ .lg-three[class*='column'],
386
+ .lg-one-quarter[class*='column'] {
387
+ width: calc(24.9999999999% - 1rem);
388
+ }
389
+ .lg-four[class*='column'],
390
+ .lg-one-third[class*='column'] {
391
+ width: calc(33.3333333332% - 1rem);
392
+ }
393
+ .lg-five[class*='column'] {
394
+ width: calc(41.6666666665% - 1rem);
395
+ }
396
+ .lg-six[class*='column'],
397
+ .lg-one-half[class*='column'] {
398
+ width: calc(49.9999999998% - 1rem);
399
+ }
400
+ .lg-seven[class*='column'] {
401
+ width: calc(58.3333333331% - 1rem);
402
+ }
403
+ .lg-eight[class*='column'],
404
+ .lg-two-thirds[class*='column'] {
405
+ width: calc(66.6666666664% - 1rem);
406
+ }
407
+ .lg-nine[class*='column'] {
408
+ width: calc(74.9999999997% - 1rem);
409
+ }
410
+ .lg-ten[class*='column'] {
411
+ width: calc(83.333333333% - 1rem);
412
+ }
413
+ .lg-eleven[class*='column'] {
414
+ width: calc(91.6666666663% - 1rem);
415
+ }
416
+ .lg-twelve[class*='column'] {
417
+ width: calc(99.9999999996% - 1rem);
418
+ }
419
+ .lg-offset-by-one[class*='column'] {
420
+ margin-left: calc(8.3333333333% + 0.5rem);
421
+ }
422
+ .lg-offset-by-two[class*='column'] {
423
+ margin-left: calc(16.6666666666% + 0.5rem);
424
+ }
425
+ .lg-offset-by-three[class*='column'],
426
+ .lg-offset-by-one-quarter[class*='column'] {
427
+ margin-left: calc(24.9999999999% + 0.5rem);
428
+ }
429
+ .lg-offset-by-four[class*='column'],
430
+ .lg-offset-by-one-third[class*='column'] {
431
+ margin-left: calc(33.3333333332% + 0.5rem);
432
+ }
433
+ .lg-offset-by-five[class*='column'] {
434
+ margin-left: calc(41.6666666665% + 0.5rem);
435
+ }
436
+ .lg-offset-by-six[class*='column'],
437
+ .lg-offset-by-one-half[class*='column'] {
438
+ margin-left: calc(49.9999999998% + 0.5rem);
439
+ }
440
+ .lg-offset-by-seven[class*='column'] {
441
+ margin-left: calc(58.3333333331% + 0.5rem);
442
+ }
443
+ .lg-offset-by-eight[class*='column'],
444
+ .lg-offset-by-two-thirds[class*='column'] {
445
+ margin-left: calc(66.6666666664% + 0.5rem);
446
+ }
447
+ .lg-offset-by-nine[class*='column'] {
448
+ margin-left: calc(74.9999999997% + 0.5rem);
449
+ }
450
+ .lg-offset-by-ten[class*='column'] {
451
+ margin-left: calc(83.333333333% + 0.5rem);
452
+ }
453
+ .lg-offset-by-eleven[class*='column'] {
454
+ margin-left: calc(91.6666666663% + 0.5rem);
455
+ }
456
+ }
457
+
458
+ /* Typography and Links */
459
+
460
+ /* Base Typo
461
+ ------------------------------------------------- */
462
+
463
+ h1,
464
+ h2,
465
+ h3,
466
+ h4,
467
+ h5,
468
+ h6 {
469
+ margin-top: 0;
470
+ margin-bottom: 2rem;
471
+ font-weight: 300;
472
+ }
473
+
474
+ h1 {
475
+ font-size: 4.0rem;
476
+ line-height: 1.2;
477
+ letter-spacing: -0.1rem;
478
+ }
479
+
480
+ h2 {
481
+ font-size: 3.6rem;
482
+ line-height: 1.25;
483
+ letter-spacing: -0.1rem;
484
+ }
485
+
486
+ h3 {
487
+ font-size: 3.0rem;
488
+ line-height: 1.3;
489
+ letter-spacing: -0.1rem;
490
+ }
491
+
492
+ h4 {
493
+ font-size: 2.4rem;
494
+ line-height: 1.35;
495
+ letter-spacing: -0.08rem;
496
+ }
497
+
498
+ h5 {
499
+ font-size: 1.8rem;
500
+ line-height: 1.5;
501
+ letter-spacing: -0.05rem;
502
+ }
503
+
504
+ h6 {
505
+ font-size: 1.5rem;
506
+ line-height: 1.6;
507
+ letter-spacing: 0;
508
+ }
509
+
510
+
511
+ /* Larger than phablet */
512
+
513
+ @media (min-width: 560px) {
514
+ h1 {
515
+ font-size: 5.0rem;
516
+ }
517
+ h2 {
518
+ font-size: 4.2rem;
519
+ }
520
+ h3 {
521
+ font-size: 3.6rem;
522
+ }
523
+ h4 {
524
+ font-size: 3.0rem;
525
+ }
526
+ h5 {
527
+ font-size: 2.4rem;
528
+ }
529
+ h6 {
530
+ font-size: 1.5rem;
531
+ }
532
+ }
533
+
534
+ p {
535
+ margin-top: 0;
536
+ }
537
+
538
+
539
+ /* Links
540
+ –––––––––––––––––––––––––––––––––––––––––––––––––– */
541
+
542
+ a {
543
+ color: #1EAEDB;
544
+ }
545
+
546
+ a:hover {
547
+ color: #0FA0CE;
548
+ }
549
+
550
+ /* Buttons */
551
+
552
+ .button,
553
+ button,
554
+ input[type="submit"],
555
+ input[type="reset"],
556
+ input[type="button"] {
557
+ display: inline-block;
558
+ height: 2.5rem;
559
+ padding: 0 1.9rem;
560
+ color: #555;
561
+ text-align: center;
562
+ font-size: 0.7rem;
563
+ font-weight: 600;
564
+ line-height: 2.5rem;
565
+ letter-spacing: 0.1rem;
566
+ text-transform: uppercase;
567
+ text-decoration: none;
568
+ white-space: nowrap;
569
+ background-color: transparent;
570
+ border-radius: 4px;
571
+ border: 1px solid #BBB;
572
+ cursor: pointer;
573
+ }
574
+
575
+ .button:hover,
576
+ button:hover,
577
+ input[type="submit"]:hover,
578
+ input[type="reset"]:hover,
579
+ input[type="button"]:hover,
580
+ .button:focus,
581
+ button:focus,
582
+ input[type="submit"]:focus,
583
+ input[type="reset"]:focus,
584
+ input[type="button"]:focus {
585
+ color: #333;
586
+ border-color: #888;
587
+ outline: 0;
588
+ }
589
+
590
+ .button:disabled {
591
+ border: 1px solid #E3E3E3;
592
+ color: #888;
593
+ cursor: not-allowed;
594
+ }
595
+
596
+ .button:active,
597
+ button:active,
598
+ input[type="submit"]:active,
599
+ input[type="reset"]:active,
600
+ input[type="button"]:active {
601
+ color: #222;
602
+ border-color: #222;
603
+ }
604
+
605
+ .button.button-primary,
606
+ button.button-primary,
607
+ input[type="submit"].button-primary,
608
+ input[type="reset"].button-primary,
609
+ input[type="button"].button-primary {
610
+ color: #FFF;
611
+ background-color: #33C3F0;
612
+ border-color: #33C3F0;
613
+ }
614
+
615
+ .button.button-primary:hover,
616
+ button.button-primary:hover,
617
+ input[type="submit"].button-primary:hover,
618
+ input[type="reset"].button-primary:hover,
619
+ input[type="button"].button-primary:hover,
620
+ .button.button-primary:focus,
621
+ button.button-primary:focus,
622
+ input[type="submit"].button-primary:focus,
623
+ input[type="reset"].button-primary:focus,
624
+ input[type="button"].button-primary:focus {
625
+ color: #FFF;
626
+ background-color: #1EAEDB;
627
+ border-color: #1EAEDB;
628
+ }
629
+
630
+ .button.button-primary:disabled,
631
+ button.button-primary:disabled,
632
+ input[type="submit"].button-primary:disabled,
633
+ input[type="reset"].button-primary:disabled,
634
+ input[type="button"].button-primary:disabled {
635
+ color: #FFF;
636
+ cursor: not-allowed;
637
+ background-color: #7CD9F8;
638
+ border-color: #7CD9F8;
639
+ }
640
+
641
+ .button.button-primary:active,
642
+ button.button-primary:active,
643
+ input[type="submit"].button-primary:active,
644
+ input[type="reset"].button-primary:active,
645
+ input[type="button"].button-primary:active {
646
+ color: #FFF;
647
+ background-color: #157b9b;
648
+ border-color: #157b9b;
649
+ }
650
+
651
+ /* Forms */
652
+
653
+ input[type="email"],
654
+ input[type="number"],
655
+ input[type="date"],
656
+ input[type="search"],
657
+ input[type="text"],
658
+ input[type="tel"],
659
+ input[type="url"],
660
+ input[type="password"],
661
+ textarea,
662
+ select {
663
+ padding: 0.4rem 0.6rem;
664
+ /* The 6px vertically centers text on FF, ignored by Webkit */
665
+ background-color: #FFF;
666
+ border: 1px solid #D1D1D1;
667
+ border-radius: 4px;
668
+ box-shadow: none;
669
+ }
670
+
671
+ input[type="email"],
672
+ input[type="number"],
673
+ input[type="search"],
674
+ input[type="text"],
675
+ input[type="tel"],
676
+ input[type="url"],
677
+ input[type="password"],
678
+ select:not([size]),
679
+ textarea:not([rows]) {
680
+ height: 2.5rem;
681
+ }
682
+
683
+
684
+ /* Removes awkward default styles on some inputs for iOS */
685
+
686
+ input[type="email"],
687
+ input[type="number"],
688
+ input[type="date"],
689
+ input[type="search"],
690
+ input[type="text"],
691
+ input[type="tel"],
692
+ input[type="url"],
693
+ input[type="password"],
694
+ input[type="button"],
695
+ input[type="submit"],
696
+ textarea {
697
+ -webkit-appearance: none;
698
+ -moz-appearance: none;
699
+ appearance: none;
700
+ }
701
+
702
+ textarea {
703
+ min-height: 4rem;
704
+ padding-top: 0.4rem;
705
+ padding-bottom: 0.4rem;
706
+ }
707
+
708
+ input[type="email"]:focus,
709
+ input[type="number"]:focus,
710
+ input[type="date"]:focus,
711
+ input[type="search"]:focus,
712
+ input[type="text"]:focus,
713
+ input[type="tel"]:focus,
714
+ input[type="url"]:focus,
715
+ input[type="password"]:focus,
716
+ textarea:focus,
717
+ select:focus {
718
+ border: 1px solid #33C3F0;
719
+ outline: 0;
720
+ }
721
+
722
+ label,
723
+ legend {
724
+ display: block;
725
+ margin-bottom: 0.5rem;
726
+ font-weight: 600;
727
+ }
728
+
729
+ fieldset {
730
+ padding: 0;
731
+ border-width: 0;
732
+ }
733
+
734
+ input[type="checkbox"],
735
+ input[type="radio"] {
736
+ display: inline;
737
+ }
738
+
739
+ label > .label-body {
740
+ display: inline-block;
741
+ margin-left: 0.5rem;
742
+ font-weight: normal;
743
+ }
744
+
745
+ /* Lists */
746
+
747
+ ul {
748
+ list-style: circle inside;
749
+ }
750
+
751
+ ol {
752
+ list-style: decimal inside;
753
+ }
754
+
755
+ ol,
756
+ ul {
757
+ padding-left: 0;
758
+ margin-top: 0;
759
+ }
760
+
761
+ ul ul,
762
+ ul ol,
763
+ ol ol,
764
+ ol ul {
765
+ margin: 1.5rem 0 1.5rem 3rem;
766
+ font-size: 90%;
767
+ }
768
+
769
+ li {
770
+ margin-bottom: 1rem;
771
+ }
772
+
773
+ /* Code */
774
+
775
+ code {
776
+ padding: 0.2rem 0.5rem;
777
+ margin: 0 0.2rem;
778
+ font-size: 90%;
779
+ white-space: nowrap;
780
+ background: #F1F1F1;
781
+ border: 1px solid #E1E1E1;
782
+ border-radius: 4px;
783
+ }
784
+
785
+ pre > code {
786
+ display: block;
787
+ padding: 1rem 1.5rem;
788
+ white-space: pre;
789
+ overflow: auto;
790
+ }
791
+
792
+ /* Tables */
793
+
794
+ table {
795
+ display: block;
796
+ overflow-x: auto;
797
+ -webkit-overflow-scrolling: touch;
798
+ }
799
+
800
+ th,
801
+ td {
802
+ padding: 0.75rem 1rem;
803
+ text-align: left;
804
+ border-bottom: 1px solid #E1E1E1;
805
+ }
806
+
807
+ th:first-child,
808
+ td:first-child {
809
+ padding-left: 0;
810
+ }
811
+
812
+ th:last-child,
813
+ td:last-child {
814
+ padding-right: 0;
815
+ }
816
+
817
+ /* Spacing */
818
+
819
+ button,
820
+ .button {
821
+ margin-bottom: 1rem;
822
+ }
823
+
824
+ input,
825
+ textarea,
826
+ select,
827
+ fieldset {
828
+ margin-bottom: 1.5rem;
829
+ }
830
+
831
+ pre,
832
+ blockquote,
833
+ dl,
834
+ figure,
835
+ table,
836
+ p,
837
+ ul,
838
+ ol,
839
+ form {
840
+ margin-bottom: 2.5rem;
841
+ }
842
+
843
+ /* Utilities */
844
+
845
+ .u-full-width {
846
+ width: 100%;
847
+ }
848
+
849
+ .u-max-full-width {
850
+ max-width: 100%;
851
+ }
852
+
853
+
854
+ /* Floats */
855
+
856
+ .u-pull-right {
857
+ float: right;
858
+ }
859
+
860
+ .u-pull-left {
861
+ float: left;
862
+ }
863
+
864
+ .u-cf {
865
+ content: "";
866
+ display: table;
867
+ clear: both;
868
+ }
869
+
870
+
871
+ /* Positioning */
872
+
873
+ .u-center-block {
874
+ display: block;
875
+ margin-left: auto;
876
+ margin-right: auto;
877
+ }
878
+
879
+
880
+ /**
881
+ * Note:
882
+ *
883
+ * Nest this class inside something with `position: relative` to have
884
+ * your element centered relative to its containing element.
885
+ *
886
+ * Use this class without nesting it to have your element centered relative
887
+ * to the viewport.
888
+ */
889
+
890
+ .u-center-abs {
891
+ position: absolute;
892
+ top: 50%;
893
+ left: 50%;
894
+ -webkit-transform: translateY(-50%) translateX(-50%);
895
+ transform: translateY(-50%) translateX(-50%);
896
+ }
897
+
898
+
899
+ /* Type */
900
+
901
+ .u-text-center {
902
+ text-align: center !important;
903
+ }
904
+
905
+ .u-text-right {
906
+ text-align: right !important;
907
+ }
908
+
909
+ .u-text-hide {
910
+ font: 0/0 a;
911
+ color: transparent;
912
+ text-shadow: none;
913
+ background-color: transparent;
914
+ border: 0;
915
+ }
916
+
917
+
918
+ /* Peek a boo */
919
+
920
+ .u-hide {
921
+ display: none !important;
922
+ }
923
+
924
+ .u-show {
925
+ display: block !important;
926
+ }
927
+
928
+ .u-invisible {
929
+ visibility: hidden !important;
930
+ }
931
+
932
+ .u-visible {
933
+ visibility: visible !important;
934
+ }
935
+
936
+
937
+ /* Misc */
938
+
939
+ .u-img-responsive {
940
+ display: block;
941
+ max-width: 100%;
942
+ height: auto;
943
+ }
944
+
945
+ /* Misc */
946
+
947
+ hr {
948
+ margin-top: 3rem;
949
+ margin-bottom: 3.5rem;
950
+ border-width: 0;
951
+ border-top: 1px solid #E1E1E1;
952
+ }
953
+
954
+
955
+ /* Clearing */
956
+
957
+ .container:after,
958
+ .row:after {
959
+ content: "";
960
+ display: table;
961
+ clear: both;
962
+ }
963
+
964
+
965
+ /* Media Queries */
966
+
967
+
968
+ /* Note: The best way to structure the use of media queries is to create the
969
+ queries near the relevant code. For example, if you wanted to change the
970
+ styles for buttons on small devices, paste the mobile query code up in the
971
+ buttons section and style it there. */
972
+
973
+
974
+ /* Larger than mobile */
975
+
976
+ @media (min-width: 400px) {}
977
+
978
+
979
+ /* Larger than phablet (also point when grid becomes active) */
980
+
981
+ @media (min-width: 560px) {}
982
+
983
+
984
+ /* Larger than tablet */
985
+
986
+ @media (min-width: 720px) {}
987
+
988
+
989
+ /* Larger than desktop */
990
+
991
+ @media (min-width: 960px) {}
992
+
993
+
994
+ /* Larger than Desktop HD */
995
+
996
+ @media (min-width: 1200px) {}
metadata ADDED
@@ -0,0 +1,83 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: skeleton-framework-rails
3
+ version: !ruby/object:Gem::Version
4
+ version: 1.0.7
5
+ platform: ruby
6
+ authors:
7
+ - Zac
8
+ autorequire:
9
+ bindir: exe
10
+ cert_chain: []
11
+ date: 2016-02-16 00:00:00.000000000 Z
12
+ dependencies:
13
+ - !ruby/object:Gem::Dependency
14
+ name: bundler
15
+ requirement: !ruby/object:Gem::Requirement
16
+ requirements:
17
+ - - "~>"
18
+ - !ruby/object:Gem::Version
19
+ version: '1.11'
20
+ type: :development
21
+ prerelease: false
22
+ version_requirements: !ruby/object:Gem::Requirement
23
+ requirements:
24
+ - - "~>"
25
+ - !ruby/object:Gem::Version
26
+ version: '1.11'
27
+ - !ruby/object:Gem::Dependency
28
+ name: rake
29
+ requirement: !ruby/object:Gem::Requirement
30
+ requirements:
31
+ - - "~>"
32
+ - !ruby/object:Gem::Version
33
+ version: '10.0'
34
+ type: :development
35
+ prerelease: false
36
+ version_requirements: !ruby/object:Gem::Requirement
37
+ requirements:
38
+ - - "~>"
39
+ - !ruby/object:Gem::Version
40
+ version: '10.0'
41
+ description: New Skeleton CSS Framework into Rails
42
+ email:
43
+ - mymengyu@gmail.com
44
+ executables: []
45
+ extensions: []
46
+ extra_rdoc_files: []
47
+ files:
48
+ - ".gitignore"
49
+ - ".rspec"
50
+ - ".travis.yml"
51
+ - Gemfile
52
+ - README.md
53
+ - Rakefile
54
+ - bin/console
55
+ - bin/setup
56
+ - lib/skeleton/framework/rails.rb
57
+ - lib/skeleton/framework/rails/version.rb
58
+ - skeleton-framework-rails.gemspec
59
+ - vendor/assets/stylesheets/skeleton.css
60
+ homepage: https://github.com/mymengyu/skeleton-framework-rails
61
+ licenses: []
62
+ metadata: {}
63
+ post_install_message:
64
+ rdoc_options: []
65
+ require_paths:
66
+ - lib
67
+ required_ruby_version: !ruby/object:Gem::Requirement
68
+ requirements:
69
+ - - ">="
70
+ - !ruby/object:Gem::Version
71
+ version: '0'
72
+ required_rubygems_version: !ruby/object:Gem::Requirement
73
+ requirements:
74
+ - - ">="
75
+ - !ruby/object:Gem::Version
76
+ version: '0'
77
+ requirements: []
78
+ rubyforge_project:
79
+ rubygems_version: 2.5.1
80
+ signing_key:
81
+ specification_version: 4
82
+ summary: Skeleton CSS Framework into Rails
83
+ test_files: []