bootswatch-sass 3.3.1.3 → 3.3.1.4

Sign up to get free protection for your applications and to get access to all the features.
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: inherit;
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,68 +1,120 @@
1
+ // Journal 3.3.1
2
+ // Bootswatch
3
+ // -----------------------------------------------------
4
+
1
5
  @import url("//fonts.googleapis.com/css?family=News+Cycle:400,700");
6
+
7
+ // Navbar =====================================================================
8
+
2
9
  .navbar {
3
10
  font-size: 18px;
4
- font-family: "News Cycle", "Arial Narrow Bold", sans-serif;
5
- font-weight: 700;
6
- }
7
- .navbar-default .badge {
8
- background-color: #000;
9
- color: #fff;
10
- }
11
- .navbar-inverse .badge {
12
- background-color: #fff;
13
- color: #eb6864;
11
+ font-family: $font-family-sans-serif;
12
+ font-weight: $headings-font-weight;
13
+
14
+ &-default {
15
+
16
+ .badge {
17
+ background-color: #000;
18
+ color: #fff;
19
+ }
20
+ }
21
+
22
+ &-inverse {
23
+
24
+ .badge {
25
+ background-color: #fff;
26
+ color: $navbar-inverse-bg;
27
+ }
28
+ }
14
29
  }
30
+
15
31
  .navbar-brand {
16
32
  font-size: 18px;
17
- font-weight: 700;
33
+ font-weight: $headings-font-weight;
18
34
  text-transform: uppercase;
19
35
  }
20
- .has-warning .help-block,
21
- .has-warning .control-label,
22
- .has-warning .form-control-feedback {
23
- color: #f57a00;
24
- }
25
- .has-warning .form-control,
26
- .has-warning .form-control:focus {
27
- border-color: #f57a00;
28
- }
29
- .has-error .help-block,
30
- .has-error .control-label,
31
- .has-error .form-control-feedback {
32
- color: #eb6864;
33
- }
34
- .has-error .form-control,
35
- .has-error .form-control:focus {
36
- border-color: #eb6864;
36
+
37
+ // Buttons ====================================================================
38
+
39
+ // Typography =================================================================
40
+
41
+ // Tables =====================================================================
42
+
43
+ // Forms ======================================================================
44
+
45
+ .has-warning {
46
+ .help-block,
47
+ .control-label,
48
+ .form-control-feedback {
49
+ color: $brand-danger;
50
+ }
51
+
52
+ .form-control,
53
+ .form-control:focus {
54
+ border-color: $brand-danger;
55
+ }
37
56
  }
38
- .has-success .help-block,
39
- .has-success .control-label,
40
- .has-success .form-control-feedback {
41
- color: #22b24c;
57
+
58
+ .has-error {
59
+ .help-block,
60
+ .control-label,
61
+ .form-control-feedback {
62
+ color: $brand-primary;
63
+ }
64
+
65
+ .form-control,
66
+ .form-control:focus {
67
+ border-color: $brand-primary;
68
+ }
42
69
  }
43
- .has-success .form-control,
44
- .has-success .form-control:focus {
45
- border-color: #22b24c;
70
+
71
+ .has-success {
72
+ .help-block,
73
+ .control-label,
74
+ .form-control-feedback {
75
+ color: $brand-success;
76
+ }
77
+
78
+ .form-control,
79
+ .form-control:focus {
80
+ border-color: $brand-success;
81
+ }
46
82
  }
83
+
84
+ // Navs =======================================================================
85
+
86
+ // Indicators =================================================================
87
+
47
88
  .badge {
48
89
  padding-bottom: 4px;
49
90
  vertical-align: 3px;
50
91
  font-size: 10px;
51
92
  }
52
- .jumbotron h1,
53
- .jumbotron h2,
54
- .jumbotron h3,
55
- .jumbotron h4,
56
- .jumbotron h5,
57
- .jumbotron h6 {
58
- font-family: "News Cycle", "Arial Narrow Bold", sans-serif;
59
- font-weight: 700;
60
- color: #000;
93
+
94
+ // Progress bars ==============================================================
95
+
96
+ // Containers =================================================================
97
+
98
+ .jumbotron {
99
+
100
+ h1, h2, h3, h4, h5, h6 {
101
+ font-family: $font-family-sans-serif;
102
+ font-weight: $headings-font-weight;
103
+ color: #000;
104
+ }
61
105
  }
62
- .panel-primary .panel-title,
63
- .panel-success .panel-title,
64
- .panel-warning .panel-title,
65
- .panel-danger .panel-title,
66
- .panel-info .panel-title {
67
- color: #fff;
106
+
107
+ .panel {
108
+
109
+ &-primary,
110
+ &-success,
111
+ &-warning,
112
+ &-danger,
113
+ &-info {
114
+ .panel-title {
115
+ color: #fff;
116
+ }
117
+ }
118
+
119
+
68
120
  }
@@ -76,7 +76,7 @@ $headings-color: #000;
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,385 +1,481 @@
1
+ // Lumen 3.3.1
2
+ // Bootswatch
3
+ // -----------------------------------------------------
4
+
1
5
  @import url("//fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700,400italic");
2
- .navbar {
3
- border-width: 0 1px 4px 1px;
4
- }
6
+
7
+ @mixin shadow($width: 4px){
8
+ border-width: 0 1px $width 1px;
9
+ }
10
+
11
+ // Navbar =====================================================================
12
+
13
+ .navbar {
14
+ @include shadow();
15
+ }
16
+
17
+ // Buttons ====================================================================
18
+
5
19
  .btn {
6
- padding: 9px 12px 7px;
7
- border-width: 0 1px 4px 1px;
20
+ padding: $padding-base-vertical+2 $padding-base-horizontal $padding-base-vertical;
21
+ @include shadow();
8
22
  font-size: 12px;
9
23
  font-weight: bold;
10
24
  text-transform: uppercase;
11
- }
12
- .btn:hover {
13
- margin-top: 1px;
14
- border-bottom-width: 3px;
15
- }
16
- .btn:active {
17
- margin-top: 2px;
18
- border-bottom-width: 2px;
19
- -webkit-box-shadow: none;
20
- box-shadow: none;
21
- }
22
- .btn-lg,
23
- .btn-group-lg > .btn {
24
- padding: 15px 16px 13px;
25
- line-height: 15px;
26
- }
27
- .btn-sm,
28
- .btn-group-sm > .btn {
29
- padding: 6px 10px 4px;
30
- }
31
- .btn-xs,
32
- .btn-group-xs > .btn {
33
- padding: 3px 5px 1px;
34
- }
35
- .btn-default:hover,
36
- .btn-default:focus,
37
- .btn-group.open .dropdown-toggle.btn-default {
38
- background-color: #eeeeee;
39
- border-color: #e2e2e2;
40
- }
41
- .btn-primary:hover,
42
- .btn-primary:focus,
43
- .btn-group.open .dropdown-toggle.btn-primary {
44
- background-color: #158cba;
45
- border-color: #127ba3;
46
- }
47
- .btn-success:hover,
48
- .btn-success:focus,
49
- .btn-group.open .dropdown-toggle.btn-success {
50
- background-color: #28b62c;
51
- border-color: #23a127;
52
- }
53
- .btn-info:hover,
54
- .btn-info:focus,
55
- .btn-group.open .dropdown-toggle.btn-info {
56
- background-color: #75caeb;
57
- border-color: #5fc1e8;
58
- }
59
- .btn-warning:hover,
60
- .btn-warning:focus,
61
- .btn-group.open .dropdown-toggle.btn-warning {
62
- background-color: #ff851b;
63
- border-color: #ff7701;
64
- }
65
- .btn-danger:hover,
66
- .btn-danger:focus,
67
- .btn-group.open .dropdown-toggle.btn-danger {
68
- background-color: #ff4136;
69
- border-color: #ff291c;
70
- }
71
- .btn-group.open .dropdown-toggle {
72
- -webkit-box-shadow: none;
73
- box-shadow: none;
74
- }
75
- .navbar-btn:hover {
76
- margin-top: 8px;
77
- }
78
- .navbar-btn:active {
79
- margin-top: 9px;
80
- }
81
- .navbar-btn.btn-sm:hover {
82
- margin-top: 11px;
83
- }
84
- .navbar-btn.btn-sm:active {
85
- margin-top: 12px;
86
- }
87
- .navbar-btn.btn-xs:hover {
88
- margin-top: 15px;
89
- }
90
- .navbar-btn.btn-xs:active {
91
- margin-top: 16px;
92
- }
25
+
26
+ &:hover {
27
+ margin-top: 1px;
28
+ border-bottom-width: 3px;
29
+ }
30
+
31
+ &:active {
32
+ margin-top: 2px;
33
+ border-bottom-width: 2px;
34
+ @include box-shadow(none);
35
+ }
36
+
37
+ &-lg,
38
+ &-group-lg > .btn {
39
+ padding: $padding-large-vertical+2 $padding-large-horizontal $padding-large-vertical;
40
+ line-height: 15px;
41
+ }
42
+
43
+ &-sm,
44
+ &-group-sm > .btn {
45
+ padding: $padding-small-vertical+2 $padding-small-horizontal $padding-small-vertical;
46
+ }
47
+
48
+ &-xs,
49
+ &-group-xs > .btn {
50
+ padding: $padding-xs-vertical+2 $padding-xs-horizontal $padding-xs-vertical;
51
+ }
52
+
53
+ &-default:hover,
54
+ &-default:focus,
55
+ &-group.open .dropdown-toggle.btn-default {
56
+ background-color: $btn-default-bg;
57
+ border-color: $btn-default-border;
58
+ }
59
+
60
+ &-primary:hover,
61
+ &-primary:focus,
62
+ &-group.open .dropdown-toggle.btn-primary {
63
+ background-color: $btn-primary-bg;
64
+ border-color: $btn-primary-border;
65
+ }
66
+
67
+ &-success:hover,
68
+ &-success:focus,
69
+ &-group.open .dropdown-toggle.btn-success {
70
+ background-color: $btn-success-bg;
71
+ border-color: $btn-success-border;
72
+ }
73
+
74
+ &-info:hover,
75
+ &-info:focus,
76
+ &-group.open .dropdown-toggle.btn-info {
77
+ background-color: $btn-info-bg;
78
+ border-color: $btn-info-border;
79
+ }
80
+
81
+ &-warning:hover,
82
+ &-warning:focus,
83
+ &-group.open .dropdown-toggle.btn-warning {
84
+ background-color: $btn-warning-bg;
85
+ border-color: $btn-warning-border;
86
+ }
87
+
88
+ &-danger:hover,
89
+ &-danger:focus,
90
+ &-group.open .dropdown-toggle.btn-danger {
91
+ background-color: $btn-danger-bg;
92
+ border-color: $btn-danger-border;
93
+ }
94
+
95
+ &-group.open .dropdown-toggle {
96
+ @include box-shadow(none);
97
+ }
98
+ }
99
+
100
+ .navbar-btn {
101
+ &:hover {
102
+ margin-top: 8px
103
+ }
104
+
105
+ &:active {
106
+ margin-top: 9px
107
+ }
108
+
109
+ &.btn-sm {
110
+ &:hover {
111
+ margin-top: 11px
112
+ }
113
+
114
+ &:active {
115
+ margin-top: 12px
116
+ }
117
+ }
118
+
119
+ &.btn-xs {
120
+ &:hover {
121
+ margin-top: 15px
122
+ }
123
+
124
+ &:active {
125
+ margin-top: 16px
126
+ }
127
+ }
128
+ }
129
+
130
+ // Typography =================================================================
131
+
93
132
  .text-primary,
94
133
  .text-primary:hover {
95
- color: #158cba;
134
+ color: $brand-primary;
96
135
  }
136
+
97
137
  .text-success,
98
138
  .text-success:hover {
99
- color: #28b62c;
139
+ color: $brand-success;
100
140
  }
141
+
101
142
  .text-danger,
102
143
  .text-danger:hover {
103
- color: #ff4136;
144
+ color: $brand-danger;
104
145
  }
146
+
105
147
  .text-warning,
106
148
  .text-warning:hover {
107
- color: #ff851b;
149
+ color: $brand-warning;
108
150
  }
151
+
109
152
  .text-info,
110
153
  .text-info:hover {
111
- color: #75caeb;
112
- }
113
- table a:not(.btn),
114
- .table a:not(.btn) {
115
- text-decoration: underline;
116
- }
117
- table .dropdown-menu a,
118
- .table .dropdown-menu a {
119
- text-decoration: none;
120
- }
121
- table .success,
122
- .table .success,
123
- table .warning,
124
- .table .warning,
125
- table .danger,
126
- .table .danger,
127
- table .info,
128
- .table .info {
129
- color: #fff;
130
- }
131
- table .success a:not(.btn),
132
- .table .success a:not(.btn),
133
- table .warning a:not(.btn),
134
- .table .warning a:not(.btn),
135
- table .danger a:not(.btn),
136
- .table .danger a:not(.btn),
137
- table .info a:not(.btn),
138
- .table .info a:not(.btn) {
139
- color: #fff;
140
- }
141
- table > thead > tr > th,
142
- .table > thead > tr > th,
143
- table > tbody > tr > th,
144
- .table > tbody > tr > th,
145
- table > tfoot > tr > th,
146
- .table > tfoot > tr > th,
147
- table > thead > tr > td,
148
- .table > thead > tr > td,
149
- table > tbody > tr > td,
150
- .table > tbody > tr > td,
151
- table > tfoot > tr > td,
152
- .table > tfoot > tr > td {
153
- border-color: transparent;
154
- }
154
+ color: $brand-info;
155
+ }
156
+
157
+ // Tables =====================================================================
158
+
159
+ table,
160
+ .table {
161
+
162
+ a:not(.btn) {
163
+ text-decoration: underline;
164
+ }
165
+
166
+ .dropdown-menu a {
167
+ text-decoration: none;
168
+ }
169
+
170
+ .success,
171
+ .warning,
172
+ .danger,
173
+ .info {
174
+ color: #fff;
175
+
176
+ a:not(.btn) {
177
+ color: #fff;
178
+ }
179
+ }
180
+
181
+ > thead > tr > th,
182
+ > tbody > tr > th,
183
+ > tfoot > tr > th,
184
+ > thead > tr > td,
185
+ > tbody > tr > td,
186
+ > tfoot > tr > td {
187
+ border-color: transparent;
188
+ }
189
+ }
190
+
191
+ // Forms ======================================================================
192
+
155
193
  .form-control {
156
- -webkit-box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.075);
157
- box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.075);
194
+ @include box-shadow(inset 0 2px 0 rgba(0, 0, 0, 0.075));
158
195
  }
196
+
159
197
  label {
160
198
  font-weight: normal;
161
199
  }
162
- .has-warning .help-block,
163
- .has-warning .control-label,
164
- .has-warning .form-control-feedback {
165
- color: #ff851b;
166
- }
167
- .has-warning .form-control,
168
- .has-warning .form-control:focus {
169
- border: 1px solid #ff851b;
170
- -webkit-box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.075);
171
- box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.075);
172
- }
173
- .has-warning .input-group-addon {
174
- border: 1px solid #ff851b;
175
- }
176
- .has-error .help-block,
177
- .has-error .control-label,
178
- .has-error .form-control-feedback {
179
- color: #ff4136;
180
- }
181
- .has-error .form-control,
182
- .has-error .form-control:focus {
183
- border: 1px solid #ff4136;
184
- -webkit-box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.075);
185
- box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.075);
186
- }
187
- .has-error .input-group-addon {
188
- border: 1px solid #ff4136;
189
- }
190
- .has-success .help-block,
191
- .has-success .control-label,
192
- .has-success .form-control-feedback {
193
- color: #28b62c;
194
- }
195
- .has-success .form-control,
196
- .has-success .form-control:focus {
197
- border: 1px solid #28b62c;
198
- -webkit-box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.075);
199
- box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.075);
200
- }
201
- .has-success .input-group-addon {
202
- border: 1px solid #28b62c;
203
- }
204
- .nav .open > a,
205
- .nav .open > a:hover,
206
- .nav .open > a:focus {
207
- border-color: transparent;
208
- }
209
- .nav-tabs > li > a {
210
- margin-top: 6px;
211
- border-color: #e7e7e7;
212
- color: #333333;
213
- -webkit-transition: all 0.2s ease-in-out;
214
- -o-transition: all 0.2s ease-in-out;
215
- transition: all 0.2s ease-in-out;
216
- }
217
- .nav-tabs > li > a:hover,
218
- .nav-tabs > li > a:focus,
219
- .nav-tabs > li.active > a,
220
- .nav-tabs > li.active > a:hover,
221
- .nav-tabs > li.active > a:focus,
222
- .nav-tabs .open > a,
223
- .nav-tabs .open > a:hover,
224
- .nav-tabs .open > a:focus {
225
- padding-top: 16px;
226
- padding-bottom: 16px;
227
- margin-top: 0;
228
- }
229
- .nav-tabs .open > a,
230
- .nav-tabs .open > a:hover,
231
- .nav-tabs .open > a:focus {
232
- border-color: #e7e7e7;
233
- }
234
- .nav-tabs > li.disabled > a:hover,
235
- .nav-tabs > li.disabled > a:focus {
236
- padding-top: 13px;
237
- padding-bottom: 13px;
238
- margin-top: 6px;
239
- }
200
+
201
+ .has-warning {
202
+ .help-block,
203
+ .control-label,
204
+ .form-control-feedback {
205
+ color: $brand-warning;
206
+ }
207
+
208
+ .form-control,
209
+ .form-control:focus {
210
+ border: 1px solid $brand-warning;
211
+ @include box-shadow(inset 0 2px 0 rgba(0, 0, 0, 0.075));
212
+ }
213
+
214
+ .input-group-addon {
215
+ border: 1px solid $brand-warning;
216
+ }
217
+ }
218
+
219
+ .has-error {
220
+ .help-block,
221
+ .control-label,
222
+ .form-control-feedback {
223
+ color: $brand-danger;
224
+ }
225
+
226
+ .form-control,
227
+ .form-control:focus {
228
+ border: 1px solid $brand-danger;
229
+ @include box-shadow(inset 0 2px 0 rgba(0, 0, 0, 0.075));
230
+ }
231
+
232
+ .input-group-addon {
233
+ border: 1px solid $brand-danger;
234
+ }
235
+ }
236
+
237
+ .has-success {
238
+ .help-block,
239
+ .control-label,
240
+ .form-control-feedback {
241
+ color: $brand-success;
242
+ }
243
+
244
+ .form-control,
245
+ .form-control:focus {
246
+ border: 1px solid $brand-success;
247
+ @include box-shadow(inset 0 2px 0 rgba(0, 0, 0, 0.075));
248
+ }
249
+
250
+ .input-group-addon {
251
+ border: 1px solid $brand-success;
252
+ }
253
+ }
254
+
255
+ // Navs =======================================================================
256
+
257
+ .nav {
258
+ .open > a,
259
+ .open > a:hover,
260
+ .open > a:focus {
261
+ border-color: transparent;
262
+ }
263
+ }
264
+
265
+ .nav-tabs {
266
+
267
+ > li > a {
268
+ margin-top: 6px;
269
+ border-color: $navbar-default-border;
270
+ color: $gray-dark;
271
+ @include transition(all 0.2s ease-in-out);
272
+ }
273
+
274
+ > li > a:hover,
275
+ > li > a:focus,
276
+ > li.active > a,
277
+ > li.active > a:hover,
278
+ > li.active > a:focus,
279
+ .open > a,
280
+ .open > a:hover,
281
+ .open > a:focus {
282
+ padding-top: $padding-large-vertical + 3px;
283
+ padding-bottom: $padding-large-vertical + 3px;
284
+ margin-top: 0;
285
+ }
286
+
287
+ .open > a,
288
+ .open > a:hover,
289
+ .open > a:focus {
290
+ border-color: $navbar-default-border;
291
+ }
292
+
293
+ > li.disabled > a:hover,
294
+ > li.disabled > a:focus {
295
+ padding-top: $padding-large-vertical;
296
+ padding-bottom: $padding-large-vertical;
297
+ margin-top: 6px;
298
+ }
299
+ }
300
+
240
301
  .dropdown-menu {
241
302
  margin-top: 0;
242
- border-width: 0 1px 4px 1px;
303
+ @include shadow();
243
304
  border-top-width: 1px;
244
- -webkit-box-shadow: none;
245
- box-shadow: none;
305
+ @include box-shadow(none);
246
306
  }
307
+
247
308
  .breadcrumb {
248
- border-color: #ededed;
309
+ border-color: darken($breadcrumb-bg, 5%);
249
310
  border-style: solid;
250
- border-width: 0 1px 4px 1px;
251
- }
252
- .pagination > li > a,
253
- .pager > li > a,
254
- .pagination > li > span,
255
- .pager > li > span {
256
- position: relative;
257
- top: 0;
258
- border-width: 0 1px 4px 1px;
259
- color: #555555;
260
- font-size: 12px;
261
- font-weight: bold;
262
- text-transform: uppercase;
263
- }
264
- .pagination > li > a:hover,
265
- .pager > li > a:hover,
266
- .pagination > li > span:hover,
267
- .pager > li > span:hover {
268
- top: 1px;
269
- border-bottom-width: 3px;
270
- }
271
- .pagination > li > a:active,
272
- .pager > li > a:active,
273
- .pagination > li > span:active,
274
- .pager > li > span:active {
275
- top: 2px;
276
- border-bottom-width: 2px;
277
- }
278
- .pagination > .disabled > a:hover,
279
- .pager > .disabled > a:hover,
280
- .pagination > .disabled > span:hover,
281
- .pager > .disabled > span:hover {
282
- top: 0;
283
- border-width: 0 1px 4px 1px;
284
- }
285
- .pagination > .disabled > a:active,
286
- .pager > .disabled > a:active,
287
- .pagination > .disabled > span:active,
288
- .pager > .disabled > span:active {
289
- top: 0;
290
- border-width: 0 1px 4px 1px;
291
- }
292
- .pager > li > a,
293
- .pager > li > span,
294
- .pager > .disabled > a,
295
- .pager > .disabled > span,
296
- .pager > li > a:hover,
297
- .pager > li > span:hover,
298
- .pager > .disabled > a:hover,
299
- .pager > .disabled > span:hover,
300
- .pager > li > a:active,
301
- .pager > li > span:active,
302
- .pager > .disabled > a:active,
303
- .pager > .disabled > span:active {
304
- border-left-width: 2px;
305
- border-right-width: 2px;
306
- }
311
+ @include shadow();
312
+ }
313
+
314
+ .pagination,
315
+ .pager {
316
+
317
+ > li > a,
318
+ > li > span {
319
+ position: relative;
320
+ top: 0;
321
+ @include shadow();
322
+ color: $pagination-color;
323
+ font-size: 12px;
324
+ font-weight: bold;
325
+ text-transform: uppercase;
326
+
327
+ &:hover {
328
+ top: 1px;
329
+ border-bottom-width: 3px;
330
+ }
331
+
332
+ &:active {
333
+ top: 2px;
334
+ border-bottom-width: 2px;
335
+ }
336
+ }
337
+
338
+ > .disabled > a,
339
+ > .disabled > span {
340
+
341
+ &:hover {
342
+ top: 0;
343
+ @include shadow();
344
+ }
345
+
346
+ &:active {
347
+ top: 0;
348
+ @include shadow();
349
+ }
350
+ }
351
+ }
352
+
353
+ .pager {
354
+
355
+ > li > a,
356
+ > li > span,
357
+ > .disabled > a,
358
+ > .disabled > span {
359
+
360
+ &,
361
+ &:hover,
362
+ &:active {
363
+ border-left-width: 2px;
364
+ border-right-width: 2px;
365
+ }
366
+ }
367
+ }
368
+
369
+ // Indicators =================================================================
370
+
307
371
  .close {
308
372
  color: #fff;
309
373
  text-decoration: none;
310
374
  opacity: 0.4;
311
- }
312
- .close:hover,
313
- .close:focus {
314
- color: #fff;
315
- opacity: 1;
316
- }
375
+
376
+ &:hover,
377
+ &:focus {
378
+ color: #fff;
379
+ opacity: 1;
380
+ }
381
+ }
382
+
317
383
  .alert {
318
- border-width: 0 1px 4px 1px;
319
- }
320
- .alert .alert-link {
321
- font-weight: normal;
322
- color: #fff;
323
- text-decoration: underline;
324
- }
384
+ @include shadow();
385
+
386
+ .alert-link {
387
+ font-weight: normal;
388
+ color: #fff;
389
+ text-decoration: underline;
390
+ }
391
+ }
392
+
325
393
  .label {
326
394
  font-weight: normal;
327
395
  }
396
+
397
+ // Progress bars ==============================================================
398
+
328
399
  .progress {
329
- border: 1px solid #e7e7e7;
330
- -webkit-box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.1);
331
- box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.1);
332
- }
333
- .progress-bar {
334
- -webkit-box-shadow: inset 0 -4px 0 rgba(0, 0, 0, 0.15);
335
- box-shadow: inset 0 -4px 0 rgba(0, 0, 0, 0.15);
336
- }
400
+ border: 1px solid $navbar-default-border;
401
+ @include box-shadow(inset 0 2px 0 rgba(0, 0, 0, 0.1));
402
+
403
+ &-bar {
404
+ @include box-shadow(inset 0 -4px 0 rgba(0, 0, 0, 0.15));
405
+ }
406
+ }
407
+
408
+ // Containers =================================================================
409
+
337
410
  .well {
338
- border: 1px solid #e7e7e7;
339
- -webkit-box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.05);
340
- box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.05);
341
- }
342
- a.list-group-item.active,
343
- a.list-group-item.active:hover,
344
- a.list-group-item.active:focus {
345
- border-color: #dddddd;
346
- }
347
- a.list-group-item-success.active {
348
- background-color: #28b62c;
349
- }
350
- a.list-group-item-success.active:hover,
351
- a.list-group-item-success.active:focus {
352
- background-color: #23a127;
353
- }
354
- a.list-group-item-warning.active {
355
- background-color: #ff851b;
356
- }
357
- a.list-group-item-warning.active:hover,
358
- a.list-group-item-warning.active:focus {
359
- background-color: #ff7701;
360
- }
361
- a.list-group-item-danger.active {
362
- background-color: #ff4136;
363
- }
364
- a.list-group-item-danger.active:hover,
365
- a.list-group-item-danger.active:focus {
366
- background-color: #ff291c;
367
- }
411
+ border: 1px solid $navbar-default-border;
412
+ @include box-shadow(inset 0 2px 0 rgba(0, 0, 0, 0.05));
413
+ }
414
+
415
+ a.list-group-item {
416
+
417
+ &.active,
418
+ &.active:hover,
419
+ &.active:focus {
420
+ border-color: $list-group-border;
421
+ }
422
+
423
+ &-success {
424
+ &.active {
425
+ background-color: $state-success-bg;
426
+ }
427
+
428
+ &.active:hover,
429
+ &.active:focus {
430
+ background-color: darken($state-success-bg, 5%);
431
+ }
432
+ }
433
+
434
+ &-warning {
435
+ &.active {
436
+ background-color: $state-warning-bg;
437
+ }
438
+
439
+ &.active:hover,
440
+ &.active:focus {
441
+ background-color: darken($state-warning-bg, 5%);
442
+ }
443
+ }
444
+
445
+ &-danger {
446
+ &.active {
447
+ background-color: $state-danger-bg;
448
+ }
449
+
450
+ &.active:hover,
451
+ &.active:focus {
452
+ background-color: darken($state-danger-bg, 5%);
453
+ }
454
+ }
455
+ }
456
+
368
457
  .jumbotron {
369
- border: 1px solid #e7e7e7;
370
- -webkit-box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.05);
371
- box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.05);
458
+ border: 1px solid $navbar-default-border;
459
+ @include box-shadow(inset 0 2px 0 rgba(0, 0, 0, 0.05));
372
460
  }
461
+
373
462
  .panel {
374
- border: 1px solid #e7e7e7;
375
- border-width: 0 1px 4px 1px;
376
- }
377
- .panel-default .close {
378
- color: #555555;
379
- }
380
- .modal .close {
381
- color: #555555;
382
- }
463
+ border: 1px solid $navbar-default-border;
464
+ @include shadow();
465
+
466
+ &-default {
467
+ .close {
468
+ color: $text-color;
469
+ }
470
+ }
471
+ }
472
+
473
+ .modal {
474
+ .close {
475
+ color: $text-color;
476
+ }
477
+ }
478
+
383
479
  .popover {
384
- color: #555555;
480
+ color: $text-color;
385
481
  }