base_css-rails 1.0

Sign up to get free protection for your applications and to get access to all the features.
data/LICENSE.txt ADDED
@@ -0,0 +1,22 @@
1
+ Copyright (c) 2012 Ricardo Cruz
2
+
3
+ MIT License
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining
6
+ a copy of this software and associated documentation files (the
7
+ "Software"), to deal in the Software without restriction, including
8
+ without limitation the rights to use, copy, modify, merge, publish,
9
+ distribute, sublicense, and/or sell copies of the Software, and to
10
+ permit persons to whom the Software is furnished to do so, subject to
11
+ the following conditions:
12
+
13
+ The above copyright notice and this permission notice shall be
14
+ included in all copies or substantial portions of the Software.
15
+
16
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
17
+ EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
18
+ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
19
+ NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
20
+ LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
21
+ OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
22
+ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
data/README.md ADDED
@@ -0,0 +1,72 @@
1
+ # Base CSS Framework
2
+
3
+ base_css-rails is a gem that adds the [Base Framework](http://matthewhartman.github.com/base/) to the
4
+ applicaton's asset pipeline
5
+
6
+ ## Installation
7
+
8
+ Add this line to your application's Gemfile:
9
+
10
+ gem 'base_css-rails'
11
+
12
+ And then execute:
13
+
14
+ $ bundle
15
+
16
+ Or install it yourself as:
17
+
18
+ $ gem install base_css-rails
19
+
20
+ ## Usage
21
+
22
+ Once installed on the Rails application, you just have to require the stylesheet on your application.css file
23
+
24
+ ```
25
+ *= require base_style
26
+ ```
27
+
28
+ Also you have to require the javascript file on you application.js file
29
+
30
+ ```
31
+ //= require base-script
32
+ ```
33
+
34
+ And you're ready to go, for more information on how to use the framework, check the [Documentation](http://matthewhartman.github.com/base/demo/)
35
+
36
+ ## Credits
37
+
38
+ Credits go to [matthewhartman](https://github.com/matthewhartman) for creating this cool and easy to use framework
39
+
40
+ Also, you can follow me on [twitter](http://twitter.com/rkrdo89)
41
+
42
+ ## License
43
+ Copyright (c) 2012 Ricardo Cruz
44
+
45
+ MIT License
46
+
47
+ Permission is hereby granted, free of charge, to any person obtaining
48
+ a copy of this software and associated documentation files (the
49
+ "Software"), to deal in the Software without restriction, including
50
+ without limitation the rights to use, copy, modify, merge, publish,
51
+ distribute, sublicense, and/or sell copies of the Software, and to
52
+ permit persons to whom the Software is furnished to do so, subject to
53
+ the following conditions:
54
+
55
+ The above copyright notice and this permission notice shall be
56
+ included in all copies or substantial portions of the Software.
57
+
58
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
59
+ EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
60
+ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
61
+ NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
62
+ LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
63
+ OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
64
+ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
65
+
66
+ ## Contributing
67
+
68
+ 1. Fork it
69
+ 2. Create your feature branch (`git checkout -b my-new-feature`)
70
+ 3. Commit your changes (`git commit -am 'Add some feature'`)
71
+ 4. Push to the branch (`git push origin my-new-feature`)
72
+ 5. Create new Pull Request
@@ -0,0 +1,5 @@
1
+ module BaseCss
2
+ module Rails
3
+ VERSION = "1.0"
4
+ end
5
+ end
@@ -0,0 +1,9 @@
1
+ require "base_css-rails/version"
2
+
3
+ module BaseCss
4
+ module Rails
5
+ # Your code goes here...
6
+ class Engine < ::Rails::Engine
7
+ end
8
+ end
9
+ end
@@ -0,0 +1,60 @@
1
+ /* ==========================================================
2
+ Base Default JavaScript
3
+ https://github.com/matthewhartman/base/blob/master/javascripts/default.js
4
+ -- Table of Contents --
5
+
6
+ 1. Plugins Combined (respond.js)
7
+ 2. Initiations / Default Functions
8
+ 2.0 Toggle JS Class
9
+ 2.1 Add Zebra Stripes for Tables
10
+ 2.2 Menu for Mobile Devices
11
+ 2.3 Jump to Anchored Sections
12
+ */
13
+
14
+ /* ==========================================================
15
+ 1. Plugins Combined (respond.js)
16
+ Respond.js v1.1.0: min/max-width media query polyfill. (c) Scott Jehl. MIT/GPLv2 Lic. j.mp/respondjs
17
+ */
18
+ (function(e){e.respond={};respond.update=function(){};respond.mediaQueriesSupported=e.matchMedia&&e.matchMedia("only all").matches;if(respond.mediaQueriesSupported){return}var w=e.document,s=w.documentElement,i=[],k=[],q=[],o={},h=30,f=w.getElementsByTagName("head")[0]||s,g=w.getElementsByTagName("base")[0],b=f.getElementsByTagName("link"),d=[],a=function(){var D=b,y=D.length,B=0,A,z,C,x;for(;B<y;B++){A=D[B],z=A.href,C=A.media,x=A.rel&&A.rel.toLowerCase()==="stylesheet";if(!!z&&x&&!o[z]){if(A.styleSheet&&A.styleSheet.rawCssText){m(A.styleSheet.rawCssText,z,C);o[z]=true}else{if((!/^([a-zA-Z:]*\/\/)/.test(z)&&!g)||z.replace(RegExp.$1,"").split("/")[0]===e.location.host){d.push({href:z,media:C})}}}}u()},u=function(){if(d.length){var x=d.shift();n(x.href,function(y){m(y,x.href,x.media);o[x.href]=true;u()})}},m=function(I,x,z){var G=I.match(/@media[^\{]+\{([^\{\}]*\{[^\}\{]*\})+/gi),J=G&&G.length||0,x=x.substring(0,x.lastIndexOf("/")),y=function(K){return K.replace(/(url\()['"]?([^\/\)'"][^:\)'"]+)['"]?(\))/g,"$1"+x+"$2$3")},A=!J&&z,D=0,C,E,F,B,H;if(x.length){x+="/"}if(A){J=1}for(;D<J;D++){C=0;if(A){E=z;k.push(y(I))}else{E=G[D].match(/@media *([^\{]+)\{([\S\s]+?)$/)&&RegExp.$1;k.push(RegExp.$2&&y(RegExp.$2))}B=E.split(",");H=B.length;for(;C<H;C++){F=B[C];i.push({media:F.split("(")[0].match(/(only\s+)?([a-zA-Z]+)\s?/)&&RegExp.$2||"all",rules:k.length-1,hasquery:F.indexOf("(")>-1,minw:F.match(/\(min\-width:[\s]*([\s]*[0-9\.]+)(px|em)[\s]*\)/)&&parseFloat(RegExp.$1)+(RegExp.$2||""),maxw:F.match(/\(max\-width:[\s]*([\s]*[0-9\.]+)(px|em)[\s]*\)/)&&parseFloat(RegExp.$1)+(RegExp.$2||"")})}}j()},l,r,v=function(){var z,A=w.createElement("div"),x=w.body,y=false;A.style.cssText="position:absolute;font-size:1em;width:1em";if(!x){x=y=w.createElement("body");x.style.background="none"}x.appendChild(A);s.insertBefore(x,s.firstChild);z=A.offsetWidth;if(y){s.removeChild(x)}else{x.removeChild(A)}z=p=parseFloat(z);return z},p,j=function(I){var x="clientWidth",B=s[x],H=w.compatMode==="CSS1Compat"&&B||w.body[x]||B,D={},G=b[b.length-1],z=(new Date()).getTime();if(I&&l&&z-l<h){clearTimeout(r);r=setTimeout(j,h);return}else{l=z}for(var E in i){var K=i[E],C=K.minw,J=K.maxw,A=C===null,L=J===null,y="em";if(!!C){C=parseFloat(C)*(C.indexOf(y)>-1?(p||v()):1)}if(!!J){J=parseFloat(J)*(J.indexOf(y)>-1?(p||v()):1)}if(!K.hasquery||(!A||!L)&&(A||H>=C)&&(L||H<=J)){if(!D[K.media]){D[K.media]=[]}D[K.media].push(k[K.rules])}}for(var E in q){if(q[E]&&q[E].parentNode===f){f.removeChild(q[E])}}for(var E in D){var M=w.createElement("style"),F=D[E].join("\n");M.type="text/css";M.media=E;f.insertBefore(M,G.nextSibling);if(M.styleSheet){M.styleSheet.cssText=F}else{M.appendChild(w.createTextNode(F))}q.push(M)}},n=function(x,z){var y=c();if(!y){return}y.open("GET",x,true);y.onreadystatechange=function(){if(y.readyState!=4||y.status!=200&&y.status!=304){return}z(y.responseText)};if(y.readyState==4){return}y.send(null)},c=(function(){var x=false;try{x=new XMLHttpRequest()}catch(y){x=new ActiveXObject("Microsoft.XMLHTTP")}return function(){return x}})();a();respond.update=a;function t(){j(true)}if(e.addEventListener){e.addEventListener("resize",t,false)}else{if(e.attachEvent){e.attachEvent("onresize",t)}}})(this);
19
+
20
+
21
+ /* ==========================================================
22
+ 2. Initiations / Default Functions
23
+ */
24
+
25
+ $(document).ready(function(){
26
+
27
+ // 2.0 Toggle JS Class
28
+ $("html").removeClass('no-js').addClass('js');
29
+
30
+ // 2.1 Add Zebra Stripes for Tables
31
+ $('table tbody tr:odd, table tbody tr:odd').addClass('odd');
32
+
33
+ // 2.2 Menu for Mobile Devices
34
+ // If JS is enabled, attach the 'hide' class (only affects mobiles - special media query class)
35
+ $('.navigation').prepend('<a href="#" class="nav-toggle nodesktop notablet nomobile">Navigation <span class="arrow">+</span></a>');
36
+ $(".nav-toggle").removeClass('nomobile').addClass('showmobile');
37
+ $('.menu').addClass("nomobile");
38
+
39
+ // When the navigation button is clicked, toggle menu
40
+ $(".nav-toggle").click(function() {
41
+ if ( $('.menu:visible').length < 1 ) {
42
+ $('.menu').stop(true, true).slideDown(200, function() {
43
+ $('.nav-toggle .arrow').html('-');
44
+ $(this).removeClass('nomobile').removeAttr('style');
45
+ });
46
+ } else {
47
+ $('.menu').stop(true, true).slideUp(200, function() {
48
+ $('.nav-toggle .arrow').html('+');
49
+ $(this).addClass('nomobile').removeAttr('style');
50
+ });
51
+ };
52
+ return false;
53
+ });
54
+
55
+
56
+
57
+
58
+
59
+
60
+ }); // end document ready
@@ -0,0 +1,601 @@
1
+ /* ==========================================================================
2
+
3
+ Base Stylesheet - http://matthewhartman.github.com/base/
4
+ Author: Matthew Hartman - http://www.matthewhartman.com.au/
5
+ Version: 1.1 - Last Updated: 4th December, 2012
6
+
7
+ ========================================================================== */
8
+ /* ==========================================================================
9
+ /* -- Micro Clearfix, Resets and Common Classes
10
+ ========================================================================== */
11
+ /* Micro Clearfix */
12
+ .clear:before,
13
+ .clear:after {
14
+ content: "";
15
+ display: table;
16
+ }
17
+ .clear:after {
18
+ clear: both;
19
+ }
20
+ .clear {
21
+ zoom: 1;
22
+ }
23
+ .section:before,
24
+ .section:after {
25
+ content: "";
26
+ display: table;
27
+ }
28
+ .section:after {
29
+ clear: both;
30
+ }
31
+ .section {
32
+ zoom: 1;
33
+ }
34
+ /* General Resets */
35
+ /* Start font size at 100% */
36
+ html {
37
+ font-size: 100%;
38
+ }
39
+ /* Make all form fonts consistent */
40
+ button,
41
+ input,
42
+ select,
43
+ textarea {
44
+ font-family: sans-serif;
45
+ }
46
+ /* Remove all default borders */
47
+ form,
48
+ fieldset,
49
+ a img {
50
+ border: 0;
51
+ }
52
+ /* Common Classes */
53
+ .left {
54
+ float: left;
55
+ }
56
+ .right {
57
+ float: right;
58
+ }
59
+ .nofloat {
60
+ float: none;
61
+ }
62
+ .block {
63
+ display: block;
64
+ }
65
+ .inline-block {
66
+ display: inline-block;
67
+ }
68
+ .inline {
69
+ display: inline;
70
+ }
71
+ .visuallyhidden {
72
+ border: 0;
73
+ clip: rect(0 0 0 0);
74
+ height: 1px;
75
+ overflow: hidden;
76
+ padding: 0;
77
+ position: absolute;
78
+ width: 1px;
79
+ left: -9999em;
80
+ }
81
+ .visuallyvisible {
82
+ clip: auto;
83
+ width: auto;
84
+ height: auto;
85
+ overflow: visible;
86
+ left: 0;
87
+ }
88
+ .strong {
89
+ font-weight: bold;
90
+ }
91
+ .alignleft {
92
+ text-align: left;
93
+ }
94
+ .alignright {
95
+ text-align: right;
96
+ }
97
+ .aligncenter {
98
+ text-align: center;
99
+ }
100
+ .center {
101
+ margin-left: auto;
102
+ margin-right: auto;
103
+ }
104
+ .nolist {
105
+ list-style: none;
106
+ }
107
+ .nopadding {
108
+ padding: 0;
109
+ }
110
+ .nomargin {
111
+ margin: 0;
112
+ }
113
+ .none,
114
+ .nodesktop {
115
+ display: none;
116
+ }
117
+ /* ==========================================================================
118
+ /* 1.0 - Document Setup (body, links, headings, code, tables, forms etc)
119
+ ========================================================================== */
120
+ /* Body */
121
+ body {
122
+ font-family: arial, helvetica, clean, sans-serif;
123
+ background: #ffffff;
124
+ color: #111111;
125
+ margin: 0;
126
+ font-size: 87.5%;
127
+ -webkit-text-size-adjust: 100%;
128
+ -ms-text-size-adjust: 100%;
129
+ }
130
+ /* Links */
131
+ a {
132
+ color: #ff3300;
133
+ text-decoration: underline;
134
+ }
135
+ a:visited {
136
+ color: #ff3300;
137
+ }
138
+ a:hover {
139
+ text-decoration: none;
140
+ }
141
+ a:active {
142
+ color: #333333;
143
+ }
144
+ /* 1.1 Headings - h1, h2, h3, h4, h5, h6 & other (if any)
145
+ ========================================================================== */
146
+ h1,
147
+ h2,
148
+ h3,
149
+ h4,
150
+ h5,
151
+ h6 {
152
+ margin: 0;
153
+ }
154
+ h1 {
155
+ font-size: 2.857142857142857em;
156
+ margin-bottom: 10px;
157
+ }
158
+ h2 {
159
+ font-size: 1.4285714285714286em;
160
+ margin-bottom: 8px;
161
+ }
162
+ h3 {
163
+ font-size: 1.8571428571428572em;
164
+ margin-bottom: 6px;
165
+ }
166
+ h4 {
167
+ font-size: 1.4285714285714286em;
168
+ margin-bottom: 4px;
169
+ }
170
+ /* 1.2 Paragraphs, block quotes, code, pre, etc
171
+ ========================================================================== */
172
+ p {
173
+ margin: 0 0 1em 0;
174
+ }
175
+ abbr {
176
+ border-bottom: 1px dotted #000;
177
+ cursor: help;
178
+ }
179
+ address {
180
+ font-style: italic;
181
+ line-height: 1.384em;
182
+ }
183
+ small {
184
+ font-size: 67.5%;
185
+ }
186
+ /* Block Quotes */
187
+ blockquote,
188
+ q {
189
+ quotes: none;
190
+ border-left: 7px solid #cccccc;
191
+ font-style: italic;
192
+ padding-left: 1em;
193
+ margin: 1em;
194
+ }
195
+ blockquote:before,
196
+ blockquote:after,
197
+ q:before,
198
+ q:after {
199
+ content: '';
200
+ }
201
+ /* Code Blocks & Pre */
202
+ code,
203
+ pre {
204
+ padding: 0 3px 2px;
205
+ font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
206
+ font-size: 12px;
207
+ color: #333;
208
+ border-radius: 3px;
209
+ }
210
+ code {
211
+ padding: 2px 4px;
212
+ color: #d14;
213
+ background-color: #f7f7f9;
214
+ border: 1px solid #e1e1e8;
215
+ }
216
+ pre {
217
+ display: block;
218
+ padding: 8.5px;
219
+ margin: 0 0 9px;
220
+ font-size: 12.025px;
221
+ line-height: 18px;
222
+ word-break: break-all;
223
+ word-wrap: break-word;
224
+ white-space: pre;
225
+ white-space: pre-wrap;
226
+ background: #f5f5f5;
227
+ border: 1px solid #ccc;
228
+ border-radius: 4px;
229
+ }
230
+ pre code {
231
+ padding: 0;
232
+ color: inherit;
233
+ background-color: transparent;
234
+ border: 0;
235
+ }
236
+ .pre-scrollable {
237
+ max-height: 340px;
238
+ overflow-y: scroll;
239
+ }
240
+ hr {
241
+ border: 0;
242
+ background: none;
243
+ outline: 0;
244
+ height: 1px;
245
+ background-color: #dddddd;
246
+ margin: 2em 0;
247
+ }
248
+ /* 1.3 Tables
249
+ ========================================================================== */
250
+ table {
251
+ width: 100%;
252
+ border: 1px solid #dddddd;
253
+ border-collapse: collapse;
254
+ border-left: 0;
255
+ background-color: #fff;
256
+ border-spacing: 0;
257
+ }
258
+ table th,
259
+ table td {
260
+ padding: 8px;
261
+ line-height: 18px;
262
+ text-align: left;
263
+ vertical-align: top;
264
+ border-top: 1px solid #dddddd;
265
+ border-left: 1px solid #dddddd;
266
+ }
267
+ table thead th {
268
+ vertical-align: bottom;
269
+ font-weight: bold;
270
+ background: #ffffff;
271
+ color: #000000;
272
+ border-left: 1px solid #dddddd;
273
+ }
274
+ table caption + thead tr:first-child th,
275
+ table caption + thead tr:first-child td,
276
+ table colgroup + thead tr:first-child th,
277
+ table colgroup + thead tr:first-child td,
278
+ table thead:first-child tr:first-child th,
279
+ table thead:first-child tr:first-child td {
280
+ border-top: 0;
281
+ }
282
+ table tbody tr:nth-child(odd) td,
283
+ table tbody tr:nth-child(odd) th {
284
+ background-color: #f1f1f1;
285
+ }
286
+ table tbody tr:nth-child(even) td,
287
+ table tbody tr:nth-child(even) th {
288
+ background-color: #ffffff;
289
+ }
290
+ table tbody .odd td,
291
+ table tbody .odd td {
292
+ background-color: #f1f1f1;
293
+ }
294
+ table tfoot td {
295
+ background: #eeeeee;
296
+ font-weight: bold;
297
+ }
298
+ table caption {
299
+ padding: .5em;
300
+ font-style: italic;
301
+ background-color: #eeeeee;
302
+ border: 1px solid #cccccc;
303
+ border-bottom: 0;
304
+ font-weight: bold;
305
+ }
306
+ /* 1.4 Lists
307
+ ========================================================================== */
308
+ ul,
309
+ ul ul {
310
+ list-style: disc;
311
+ margin: .5em;
312
+ }
313
+ ol,
314
+ ol ol {
315
+ list-style: decimal;
316
+ margin: .5em;
317
+ }
318
+ dl:before,
319
+ dl:after {
320
+ content: "";
321
+ display: table;
322
+ }
323
+ dl:after {
324
+ clear: both;
325
+ }
326
+ dl {
327
+ zoom: 1;
328
+ }
329
+ dl {
330
+ width: 100%;
331
+ }
332
+ dl dt {
333
+ width: 28%;
334
+ float: left;
335
+ clear: left;
336
+ padding: 1%;
337
+ margin: 0 0 .5em;
338
+ font-weight: bold;
339
+ }
340
+ dl dd {
341
+ width: 68%;
342
+ float: left;
343
+ padding: 1%;
344
+ margin: 0 0 .5em;
345
+ }
346
+ /* 1.5 Forms, Labels and Inputs
347
+ ========================================================================== */
348
+ legend {
349
+ font-size: 1.4285714285714286em;
350
+ font-family: "Georgia", "Times New Roman", sans-serif;
351
+ font-weight: bold;
352
+ display: block;
353
+ width: 100%;
354
+ padding-bottom: 1em;
355
+ }
356
+ .field {
357
+ padding: 10px 0;
358
+ }
359
+ .field label {
360
+ display: inline-block;
361
+ min-width: 20%;
362
+ }
363
+ .field ul {
364
+ list-style: none;
365
+ margin: 0;
366
+ padding: 0;
367
+ }
368
+ /* Inputs (Text, Search, Email, etc) */
369
+ input[type=text],
370
+ input[type=email],
371
+ input[type=search],
372
+ input[type=tel],
373
+ input[type=file] {
374
+ border-radius: 0;
375
+ outline: 0;
376
+ border: 1px solid #ccc;
377
+ padding: .5%;
378
+ height: 18px;
379
+ width: 30%;
380
+ display: inline-block;
381
+ vertical-align: middle;
382
+ -webkit-appearance: none;
383
+ /* Remove Default Browser Behaviour for Safari */
384
+
385
+ -moz-appearance: none;
386
+ /* Remove Default Browser Behaviour for Firefox */
387
+
388
+ }
389
+ input[type=file] {
390
+ border: 0;
391
+ height: 20px;
392
+ }
393
+ input[type=button]::-moz-focus-inner,
394
+ input[type=submit]::-moz-focus-inner {
395
+ padding: 0;
396
+ border: 0;
397
+ }
398
+ input[type="search"]::-webkit-search-cancel-button {
399
+ -webkit-appearance: none;
400
+ }
401
+ input[type=submit],
402
+ input[type=button] {
403
+ line-height: normal;
404
+ cursor: pointer;
405
+ border-radius: 0;
406
+ -webkit-appearance: none;
407
+ /* Remove Default Browser Behaviour for Safari */
408
+
409
+ -moz-appearance: none;
410
+ /* Remove Default Browser Behaviour for Firefox */
411
+
412
+ }
413
+ textarea {
414
+ vertical-align: top;
415
+ display: inline-block;
416
+ border: 1px solid #cccccc;
417
+ min-height: 80px;
418
+ padding: .5%;
419
+ width: 30%;
420
+ }
421
+ select {
422
+ font-size: 14px;
423
+ outline: 0;
424
+ height: 34px;
425
+ border: 1px solid #cccccc;
426
+ padding: .5%;
427
+ width: 31%;
428
+ -webkit-border-radius: 0 3px 3px 0;
429
+ -moz-border-radius: 0 3px 3px 0;
430
+ }
431
+ select:focus {
432
+ border: 1px solid #cccccc;
433
+ outline: 0;
434
+ }
435
+ select[multiple] {
436
+ min-height: 100px;
437
+ vertical-align: top;
438
+ border: 1px solid #ccc;
439
+ }
440
+ select:focus {
441
+ border: 1px solid #999999;
442
+ }
443
+ /* ==========================================================================
444
+ /* 2.0 - Grid Layout (Responsive)
445
+ ========================================================================== */
446
+ /* Sections & Content Blocks */
447
+ .section {
448
+ position: relative;
449
+ }
450
+ .container {
451
+ max-width: 960px;
452
+ margin: 0 auto;
453
+ padding-left: 10px;
454
+ padding-right: 10px;
455
+ }
456
+ .container-full {
457
+ max-width: 980px;
458
+ margin: 0 auto;
459
+ }
460
+ /* Fluid Grid */
461
+ .col {
462
+ margin-left: 2%;
463
+ float: left;
464
+ }
465
+ .col:first-child {
466
+ margin-left: 0;
467
+ }
468
+ /* Columns */
469
+ .one {
470
+ width: 6.333%;
471
+ }
472
+ .two {
473
+ width: 14.667%;
474
+ }
475
+ .three {
476
+ width: 23.0%;
477
+ }
478
+ .four {
479
+ width: 31.333%;
480
+ }
481
+ .five {
482
+ width: 39.667%;
483
+ }
484
+ .six {
485
+ width: 48.0%;
486
+ }
487
+ .seven {
488
+ width: 56.333%;
489
+ }
490
+ .eight {
491
+ width: 64.667%;
492
+ }
493
+ .nine {
494
+ width: 73.0%;
495
+ }
496
+ .ten {
497
+ width: 81.333%;
498
+ }
499
+ .eleven {
500
+ width: 89.667%;
501
+ }
502
+ .twelve {
503
+ width: 100%;
504
+ }
505
+ .half {
506
+ width: 48.0%;
507
+ }
508
+ .one-third {
509
+ width: 31.333%;
510
+ }
511
+ /* ==========================================================================
512
+ /* -- Tablet Devices (Layout, Modifications, etc)
513
+ ========================================================================== */
514
+ @media only screen and (min-width: 720px) and (max-width: 959px) {
515
+ html body {
516
+ max-width: 959px;
517
+ padding: 0;
518
+ margin: 0;
519
+ }
520
+ .container {
521
+ width: 700px;
522
+ }
523
+ .notablet {
524
+ display: none;
525
+ }
526
+ .showtablet {
527
+ display: block;
528
+ }
529
+ }
530
+ /* End Tablet Media Query */
531
+ /* ==========================================================================
532
+ /* -- Mobile Devices (Layout, Modifications, etc)
533
+ ========================================================================== */
534
+ @media only screen and (max-width: 719px) {
535
+ html body {
536
+ max-width: 100%;
537
+ padding: 0;
538
+ margin: 0;
539
+ }
540
+ .one,
541
+ .two,
542
+ .three,
543
+ .four,
544
+ .five,
545
+ .six,
546
+ .seven,
547
+ .eight,
548
+ .nine,
549
+ .ten,
550
+ .eleven,
551
+ .twelve {
552
+ width: 100%;
553
+ margin-left: 0;
554
+ margin-right: 0;
555
+ float: none;
556
+ }
557
+ .container {
558
+ padding-left: 20px;
559
+ padding-right: 20px;
560
+ }
561
+ .navigation a:active,
562
+ .navigation a:visited {
563
+ color: #ffffff;
564
+ }
565
+ .navigation a:hover {
566
+ background-color: #333333;
567
+ }
568
+ .menu {
569
+ list-style: none;
570
+ padding: 0;
571
+ margin: 0;
572
+ }
573
+ .nav-toggle,
574
+ .menu a {
575
+ display: block;
576
+ background-color: #111111;
577
+ text-align: center;
578
+ color: #ffffff;
579
+ padding: 10px;
580
+ margin-top: 1px;
581
+ text-decoration: none;
582
+ }
583
+ .nomobile {
584
+ display: none;
585
+ }
586
+ .showmobile {
587
+ display: block;
588
+ }
589
+ }
590
+ /* End Mobile Media Query */
591
+ /* ==========================================================================
592
+ /* -- Print Layout
593
+ ========================================================================== */
594
+ @media print {
595
+ body {
596
+ font-family: serif;
597
+ /* Serif is easier to read offscreen */
598
+ margin: 0.5cm;
599
+ }
600
+ }
601
+ /* End Print Media Query */
metadata ADDED
@@ -0,0 +1,68 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: base_css-rails
3
+ version: !ruby/object:Gem::Version
4
+ version: '1.0'
5
+ prerelease:
6
+ platform: ruby
7
+ authors:
8
+ - Ricardo Cruz
9
+ autorequire:
10
+ bindir: bin
11
+ cert_chain: []
12
+ date: 2012-12-22 00:00:00.000000000 Z
13
+ dependencies:
14
+ - !ruby/object:Gem::Dependency
15
+ name: railties
16
+ requirement: !ruby/object:Gem::Requirement
17
+ none: false
18
+ requirements:
19
+ - - ~>
20
+ - !ruby/object:Gem::Version
21
+ version: '3.1'
22
+ type: :runtime
23
+ prerelease: false
24
+ version_requirements: !ruby/object:Gem::Requirement
25
+ none: false
26
+ requirements:
27
+ - - ~>
28
+ - !ruby/object:Gem::Version
29
+ version: '3.1'
30
+ description: This gem adds the Base CSS framework to your Rails application's asset
31
+ pipeline
32
+ email:
33
+ - ricardocruz.a89@gmail.com
34
+ executables: []
35
+ extensions: []
36
+ extra_rdoc_files: []
37
+ files:
38
+ - lib/base_css-rails/version.rb
39
+ - lib/base_css-rails.rb
40
+ - vendor/assets/javascripts/base-script.js
41
+ - vendor/assets/stylesheets/base-style.css
42
+ - LICENSE.txt
43
+ - README.md
44
+ homepage: https://github.com/rkrdo/base_css-rails
45
+ licenses: []
46
+ post_install_message:
47
+ rdoc_options: []
48
+ require_paths:
49
+ - lib
50
+ required_ruby_version: !ruby/object:Gem::Requirement
51
+ none: false
52
+ requirements:
53
+ - - ! '>='
54
+ - !ruby/object:Gem::Version
55
+ version: '0'
56
+ required_rubygems_version: !ruby/object:Gem::Requirement
57
+ none: false
58
+ requirements:
59
+ - - ! '>='
60
+ - !ruby/object:Gem::Version
61
+ version: '0'
62
+ requirements: []
63
+ rubyforge_project:
64
+ rubygems_version: 1.8.24
65
+ signing_key:
66
+ specification_version: 3
67
+ summary: Use Base CSS framework with Rails 3.1
68
+ test_files: []