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,115 +1,142 @@
1
+ // Simplex 3.3.1
2
+ // Bootswatch
3
+ // -----------------------------------------------------
4
+
1
5
  @import url("//fonts.googleapis.com/css?family=Open+Sans:400,700");
2
- .navbar-inverse .badge {
3
- background-color: #fff;
4
- color: #d9230f;
5
- }
6
+
7
+ @mixin btn-shadow($color){
8
+ @include gradient-vertical-three-colors(lighten($color, 3%), $color, 6%, darken($color, 3%));
9
+ filter: none;
10
+ border: 1px solid darken($color, 10%);
11
+ }
12
+
13
+ // Navbar =====================================================================
14
+
15
+ .navbar {
16
+
17
+ &-inverse {
18
+
19
+ .badge {
20
+ background-color: #fff;
21
+ color: $brand-primary;
22
+ }
23
+ }
24
+ }
25
+
26
+ // Buttons ====================================================================
27
+
6
28
  .btn {
7
- font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
29
+ font-family: $headings-font-family;
8
30
  }
31
+
9
32
  .btn-default,
10
33
  .btn-default:hover {
11
- background-image: -webkit-linear-gradient(#4f5151, #474949 6%, #3f4141);
12
- background-image: -o-linear-gradient(#4f5151, #474949 6%, #3f4141);
13
- background-image: linear-gradient(#4f5151, #474949 6%, #3f4141);
14
- background-repeat: no-repeat;
15
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff4f5151', endColorstr='#ff3f4141', GradientType=0);
16
- filter: none;
17
- border: 1px solid #2e2f2f;
34
+ @include btn-shadow($btn-default-bg);
18
35
  }
36
+
19
37
  .btn-primary,
20
38
  .btn-primary:hover {
21
- background-image: -webkit-linear-gradient(#e72510, #d9230f 6%, #cb210e);
22
- background-image: -o-linear-gradient(#e72510, #d9230f 6%, #cb210e);
23
- background-image: linear-gradient(#e72510, #d9230f 6%, #cb210e);
24
- background-repeat: no-repeat;
25
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe72510', endColorstr='#ffcb210e', GradientType=0);
26
- filter: none;
27
- border: 1px solid #a91b0c;
39
+ @include btn-shadow($btn-primary-bg);
28
40
  }
41
+
29
42
  .btn-success,
30
43
  .btn-success:hover {
31
- background-image: -webkit-linear-gradient(#4da309, #469408 6%, #3f8507);
32
- background-image: -o-linear-gradient(#4da309, #469408 6%, #3f8507);
33
- background-image: linear-gradient(#4da309, #469408 6%, #3f8507);
34
- background-repeat: no-repeat;
35
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff4da309', endColorstr='#ff3f8507', GradientType=0);
36
- filter: none;
37
- border: 1px solid #2f6405;
44
+ @include btn-shadow($btn-success-bg);
38
45
  }
46
+
39
47
  .btn-info,
40
48
  .btn-info:hover {
41
- background-image: -webkit-linear-gradient(#02a5de, #029acf 6%, #028fc0);
42
- background-image: -o-linear-gradient(#02a5de, #029acf 6%, #028fc0);
43
- background-image: linear-gradient(#02a5de, #029acf 6%, #028fc0);
44
- background-repeat: no-repeat;
45
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff02a5de', endColorstr='#ff028fc0', GradientType=0);
46
- filter: none;
47
- border: 1px solid #02749c;
49
+ @include btn-shadow($btn-info-bg);
48
50
  }
51
+
49
52
  .btn-warning,
50
53
  .btn-warning:hover {
51
- background-image: -webkit-linear-gradient(#a54caa, #9b479f 6%, #914294);
52
- background-image: -o-linear-gradient(#a54caa, #9b479f 6%, #914294);
53
- background-image: linear-gradient(#a54caa, #9b479f 6%, #914294);
54
- background-repeat: no-repeat;
55
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffa54caa', endColorstr='#ff914294', GradientType=0);
56
- filter: none;
57
- border: 1px solid #79377c;
54
+ @include btn-shadow($btn-warning-bg);
58
55
  }
56
+
59
57
  .btn-danger,
60
58
  .btn-danger:hover {
61
- background-image: -webkit-linear-gradient(#e08b27, #d9831f 6%, #cc7b1d);
62
- background-image: -o-linear-gradient(#e08b27, #d9831f 6%, #cc7b1d);
63
- background-image: linear-gradient(#e08b27, #d9831f 6%, #cc7b1d);
64
- background-repeat: no-repeat;
65
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe08b27', endColorstr='#ffcc7b1d', GradientType=0);
66
- filter: none;
67
- border: 1px solid #ac6819;
59
+ @include btn-shadow($btn-danger-bg);
68
60
  }
61
+
62
+ // Typography =================================================================
63
+
69
64
  body {
70
65
  font-weight: 200;
71
66
  }
67
+
68
+ // Tables =====================================================================
69
+
72
70
  th {
73
- color: #444444;
71
+ color: $headings-color;
74
72
  }
73
+
74
+ // Forms ======================================================================
75
+
75
76
  legend {
76
- color: #444444;
77
+ color: $headings-color;
77
78
  }
79
+
78
80
  label {
79
81
  font-weight: normal;
80
82
  }
81
- .has-warning .help-block,
82
- .has-warning .control-label {
83
- color: #d9831f;
84
- }
85
- .has-warning .form-control,
86
- .has-warning .form-control:focus {
87
- border-color: #d9831f;
88
- }
89
- .has-error .help-block,
90
- .has-error .control-label {
91
- color: #d9230f;
92
- }
93
- .has-error .form-control,
94
- .has-error .form-control:focus {
95
- border-color: #d9230f;
96
- }
97
- .has-success .help-block,
98
- .has-success .control-label {
99
- color: #469408;
100
- }
101
- .has-success .form-control,
102
- .has-success .form-control:focus {
103
- border-color: #469408;
104
- }
105
- .pager a {
106
- color: #444444;
107
- }
108
- .pager a:hover,
109
- .pager .active > a {
110
- border-color: #d9230f;
111
- color: #fff;
112
- }
113
- .pager .disabled > a {
114
- border-color: #dddddd;
115
- }
83
+
84
+ .has-warning {
85
+ .help-block,
86
+ .control-label {
87
+ color: $brand-danger;
88
+ }
89
+
90
+ .form-control,
91
+ .form-control:focus {
92
+ border-color: $brand-danger;
93
+ }
94
+ }
95
+
96
+ .has-error {
97
+ .help-block,
98
+ .control-label {
99
+ color: $brand-primary;
100
+ }
101
+
102
+ .form-control,
103
+ .form-control:focus {
104
+ border-color: $brand-primary;
105
+ }
106
+ }
107
+
108
+ .has-success {
109
+ .help-block,
110
+ .control-label {
111
+ color: $brand-success;
112
+ }
113
+
114
+ .form-control,
115
+ .form-control:focus {
116
+ border-color: $brand-success;
117
+ }
118
+ }
119
+
120
+ // Navs =======================================================================
121
+
122
+ .pager {
123
+ a {
124
+ color: $headings-color;
125
+ }
126
+
127
+ a:hover,
128
+ .active > a, {
129
+ border-color: $brand-primary;
130
+ color: #fff;
131
+ }
132
+
133
+ .disabled > a {
134
+ border-color: $pager-border;
135
+ }
136
+ }
137
+
138
+ // Indicators =================================================================
139
+
140
+ // Progress bars ==============================================================
141
+
142
+ // Containers =================================================================
@@ -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,422 +1,417 @@
1
- .navbar {
2
- background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
3
- background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
4
- background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
5
- background-repeat: no-repeat;
6
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
7
- filter: none;
8
- border: 1px solid rgba(0, 0, 0, 0.6);
9
- text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
10
- }
11
- .navbar-inverse {
12
- background-image: -webkit-linear-gradient(#8a9196, #7a8288 60%, #70787d);
13
- background-image: -o-linear-gradient(#8a9196, #7a8288 60%, #70787d);
14
- background-image: linear-gradient(#8a9196, #7a8288 60%, #70787d);
15
- background-repeat: no-repeat;
16
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff8a9196', endColorstr='#ff70787d', GradientType=0);
1
+ // Slate 3.3.1
2
+ // Bootswatch
3
+ // -----------------------------------------------------
4
+
5
+ @mixin btn-shadow($color){
6
+ @include gradient-vertical-three-colors(lighten($color, 6%), $color, 60%, darken($color, 4%));
17
7
  filter: none;
18
8
  }
19
- .navbar-inverse .badge {
20
- background-color: #5d6368;
21
- }
22
- .navbar-nav > li > a {
23
- border-right: 1px solid rgba(0, 0, 0, 0.2);
24
- border-left: 1px solid rgba(255, 255, 255, 0.1);
25
- }
26
- .navbar-nav > li > a:hover {
27
- background-image: -webkit-linear-gradient(#020202, #101112 40%, #191b1d);
28
- background-image: -o-linear-gradient(#020202, #101112 40%, #191b1d);
29
- background-image: linear-gradient(#020202, #101112 40%, #191b1d);
30
- background-repeat: no-repeat;
31
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff020202', endColorstr='#ff191b1d', GradientType=0);
9
+
10
+ @mixin btn-shadow-inverse($color){
11
+ @include gradient-vertical-three-colors(darken($color, 24%), darken($color, 18%), 40%, darken($color, 14%));
32
12
  filter: none;
33
- border-left-color: transparent;
34
- }
35
- .navbar .nav .open > a {
36
- border-color: transparent;
37
- }
38
- .navbar-nav > li.active > a {
39
- border-left-color: transparent;
40
- }
41
- .navbar-form {
42
- margin-left: 5px;
43
- margin-right: 5px;
44
13
  }
14
+
15
+ // Navbar =====================================================================
16
+
17
+ .navbar {
18
+
19
+ @include btn-shadow($navbar-default-bg);
20
+ border: 1px solid rgba(0, 0, 0, 0.6);
21
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
22
+
23
+ &-inverse {
24
+ @include btn-shadow($navbar-inverse-bg);
25
+
26
+ .badge {
27
+ background-color: $navbar-inverse-link-active-bg;
28
+ }
29
+ }
30
+
31
+ &-nav > li > a {
32
+ border-right: 1px solid rgba(0, 0, 0, 0.2);
33
+ border-left: 1px solid rgba(255, 255, 255, 0.1);
34
+
35
+ &:hover {
36
+ @include btn-shadow-inverse($navbar-default-bg);
37
+ border-left-color: transparent;
38
+ }
39
+ }
40
+
41
+ .nav .open > a {
42
+ border-color: transparent;
43
+ }
44
+
45
+ &-nav > li.active > a {
46
+ border-left-color: transparent;
47
+ }
48
+
49
+ &-form {
50
+ margin-left: 5px;
51
+ margin-right: 5px;
52
+ }
53
+ }
54
+
55
+ // Buttons ====================================================================
56
+
45
57
  .btn,
46
58
  .btn:hover {
47
59
  border-color: rgba(0, 0, 0, 0.6);
48
60
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
49
61
  }
62
+
50
63
  .btn-default {
51
- background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
52
- background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
53
- background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
54
- background-repeat: no-repeat;
55
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
56
- filter: none;
57
- }
58
- .btn-default:hover {
59
- background-image: -webkit-linear-gradient(#020202, #101112 40%, #191b1d);
60
- background-image: -o-linear-gradient(#020202, #101112 40%, #191b1d);
61
- background-image: linear-gradient(#020202, #101112 40%, #191b1d);
62
- background-repeat: no-repeat;
63
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff020202', endColorstr='#ff191b1d', GradientType=0);
64
- filter: none;
64
+ @include btn-shadow($btn-default-bg);
65
+
66
+ &:hover {
67
+ @include btn-shadow-inverse($btn-default-bg);
68
+ }
65
69
  }
70
+
66
71
  .btn-primary {
67
- background-image: -webkit-linear-gradient(#8a9196, #7a8288 60%, #70787d);
68
- background-image: -o-linear-gradient(#8a9196, #7a8288 60%, #70787d);
69
- background-image: linear-gradient(#8a9196, #7a8288 60%, #70787d);
70
- background-repeat: no-repeat;
71
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff8a9196', endColorstr='#ff70787d', GradientType=0);
72
- filter: none;
73
- }
74
- .btn-primary:hover {
75
- background-image: -webkit-linear-gradient(#404448, #4e5458 40%, #585e62);
76
- background-image: -o-linear-gradient(#404448, #4e5458 40%, #585e62);
77
- background-image: linear-gradient(#404448, #4e5458 40%, #585e62);
78
- background-repeat: no-repeat;
79
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff404448', endColorstr='#ff585e62', GradientType=0);
80
- filter: none;
72
+ @include btn-shadow($btn-primary-bg);
73
+
74
+ &:hover {
75
+ @include btn-shadow-inverse($btn-primary-bg);
76
+ }
81
77
  }
78
+
82
79
  .btn-success {
83
- background-image: -webkit-linear-gradient(#78cc78, #62c462 60%, #53be53);
84
- background-image: -o-linear-gradient(#78cc78, #62c462 60%, #53be53);
85
- background-image: linear-gradient(#78cc78, #62c462 60%, #53be53);
86
- background-repeat: no-repeat;
87
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff78cc78', endColorstr='#ff53be53', GradientType=0);
88
- filter: none;
89
- }
90
- .btn-success:hover {
91
- background-image: -webkit-linear-gradient(#2f7d2f, #379337 40%, #3da23d);
92
- background-image: -o-linear-gradient(#2f7d2f, #379337 40%, #3da23d);
93
- background-image: linear-gradient(#2f7d2f, #379337 40%, #3da23d);
94
- background-repeat: no-repeat;
95
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff2f7d2f', endColorstr='#ff3da23d', GradientType=0);
96
- filter: none;
80
+ @include btn-shadow($btn-success-bg);
81
+
82
+ &:hover {
83
+ @include btn-shadow-inverse($btn-success-bg);
84
+ }
97
85
  }
86
+
98
87
  .btn-info {
99
- background-image: -webkit-linear-gradient(#74cae3, #5bc0de 60%, #4ab9db);
100
- background-image: -o-linear-gradient(#74cae3, #5bc0de 60%, #4ab9db);
101
- background-image: linear-gradient(#74cae3, #5bc0de 60%, #4ab9db);
102
- background-repeat: no-repeat;
103
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff74cae3', endColorstr='#ff4ab9db', GradientType=0);
104
- filter: none;
105
- }
106
- .btn-info:hover {
107
- background-image: -webkit-linear-gradient(#20829f, #2596b8 40%, #28a4c9);
108
- background-image: -o-linear-gradient(#20829f, #2596b8 40%, #28a4c9);
109
- background-image: linear-gradient(#20829f, #2596b8 40%, #28a4c9);
110
- background-repeat: no-repeat;
111
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff20829f', endColorstr='#ff28a4c9', GradientType=0);
112
- filter: none;
88
+ @include btn-shadow($btn-info-bg);
89
+
90
+ &:hover {
91
+ @include btn-shadow-inverse($btn-info-bg);
92
+ }
113
93
  }
94
+
114
95
  .btn-warning {
115
- background-image: -webkit-linear-gradient(#faa123, #f89406 60%, #e48806);
116
- background-image: -o-linear-gradient(#faa123, #f89406 60%, #e48806);
117
- background-image: linear-gradient(#faa123, #f89406 60%, #e48806);
118
- background-repeat: no-repeat;
119
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffaa123', endColorstr='#ffe48806', GradientType=0);
120
- filter: none;
121
- }
122
- .btn-warning:hover {
123
- background-image: -webkit-linear-gradient(#804d03, #9e5f04 40%, #b26a04);
124
- background-image: -o-linear-gradient(#804d03, #9e5f04 40%, #b26a04);
125
- background-image: linear-gradient(#804d03, #9e5f04 40%, #b26a04);
126
- background-repeat: no-repeat;
127
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff804d03', endColorstr='#ffb26a04', GradientType=0);
128
- filter: none;
96
+ @include btn-shadow($btn-warning-bg);
97
+
98
+ &:hover {
99
+ @include btn-shadow-inverse($btn-warning-bg);
100
+ }
129
101
  }
102
+
130
103
  .btn-danger {
131
- background-image: -webkit-linear-gradient(#f17a77, #ee5f5b 60%, #ec4d49);
132
- background-image: -o-linear-gradient(#f17a77, #ee5f5b 60%, #ec4d49);
133
- background-image: linear-gradient(#f17a77, #ee5f5b 60%, #ec4d49);
134
- background-repeat: no-repeat;
135
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff17a77', endColorstr='#ffec4d49', GradientType=0);
136
- filter: none;
137
- }
138
- .btn-danger:hover {
139
- background-image: -webkit-linear-gradient(#bb1813, #d71c16 40%, #e7201a);
140
- background-image: -o-linear-gradient(#bb1813, #d71c16 40%, #e7201a);
141
- background-image: linear-gradient(#bb1813, #d71c16 40%, #e7201a);
142
- background-repeat: no-repeat;
143
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffbb1813', endColorstr='#ffe7201a', GradientType=0);
144
- filter: none;
104
+ @include btn-shadow($btn-danger-bg);
105
+
106
+ &:hover {
107
+ @include btn-shadow-inverse($btn-danger-bg);
108
+ }
145
109
  }
110
+
146
111
  .btn-link,
147
112
  .btn-link:hover {
148
113
  border-color: transparent;
149
114
  }
150
- h1,
151
- h2,
152
- h3,
153
- h4,
154
- h5,
155
- h6 {
115
+
116
+ // Typography =================================================================
117
+
118
+ h1, h2, h3, h4, h5, h6 {
156
119
  text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.3);
157
120
  }
121
+
158
122
  .text-primary,
159
123
  .text-primary:hover {
160
- color: #7a8288;
124
+ color: $brand-primary;
161
125
  }
126
+
162
127
  .text-success,
163
128
  .text-success:hover {
164
- color: #62c462;
129
+ color: $brand-success;
165
130
  }
131
+
166
132
  .text-danger,
167
133
  .text-danger:hover {
168
- color: #ee5f5b;
134
+ color: $brand-danger;
169
135
  }
136
+
170
137
  .text-warning,
171
138
  .text-warning:hover {
172
- color: #f89406;
139
+ color: $brand-warning;
173
140
  }
141
+
174
142
  .text-info,
175
143
  .text-info:hover {
176
- color: #5bc0de;
177
- }
178
- .table .success,
179
- .table .warning,
180
- .table .danger,
181
- .table .info {
182
- color: #fff;
183
- }
184
- .table-bordered tbody tr.success td,
185
- .table-bordered tbody tr.warning td,
186
- .table-bordered tbody tr.danger td,
187
- .table-bordered tbody tr.success:hover td,
188
- .table-bordered tbody tr.warning:hover td,
189
- .table-bordered tbody tr.danger:hover td {
190
- border-color: #1c1e22;
191
- }
144
+ color: $brand-info;
145
+ }
146
+
147
+ // Tables =====================================================================
148
+
149
+ .table {
150
+
151
+ .success,
152
+ .warning,
153
+ .danger,
154
+ .info {
155
+ color: #fff;
156
+ }
157
+
158
+ &-bordered tbody {
159
+
160
+ tr.success,
161
+ tr.warning,
162
+ tr.danger {
163
+
164
+ td,
165
+ &:hover td {
166
+ border-color: $table-border-color;
167
+ }
168
+ }
169
+ }
170
+ }
171
+
192
172
  .table-responsive > .table {
193
- background-color: #2e3338;
173
+ background-color: $table-bg;
194
174
  }
175
+
176
+ // Forms ======================================================================
177
+
195
178
  input,
196
179
  textarea {
197
- color: #272b30;
198
- }
199
- .has-warning .help-block,
200
- .has-warning .control-label,
201
- .has-warning .form-control-feedback {
202
- color: #f89406;
203
- }
204
- .has-warning .form-control,
205
- .has-warning .form-control:focus {
206
- border-color: #f89406;
207
- }
208
- .has-warning .input-group-addon {
209
- background-color: #272b30;
210
- border: none;
211
- }
212
- .has-error .help-block,
213
- .has-error .control-label,
214
- .has-error .form-control-feedback {
215
- color: #ee5f5b;
216
- }
217
- .has-error .form-control,
218
- .has-error .form-control:focus {
219
- border-color: #ee5f5b;
220
- }
221
- .has-error .input-group-addon {
222
- background-color: #272b30;
223
- border: none;
224
- }
225
- .has-success .help-block,
226
- .has-success .control-label,
227
- .has-success .form-control-feedback {
228
- color: #62c462;
229
- }
230
- .has-success .form-control,
231
- .has-success .form-control:focus {
232
- border-color: #62c462;
233
- }
234
- .has-success .input-group-addon {
235
- background-color: #272b30;
236
- border: none;
237
- }
180
+ color: $input-color;
181
+ }
182
+
183
+ .has-warning {
184
+ .help-block,
185
+ .control-label,
186
+ .form-control-feedback {
187
+ color: $brand-warning;
188
+ }
189
+
190
+ .form-control,
191
+ .form-control:focus {
192
+ border-color: $brand-warning;
193
+ }
194
+
195
+ .input-group-addon {
196
+ background-color: $body-bg;
197
+ border: none;
198
+ }
199
+ }
200
+
201
+ .has-error {
202
+ .help-block,
203
+ .control-label,
204
+ .form-control-feedback {
205
+ color: $brand-danger;
206
+ }
207
+
208
+ .form-control,
209
+ .form-control:focus {
210
+ border-color: $brand-danger;
211
+ }
212
+
213
+ .input-group-addon {
214
+ background-color: $body-bg;
215
+ border: none;
216
+ }
217
+ }
218
+
219
+ .has-success {
220
+ .help-block,
221
+ .control-label,
222
+ .form-control-feedback {
223
+ color: $brand-success;
224
+ }
225
+
226
+ .form-control,
227
+ .form-control:focus {
228
+ border-color: $brand-success;
229
+ }
230
+
231
+ .input-group-addon {
232
+ background-color: $body-bg;
233
+ border: none;
234
+ }
235
+ }
236
+
238
237
  legend {
239
238
  color: #fff;
240
239
  }
240
+
241
241
  .input-group-addon {
242
242
  border-color: rgba(0, 0, 0, 0.6);
243
243
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
244
- background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
245
- background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
246
- background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
247
- background-repeat: no-repeat;
248
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
249
- filter: none;
250
- color: #ffffff;
251
- }
252
- .nav .open > a,
253
- .nav .open > a:hover,
254
- .nav .open > a:focus {
255
- border-color: rgba(0, 0, 0, 0.6);
256
- }
257
- .nav-pills > li > a {
258
- background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
259
- background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
260
- background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
261
- background-repeat: no-repeat;
262
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
263
- filter: none;
264
- border: 1px solid rgba(0, 0, 0, 0.6);
265
- text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
266
- }
267
- .nav-pills > li > a:hover {
268
- background-image: -webkit-linear-gradient(#020202, #101112 40%, #191b1d);
269
- background-image: -o-linear-gradient(#020202, #101112 40%, #191b1d);
270
- background-image: linear-gradient(#020202, #101112 40%, #191b1d);
271
- background-repeat: no-repeat;
272
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff020202', endColorstr='#ff191b1d', GradientType=0);
273
- filter: none;
274
- border: 1px solid rgba(0, 0, 0, 0.6);
275
- }
276
- .nav-pills > li.active > a,
277
- .nav-pills > li.active > a:hover {
278
- background-color: none;
279
- background-image: -webkit-linear-gradient(#020202, #101112 40%, #191b1d);
280
- background-image: -o-linear-gradient(#020202, #101112 40%, #191b1d);
281
- background-image: linear-gradient(#020202, #101112 40%, #191b1d);
282
- background-repeat: no-repeat;
283
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff020202', endColorstr='#ff191b1d', GradientType=0);
284
- filter: none;
285
- border: 1px solid rgba(0, 0, 0, 0.6);
286
- }
287
- .nav-pills > li.disabled > a,
288
- .nav-pills > li.disabled > a:hover {
289
- background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
290
- background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
291
- background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
292
- background-repeat: no-repeat;
293
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
294
- filter: none;
295
- }
296
- .pagination > li > a,
297
- .pagination > li > span {
298
- text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
299
- background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
300
- background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
301
- background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
302
- background-repeat: no-repeat;
303
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
304
- filter: none;
305
- }
306
- .pagination > li > a:hover,
307
- .pagination > li > span:hover {
308
- background-image: -webkit-linear-gradient(#020202, #101112 40%, #191b1d);
309
- background-image: -o-linear-gradient(#020202, #101112 40%, #191b1d);
310
- background-image: linear-gradient(#020202, #101112 40%, #191b1d);
311
- background-repeat: no-repeat;
312
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff020202', endColorstr='#ff191b1d', GradientType=0);
313
- filter: none;
314
- }
315
- .pagination > li.active > a,
316
- .pagination > li.active > span {
317
- background-image: -webkit-linear-gradient(#020202, #101112 40%, #191b1d);
318
- background-image: -o-linear-gradient(#020202, #101112 40%, #191b1d);
319
- background-image: linear-gradient(#020202, #101112 40%, #191b1d);
320
- background-repeat: no-repeat;
321
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff020202', endColorstr='#ff191b1d', GradientType=0);
322
- filter: none;
323
- }
324
- .pagination > li.disabled > a,
325
- .pagination > li.disabled > a:hover,
326
- .pagination > li.disabled > span,
327
- .pagination > li.disabled > span:hover {
328
- background-color: transparent;
329
- background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
330
- background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
331
- background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
332
- background-repeat: no-repeat;
333
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
334
- filter: none;
335
- }
336
- .pager > li > a {
337
- background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
338
- background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
339
- background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
340
- background-repeat: no-repeat;
341
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
342
- filter: none;
343
- text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
344
- }
345
- .pager > li > a:hover {
346
- background-image: -webkit-linear-gradient(#020202, #101112 40%, #191b1d);
347
- background-image: -o-linear-gradient(#020202, #101112 40%, #191b1d);
348
- background-image: linear-gradient(#020202, #101112 40%, #191b1d);
349
- background-repeat: no-repeat;
350
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff020202', endColorstr='#ff191b1d', GradientType=0);
351
- filter: none;
352
- }
353
- .pager > li.disabled > a,
354
- .pager > li.disabled > a:hover {
355
- background-color: transparent;
356
- background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
357
- background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
358
- background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
359
- background-repeat: no-repeat;
360
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
361
- filter: none;
362
- }
244
+ @include btn-shadow($btn-default-bg);
245
+ color: $btn-default-color;
246
+ }
247
+
248
+ // Navs =======================================================================
249
+
250
+ .nav {
251
+
252
+ .open > a,
253
+ .open > a:hover,
254
+ .open > a:focus {
255
+ border-color: rgba(0, 0, 0, 0.6);
256
+ }
257
+
258
+ }
259
+
260
+ .nav-pills {
261
+
262
+ & > li > a {
263
+ @include btn-shadow($btn-default-bg);
264
+ border: 1px solid rgba(0, 0, 0, 0.6);
265
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
266
+
267
+ &:hover {
268
+ @include btn-shadow-inverse($btn-default-bg);
269
+ border: 1px solid rgba(0, 0, 0, 0.6);
270
+ }
271
+ }
272
+
273
+ & > li.active > a,
274
+ & > li.active > a:hover {
275
+ background-color: none;
276
+ @include btn-shadow-inverse($btn-default-bg);
277
+ border: 1px solid rgba(0, 0, 0, 0.6);
278
+ }
279
+
280
+ & > li.disabled > a,
281
+ & > li.disabled > a:hover {
282
+ @include btn-shadow($btn-default-bg);
283
+ }
284
+ }
285
+
286
+ .pagination {
287
+
288
+ & > li > a,
289
+ & > li > span {
290
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
291
+ @include btn-shadow($btn-default-bg);
292
+
293
+ &:hover {
294
+ @include btn-shadow-inverse($btn-default-bg);
295
+ }
296
+ }
297
+
298
+ & > li.active > a,
299
+ & > li.active > span {
300
+ @include btn-shadow-inverse($btn-default-bg);
301
+ }
302
+
303
+ & > li.disabled > a,
304
+ & > li.disabled > a:hover,
305
+ & > li.disabled > span,
306
+ & > li.disabled > span:hover {
307
+ background-color: transparent;
308
+ @include btn-shadow($btn-default-bg);
309
+ }
310
+ }
311
+
312
+ .pager {
313
+
314
+ & > li > a {
315
+ @include btn-shadow($btn-default-bg);
316
+ text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
317
+
318
+ &:hover {
319
+ @include btn-shadow-inverse($btn-default-bg);
320
+ }
321
+ }
322
+
323
+ & > li.disabled > a,
324
+ & > li.disabled > a:hover {
325
+ background-color: transparent;
326
+ @include btn-shadow($btn-default-bg);
327
+ }
328
+ }
329
+
363
330
  .breadcrumb {
364
331
  border: 1px solid rgba(0, 0, 0, 0.6);
365
332
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
366
- background-image: -webkit-linear-gradient(#484e55, #3a3f44 60%, #313539);
367
- background-image: -o-linear-gradient(#484e55, #3a3f44 60%, #313539);
368
- background-image: linear-gradient(#484e55, #3a3f44 60%, #313539);
369
- background-repeat: no-repeat;
370
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff484e55', endColorstr='#ff313539', GradientType=0);
371
- filter: none;
372
- }
373
- .alert .alert-link,
374
- .alert a {
375
- color: #fff;
376
- text-decoration: underline;
377
- }
378
- .alert .close {
379
- color: #000000;
380
- text-decoration: none;
381
- }
333
+ @include btn-shadow($btn-default-bg);
334
+ }
335
+
336
+ // Indicators =================================================================
337
+
338
+ .alert {
339
+
340
+ .alert-link,
341
+ a {
342
+ color: #fff;
343
+ text-decoration: underline;
344
+ }
345
+
346
+ .close {
347
+ color: $close-color;
348
+ text-decoration: none;
349
+ }
350
+ }
351
+
352
+ // Progress bars ==============================================================
353
+
354
+ // Containers =================================================================
355
+
382
356
  a.thumbnail:hover,
383
357
  a.thumbnail:focus,
384
358
  a.thumbnail.active {
385
- border-color: #0c0d0e;
386
- }
387
- a.list-group-item.active,
388
- a.list-group-item.active:hover,
389
- a.list-group-item.active:focus {
390
- border-color: rgba(0, 0, 0, 0.6);
391
- }
392
- a.list-group-item-success.active {
393
- background-color: #62c462;
394
- }
395
- a.list-group-item-success.active:hover,
396
- a.list-group-item-success.active:focus {
397
- background-color: #4fbd4f;
398
- }
399
- a.list-group-item-warning.active {
400
- background-color: #f89406;
401
- }
402
- a.list-group-item-warning.active:hover,
403
- a.list-group-item-warning.active:focus {
404
- background-color: #df8505;
405
- }
406
- a.list-group-item-danger.active {
407
- background-color: #ee5f5b;
408
- }
409
- a.list-group-item-danger.active:hover,
410
- a.list-group-item-danger.active:focus {
411
- background-color: #ec4844;
412
- }
359
+ border-color: $thumbnail-border;
360
+ }
361
+
362
+ a.list-group-item {
363
+
364
+ &.active,
365
+ &.active:hover,
366
+ &.active:focus {
367
+ border-color: $list-group-border;
368
+ }
369
+
370
+ &-success {
371
+ &.active {
372
+ background-color: $state-success-bg;
373
+ }
374
+
375
+ &.active:hover,
376
+ &.active:focus {
377
+ background-color: darken($state-success-bg, 5%);
378
+ }
379
+ }
380
+
381
+ &-warning {
382
+ &.active {
383
+ background-color: $state-warning-bg;
384
+ }
385
+
386
+ &.active:hover,
387
+ &.active:focus {
388
+ background-color: darken($state-warning-bg, 5%);
389
+ }
390
+ }
391
+
392
+ &-danger {
393
+ &.active {
394
+ background-color: $state-danger-bg;
395
+ }
396
+
397
+ &.active:hover,
398
+ &.active:focus {
399
+ background-color: darken($state-danger-bg, 5%);
400
+ }
401
+ }
402
+ }
403
+
413
404
  .jumbotron {
414
405
  border: 1px solid rgba(0, 0, 0, 0.6);
415
406
  }
416
- .panel-primary .panel-heading,
417
- .panel-success .panel-heading,
418
- .panel-danger .panel-heading,
419
- .panel-warning .panel-heading,
420
- .panel-info .panel-heading {
421
- border-color: #000;
422
- }
407
+
408
+ .panel-primary,
409
+ .panel-success,
410
+ .panel-danger,
411
+ .panel-warning,
412
+ .panel-info {
413
+
414
+ .panel-heading {
415
+ border-color: #000;
416
+ }
417
+ }