anjlab-bootstrap-rails 0.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/.gitignore +17 -0
- data/Gemfile +4 -0
- data/README.md +64 -0
- data/Rakefile +31 -0
- data/bootstrap-rails.gemspec +23 -0
- data/lib/bootstrap-rails.rb +11 -0
- data/lib/bootstrap-rails/engine.rb +6 -0
- data/lib/bootstrap-rails/railtie.rb +5 -0
- data/lib/bootstrap-rails/version.rb +5 -0
- data/vendor/assets/javascripts/bootstrap-alerts.js +104 -0
- data/vendor/assets/javascripts/bootstrap-dropdown.js +50 -0
- data/vendor/assets/javascripts/bootstrap-modal.js +238 -0
- data/vendor/assets/javascripts/bootstrap-popover.js +77 -0
- data/vendor/assets/javascripts/bootstrap-scrollspy.js +105 -0
- data/vendor/assets/javascripts/bootstrap-tabs.js +62 -0
- data/vendor/assets/javascripts/bootstrap-twipsy.js +307 -0
- data/vendor/assets/javascripts/bootstrap.js +8 -0
- data/vendor/assets/stylesheets/bootstrap.scss +26 -0
- data/vendor/assets/stylesheets/forms.scss +465 -0
- data/vendor/assets/stylesheets/mixins.scss +224 -0
- data/vendor/assets/stylesheets/patterns.scss +1002 -0
- data/vendor/assets/stylesheets/reset.scss +141 -0
- data/vendor/assets/stylesheets/scaffolding.scss +108 -0
- data/vendor/assets/stylesheets/tables.scss +171 -0
- data/vendor/assets/stylesheets/type.scss +187 -0
- data/vendor/assets/stylesheets/variables.scss +60 -0
- metadata +116 -0
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* Bootstrap v1.3.0
|
|
3
|
+
*
|
|
4
|
+
* Copyright 2011 Twitter, Inc
|
|
5
|
+
* Licensed under the Apache License v2.0
|
|
6
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
7
|
+
*
|
|
8
|
+
* Designed and built with all the love in the world @twitter by @mdo and @fat.
|
|
9
|
+
* Date: 2011-09-19 13:30:56 +0400
|
|
10
|
+
*/
|
|
11
|
+
|
|
12
|
+
// CSS Reset
|
|
13
|
+
@import "reset.scss";
|
|
14
|
+
|
|
15
|
+
// Core variables and mixins
|
|
16
|
+
@import "variables.scss"; // Modify this for custom colors, font-sizes, etc
|
|
17
|
+
@import "mixins.scss";
|
|
18
|
+
|
|
19
|
+
// Grid system and page structure
|
|
20
|
+
@import "scaffolding.scss";
|
|
21
|
+
|
|
22
|
+
// Styled patterns and elements
|
|
23
|
+
@import "type.scss";
|
|
24
|
+
@import "forms.scss";
|
|
25
|
+
@import "tables.scss";
|
|
26
|
+
@import "patterns.scss";
|
|
@@ -0,0 +1,465 @@
|
|
|
1
|
+
/* Forms.less
|
|
2
|
+
* Base styles for various input types, form layouts, and states
|
|
3
|
+
* ------------------------------------------------------------- */
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
// FORM STYLES
|
|
7
|
+
// -----------
|
|
8
|
+
|
|
9
|
+
form {
|
|
10
|
+
margin-bottom: $baseline;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
// Groups of fields with labels on top (legends)
|
|
14
|
+
fieldset {
|
|
15
|
+
margin-bottom: $baseline;
|
|
16
|
+
padding-top: $baseline;
|
|
17
|
+
legend {
|
|
18
|
+
display: block;
|
|
19
|
+
padding-left: 150px;
|
|
20
|
+
font-size: $basefont * 1.5;
|
|
21
|
+
line-height: 1;
|
|
22
|
+
color: $grayDark;
|
|
23
|
+
*padding: 0 0 5px 145px; /* IE6-7 */
|
|
24
|
+
*line-height: 1.5; /* IE6-7 */
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
// Parent element that clears floats and wraps labels and fields together
|
|
29
|
+
form .clearfix {
|
|
30
|
+
margin-bottom: $baseline;
|
|
31
|
+
@include clearfix;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
// Set font for forms
|
|
35
|
+
label,
|
|
36
|
+
input,
|
|
37
|
+
select,
|
|
38
|
+
textarea {
|
|
39
|
+
@include font-sans-serif(normal,13px,normal);
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
// Float labels left
|
|
43
|
+
label {
|
|
44
|
+
padding-top: 6px;
|
|
45
|
+
font-size: $basefont;
|
|
46
|
+
line-height: $baseline;
|
|
47
|
+
float: left;
|
|
48
|
+
width: 130px;
|
|
49
|
+
text-align: right;
|
|
50
|
+
color: $grayDark;
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
// Shift over the inside div to align all label's relevant content
|
|
54
|
+
form .input {
|
|
55
|
+
margin-left: 150px;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
// Checkboxs and radio buttons
|
|
59
|
+
input[type=checkbox],
|
|
60
|
+
input[type=radio] {
|
|
61
|
+
cursor: pointer;
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
// Inputs, Textareas, Selects
|
|
65
|
+
input,
|
|
66
|
+
textarea,
|
|
67
|
+
select,
|
|
68
|
+
.uneditable-input {
|
|
69
|
+
display: inline-block;
|
|
70
|
+
width: 210px;
|
|
71
|
+
height: $baseline;
|
|
72
|
+
padding: 4px;
|
|
73
|
+
font-size: $basefont;
|
|
74
|
+
line-height: $baseline;
|
|
75
|
+
color: $gray;
|
|
76
|
+
border: 1px solid #ccc;
|
|
77
|
+
@include border-radius(3px);
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
/* mini reset for non-html5 file types */
|
|
81
|
+
input[type=checkbox],
|
|
82
|
+
input[type=radio] {
|
|
83
|
+
width: auto;
|
|
84
|
+
height: auto;
|
|
85
|
+
padding: 0;
|
|
86
|
+
margin: 3px 0;
|
|
87
|
+
*margin-top: 0; /* IE6-7 */
|
|
88
|
+
line-height: normal;
|
|
89
|
+
border: none;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
input[type=file] {
|
|
93
|
+
background-color: $white;
|
|
94
|
+
padding: initial;
|
|
95
|
+
border: initial;
|
|
96
|
+
line-height: initial;
|
|
97
|
+
@include box-shadow(none);
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
input[type=button],
|
|
101
|
+
input[type=reset],
|
|
102
|
+
input[type=submit] {
|
|
103
|
+
width: auto;
|
|
104
|
+
height: auto;
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
select,
|
|
108
|
+
input[type=file] {
|
|
109
|
+
height: $baseline * 1.5; // In IE7, the height of the select element cannot be changed by height, only font-size
|
|
110
|
+
line-height: $baseline * 1.5;
|
|
111
|
+
*margin-top: 4px; /* For IE7, add top margin to align select with labels */
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
// Make multiple select elements height not fixed
|
|
115
|
+
select[multiple] {
|
|
116
|
+
height: inherit;
|
|
117
|
+
}
|
|
118
|
+
|
|
119
|
+
textarea {
|
|
120
|
+
height: auto;
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
// For text that needs to appear as an input but should not be an input
|
|
124
|
+
.uneditable-input {
|
|
125
|
+
background-color: $white;
|
|
126
|
+
display: block;
|
|
127
|
+
border-color: #eee;
|
|
128
|
+
@include box-shadow(inset 0 1px 2px rgba(0,0,0,.025));
|
|
129
|
+
cursor: not-allowed;
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
// Placeholder text gets special styles; can't be bundled together though for some reason
|
|
133
|
+
:-moz-placeholder {
|
|
134
|
+
color: $grayLight;
|
|
135
|
+
}
|
|
136
|
+
::-webkit-input-placeholder {
|
|
137
|
+
color: $grayLight;
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
// Focus states
|
|
141
|
+
input,
|
|
142
|
+
textarea {
|
|
143
|
+
$transition: border linear .2s, box-shadow linear .2s;
|
|
144
|
+
@include transition($transition);
|
|
145
|
+
@include box-shadow(inset 0 1px 3px rgba(0,0,0,.1));
|
|
146
|
+
}
|
|
147
|
+
input:focus,
|
|
148
|
+
textarea:focus {
|
|
149
|
+
outline: 0;
|
|
150
|
+
border-color: rgba(82,168,236,.8);
|
|
151
|
+
$shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6);
|
|
152
|
+
@include box-shadow($shadow);
|
|
153
|
+
}
|
|
154
|
+
input[type=file]:focus,
|
|
155
|
+
input[type=checkbox]:focus,
|
|
156
|
+
select:focus {
|
|
157
|
+
@include box-shadow(none); // override for file inputs
|
|
158
|
+
outline: 1px dotted #666; // Selet elements don't get box-shadow styles, so instead we do outline
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
// Error styles
|
|
162
|
+
form div.clearfix.error {
|
|
163
|
+
background: lighten($red, 57%);
|
|
164
|
+
padding: 10px 0;
|
|
165
|
+
margin: -10px 0 10px;
|
|
166
|
+
@include border-radius(4px);
|
|
167
|
+
$error-text: desaturate(lighten($red, 25%), 25%);
|
|
168
|
+
> label,
|
|
169
|
+
span.help-inline,
|
|
170
|
+
span.help-block {
|
|
171
|
+
color: $red;
|
|
172
|
+
}
|
|
173
|
+
input,
|
|
174
|
+
textarea {
|
|
175
|
+
border-color: $error-text;
|
|
176
|
+
@include box-shadow(0 0 3px rgba(171,41,32,.25));
|
|
177
|
+
&:focus {
|
|
178
|
+
border-color: darken($error-text, 10%);
|
|
179
|
+
@include box-shadow(0 0 6px rgba(171,41,32,.5));
|
|
180
|
+
}
|
|
181
|
+
}
|
|
182
|
+
.input-prepend,
|
|
183
|
+
.input-append {
|
|
184
|
+
span.add-on {
|
|
185
|
+
background: lighten($red, 50%);
|
|
186
|
+
border-color: $error-text;
|
|
187
|
+
color: darken($error-text, 10%);
|
|
188
|
+
}
|
|
189
|
+
}
|
|
190
|
+
}
|
|
191
|
+
|
|
192
|
+
// Form element sizes
|
|
193
|
+
// TODO v2: remove duplication here and just stick to .input-[size] in light of adding .spanN sizes
|
|
194
|
+
.input-mini,
|
|
195
|
+
input.mini,
|
|
196
|
+
textarea.mini,
|
|
197
|
+
select.mini {
|
|
198
|
+
width: 60px;
|
|
199
|
+
}
|
|
200
|
+
.input-small,
|
|
201
|
+
input.small,
|
|
202
|
+
textarea.small,
|
|
203
|
+
select.small {
|
|
204
|
+
width: 90px;
|
|
205
|
+
}
|
|
206
|
+
.input-medium,
|
|
207
|
+
input.medium,
|
|
208
|
+
textarea.medium,
|
|
209
|
+
select.medium {
|
|
210
|
+
width: 150px;
|
|
211
|
+
}
|
|
212
|
+
.input-large,
|
|
213
|
+
input.large,
|
|
214
|
+
textarea.large,
|
|
215
|
+
select.large {
|
|
216
|
+
width: 210px;
|
|
217
|
+
}
|
|
218
|
+
.input-xlarge,
|
|
219
|
+
input.xlarge,
|
|
220
|
+
textarea.xlarge,
|
|
221
|
+
select.xlarge {
|
|
222
|
+
width: 270px;
|
|
223
|
+
}
|
|
224
|
+
.input-xxlarge,
|
|
225
|
+
input.xxlarge,
|
|
226
|
+
textarea.xxlarge,
|
|
227
|
+
select.xxlarge {
|
|
228
|
+
width: 530px;
|
|
229
|
+
}
|
|
230
|
+
textarea.xxlarge {
|
|
231
|
+
overflow-y: auto;
|
|
232
|
+
}
|
|
233
|
+
|
|
234
|
+
// Grid style input sizes
|
|
235
|
+
// This is a duplication of the main grid .columns() mixin, but subtracts 10px to account for input padding and border
|
|
236
|
+
@mixin form-columns($columnSpan: 1) {
|
|
237
|
+
display: inline-block;
|
|
238
|
+
float: none;
|
|
239
|
+
width: (($gridColumnWidth - 10) * $columnSpan) + (($gridColumnWidth - 10) * ($columnSpan - 1));
|
|
240
|
+
margin-left: 0;
|
|
241
|
+
}
|
|
242
|
+
input,
|
|
243
|
+
textarea,
|
|
244
|
+
select {
|
|
245
|
+
// Default columns
|
|
246
|
+
&.span1 { @include form-columns(1); }
|
|
247
|
+
&.span2 { @include form-columns(2); }
|
|
248
|
+
&.span3 { @include form-columns(3); }
|
|
249
|
+
&.span4 { @include form-columns(4); }
|
|
250
|
+
&.span5 { @include form-columns(5); }
|
|
251
|
+
&.span6 { @include form-columns(6); }
|
|
252
|
+
&.span7 { @include form-columns(7); }
|
|
253
|
+
&.span8 { @include form-columns(8); }
|
|
254
|
+
&.span9 { @include form-columns(9); }
|
|
255
|
+
&.span10 { @include form-columns(10); }
|
|
256
|
+
&.span11 { @include form-columns(11); }
|
|
257
|
+
&.span12 { @include form-columns(12); }
|
|
258
|
+
&.span13 { @include form-columns(13); }
|
|
259
|
+
&.span14 { @include form-columns(14); }
|
|
260
|
+
&.span15 { @include form-columns(15); }
|
|
261
|
+
&.span16 { @include form-columns(16); }
|
|
262
|
+
}
|
|
263
|
+
|
|
264
|
+
// Disabled and read-only inputs
|
|
265
|
+
input[disabled],
|
|
266
|
+
select[disabled],
|
|
267
|
+
textarea[disabled],
|
|
268
|
+
input[readonly],
|
|
269
|
+
select[readonly],
|
|
270
|
+
textarea[readonly] {
|
|
271
|
+
background-color: #f5f5f5;
|
|
272
|
+
border-color: #ddd;
|
|
273
|
+
cursor: not-allowed;
|
|
274
|
+
}
|
|
275
|
+
|
|
276
|
+
// Actions (the buttons)
|
|
277
|
+
.actions {
|
|
278
|
+
background: #f5f5f5;
|
|
279
|
+
margin-top: $baseline;
|
|
280
|
+
margin-bottom: $baseline;
|
|
281
|
+
padding: ($baseline - 1) 20px $baseline 150px;
|
|
282
|
+
border-top: 1px solid #ddd;
|
|
283
|
+
@include border-radius(0 0 3px 3px);
|
|
284
|
+
.secondary-action {
|
|
285
|
+
float: right;
|
|
286
|
+
a {
|
|
287
|
+
line-height: 30px;
|
|
288
|
+
&:hover {
|
|
289
|
+
text-decoration: underline;
|
|
290
|
+
}
|
|
291
|
+
}
|
|
292
|
+
}
|
|
293
|
+
}
|
|
294
|
+
|
|
295
|
+
// Help Text
|
|
296
|
+
.help-inline,
|
|
297
|
+
.help-block {
|
|
298
|
+
font-size: $basefont - 2;
|
|
299
|
+
line-height: $baseline;
|
|
300
|
+
color: $grayLight;
|
|
301
|
+
}
|
|
302
|
+
.help-inline {
|
|
303
|
+
padding-left: 5px;
|
|
304
|
+
*position: relative; /* IE6-7 */
|
|
305
|
+
*top: -5px; /* IE6-7 */
|
|
306
|
+
}
|
|
307
|
+
|
|
308
|
+
// Big blocks of help text
|
|
309
|
+
.help-block {
|
|
310
|
+
display: block;
|
|
311
|
+
max-width: 600px;
|
|
312
|
+
}
|
|
313
|
+
|
|
314
|
+
// Inline Fields (input fields that appear as inline objects
|
|
315
|
+
.inline-inputs {
|
|
316
|
+
color: $gray;
|
|
317
|
+
span, input {
|
|
318
|
+
display: inline-block;
|
|
319
|
+
}
|
|
320
|
+
input.mini {
|
|
321
|
+
width: 60px;
|
|
322
|
+
}
|
|
323
|
+
input.small {
|
|
324
|
+
width: 90px;
|
|
325
|
+
}
|
|
326
|
+
span {
|
|
327
|
+
padding: 0 2px 0 1px;
|
|
328
|
+
}
|
|
329
|
+
}
|
|
330
|
+
|
|
331
|
+
// Allow us to put symbols and text within the input field for a cleaner look
|
|
332
|
+
.input-prepend,
|
|
333
|
+
.input-append {
|
|
334
|
+
input {
|
|
335
|
+
@include border-radius(0 3px 3px 0);
|
|
336
|
+
}
|
|
337
|
+
.add-on {
|
|
338
|
+
position: relative;
|
|
339
|
+
background: #f5f5f5;
|
|
340
|
+
border: 1px solid #ccc;
|
|
341
|
+
z-index: 2;
|
|
342
|
+
float: left;
|
|
343
|
+
display: block;
|
|
344
|
+
width: auto;
|
|
345
|
+
min-width: 16px;
|
|
346
|
+
height: 18px;
|
|
347
|
+
padding: 4px 4px 4px 5px;
|
|
348
|
+
margin-right: -1px;
|
|
349
|
+
font-weight: normal;
|
|
350
|
+
line-height: 18px;
|
|
351
|
+
color: $grayLight;
|
|
352
|
+
text-align: center;
|
|
353
|
+
text-shadow: 0 1px 0 $white;
|
|
354
|
+
@include border-radius(3px 0 0 3px);
|
|
355
|
+
}
|
|
356
|
+
.active {
|
|
357
|
+
background: lighten($green, 30);
|
|
358
|
+
border-color: $green;
|
|
359
|
+
}
|
|
360
|
+
}
|
|
361
|
+
.input-prepend {
|
|
362
|
+
.add-on {
|
|
363
|
+
*margin-top: 1px; /* IE6-7 */
|
|
364
|
+
}
|
|
365
|
+
}
|
|
366
|
+
.input-append {
|
|
367
|
+
input {
|
|
368
|
+
float: left;
|
|
369
|
+
@include border-radius(3px 0 0 3px);
|
|
370
|
+
}
|
|
371
|
+
.add-on {
|
|
372
|
+
@include border-radius(0 3px 3px 0);
|
|
373
|
+
margin-right: 0;
|
|
374
|
+
margin-left: -1px;
|
|
375
|
+
}
|
|
376
|
+
}
|
|
377
|
+
|
|
378
|
+
// Stacked options for forms (radio buttons or checkboxes)
|
|
379
|
+
.inputs-list {
|
|
380
|
+
margin: 0 0 5px;
|
|
381
|
+
width: 100%;
|
|
382
|
+
li {
|
|
383
|
+
display: block;
|
|
384
|
+
padding: 0;
|
|
385
|
+
width: 100%;
|
|
386
|
+
}
|
|
387
|
+
label {
|
|
388
|
+
display: block;
|
|
389
|
+
float: none;
|
|
390
|
+
width: auto;
|
|
391
|
+
padding: 0;
|
|
392
|
+
line-height: $baseline;
|
|
393
|
+
text-align: left;
|
|
394
|
+
white-space: normal;
|
|
395
|
+
strong {
|
|
396
|
+
color: $gray;
|
|
397
|
+
}
|
|
398
|
+
small {
|
|
399
|
+
font-size: $basefont - 2;
|
|
400
|
+
font-weight: normal;
|
|
401
|
+
}
|
|
402
|
+
}
|
|
403
|
+
.inputs-list {
|
|
404
|
+
margin-left: 25px;
|
|
405
|
+
margin-bottom: 10px;
|
|
406
|
+
padding-top: 0;
|
|
407
|
+
}
|
|
408
|
+
&:first-child {
|
|
409
|
+
padding-top: 6px;
|
|
410
|
+
}
|
|
411
|
+
li + li {
|
|
412
|
+
padding-top: 2px;
|
|
413
|
+
}
|
|
414
|
+
input[type=radio],
|
|
415
|
+
input[type=checkbox] {
|
|
416
|
+
margin-bottom: 0;
|
|
417
|
+
}
|
|
418
|
+
}
|
|
419
|
+
|
|
420
|
+
// Stacked forms
|
|
421
|
+
.form-stacked {
|
|
422
|
+
padding-left: 20px;
|
|
423
|
+
fieldset {
|
|
424
|
+
padding-top: $baseline / 2;
|
|
425
|
+
}
|
|
426
|
+
legend {
|
|
427
|
+
padding-left: 0;
|
|
428
|
+
}
|
|
429
|
+
label {
|
|
430
|
+
display: block;
|
|
431
|
+
float: none;
|
|
432
|
+
width: auto;
|
|
433
|
+
font-weight: bold;
|
|
434
|
+
text-align: left;
|
|
435
|
+
line-height: 20px;
|
|
436
|
+
padding-top: 0;
|
|
437
|
+
}
|
|
438
|
+
.clearfix {
|
|
439
|
+
margin-bottom: $baseline / 2;
|
|
440
|
+
div.input {
|
|
441
|
+
margin-left: 0;
|
|
442
|
+
}
|
|
443
|
+
}
|
|
444
|
+
.inputs-list {
|
|
445
|
+
margin-bottom: 0;
|
|
446
|
+
li {
|
|
447
|
+
padding-top: 0;
|
|
448
|
+
label {
|
|
449
|
+
font-weight: normal;
|
|
450
|
+
padding-top: 0;
|
|
451
|
+
}
|
|
452
|
+
}
|
|
453
|
+
}
|
|
454
|
+
div.clearfix.error {
|
|
455
|
+
padding-top: 10px;
|
|
456
|
+
padding-bottom: 10px;
|
|
457
|
+
padding-left: 10px;
|
|
458
|
+
margin-top: 0;
|
|
459
|
+
margin-left: -10px;
|
|
460
|
+
}
|
|
461
|
+
.actions {
|
|
462
|
+
margin-left: -20px;
|
|
463
|
+
padding-left: 20px;
|
|
464
|
+
}
|
|
465
|
+
}
|