flashgrid 1.3.0 → 2.0.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (35) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +9 -2
  3. data/lib/flashgrid/version.rb +1 -1
  4. data/vendor/assets/javascripts/alert.js +2 -1
  5. data/vendor/assets/javascripts/animation.js +82 -0
  6. data/vendor/assets/javascripts/button.js +99 -0
  7. data/vendor/assets/javascripts/carousel.js +199 -0
  8. data/vendor/assets/javascripts/date_picker.js +1645 -1645
  9. data/vendor/assets/javascripts/hoverdown.js +93 -0
  10. data/vendor/assets/javascripts/scrollspy.js +146 -0
  11. data/vendor/assets/stylesheets/alert.css.scss +3 -3
  12. data/vendor/assets/stylesheets/animation.css.scss +2319 -0
  13. data/vendor/assets/stylesheets/breadcrumb.css.scss +2 -5
  14. data/vendor/assets/stylesheets/button.css.scss +106 -113
  15. data/vendor/assets/stylesheets/carousel.css.scss +148 -0
  16. data/vendor/assets/stylesheets/collapse.css.scss +2 -2
  17. data/vendor/assets/stylesheets/datepicker.css.scss +2 -4
  18. data/vendor/assets/stylesheets/dropdown.css.scss +6 -6
  19. data/vendor/assets/stylesheets/footer.css.scss +31 -4
  20. data/vendor/assets/stylesheets/form.css.scss +55 -24
  21. data/vendor/assets/stylesheets/header.css.scss +11 -4
  22. data/vendor/assets/stylesheets/icon.css.scss +10 -10
  23. data/vendor/assets/stylesheets/label_and_badge.css.scss +1 -1
  24. data/vendor/assets/stylesheets/list.css.scss +34 -15
  25. data/vendor/assets/stylesheets/modal.css.scss +12 -14
  26. data/vendor/assets/stylesheets/{tab.css.scss → nav_and_tab.css.scss} +20 -16
  27. data/vendor/assets/stylesheets/pagination.css.scss +1 -1
  28. data/vendor/assets/stylesheets/popover.css.scss +3 -3
  29. data/vendor/assets/stylesheets/progress.css.scss +1 -1
  30. data/vendor/assets/stylesheets/reset.css.scss +5 -8
  31. data/vendor/assets/stylesheets/switch.css.scss +24 -13
  32. data/vendor/assets/stylesheets/table.css.scss +10 -10
  33. data/vendor/assets/stylesheets/timepicker.css.scss +11 -11
  34. data/vendor/assets/stylesheets/trunk.css.scss +9 -23
  35. metadata +10 -3
@@ -14,11 +14,8 @@
14
14
  font-size: 12px;
15
15
  font-weight: bold;
16
16
  }
17
- .breadcrumb > li > a {
18
- color: rgba(58,144,216,1);
19
- opacity: 0.8;
20
- }
21
- .breadcrumb > li > a:hover { opacity: 1; }
17
+ .breadcrumb > li > a { color: rgba(58,144,216,1); }
18
+ .breadcrumb > li > a:hover { color: rgba(158,171,179,1); }
22
19
  .breadcrumb > li > .divider {
23
20
  color: rgba(71,74,84,1);
24
21
  padding: 0 5px;
@@ -8,16 +8,16 @@
8
8
  #Button Outlines
9
9
  #Button Styles
10
10
  #Button Group
11
- #Button Toolbar */
11
+ #Button Toolbar
12
+ #Button Data Toggles */
12
13
 
13
14
  /* #Button
14
15
  ================================================== */
15
16
  .btn {
16
17
  -webkit-appearance: none;
17
18
  -moz-appearance: none;
18
- background: rgba(236,238,241,1);
19
- border: none;
20
- border-bottom: 2px solid rgba(196,198,201,1);
19
+ background: rgba(246,247,249,1);
20
+ border: 1px solid rgba(217,222,225,1);
21
21
  border-radius: 2px;
22
22
  -moz-box-sizing: border-box;
23
23
  box-sizing: border-box;
@@ -37,10 +37,14 @@
37
37
  transition: all 0.3s linear;
38
38
  vertical-align: middle;
39
39
  }
40
+ .btn:active,
41
+ .btn.active,
40
42
  .btn:hover,
43
+ .btn:focus,
41
44
  .btn[disabled],
42
- .btn[disabled]:hover {
43
- background: rgba(226,228,231,1);
45
+ .btn[disabled]:hover,
46
+ .open > .dropdown-toggle.btn {
47
+ background: rgba(236,237,239,1);
44
48
  text-decoration: none;
45
49
  }
46
50
  .btn[disabled],
@@ -50,12 +54,6 @@
50
54
  }
51
55
  .btn:active,
52
56
  .btn[disabled]:active {
53
- border-bottom-width: 0;
54
- -webkit-transform: translateY(2px);
55
- -moz-transform: translateY(2px);
56
- -ms-transform: translateY(2px);
57
- -o-transform: translateY(2px);
58
- transform: translateY(2px);
59
57
  -webkit-transition: all 0.1s linear;
60
58
  transition: all 0.1s linear;
61
59
  }
@@ -101,166 +99,157 @@ input.btn-block {
101
99
  .btn-red,
102
100
  .btn-red[disabled] { color: rgba(255,255,255,1); }
103
101
  .btn-black {
104
- background: rgba(61,64,74,1);
102
+ background: rgba(71,74,84,1);
105
103
  border-color: rgba(1,4,14,1);
106
104
  }
105
+ .btn-black:active,
106
+ .btn-black.active,
107
107
  .btn-black:hover,
108
+ .btn-black:focus,
108
109
  .btn-black[disabled],
109
- .btn-black[disabled]:hover { background: rgba(51,54,64,1); }
110
+ .btn-black[disabled]:hover,
111
+ .open > .dropdown-toggle.btn-black { background: rgba(61,64,74,1); }
110
112
  .btn-blue {
111
113
  background: rgba(58,144,216,1);
112
114
  border-color: rgba(8,94,166,1);
113
115
  }
116
+ .btn-blue:active,
117
+ .btn-blue.active,
114
118
  .btn-blue:hover,
119
+ .btn-blue:focus,
115
120
  .btn-blue[disabled],
116
- .btn-blue[disabled]:hover { background: rgba(48,134,206,1); }
121
+ .btn-blue[disabled]:hover,
122
+ .open > .dropdown-toggle.btn-blue { background: rgba(48,134,206,1); }
117
123
  .btn-green {
118
124
  background: rgba(122,179,23,1);
119
125
  border-color: rgba(72,129,3,1);
120
126
  }
127
+ .btn-green:active,
128
+ .btn-green.active,
121
129
  .btn-green:hover,
130
+ .btn-green:focus,
122
131
  .btn-green[disabled],
123
- .btn-green[disabled]:hover { background: rgba(112,169,13,1); }
132
+ .btn-green[disabled]:hover,
133
+ .open > .dropdown-toggle.btn-green { background: rgba(112,169,13,1); }
124
134
  .btn-red {
125
135
  background: rgba(220,74,56,1);
126
136
  border-color: rgba(180,34,16,1);
127
137
  }
138
+ .btn-red:active,
139
+ .btn-red.active,
128
140
  .btn-red:hover,
141
+ .btn-red:focus,
129
142
  .btn-red[disabled],
130
- .btn-red[disabled]:hover { background: rgba(210,64,46,1); }
143
+ .btn-red[disabled]:hover,
144
+ .open > .dropdown-toggle.btn-red { background: rgba(210,64,46,1); }
131
145
  .btn-white { background: rgba(255,255,255,1); }
146
+ .btn-white:active,
147
+ .btn-white.active,
132
148
  .btn-white:hover,
149
+ .btn-white:focus,
133
150
  .btn-white[disabled],
134
- .btn-white[disabled]:hover { background: rgba(226,228,231,1); }
151
+ .btn-white[disabled]:hover,
152
+ .open > .dropdown-toggle.btn-white { background: rgba(246,247,249,1); }
135
153
 
136
154
  /* #Button Links
137
155
  ================================================== */
138
156
  .btn-link {
139
- background: none;
140
- border: none;
157
+ background: transparent;
158
+ border-color: transparent;
141
159
  color: rgba(174,182,192,1);
142
- margin-top: 12px;
143
160
  padding: 0;
144
161
  }
145
- .btn-link:hover {
146
- background: none;
162
+ .btn-link:active,
163
+ .btn-link.active,
164
+ .btn-link:hover,
165
+ .btn-link:focus, {
166
+ background: transparent;
147
167
  color: rgba(71,74,84,1);
148
168
  }
149
- .btn-link.btn-large { margin-top: 17px; }
150
- .btn-link.btn-small { margin-top: 8px; }
151
- .btn-link.btn-mini { margin-top: 6px; }
152
- .btn-link.btn-link-clean { margin-top: 0; }
153
169
 
154
170
  /* #Button Icons
155
171
  ================================================== */
156
172
  .btn-icon {
157
173
  font-size: 17px;
158
174
  line-height: 17px;
159
- padding: 12px 14px 10px 14px;
175
+ padding: 10px 13px;
160
176
  }
161
177
  .btn-large.btn-icon {
162
178
  font-size: 23px;
163
179
  line-height: 23px;
164
- padding: 13px 14px 11px 14px;
180
+ padding: 11px 13px;
165
181
  }
166
182
  .btn-small.btn-icon {
167
183
  font-size: 14px;
168
184
  line-height: 14px;
169
- padding: 8px 9px 6px 8px;
185
+ padding: 6px 7px 6px 6px;
170
186
  }
171
187
  .btn-mini.btn-icon {
172
188
  font-size: 11px;
173
189
  line-height: 11px;
174
- padding: 6px 7px 4px 7px;
190
+ padding: 5px 6px;
175
191
  }
176
192
 
177
193
  /* #Button Outlines
178
194
  ================================================== */
179
195
  .btn-outline {
180
196
  background: transparent;
181
- border: 1px solid rgba(229,230,234,1);
182
- border-radius: 2px;
183
197
  color: rgba(174,182,192,1);
184
198
  }
185
- .btn-outline:hover {
199
+ .btn-outline:active,
200
+ .btn-outline.active,
201
+ .btn-outline:hover,
202
+ .btn-outline:focus {
186
203
  background: transparent;
187
- border-color: rgba(199,200,204,1);
188
204
  color: rgba(71,74,84,1);
189
205
  }
190
- .btn-outline:active {
191
- border-bottom-width: 1px;
192
- -webkit-transform: translateY(0px);
193
- -moz-transform: translateY(0px);
194
- -ms-transform: translateY(0px);
195
- -o-transform: translateY(0px);
196
- transform: translateY(0px);
197
- -webkit-transition: all 0.3s linear;
198
- transition: all 0.3s linear;
199
- }
200
- .btn-outline.btn-large { padding: 14px 29px 16px 29px; }
201
- .btn-outline.btn-small { padding: 7px 14px 8px 14px; }
202
- .btn-outline.btn-mini { padding: 5px 14px 6px 14px; }
203
- .btn-outline.btn-icon { padding: 10px 12px 9px 12px; }
204
- .btn-outline.btn-large.btn-icon { padding: 11px 13px 11px 13px; }
205
- .btn-outline.btn-small.btn-icon { padding: 6px 7px 6px 6px; }
206
- .btn-outline.btn-mini.btn-icon { padding: 4px 6px 4px 6px; }
206
+ .btn-outline[disabled],
207
+ .btn-outline[disabled]:hover { color: rgba(174,182,192,1); }
207
208
  .btn-outline.btn-black {
208
209
  border-color: rgba(71,74,84,1);
209
210
  color: rgba(71,74,84,1);
210
211
  }
211
- .btn-outline.btn-black:hover { color: rgba(61,64,74,1); }
212
+ .btn-outline.btn-black:active,
213
+ .btn-outline.btn-black.active,
214
+ .btn-outline.btn-black:hover,
215
+ .btn-outline.btn-black:focus { color: rgba(61,64,74,1); }
212
216
  .btn-outline.btn-blue {
213
217
  border-color: rgba(58,144,216,1);
214
218
  color: rgba(58,144,216,1);
215
219
  }
216
- .btn-outline.btn-blue:hover { color: rgba(48,134,206,1); }
220
+ .btn-outline.btn-blue:active,
221
+ .btn-outline.btn-blue.active,
222
+ .btn-outline.btn-blue:hover,
223
+ .btn-outline.btn-blue:focus { color: rgba(48,134,206,1); }
217
224
  .btn-outline.btn-green {
218
225
  border-color: rgba(122,179,23,1);
219
226
  color: rgba(122,179,23,1);
220
227
  }
221
- .btn-outline.btn-green:hover { color: rgba(102,159,3,1); }
228
+ .btn-outline.btn-green:active,
229
+ .btn-outline.btn-green.active,
230
+ .btn-outline.btn-green:hover,
231
+ .btn-outline.btn-green:focus { color: rgba(102,159,3,1); }
222
232
  .btn-outline.btn-red {
223
233
  border-color: rgba(220,74,56,1);
224
234
  color: rgba(220,74,56,1);
225
235
  }
226
- .btn-outline.btn-red:hover { color: rgba(210,64,46,1); }
236
+ .btn-outline.btn-red:active,
237
+ .btn-outline.btn-red.active,
238
+ .btn-outline.btn-red:hover,
239
+ .btn-outline.btn-red:focus { color: rgba(210,64,46,1); }
227
240
  .btn-outline.btn-white {
228
241
  border-color: rgba(255,255,255,1);
229
- color: rgba(225,255,255,1);
242
+ color: rgba(255,255,255,1);
230
243
  }
231
- .btn-outline.btn-white:hover { color: rgba(226,228,231,1); }
244
+ .btn-outline.btn-white:active,
245
+ .btn-outline.btn-white.active,
246
+ .btn-outline.btn-white:hover,
247
+ .btn-outline.btn-white:focus { color: rgba(71,74,84,1); }
232
248
 
233
249
  /* #Button Styles
234
250
  ================================================== */
235
- .btn-round { border-radius: 500px; }
236
- .btn-uppercase {
237
- font-size: 12px;
238
- letter-spacing: 1px;
239
- line-height: 12px;
240
- padding-bottom: 13px;
241
- text-transform: uppercase;
242
- }
243
- .btn-xlarge.btn-uppercase {
244
- font-size: 13px;
245
- line-height: 13px;
246
- padding: 20px 30px;
247
- }
248
- .btn-large.btn-uppercase {
249
- font-size: 13px;
250
- line-height: 13px;
251
- padding-bottom: 16px;
252
- padding-top: 16px;
253
- }
254
- .btn-small.btn-uppercase {
255
- font-size: 10px;
256
- line-height: 10px;
257
- padding-top: 8px;
258
- }
259
- .btn-mini.btn-uppercase {
260
- font-size: 8px;
261
- line-height: 8px;
262
- padding-bottom: 7px;
263
- }
251
+ .btn-circle { border-radius: 500px; }
252
+ .btn-uppercase { text-transform: uppercase; }
264
253
 
265
254
  /* #Button Group
266
255
  ================================================== */
@@ -273,19 +262,14 @@ input.btn-block {
273
262
  }
274
263
  .btn-group + .btn-group { margin-left: 5px; }
275
264
  .btn-group.pull-right + .btn-group.pull-right {
276
- margin-left: 0;
277
265
  margin-right: 10px;
266
+ margin-left: 0;
278
267
  }
279
268
  .btn-group > .btn {
280
- border-right: 1px solid rgba(196,198,201,1);
281
269
  border-radius: 0;
270
+ margin-left: -1px;
282
271
  position: relative;
283
272
  }
284
- .btn-group > .btn-black { border-color: rgba(1,4,14,1); }
285
- .btn-group > .btn-blue { border-color: rgba(8,94,166,1); }
286
- .btn-group > .btn-green { border-color: rgba(72,129,3,1); }
287
- .btn-group > .btn-red { border-color: rgba(180,34,16,1); }
288
- .btn-group > .btn-white { border-color: rgba(196,198,201,1); }
289
273
  .btn-group > .btn:first-child {
290
274
  border-bottom-left-radius: 2px;
291
275
  border-top-left-radius: 2px;
@@ -293,30 +277,30 @@ input.btn-block {
293
277
  }
294
278
  .btn-group > .btn:last-child,
295
279
  .btn-group > .dropdown-toggle {
296
- border-right: none;
297
280
  border-bottom-right-radius: 2px;
298
281
  border-top-right-radius: 2px;
299
282
  }
300
- .btn-group > .btn:hover,
301
- .btn-group > .btn:focus,
302
283
  .btn-group > .btn:active,
303
- .btn-group > .btn.active { z-index: 2; }
284
+ .btn-group > .btn.active,
285
+ .btn-group > .btn:hover,
286
+ .btn-group > .btn:focus { z-index: 2; }
304
287
  .btn-group .dropdown-toggle:active,
305
- .btn-group.open .dropdown-toggle { outline: 0; }
306
- .btn-group-outline > .btn {
307
- border-width: 1px;
308
- margin-left: -1px;
288
+ .btn-group.open .dropdown-toggle { outline: 0; }
289
+ .btn-group-justified {
290
+ border-collapse: separate;
291
+ display: table;
292
+ table-layout: fixed;
293
+ width: 100%;
309
294
  }
310
- .btn-group-outline > .btn-outline:first-child { margin-left: 0; }
311
- .btn-group-outline > .btn-outline:last-child,
312
- .btn-group-outline > .dropdown-toggle { border-right: 1px solid rgba(229,230,234,1); }
313
- .btn-group-outline > .btn-outline-black:last-child { border-right-color: rgba(1,4,14,1); }
314
- .btn-group-outline > .btn-outline-blue:last-child { border-right-color: rgba(8,94,166,1); }
315
- .btn-group-outline > .btn-outline-green:last-child { border-right-color: rgba(72,129,3,1); }
316
- .btn-group-outline > .btn-outline-red:last-child { border-right-color: rgba(180,34,16,1); }
317
- .btn-group-outline > .btn-outline-white:last-child { border-right-color: rgba(196,198,201,1); }
318
- .btn-group-outline > .btn-outline:last-child:hover,
319
- .btn-group-outline > .dropdown-toggle:hover { border-right: 1px solid rgba(199,200,204,1); }
295
+ .btn-group-justified > .btn,
296
+ .btn-group-justified > .btn-group {
297
+ display: table-cell;
298
+ float: none;
299
+ width: 1%;
300
+ }
301
+ .btn-group-justified > .btn-group .btn { width: 100%; }
302
+ .btn-group-justified > .btn { border-right-width: 0; }
303
+ .btn-group-justified > .btn:last-child { border-right-width: 1px; }
320
304
 
321
305
  /* #Button Toolbar
322
306
  ================================================== */
@@ -327,4 +311,13 @@ input.btn-block {
327
311
  }
328
312
  .btn-toolbar > .btn + .btn,
329
313
  .btn-toolbar > .btn-group + .btn,
330
- .btn-toolbar > .btn + .btn-group { margin-left: 5px; }
314
+ .btn-toolbar > .btn + .btn-group { margin-left: 5px; }
315
+
316
+ /* #Button Data Toggles
317
+ ================================================== */
318
+ [data-toggle="buttons"] > .btn > input[type="radio"],
319
+ [data-toggle="buttons"] > .btn > input[type="checkbox"] {
320
+ position: absolute;
321
+ z-index: -1;
322
+ opacity: 0;
323
+ }
@@ -0,0 +1,148 @@
1
+ /* Table of Contents
2
+ ==================================================
3
+ #Carousel */
4
+
5
+ /* #Carousel
6
+ ================================================== */
7
+ .carousel { position: relative; }
8
+ .carousel-inner {
9
+ overflow: hidden;
10
+ position: relative;
11
+ width: 100%;
12
+ }
13
+ .carousel-inner > .item {
14
+ display: none;
15
+ position: relative;
16
+ -webkit-transition: 0.6s ease-in-out left;
17
+ transition: 0.6s ease-in-out left;
18
+ }
19
+ .carousel-inner > .item > img,
20
+ .carousel-inner > .item > a > img {
21
+ display: block;
22
+ height: auto;
23
+ line-height: 1;
24
+ max-width: 100%;
25
+ }
26
+ .carousel-inner > .active,
27
+ .carousel-inner > .next,
28
+ .carousel-inner > .prev { display: block; }
29
+ .carousel-inner > .active { left: 0; }
30
+ .carousel-inner > .next,
31
+ .carousel-inner > .prev {
32
+ position: absolute;
33
+ top: 0;
34
+ width: 100%;
35
+ }
36
+ .carousel-inner > .next { left: 100%; }
37
+ .carousel-inner > .prev { left: -100%; }
38
+ .carousel-inner > .next.left,
39
+ .carousel-inner > .prev.right { left: 0; }
40
+ .carousel-inner > .active.left { left: -100%; }
41
+ .carousel-inner > .active.right { left: 100%; }
42
+ .carousel-control {
43
+ bottom: 0;
44
+ color: rgba(255,255,255,1);
45
+ filter: alpha(opacity=50);
46
+ left: 0;
47
+ opacity: 0.5;
48
+ position: absolute;
49
+ text-align: center;
50
+ top: 0;
51
+ width: 70px;
52
+ }
53
+ .carousel-control.right {
54
+ left: auto;
55
+ right: 0;
56
+ }
57
+ .carousel-control:hover,
58
+ .carousel-control:focus {
59
+ color: rgba(255,255,255,1);
60
+ filter: alpha(opacity=90);
61
+ opacity: 0.9;
62
+ outline: none;
63
+ text-decoration: none;
64
+ }
65
+ .carousel-control .icon-prev,
66
+ .carousel-control .icon-next,
67
+ .carousel-control .icon-carousel-left,
68
+ .carousel-control .icon-carousel-right {
69
+ display: inline-block;
70
+ font-size: 42px;
71
+ height: 60px;
72
+ line-height: 60px;
73
+ position: absolute;
74
+ text-align: center;
75
+ top: 45%;
76
+ vertical-align: middle;
77
+ width: 60px;
78
+ z-index: 5;
79
+ }
80
+ .carousel-control .icon-prev,
81
+ .carousel-control .icon-carousel-left { left: 10px; }
82
+ .carousel-control .icon-next,
83
+ .carousel-control .icon-carousel-right { right: 10px; }
84
+ .carousel-control .icon-prev,
85
+ .carousel-control .icon-next {
86
+ font-family: serif;
87
+ height: 48px;
88
+ width: 48px;
89
+ }
90
+ .carousel-control .icon-prev:before { content: '\2039'; }
91
+ .carousel-control .icon-next:before { content: '\203a'; }
92
+ .carousel-indicators {
93
+ bottom: 10px;
94
+ left: 50%;
95
+ list-style: none;
96
+ margin-left: -30%;
97
+ padding-left: 0;
98
+ position: absolute;
99
+ text-align: center;
100
+ width: 60%;
101
+ z-index: 15;
102
+ }
103
+ .carousel-indicators li {
104
+ display: inline-block;
105
+ background: rgba(0,0,0,0);
106
+ border: 1px solid rgba(255,255,255,1);
107
+ border-radius: 10px;
108
+ cursor: pointer;
109
+ height: 10px;
110
+ margin: 1px;
111
+ text-indent: -999px;
112
+ width: 10px;
113
+ }
114
+ .carousel-indicators .active {
115
+ background: rgba(255,255,255,1);
116
+ height: 12px;
117
+ margin: 0;
118
+ width: 12px;
119
+ }
120
+ .carousel-caption {
121
+ bottom: 20px;
122
+ color: rgba(255,255,255,1);
123
+ left: 15%;
124
+ padding-top: 20px;
125
+ padding-bottom: 20px;
126
+ position: absolute;
127
+ right: 15%;
128
+ text-align: center;
129
+ z-index: 10;
130
+ }
131
+ .carousel-caption h1,
132
+ .carousel-caption h2,
133
+ .carousel-caption h3,
134
+ .carousel-caption h4,
135
+ .carousel-caption h5,
136
+ .carousel-caption h6 { color: rgba(255,255,255,1); }
137
+ @media only screen and (max-width: 767px) {
138
+ .carousel-control .icon-carousel-left,
139
+ .carousel-control .icon-carousel-right,
140
+ .carousel-control .icon-prev,
141
+ .carousel-control .icon-next {
142
+ font-size:20px;
143
+ height: 20px;
144
+ width: 20px;
145
+ }
146
+ .carousel-caption { display: none !important; }
147
+ .carousel-indicators { bottom: 20px; }
148
+ }