gd-bs 6.4.3 → 6.4.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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "gd-bs",
3
- "version": "6.4.3",
3
+ "version": "6.4.4",
4
4
  "description": "Bootstrap JavaScript, TypeScript and Web Components library.",
5
5
  "main": "build/index.js",
6
6
  "typings": "src/index.d.ts",
@@ -31,14 +31,35 @@
31
31
  -webkit-mask: var(--bs-accordion-btn-active-icon);
32
32
  -webkit-mask-repeat: no-repeat;
33
33
  }
34
+ .bg-danger {
35
+ background-color: var(--sp-error-icon, #a80000) !important;
36
+ }
37
+ .bg-dark {
38
+ background-color: var(--sp-neutral-dark, #201f1e) !important;
39
+ }
40
+ .bg-info {
41
+ background-color: var(--sp-accent, #8764b8) !important;
42
+ }
43
+ .bg-light {
44
+ background-color: var(--sp-neutral-lighter, #f3f2f1) !important;
45
+ }
34
46
  .bg-primary {
35
47
  background-color: var(--sp-theme-primary, #0078d4) !important;
36
48
  }
37
- /* Create a reusable 'SharePoint Blue' background color */
49
+ .bg-secondary {
50
+ background-color: var(--sp-info-icon, #605e5c) !important;
51
+ }
52
+ /* Create a reusable 'SharePoint' background color */
38
53
  .bg-sharepoint {
39
- background-color: var(--sp-theme-primary, #0078d4) !important;
54
+ background-color: var(--sp-theme-dark, #005a9e) !important;
40
55
  }
41
- .bg-white {
56
+ .bg-success {
57
+ background-color: var(--sp-success-icon, #107c10) !important;
58
+ }
59
+ .bg-warning {
60
+ background-color: var(--sp-severe-warning-icon, #d83b01) !important;
61
+ }
62
+ .bg-white, .bg-body {
42
63
  background-color: var(--sp-white, #ffffff) !important;
43
64
  }
44
65
  /* Fix breadcrumb alignment */
@@ -58,7 +79,6 @@
58
79
  /* Color match breadcrumb active links */
59
80
  .breadcrumb-item>a:active {
60
81
  color: var(--sp-primary-text, #333333);
61
- font-weight: 500;
62
82
  text-decoration: underline;
63
83
  }
64
84
  /* Fix breadcrumb alignment */
@@ -187,6 +207,7 @@
187
207
  }
188
208
  /* Fix color for outline light active */
189
209
  .btn-outline-light:active, .btn-outline-light:hover {
210
+ color: var(--sp-black, #000000);
190
211
  svg.brand path {
191
212
  fill: var(--sp-black, #000000);
192
213
  }
@@ -205,6 +226,9 @@
205
226
  .btn-check:checked+.btn-primary:focus, .btn-check:active+.btn-primary:focus, .btn-primary:active:focus, .btn-primary.active:focus, .show>.btn-primary.dropdown-toggle:focus {
206
227
  box-shadow: 0 0 0 0.25rem color-mix(in srgb, var(--sp-theme-tertiary, #71afe5), transparent 25%);
207
228
  }
229
+ .card {
230
+ --bs-card-border-color: var(--bs-border-color);
231
+ }
208
232
  .carousel-caption {
209
233
  color: var(--sp-neutral-dark, #201f1e) !important;
210
234
  }
@@ -270,6 +294,7 @@
270
294
  /* Bootstrap Icon: Custom - caret-up-fill + caret-down-fill */
271
295
  .form-select {
272
296
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 16 25.333' fill='%23605e5c' width='1em' height='1em'><path d='M0.34 8.03C-0.44 8.92 0.2 10.32 1.38 10.32C2.71 10.32 13.3 10.32 14.62 10.32C15.38 10.32 16 9.7 16 8.94C16 8.61 15.88 8.28 15.66 8.03C15 7.28 9.7 1.23 9.04 0.47C8.54 -0.1 7.67 -0.16 7.09 0.34C7.05 0.38 7 0.43 6.96 0.47C6.96 0.47 1.01 7.28 0.34 8.03Z'/><path d='M0.34 17.3C-0.44 16.41 0.2 15.01 1.38 15.01C2.71 15.01 13.3 15.01 14.62 15.01C15.38 15.01 16 15.63 16 16.39C16 16.73 15.88 17.05 15.66 17.3C15 18.06 9.7 24.11 9.04 24.86C8.54 25.43 7.67 25.49 7.09 24.99C7.05 24.95 7 24.91 6.96 24.86C6.96 24.86 1.01 18.06 0.34 17.3Z'/></svg>");
297
+ border-color: var(--sp-info-icon, #605e5c);
273
298
  }
274
299
  /* Color match form-select active */
275
300
  .form-select:active, .form-select:focus {
@@ -286,8 +311,8 @@
286
311
  .form-check-input {
287
312
  height: 1.25em;
288
313
  }
289
- .form-check-input:focus {
290
- --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%232b88d8'/%3e%3c/svg%3e");
314
+ .form-check-input:focus:not(:checked):not(.dark) {
315
+ --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%238a8886'/%3e%3c/svg%3e");
291
316
  }
292
317
  .form-check-input.dark, .form-check-input.dark:focus, .form-check-input.dark:checked {
293
318
  --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23faf9f8'/%3e%3c/svg%3e");
@@ -370,8 +395,12 @@
370
395
  color: var(--sp-primary-button-text, #ffffff);
371
396
  }
372
397
  .navbar {
373
- --bs-navbar-brand-color: var(--sp-primary-button-text, #ffffff);
374
398
  --bs-navbar-color: var(--sp-primary-button-text, #ffffff);
399
+ --bs-navbar-hover-color: var(--sp-theme-darker, #004578);
400
+ --bs-navbar-disabled-color: var(--sp-neutral-tertiary, #a19f9d);
401
+ --bs-navbar-active-color: var(--sp-theme-light, #c7e0f4);
402
+ --bs-navbar-brand-color: var(--sp-primary-button-text, #ffffff);
403
+ --bs-navbar-brand-hover-color: var(--sp-theme-darker, #004578);
375
404
  }
376
405
  /* Properly align the navbar brand text */
377
406
  .navbar-brand {
@@ -1,20 +1,15 @@
1
1
  /* Center the dataTables_info element properly */
2
-
3
2
  div.dataTables_wrapper div.dataTables_info {
4
3
  padding-top: 0.9rem;
5
4
  }
6
5
 
7
-
8
6
  /* Add proper width for dataTables_length select */
9
-
10
7
  div.dataTables_wrapper div.dataTables_length select {
11
8
  width: 3.75rem;
12
9
  }
13
10
 
14
11
  /* Be sure to escape any characters, such as # to %23 when specifying hex color values in background-image */
15
-
16
12
  /* DataTables sorting with Bootstrap Icons */
17
-
18
13
  table.dataTable thead .sorting,
19
14
  table.dataTable thead .sorting_asc,
20
15
  table.dataTable thead .sorting_desc,
@@ -38,27 +33,21 @@ table.dataTable thead .sorting_desc_disabled:after {
38
33
  }
39
34
 
40
35
  /* Bootstrap Icon: caret-up */
41
-
42
36
  table.dataTable thead .sorting {
43
37
  background-image: url("data:image/svg+xml,<svg viewBox='0 0 16 16' fill='%23605e5c' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M3.204 11L8 5.519 12.796 11H3.204zm-.753-.659l4.796-5.48a1 1 0 0 1 1.506 0l4.796 5.48c.566.647.106 1.659-.753 1.659H3.204a1 1 0 0 1-.753-1.659z'/></svg>");
44
38
  }
45
39
 
46
-
47
40
  /* Bootstrap Icon: caret-up-fill */
48
-
49
41
  table.dataTable thead .sorting_asc {
50
42
  background-image: url("data:image/svg+xml,<svg viewBox='0 0 16 16' fill='%23605e5c' xmlns='http://www.w3.org/2000/svg'><path d='M7.247 4.86l-4.796 5.481c-.566.647-.106 1.659.753 1.659h9.592a1 1 0 0 0 .753-1.659l-4.796-5.48a1 1 0 0 0-1.506 0z'/></svg>");
51
43
  }
52
44
 
53
-
54
45
  /* Bootstrap Icon: caret-down-fill */
55
-
56
46
  table.dataTable thead .sorting_desc {
57
47
  background-image: url("data:image/svg+xml,<svg viewBox='0 0 16 16' fill='%23605e5c' xmlns='http://www.w3.org/2000/svg'><path d='M7.247 11.14L2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/></svg>");
58
48
  }
59
49
 
60
50
  /* Color match colReorder line */
61
-
62
51
  div.DTCR_pointer {
63
- background-color: var(--sp-theme-accent, #0078d4);
52
+ background-color: var(--sp-theme-primary, #0078d4);
64
53
  }
@@ -1,4 +1,4 @@
1
- /** Root Styles */
1
+ /** Define default root styles */
2
2
  :root {
3
3
  --sp-accent: #8764b8;
4
4
  --sp-black: #000000;
@@ -38,7 +38,6 @@
38
38
  --sp-success-background: #dff6dd;
39
39
  --sp-success-icon: #107c10;
40
40
  --sp-teal: #008272;
41
- --sp-theme-accent: #0078d4;
42
41
  --sp-theme-dark: #005a9e;
43
42
  --sp-theme-darker: #004578;
44
43
  --sp-theme-dark-alt: #106ebe;
@@ -54,6 +53,7 @@
54
53
  --sp-yellow: #ffb900;
55
54
  --sp-yellow-dark: #d29200;
56
55
 
56
+ /* Map the Bootstrap root variables to SharePoint */
57
57
  --bs-blue: var(--sp-blue);
58
58
  --bs-indigo: var(--sp-purple-dark);
59
59
  --bs-purple: var(--sp-purple);
@@ -97,7 +97,7 @@
97
97
  --bs-secondary-bg-subtle: var(--sp-info-background);
98
98
  --bs-success-bg-subtle: var(--sp-success-background);
99
99
  --bs-info-bg-subtle: var(--sp-theme-lighter-alt);
100
- --bs-warning-bg-subtle: var(--sp-severe-warning-background);
100
+ --bs-warning-bg-subtle: var(--sp-warning-background);
101
101
  --bs-danger-bg-subtle: var(--sp-error-background);
102
102
  --bs-light-bg-subtle: var(--sp-neutral-lighter-alt);
103
103
  --bs-dark-bg-subtle: var(--sp-neutral-quaternary-alt);
@@ -105,7 +105,7 @@
105
105
  --bs-secondary-border-subtle: var(--sp-neutral-tertiary-alt);
106
106
  --bs-success-border-subtle: var(--sp-green-light);
107
107
  --bs-info-border-subtle: var(--sp-purple-light);
108
- --bs-warning-border-subtle: var(--sp-warning-background);
108
+ --bs-warning-border-subtle: var(--sp-severe-warning-background);
109
109
  --bs-danger-border-subtle: var(--sp-blocking-icon);
110
110
  --bs-light-border-subtle: var(--sp-neutral-light);
111
111
  --bs-dark-border-subtle: var(--sp-neutral-tertiary);