flashgrid 1.3.0 → 2.0.0

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.
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
+ }