bootswatch-sass 3.3.1.3 → 3.3.1.4

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 (39) hide show
  1. checksums.yaml +4 -4
  2. data/Gemfile +0 -2
  3. data/README.md +8 -2
  4. data/assets/stylesheets/cerulean/_bootswatch.scss +102 -101
  5. data/assets/stylesheets/cerulean/_variables.scss +1 -1
  6. data/assets/stylesheets/cosmo/_bootswatch.scss +204 -123
  7. data/assets/stylesheets/cosmo/_variables.scss +1 -1
  8. data/assets/stylesheets/cyborg/_bootswatch.scss +179 -109
  9. data/assets/stylesheets/cyborg/_variables.scss +1 -1
  10. data/assets/stylesheets/darkly/_bootswatch.scss +281 -209
  11. data/assets/stylesheets/darkly/_variables.scss +1 -1
  12. data/assets/stylesheets/flatly/_bootswatch.scss +279 -203
  13. data/assets/stylesheets/flatly/_variables.scss +1 -1
  14. data/assets/stylesheets/journal/_bootswatch.scss +102 -50
  15. data/assets/stylesheets/journal/_variables.scss +1 -1
  16. data/assets/stylesheets/lumen/_bootswatch.scss +436 -340
  17. data/assets/stylesheets/lumen/_variables.scss +1 -1
  18. data/assets/stylesheets/paper/_bootswatch.scss +335 -391
  19. data/assets/stylesheets/paper/_variables.scss +1 -1
  20. data/assets/stylesheets/readable/_bootswatch.scss +155 -93
  21. data/assets/stylesheets/readable/_variables.scss +1 -1
  22. data/assets/stylesheets/sandstone/_bootswatch.scss +168 -128
  23. data/assets/stylesheets/sandstone/_variables.scss +1 -1
  24. data/assets/stylesheets/simplex/_bootswatch.scss +111 -84
  25. data/assets/stylesheets/simplex/_variables.scss +1 -1
  26. data/assets/stylesheets/slate/_bootswatch.scss +357 -362
  27. data/assets/stylesheets/slate/_variables.scss +1 -1
  28. data/assets/stylesheets/spacelab/_bootswatch.scss +132 -166
  29. data/assets/stylesheets/spacelab/_variables.scss +1 -1
  30. data/assets/stylesheets/superhero/_bootswatch.scss +264 -164
  31. data/assets/stylesheets/superhero/_variables.scss +1 -1
  32. data/assets/stylesheets/united/_bootswatch.scss +40 -7
  33. data/assets/stylesheets/united/_variables.scss +1 -1
  34. data/assets/stylesheets/yeti/_bootswatch.scss +367 -238
  35. data/assets/stylesheets/yeti/_variables.scss +1 -1
  36. data/bootswatch-sass.gemspec +3 -6
  37. data/lib/bootswatch-sass.rb +18 -1
  38. data/lib/bootswatch-sass/version.rb +1 -1
  39. metadata +7 -49
@@ -76,7 +76,7 @@ $headings-color: $gray-dark;
76
76
  //## Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower.
77
77
 
78
78
  //** Load fonts from this directory.
79
- $icon-font-path: "bootstrap/";
79
+ $icon-font-path: "bootstrap/" !default;
80
80
  //** File name for all font files.
81
81
  $icon-font-name: "glyphicons-halflings-regular";
82
82
  //** Element ID within SVG icon file.
@@ -1,203 +1,118 @@
1
+ // Paper 3.3.1
2
+ // Bootswatch
3
+ // -----------------------------------------------------
4
+
1
5
  @import url("//fonts.googleapis.com/css?family=Roboto:300,400,500");
6
+
7
+ // Navbar =====================================================================
8
+
2
9
  .navbar {
3
10
  border: none;
4
- -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
5
- box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
6
- }
7
- .navbar-brand {
8
- font-size: 24px;
9
- }
10
- .navbar-inverse .form-control {
11
- color: #fff;
12
- }
13
- .navbar-inverse .form-control::-moz-placeholder {
14
- color: #b2dbfb;
15
- opacity: 1;
16
- }
17
- .navbar-inverse .form-control:-ms-input-placeholder {
18
- color: #b2dbfb;
19
- }
20
- .navbar-inverse .form-control::-webkit-input-placeholder {
21
- color: #b2dbfb;
22
- }
23
- .navbar-inverse .form-control[type=text] {
24
- -webkit-box-shadow: inset 0 -1px 0 #b2dbfb;
25
- box-shadow: inset 0 -1px 0 #b2dbfb;
26
- }
27
- .navbar-inverse .form-control[type=text]:focus {
28
- -webkit-box-shadow: inset 0 -2px 0 #ffffff;
29
- box-shadow: inset 0 -2px 0 #ffffff;
30
- }
31
- .navbar-nav > li > .dropdown-menu {
32
- margin-top: 2px;
33
- }
34
- .btn-default {
35
- background-image: -webkit-radial-gradient(circle, #ffffff 80%, #f0f0f0 81%);
36
- background-image: radial-gradient(circle, #ffffff 80%, #f0f0f0 81%);
37
- background-repeat: no-repeat;
38
- background-size: 200%;
39
- background-position: 50%;
40
- transition: background-size 2s;
41
- }
42
- .btn-default:hover {
43
- background-size: 100%;
44
- border-color: #f0f0f0;
45
- }
46
- .btn-default:active {
47
- background-color: #f0f0f0;
48
- background-image: -webkit-radial-gradient(circle, #f0f0f0 10%, #ffffff 11%);
49
- background-image: radial-gradient(circle, #f0f0f0 10%, #ffffff 11%);
50
- background-repeat: no-repeat;
51
- background-size: 1000%;
52
- -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
53
- box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
54
- }
55
- .btn-primary {
56
- background-image: -webkit-radial-gradient(circle, #2196f3 80%, #0d87e9 81%);
57
- background-image: radial-gradient(circle, #2196f3 80%, #0d87e9 81%);
58
- background-repeat: no-repeat;
59
- background-size: 200%;
60
- background-position: 50%;
61
- transition: background-size 2s;
62
- }
63
- .btn-primary:hover {
64
- background-size: 100%;
65
- border-color: #0d87e9;
66
- }
67
- .btn-primary:active {
68
- background-color: #0d87e9;
69
- background-image: -webkit-radial-gradient(circle, #0d87e9 10%, #2196f3 11%);
70
- background-image: radial-gradient(circle, #0d87e9 10%, #2196f3 11%);
71
- background-repeat: no-repeat;
72
- background-size: 1000%;
73
- -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
74
- box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
75
- }
76
- .btn-success {
77
- background-image: -webkit-radial-gradient(circle, #4caf50 80%, #439a46 81%);
78
- background-image: radial-gradient(circle, #4caf50 80%, #439a46 81%);
79
- background-repeat: no-repeat;
80
- background-size: 200%;
81
- background-position: 50%;
82
- transition: background-size 2s;
83
- }
84
- .btn-success:hover {
85
- background-size: 100%;
86
- border-color: #439a46;
87
- }
88
- .btn-success:active {
89
- background-color: #439a46;
90
- background-image: -webkit-radial-gradient(circle, #439a46 10%, #4caf50 11%);
91
- background-image: radial-gradient(circle, #439a46 10%, #4caf50 11%);
92
- background-repeat: no-repeat;
93
- background-size: 1000%;
94
- -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
95
- box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
96
- }
97
- .btn-info {
98
- background-image: -webkit-radial-gradient(circle, #9c27b0 80%, #862197 81%);
99
- background-image: radial-gradient(circle, #9c27b0 80%, #862197 81%);
100
- background-repeat: no-repeat;
101
- background-size: 200%;
102
- background-position: 50%;
103
- transition: background-size 2s;
104
- }
105
- .btn-info:hover {
106
- background-size: 100%;
107
- border-color: #862197;
108
- }
109
- .btn-info:active {
110
- background-color: #862197;
111
- background-image: -webkit-radial-gradient(circle, #862197 10%, #9c27b0 11%);
112
- background-image: radial-gradient(circle, #862197 10%, #9c27b0 11%);
113
- background-repeat: no-repeat;
114
- background-size: 1000%;
115
- -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
116
- box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
117
- }
118
- .btn-warning {
119
- background-image: -webkit-radial-gradient(circle, #ff9800 80%, #e08600 81%);
120
- background-image: radial-gradient(circle, #ff9800 80%, #e08600 81%);
121
- background-repeat: no-repeat;
122
- background-size: 200%;
123
- background-position: 50%;
124
- transition: background-size 2s;
125
- }
126
- .btn-warning:hover {
127
- background-size: 100%;
128
- border-color: #e08600;
129
- }
130
- .btn-warning:active {
131
- background-color: #e08600;
132
- background-image: -webkit-radial-gradient(circle, #e08600 10%, #ff9800 11%);
133
- background-image: radial-gradient(circle, #e08600 10%, #ff9800 11%);
134
- background-repeat: no-repeat;
135
- background-size: 1000%;
136
- -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
137
- box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
138
- }
139
- .btn-danger {
140
- background-image: -webkit-radial-gradient(circle, #e51c23 80%, #cb171e 81%);
141
- background-image: radial-gradient(circle, #e51c23 80%, #cb171e 81%);
142
- background-repeat: no-repeat;
143
- background-size: 200%;
144
- background-position: 50%;
145
- transition: background-size 2s;
146
- }
147
- .btn-danger:hover {
148
- background-size: 100%;
149
- border-color: #cb171e;
150
- }
151
- .btn-danger:active {
152
- background-color: #cb171e;
153
- background-image: -webkit-radial-gradient(circle, #cb171e 10%, #e51c23 11%);
154
- background-image: radial-gradient(circle, #cb171e 10%, #e51c23 11%);
155
- background-repeat: no-repeat;
156
- background-size: 1000%;
157
- -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
158
- box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
159
- }
11
+ @include box-shadow(0 1px 2px rgba(0,0,0,.3));
12
+
13
+ &-brand {
14
+ font-size: 24px;
15
+ }
16
+
17
+ &-inverse {
18
+ .form-control {
19
+ color: #fff;
20
+ @include placeholder($navbar-inverse-link-color);
21
+
22
+ &[type=text] {
23
+ @include box-shadow(inset 0 -1px 0 $navbar-inverse-link-color);
24
+
25
+ &:focus {
26
+ @include box-shadow(inset 0 -2px 0 #fff);
27
+ }
28
+ }
29
+ }
30
+ }
31
+
32
+ &-nav > li > .dropdown-menu {
33
+ margin-top: 2px;
34
+ }
35
+ }
36
+
37
+ // Buttons ====================================================================
38
+
39
+ @mixin btn($class,$bg){
40
+ .btn-#{$class} {
41
+ @include gradient-radial($bg 80%, darken($bg, 6%) 81%);
42
+ background-size: 200%;
43
+ background-position: 50%;
44
+ transition: background-size 2s;
45
+
46
+ &:hover {
47
+ background-size: 100%;
48
+ border-color: darken($bg, 6%);
49
+ }
50
+
51
+ &:active {
52
+ background-color: darken($bg, 6%);
53
+ @include gradient-radial(darken($bg, 6%) 10%, $bg 11%);
54
+ background-size: 1000%;
55
+ @include box-shadow(2px 2px 2px rgba(0,0,0,.3));
56
+ }
57
+ }
58
+ }
59
+
60
+ @include btn(default,$btn-default-bg);
61
+ @include btn(primary,$btn-primary-bg);
62
+ @include btn(success,$btn-success-bg);
63
+ @include btn(info,$btn-info-bg);
64
+ @include btn(warning,$btn-warning-bg);
65
+ @include btn(danger,$btn-danger-bg);
66
+
160
67
  .btn {
161
68
  text-transform: uppercase;
162
69
  border-right: none;
163
70
  border-bottom: none;
164
- -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
165
- box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
166
- -webkit-transition: all 0.2s;
167
- -o-transition: all 0.2s;
168
- transition: all 0.2s;
169
- }
170
- .btn-link {
171
- -webkit-box-shadow: none;
172
- box-shadow: none;
173
- }
174
- .btn-link:hover,
175
- .btn-link:focus {
176
- color: #2196f3;
177
- text-decoration: none;
178
- }
179
- .btn-default.disabled {
180
- border: 1px solid #eeeeee;
181
- }
71
+ @include box-shadow(1px 1px 2px rgba(0,0,0,.3));
72
+ @include transition(all 0.2s);
73
+
74
+ &-link {
75
+ @include box-shadow(none);
76
+
77
+ &:hover,
78
+ &:focus {
79
+ color: $brand-primary;
80
+ text-decoration: none;
81
+ }
82
+ }
83
+
84
+ &-default.disabled {
85
+ border: 1px solid $btn-default-border;
86
+ }
87
+ }
88
+
89
+ // Typography =================================================================
90
+
182
91
  body {
183
92
  -webkit-font-smoothing: antialiased;
184
93
  letter-spacing: .1px;
185
94
  text-rendering: optimizeLegibility;
186
95
  }
96
+
187
97
  p {
188
98
  margin: 0 0 1em;
189
99
  }
100
+
190
101
  input,
191
102
  button {
192
103
  -webkit-font-smoothing: antialiased;
193
104
  letter-spacing: .1px;
194
105
  text-rendering: optimizeLegibility;
195
106
  }
107
+
196
108
  a {
197
- -webkit-transition: all 0.2s;
198
- -o-transition: all 0.2s;
199
- transition: all 0.2s;
109
+ @include transition(all 0.2s);
200
110
  }
111
+
112
+ // Tables =====================================================================
113
+
114
+ // Forms ======================================================================
115
+
201
116
  textarea,
202
117
  textarea.form-control,
203
118
  input.form-control,
@@ -212,253 +127,282 @@ input[type=number],
212
127
  padding: 0;
213
128
  border: none;
214
129
  border-radius: 0;
215
- -webkit-box-shadow: inset 0 -1px 0 #dddddd;
216
- box-shadow: inset 0 -1px 0 #dddddd;
130
+ @include box-shadow(inset 0 -1px 0 #ddd);
217
131
  font-size: 16px;
218
- }
219
- textarea:focus,
220
- textarea.form-control:focus,
221
- input.form-control:focus,
222
- input[type=text]:focus,
223
- input[type=password]:focus,
224
- input[type=email]:focus,
225
- input[type=number]:focus,
226
- [type=text].form-control:focus,
227
- [type=password].form-control:focus,
228
- [type=email].form-control:focus,
229
- [type=tel].form-control:focus {
230
- -webkit-box-shadow: inset 0 -2px 0 #2196f3;
231
- box-shadow: inset 0 -2px 0 #2196f3;
232
- }
233
- textarea[disabled],
234
- textarea.form-control[disabled],
235
- input.form-control[disabled],
236
- input[type=text][disabled],
237
- input[type=password][disabled],
238
- input[type=email][disabled],
239
- input[type=number][disabled],
240
- [type=text].form-control[disabled],
241
- [type=password].form-control[disabled],
242
- [type=email].form-control[disabled],
243
- [type=tel].form-control[disabled],
244
- textarea[readonly],
245
- textarea.form-control[readonly],
246
- input.form-control[readonly],
247
- input[type=text][readonly],
248
- input[type=password][readonly],
249
- input[type=email][readonly],
250
- input[type=number][readonly],
251
- [type=text].form-control[readonly],
252
- [type=password].form-control[readonly],
253
- [type=email].form-control[readonly],
254
- [type=tel].form-control[readonly] {
255
- -webkit-box-shadow: none;
256
- box-shadow: none;
257
- border-bottom: 1px dotted #ddd;
258
- }
132
+
133
+ &:focus {
134
+ @include box-shadow(inset 0 -2px 0 $brand-primary);
135
+ }
136
+
137
+ &[disabled],
138
+ &[readonly] {
139
+ @include box-shadow(none);
140
+ border-bottom: 1px dotted #ddd;
141
+ }
142
+ }
143
+
259
144
  select,
260
145
  select.form-control {
261
146
  border: 0;
262
147
  border-radius: 0;
263
148
  -webkit-appearance: none;
264
- -webkit-box-shadow: inset 0 -1px 0 #dddddd;
265
- box-shadow: inset 0 -1px 0 #dddddd;
149
+ @include box-shadow(inset 0 -1px 0 #ddd);
266
150
  font-size: 16px;
267
151
  padding-left: 0px;
268
- }
269
- select:focus,
270
- select.form-control:focus {
271
- -webkit-box-shadow: inset 0 -2px 0 #2196f3;
272
- box-shadow: inset 0 -2px 0 #2196f3;
273
- }
274
- .has-warning input,
275
- .has-warning .form-control,
276
- .has-warning input:focus,
277
- .has-warning .form-control:focus {
278
- -webkit-box-shadow: inset 0 -2px 0 #ff9800;
279
- box-shadow: inset 0 -2px 0 #ff9800;
280
- }
281
- .has-error input,
282
- .has-error .form-control,
283
- .has-error input:focus,
284
- .has-error .form-control:focus {
285
- -webkit-box-shadow: inset 0 -2px 0 #e51c23;
286
- box-shadow: inset 0 -2px 0 #e51c23;
287
- }
288
- .has-success input,
289
- .has-success .form-control,
290
- .has-success input:focus,
291
- .has-success .form-control:focus {
292
- -webkit-box-shadow: inset 0 -2px 0 #4caf50;
293
- box-shadow: inset 0 -2px 0 #4caf50;
294
- }
295
- .nav-tabs > li > a {
296
- border: none;
297
- margin-right: 0;
298
- color: #666666;
299
- -webkit-box-shadow: inset 0 -1px 0 #dddddd;
300
- box-shadow: inset 0 -1px 0 #dddddd;
301
- -webkit-transition: all 0.2s;
302
- -o-transition: all 0.2s;
303
- transition: all 0.2s;
304
- }
305
- .nav-tabs > li > a:hover {
306
- background-color: transparent;
307
- -webkit-box-shadow: inset 0 -2px 0 #2196f3;
308
- box-shadow: inset 0 -2px 0 #2196f3;
309
- color: #2196f3;
310
- }
311
- .nav-tabs > li.active > a {
312
- border: none;
313
- -webkit-box-shadow: inset 0 -2px 0 #2196f3;
314
- box-shadow: inset 0 -2px 0 #2196f3;
315
- color: #2196f3;
316
- }
317
- .nav-tabs > li.active > a:hover {
318
- border: none;
319
- color: #2196f3;
320
- }
321
- .nav-tabs > li.disabled > a {
322
- -webkit-box-shadow: inset 0 -1px 0 #dddddd;
323
- box-shadow: inset 0 -1px 0 #dddddd;
324
- }
325
- .nav-tabs.nav-justified > li > a,
326
- .nav-tabs.nav-justified > li > a:hover,
327
- .nav-tabs.nav-justified > .active > a,
328
- .nav-tabs.nav-justified > .active > a:hover {
329
- border: none;
330
- }
331
- .nav-tabs .dropdown-menu {
332
- margin-top: 0;
333
- }
152
+
153
+ &:focus {
154
+ @include box-shadow(inset 0 -2px 0 $brand-primary);
155
+ }
156
+ }
157
+
158
+ .has-warning {
159
+ input,
160
+ .form-control,
161
+ input:focus,
162
+ .form-control:focus {
163
+ @include box-shadow(inset 0 -2px 0 $brand-warning);
164
+ }
165
+ }
166
+
167
+ .has-error {
168
+ input,
169
+ .form-control,
170
+ input:focus,
171
+ .form-control:focus {
172
+ @include box-shadow(inset 0 -2px 0 $brand-danger);
173
+ }
174
+ }
175
+
176
+ .has-success {
177
+ input,
178
+ .form-control,
179
+ input:focus,
180
+ .form-control:focus {
181
+ @include box-shadow(inset 0 -2px 0 $brand-success);
182
+ }
183
+ }
184
+
185
+ // Navs =======================================================================
186
+
187
+ .nav-tabs {
188
+ & > li > a {
189
+ border: none;
190
+ margin-right: 0;
191
+ color: $navbar-default-link-color;
192
+ @include box-shadow(inset 0 -1px 0 #ddd);
193
+ @include transition(all 0.2s);
194
+
195
+ &:hover {
196
+ background-color: transparent;
197
+ @include box-shadow(inset 0 -2px 0 $brand-primary);
198
+ color: $brand-primary;
199
+ }
200
+ }
201
+
202
+ & > li.active > a {
203
+ border: none;
204
+ @include box-shadow(inset 0 -2px 0 $brand-primary);
205
+ color: $brand-primary;
206
+
207
+ &:hover {
208
+ border: none;
209
+ color: $brand-primary;
210
+ }
211
+ }
212
+
213
+ & > li.disabled > a {
214
+ @include box-shadow(inset 0 -1px 0 #ddd);
215
+ }
216
+
217
+ &.nav-justified {
218
+
219
+ & > li > a,
220
+ & > li > a:hover,
221
+ & > .active > a,
222
+ & > .active > a:hover {
223
+ border: none;
224
+ }
225
+ }
226
+
227
+ .dropdown-menu {
228
+ margin-top: 0;
229
+ }
230
+ }
231
+
334
232
  .dropdown-menu {
335
233
  border: none;
336
- -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
337
- box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
234
+ @include box-shadow(0 1px 4px rgba(0,0,0,.3));
338
235
  }
236
+
237
+ // Indicators =================================================================
238
+
339
239
  .alert {
340
240
  border: none;
341
241
  color: #fff;
342
- }
343
- .alert-success {
344
- background-color: #4caf50;
345
- }
346
- .alert-info {
347
- background-color: #9c27b0;
348
- }
349
- .alert-warning {
350
- background-color: #ff9800;
351
- }
352
- .alert-danger {
353
- background-color: #e51c23;
354
- }
355
- .alert a:not(.close),
356
- .alert .alert-link {
357
- color: #fff;
358
- font-weight: bold;
359
- }
360
- .alert .close {
361
- color: #fff;
362
- }
242
+
243
+ &-success {
244
+ background-color: $brand-success;
245
+ }
246
+
247
+ &-info {
248
+ background-color: $brand-info;
249
+ }
250
+
251
+ &-warning {
252
+ background-color: $brand-warning;
253
+ }
254
+
255
+ &-danger {
256
+ background-color: $brand-danger;
257
+ }
258
+
259
+ a:not(.close),
260
+ .alert-link {
261
+ color: #fff;
262
+ font-weight: bold;
263
+ }
264
+
265
+ .close {
266
+ color: #fff;
267
+ }
268
+ }
269
+
363
270
  .badge {
364
271
  padding: 3px 6px 5px;
365
272
  }
273
+
366
274
  .progress {
367
275
  position: relative;
368
276
  z-index: 1;
369
277
  height: 6px;
370
278
  border-radius: 0;
371
- -webkit-box-shadow: none;
372
- box-shadow: none;
373
- }
374
- .progress-bar {
375
- -webkit-box-shadow: none;
376
- box-shadow: none;
377
- }
378
- .progress-bar:last-child {
379
- border-radius: 0 3px 3px 0;
380
- }
381
- .progress-bar:last-child:before {
382
- display: block;
383
- content: 'div::before';
384
- position: absolute;
385
- width: 100%;
386
- height: 100%;
387
- left: 0;
388
- right: 0;
389
- z-index: -1;
390
- background-color: #cae6fc;
391
- }
392
- .progress-bar-success:last-child.progress-bar:before {
393
- background-color: #c7e7c8;
394
- }
395
- .progress-bar-info:last-child.progress-bar:before {
396
- background-color: #edc9f3;
397
- }
398
- .progress-bar-warning:last-child.progress-bar:before {
399
- background-color: #ffe0b3;
400
- }
401
- .progress-bar-danger:last-child.progress-bar:before {
402
- background-color: #f28e92;
403
- }
279
+
280
+ @include box-shadow(none);
281
+
282
+ &-bar {
283
+ @include box-shadow(none);
284
+
285
+ &:last-child {
286
+ border-radius: 0 3px 3px 0;
287
+ }
288
+
289
+ &:last-child {
290
+ &:before {
291
+ display: block;
292
+ content: 'div::before';
293
+ position: absolute;
294
+ width: 100%;
295
+ height: 100%;
296
+ left: 0;
297
+ right: 0;
298
+ z-index: -1;
299
+ background-color: lighten($progress-bar-bg, 35%);
300
+ }
301
+ }
302
+
303
+ &-success:last-child.progress-bar:before {
304
+ background-color: lighten($brand-success, 35%);
305
+ }
306
+
307
+ &-info:last-child.progress-bar:before {
308
+ background-color: lighten($brand-info, 45%);
309
+ }
310
+ &-warning:last-child.progress-bar:before {
311
+ background-color: lighten($brand-warning, 35%);
312
+ }
313
+
314
+ &-danger:last-child.progress-bar:before {
315
+ background-color: lighten($brand-danger, 25%);
316
+ }
317
+ }
318
+ }
319
+
320
+ // Progress bars ==============================================================
321
+
322
+ // Containers =================================================================
323
+
404
324
  .close {
405
325
  font-size: 34px;
406
326
  font-weight: 300;
407
327
  line-height: 24px;
408
328
  opacity: 0.6;
409
- }
410
- .close:hover {
411
- opacity: 1;
412
- }
413
- .list-group-item {
414
- padding: 15px;
415
- }
416
- .list-group-item-text {
417
- color: #bbbbbb;
418
- }
329
+
330
+ &:hover {
331
+ opacity: 1;
332
+ }
333
+ }
334
+
335
+ .list-group {
336
+
337
+ &-item {
338
+ padding: 15px;
339
+ }
340
+
341
+ &-item-text {
342
+ color: $gray-light;
343
+ }
344
+ }
345
+
419
346
  .well {
420
347
  border-radius: 0;
421
- -webkit-box-shadow: none;
422
- box-shadow: none;
348
+ @include box-shadow(none);
423
349
  }
350
+
424
351
  .panel {
425
352
  border: none;
426
353
  border-radius: 2px;
427
- -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
428
- box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
429
- }
430
- .panel-heading {
431
- border-bottom: none;
432
- }
433
- .panel-footer {
434
- border-top: none;
435
- }
436
- .panel-success .panel-heading {
437
- background-color: #4caf50;
438
- }
439
- .panel-success .panel-title {
440
- color: #fff;
441
- }
442
- .panel-info .panel-heading {
443
- background-color: #9c27b0;
444
- }
445
- .panel-info .panel-title {
446
- color: #fff;
447
- }
448
- .panel-warning .panel-heading {
449
- background-color: #ff9800;
450
- }
451
- .panel-warning .panel-title {
452
- color: #fff;
453
- }
454
- .panel-danger .panel-heading {
455
- background-color: #e51c23;
456
- }
457
- .panel-danger .panel-title {
458
- color: #fff;
459
- }
354
+ @include box-shadow(0 1px 4px rgba(0,0,0,.3));
355
+
356
+ &-heading {
357
+ border-bottom: none;
358
+ }
359
+
360
+ &-footer {
361
+ border-top: none;
362
+ }
363
+
364
+ &-success {
365
+ .panel-heading {
366
+ background-color: $brand-success;
367
+ }
368
+
369
+ .panel-title {
370
+ color: #fff;
371
+ }
372
+ }
373
+
374
+ &-info {
375
+ .panel-heading {
376
+ background-color: $brand-info;
377
+ }
378
+
379
+ .panel-title {
380
+ color: #fff;
381
+ }
382
+ }
383
+
384
+ &-warning {
385
+ .panel-heading {
386
+ background-color: $brand-warning;
387
+ }
388
+
389
+ .panel-title {
390
+ color: #fff;
391
+ }
392
+ }
393
+
394
+ &-danger {
395
+ .panel-heading {
396
+ background-color: $brand-danger;
397
+ }
398
+
399
+ .panel-title {
400
+ color: #fff;
401
+ }
402
+ }
403
+ }
404
+
460
405
  .popover {
461
406
  border: none;
462
- -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
463
- box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
407
+ @include box-shadow(0 1px 4px rgba(0,0,0,.3));
464
408
  }