@spark-hire/bootstrap-themes 0.2.2 → 0.2.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 (13) hide show
  1. package/css/dark.css +1 -1
  2. package/css/dark.map +1 -1
  3. package/css/light.css +1 -1
  4. package/css/light.map +1 -1
  5. package/html/dark.html +33 -27
  6. package/html/light.html +33 -27
  7. package/package.json +1 -1
  8. package/project.sublime-project +1 -1
  9. package/scss/dark/_variables.scss +34 -1
  10. package/scss/dark/theme.scss +22 -1
  11. package/scss/fonts.scss +2 -1
  12. package/scss/light/_variables.scss +15 -1
  13. package/scss/light/theme.scss +4 -1
package/html/dark.html CHANGED
@@ -139,36 +139,42 @@
139
139
  <div class="col-lg-7">
140
140
 
141
141
  <p class="bs-component">
142
- <button type="button" class="btn btn-primary">Primary</button>
143
- <button type="button" class="btn btn-secondary">Secondary</button>
144
- <button type="button" class="btn btn-success">Success</button>
145
- <button type="button" class="btn btn-info">Info</button>
146
- <button type="button" class="btn btn-warning">Warning</button>
147
- <button type="button" class="btn btn-danger">Danger</button>
148
- <button type="button" class="btn btn-link">Link</button>
142
+ <button type="button" class="btn btn-primary mr-1 mb-1">Primary</button>
143
+ <button type="button" class="btn btn-secondary mr-1 mb-1">Secondary</button>
144
+ <button type="button" class="btn btn-success mr-1 mb-1">Success</button>
145
+ <button type="button" class="btn btn-info mr-1 mb-1">Info</button>
146
+ <button type="button" class="btn btn-warning mr-1 mb-1">Warning</button>
147
+ <button type="button" class="btn btn-danger mr-1 mb-1">Danger</button>
148
+ <button type="button" class="btn btn-light mr-1 mb-1">Light</button>
149
+ <button type="button" class="btn btn-dark mr-1 mb-1">Dark</button>
150
+ <button type="button" class="btn btn-link mr-1 mb-1">Link</button>
149
151
  </p>
150
152
 
151
153
  <p class="bs-component">
152
- <button type="button" class="btn btn-primary disabled">Primary</button>
153
- <button type="button" class="btn btn-secondary disabled">Secondary</button>
154
- <button type="button" class="btn btn-success disabled">Success</button>
155
- <button type="button" class="btn btn-info disabled">Info</button>
156
- <button type="button" class="btn btn-warning disabled">Warning</button>
157
- <button type="button" class="btn btn-danger disabled">Danger</button>
158
- <button type="button" class="btn btn-link disabled">Link</button>
154
+ <button type="button" class="btn btn-primary disabled mr-1 mb-1">Primary</button>
155
+ <button type="button" class="btn btn-secondary disabled mr-1 mb-1">Secondary</button>
156
+ <button type="button" class="btn btn-success disabled mr-1 mb-1">Success</button>
157
+ <button type="button" class="btn btn-info disabled mr-1 mb-1">Info</button>
158
+ <button type="button" class="btn btn-warning disabled mr-1 mb-1">Warning</button>
159
+ <button type="button" class="btn btn-danger disabled mr-1 mb-1">Danger</button>
160
+ <button type="button" class="btn btn-light disabled mr-1 mb-1">Light</button>
161
+ <button type="button" class="btn btn-dark disabled mr-1 mb-1">Dark</button>
162
+ <button type="button" class="btn btn-link disabled mr-1 mb-1">Link</button>
159
163
  </p>
160
164
 
161
165
  <p class="bs-component">
162
- <button type="button" class="btn btn-outline-primary">Primary</button>
163
- <button type="button" class="btn btn-outline-secondary">Secondary</button>
164
- <button type="button" class="btn btn-outline-success">Success</button>
165
- <button type="button" class="btn btn-outline-info">Info</button>
166
- <button type="button" class="btn btn-outline-warning">Warning</button>
167
- <button type="button" class="btn btn-outline-danger">Danger</button>
166
+ <button type="button" class="btn btn-outline-primary mr-1 mb-1">Primary</button>
167
+ <button type="button" class="btn btn-outline-secondary mr-1 mb-1">Secondary</button>
168
+ <button type="button" class="btn btn-outline-success mr-1 mb-1">Success</button>
169
+ <button type="button" class="btn btn-outline-info mr-1 mb-1">Info</button>
170
+ <button type="button" class="btn btn-outline-warning mr-1 mb-1">Warning</button>
171
+ <button type="button" class="btn btn-outline-danger mr-1 mb-1">Danger</button>
172
+ <button type="button" class="btn btn-outline-light mr-1 mb-1">Light</button>
173
+ <button type="button" class="btn btn-outline-dark mr-1 mb-1">Dark</button>
168
174
  </p>
169
175
 
170
176
  <div class="bs-component">
171
- <div class="btn-group" role="group" aria-label="Button group with nested dropdown">
177
+ <div class="btn-group mr-1 mb-1" role="group" aria-label="Button group with nested dropdown">
172
178
  <button type="button" class="btn btn-primary">Primary</button>
173
179
  <div class="btn-group" role="group">
174
180
  <button id="btnGroupDrop1" type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></button>
@@ -179,7 +185,7 @@
179
185
  </div>
180
186
  </div>
181
187
 
182
- <div class="btn-group" role="group" aria-label="Button group with nested dropdown">
188
+ <div class="btn-group mr-1 mb-1" role="group" aria-label="Button group with nested dropdown">
183
189
  <button type="button" class="btn btn-success">Success</button>
184
190
  <div class="btn-group" role="group">
185
191
  <button id="btnGroupDrop2" type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></button>
@@ -190,7 +196,7 @@
190
196
  </div>
191
197
  </div>
192
198
 
193
- <div class="btn-group" role="group" aria-label="Button group with nested dropdown">
199
+ <div class="btn-group mr-1 mb-1" role="group" aria-label="Button group with nested dropdown">
194
200
  <button type="button" class="btn btn-info">Info</button>
195
201
  <div class="btn-group" role="group">
196
202
  <button id="btnGroupDrop3" type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></button>
@@ -201,7 +207,7 @@
201
207
  </div>
202
208
  </div>
203
209
 
204
- <div class="btn-group" role="group" aria-label="Button group with nested dropdown">
210
+ <div class="btn-group mr-1 mb-1" role="group" aria-label="Button group with nested dropdown">
205
211
  <button type="button" class="btn btn-danger">Danger</button>
206
212
  <div class="btn-group" role="group">
207
213
  <button id="btnGroupDrop4" type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></button>
@@ -214,9 +220,9 @@
214
220
  </div>
215
221
 
216
222
  <div class="bs-component">
217
- <button type="button" class="btn btn-primary btn-lg">Large button</button>
218
- <button type="button" class="btn btn-primary">Default button</button>
219
- <button type="button" class="btn btn-primary btn-sm">Small button</button>
223
+ <button type="button" class="btn btn-primary btn-lg mr-1 mb-1">Large button</button>
224
+ <button type="button" class="btn btn-primary mr-1 mb-1">Default button</button>
225
+ <button type="button" class="btn btn-primary btn-sm mr-1 mb-1">Small button</button>
220
226
  </div>
221
227
 
222
228
  </div>
package/html/light.html CHANGED
@@ -139,36 +139,42 @@
139
139
  <div class="col-lg-7">
140
140
 
141
141
  <p class="bs-component">
142
- <button type="button" class="btn btn-primary">Primary</button>
143
- <button type="button" class="btn btn-secondary">Secondary</button>
144
- <button type="button" class="btn btn-success">Success</button>
145
- <button type="button" class="btn btn-info">Info</button>
146
- <button type="button" class="btn btn-warning">Warning</button>
147
- <button type="button" class="btn btn-danger">Danger</button>
148
- <button type="button" class="btn btn-link">Link</button>
142
+ <button type="button" class="btn btn-primary mr-1 mb-1">Primary</button>
143
+ <button type="button" class="btn btn-secondary mr-1 mb-1">Secondary</button>
144
+ <button type="button" class="btn btn-success mr-1 mb-1">Success</button>
145
+ <button type="button" class="btn btn-info mr-1 mb-1">Info</button>
146
+ <button type="button" class="btn btn-warning mr-1 mb-1">Warning</button>
147
+ <button type="button" class="btn btn-danger mr-1 mb-1">Danger</button>
148
+ <button type="button" class="btn btn-light mr-1 mb-1">Light</button>
149
+ <button type="button" class="btn btn-dark mr-1 mb-1">Dark</button>
150
+ <button type="button" class="btn btn-link mr-1 mb-1">Link</button>
149
151
  </p>
150
152
 
151
153
  <p class="bs-component">
152
- <button type="button" class="btn btn-primary disabled">Primary</button>
153
- <button type="button" class="btn btn-secondary disabled">Secondary</button>
154
- <button type="button" class="btn btn-success disabled">Success</button>
155
- <button type="button" class="btn btn-info disabled">Info</button>
156
- <button type="button" class="btn btn-warning disabled">Warning</button>
157
- <button type="button" class="btn btn-danger disabled">Danger</button>
158
- <button type="button" class="btn btn-link disabled">Link</button>
154
+ <button type="button" class="btn btn-primary disabled mr-1 mb-1">Primary</button>
155
+ <button type="button" class="btn btn-secondary disabled mr-1 mb-1">Secondary</button>
156
+ <button type="button" class="btn btn-success disabled mr-1 mb-1">Success</button>
157
+ <button type="button" class="btn btn-info disabled mr-1 mb-1">Info</button>
158
+ <button type="button" class="btn btn-warning disabled mr-1 mb-1">Warning</button>
159
+ <button type="button" class="btn btn-danger disabled mr-1 mb-1">Danger</button>
160
+ <button type="button" class="btn btn-light disabled mr-1 mb-1">Light</button>
161
+ <button type="button" class="btn btn-dark disabled mr-1 mb-1">Dark</button>
162
+ <button type="button" class="btn btn-link disabled mr-1 mb-1">Link</button>
159
163
  </p>
160
164
 
161
165
  <p class="bs-component">
162
- <button type="button" class="btn btn-outline-primary">Primary</button>
163
- <button type="button" class="btn btn-outline-secondary">Secondary</button>
164
- <button type="button" class="btn btn-outline-success">Success</button>
165
- <button type="button" class="btn btn-outline-info">Info</button>
166
- <button type="button" class="btn btn-outline-warning">Warning</button>
167
- <button type="button" class="btn btn-outline-danger">Danger</button>
166
+ <button type="button" class="btn btn-outline-primary mr-1 mb-1">Primary</button>
167
+ <button type="button" class="btn btn-outline-secondary mr-1 mb-1">Secondary</button>
168
+ <button type="button" class="btn btn-outline-success mr-1 mb-1">Success</button>
169
+ <button type="button" class="btn btn-outline-info mr-1 mb-1">Info</button>
170
+ <button type="button" class="btn btn-outline-warning mr-1 mb-1">Warning</button>
171
+ <button type="button" class="btn btn-outline-danger mr-1 mb-1">Danger</button>
172
+ <button type="button" class="btn btn-outline-light mr-1 mb-1">Light</button>
173
+ <button type="button" class="btn btn-outline-dark mr-1 mb-1">Dark</button>
168
174
  </p>
169
175
 
170
176
  <div class="bs-component">
171
- <div class="btn-group" role="group" aria-label="Button group with nested dropdown">
177
+ <div class="btn-group mr-1 mb-1" role="group" aria-label="Button group with nested dropdown">
172
178
  <button type="button" class="btn btn-primary">Primary</button>
173
179
  <div class="btn-group" role="group">
174
180
  <button id="btnGroupDrop1" type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></button>
@@ -179,7 +185,7 @@
179
185
  </div>
180
186
  </div>
181
187
 
182
- <div class="btn-group" role="group" aria-label="Button group with nested dropdown">
188
+ <div class="btn-group mr-1 mb-1" role="group" aria-label="Button group with nested dropdown">
183
189
  <button type="button" class="btn btn-success">Success</button>
184
190
  <div class="btn-group" role="group">
185
191
  <button id="btnGroupDrop2" type="button" class="btn btn-success dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></button>
@@ -190,7 +196,7 @@
190
196
  </div>
191
197
  </div>
192
198
 
193
- <div class="btn-group" role="group" aria-label="Button group with nested dropdown">
199
+ <div class="btn-group mr-1 mb-1" role="group" aria-label="Button group with nested dropdown">
194
200
  <button type="button" class="btn btn-info">Info</button>
195
201
  <div class="btn-group" role="group">
196
202
  <button id="btnGroupDrop3" type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></button>
@@ -201,7 +207,7 @@
201
207
  </div>
202
208
  </div>
203
209
 
204
- <div class="btn-group" role="group" aria-label="Button group with nested dropdown">
210
+ <div class="btn-group mr-1 mb-1" role="group" aria-label="Button group with nested dropdown">
205
211
  <button type="button" class="btn btn-danger">Danger</button>
206
212
  <div class="btn-group" role="group">
207
213
  <button id="btnGroupDrop4" type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></button>
@@ -214,9 +220,9 @@
214
220
  </div>
215
221
 
216
222
  <div class="bs-component">
217
- <button type="button" class="btn btn-primary btn-lg">Large button</button>
218
- <button type="button" class="btn btn-primary">Default button</button>
219
- <button type="button" class="btn btn-primary btn-sm">Small button</button>
223
+ <button type="button" class="btn btn-primary btn-lg mr-1 mb-1">Large button</button>
224
+ <button type="button" class="btn btn-primary mr-1 mb-1">Default button</button>
225
+ <button type="button" class="btn btn-primary btn-sm mr-1 mb-1">Small button</button>
220
226
  </div>
221
227
 
222
228
  </div>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@spark-hire/bootstrap-themes",
3
- "version": "0.2.2",
3
+ "version": "0.2.4",
4
4
  "description": "Custom Bootstrap 4 Themes",
5
5
  "repository": {
6
6
  "type": "git",
package/project.sublime-project CHANGED
@@ -3,7 +3,7 @@
3
3
  [
4
4
  {
5
5
  "path": ".",
6
- "folder_exclude_patterns": ["node_modules", "vendor", "bower_components", "dist"]
6
+ "folder_exclude_patterns": ["node_modules", "vendor", "bower_components", "dist", ".sass-cache"]
7
7
  }
8
8
  ]
9
9
  }
package/scss/dark/_variables.scss CHANGED
@@ -5,6 +5,21 @@
5
5
 
6
6
  @import "../global_variables";
7
7
 
8
+ $light: $gray-800;
9
+ $dark: $gray-1000;
10
+
11
+ $theme-colors: ();
12
+ $theme-colors: map-merge((
13
+ "primary": $primary,
14
+ "secondary": $secondary,
15
+ "success": $success,
16
+ "info": $info,
17
+ "warning": $warning,
18
+ "danger": $danger,
19
+ "light": $light,
20
+ "dark": $dark
21
+ ), $theme-colors);
22
+
8
23
  $body-bg: $gray-900;
9
24
  $body-color: $gray-100;
10
25
 
@@ -31,4 +46,22 @@ $modal-backdrop-bg: rgba(2, 2, 2, 0.75);
31
46
  $modal-backdrop-opacity: 1;
32
47
 
33
48
  $close-color: $gray-200;
34
- $close-text-shadow: none;
49
+ $close-text-shadow: none;
50
+
51
+ $breadcrumb-bg: $gray-1000;
52
+
53
+ $pagination-bg: $gray-1000;
54
+ $pagination-border-color: $gray-900;
55
+ $pagination-disabled-bg: $gray-800;
56
+ $pagination-disabled-border-color: $gray-900;
57
+
58
+ $jumbotron-bg: $gray-1000;
59
+
60
+ $nav-tabs-link-active-bg: $gray-900;
61
+ $nav-tabs-link-active-border-color: $gray-700;
62
+ $nav-tabs-border-color: $gray-700;
63
+ $nav-tabs-link-active-color: $gray-200;
64
+
65
+ $list-group-bg: $gray-1000;
66
+
67
+ $card-bg: $gray-900;
package/scss/dark/theme.scss CHANGED
@@ -1,4 +1,25 @@
1
1
  @import "variables";
2
2
  @import "~bootstrap/scss/bootstrap";
3
3
  @import "../shared";
4
- @import "scrollbar";
4
+ @import "scrollbar";
5
+
6
+ // Custom style overrides
7
+
8
+ @each $color, $value in $theme-colors {
9
+ @include table-row-variant($color, theme-color-level($color, -3));
10
+ }
11
+
12
+ .form-control-plaintext {
13
+ color: $gray-100;
14
+ }
15
+
16
+ .nav-tabs {
17
+ .nav-link.active,
18
+ .nav-item.show .nav-link {
19
+ border-bottom-color: transparent;
20
+ }
21
+ }
22
+
23
+ .bg-light {
24
+ background-color: $gray-700 !important;
25
+ }
package/scss/fonts.scss CHANGED
@@ -1,7 +1,8 @@
1
1
  @import url('https://fonts.googleapis.com/css?family=Raleway:200,200i,300,300i,400,400i,600,600i,700,700i,900,900i');
2
+ @import url('https://fonts.googleapis.com/css?family=Roboto:200,200i,300,300i,400,400i,600,600i,700,700i,900,900i');
2
3
 
3
4
  html, body {
4
- font-family: 'Lato', sans-serif;
5
+ font-family: 'Raleway', sans-serif;
5
6
  }
6
7
 
7
8
  h1, h2, h3, h4, h5 {
package/scss/light/_variables.scss CHANGED
@@ -3,4 +3,18 @@
3
3
  @import "~bootstrap/scss/variables";
4
4
  @import "~bootstrap/scss/mixins";
5
5
 
6
- @import "../global_variables";
6
+ @import "../global_variables";
7
+
8
+ $light: $gray-200;
9
+
10
+ $theme-colors: ();
11
+ $theme-colors: map-merge((
12
+ "primary": $primary,
13
+ "secondary": $secondary,
14
+ "success": $success,
15
+ "info": $info,
16
+ "warning": $warning,
17
+ "danger": $danger,
18
+ "light": $light,
19
+ "dark": $dark
20
+ ), $theme-colors);
package/scss/light/theme.scss CHANGED
@@ -1,4 +1,7 @@
1
1
  @import "variables";
2
2
  @import "~bootstrap/scss/bootstrap";
3
3
  @import "../shared";
4
- @import "scrollbar";
4
+ @import "scrollbar";
5
+
6
+ // Custom style overrides
7
+