@dialpad/dialtone 7.11.0 → 7.11.2

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 (4) hide show
  1. package/lib/build/less/components/popover.less +10 -6
  2. package/lib/dist/css/dialtone.css +7 -29
  3. package/lib/dist/css/dialtone.min.css +1 -1
  4. package/package.json +1 -1
package/lib/build/less/components/popover.less CHANGED
@@ -14,18 +14,21 @@
14
14
  // - Content
15
15
  // - Header / Footer
16
16
 
17
-
18
- // $ POPOVER
17
+ // $ CSS CUSTOM PROPERTIES
19
18
  // ----------------------------------------------------------------------------
20
- .d-popover {
21
- // $ CSS CUSTOM PROPERTIES
22
- // ----------------------------------------------------------------------------
23
-
19
+ body {
24
20
  --popover-color-background: var(--black-100);
25
21
  --popover-border-width: var(--size-100); // 8
26
22
  --popover-border-radius: var(--size-400);
27
23
  --popover-color-shadow: hsla(var(--black-900-hsl) ~' / ' 10%);
24
+ --popover-color-border: var(--popover-color-shadow);
28
25
  --popover-shadow: 0 0 0 1px var(--popover-color-shadow), var(--bs-card);
26
+ }
27
+
28
+ // $ POPOVER
29
+ // ----------------------------------------------------------------------------
30
+ .d-popover {
31
+
29
32
 
30
33
  // $ POPOVER DIALOG
31
34
  // ----------------------------------------------------------------------------
@@ -40,6 +43,7 @@
40
43
  display: grid;
41
44
  grid-template-rows: 1fr;
42
45
  overflow: auto;
46
+ background-color: var(--popover-color-background);
43
47
  border-radius: var(--popover-border-radius);
44
48
  box-shadow: var(--popover-shadow);
45
49
 
package/lib/dist/css/dialtone.css CHANGED
@@ -2501,17 +2501,19 @@ legend .d-label {
2501
2501
  --notice-color-background: var(--gold-200);
2502
2502
  --notice-color-text: var(--fc-primary);
2503
2503
  }
2504
- .d-popover {
2504
+ body {
2505
2505
  --popover-color-background: var(--black-100);
2506
2506
  --popover-border-width: var(--size-100);
2507
2507
  --popover-border-radius: var(--size-400);
2508
2508
  --popover-color-shadow: hsla(var(--black-900-hsl) / 10%);
2509
+ --popover-color-border: var(--popover-color-shadow);
2509
2510
  --popover-shadow: 0 0 0 1px var(--popover-color-shadow), var(--bs-card);
2510
2511
  }
2511
2512
  .d-popover__dialog {
2512
2513
  display: grid;
2513
2514
  grid-template-rows: 1fr;
2514
2515
  overflow: auto;
2516
+ background-color: var(--popover-color-background);
2515
2517
  border-radius: var(--popover-border-radius);
2516
2518
  box-shadow: var(--popover-shadow);
2517
2519
  }
@@ -22328,17 +22330,11 @@ body.theme-dark {
22328
22330
  .sm\:d-t0 {
22329
22331
  top: 0 !important;
22330
22332
  }
22331
- .sm\:d-popover {
22332
- --popover-color-background: var(--black-100);
22333
- --popover-border-width: var(--size-100);
22334
- --popover-border-radius: var(--size-400);
22335
- --popover-color-shadow: hsla(var(--black-900-hsl) / 10%);
22336
- --popover-shadow: 0 0 0 1px var(--popover-color-shadow), var(--bs-card);
22337
- }
22338
22333
  .sm\:d-popover__dialog {
22339
22334
  display: grid;
22340
22335
  grid-template-rows: 1fr;
22341
22336
  overflow: auto;
22337
+ background-color: var(--popover-color-background);
22342
22338
  border-radius: var(--popover-border-radius);
22343
22339
  box-shadow: var(--popover-shadow);
22344
22340
  }
@@ -24639,17 +24635,11 @@ body.theme-dark {
24639
24635
  .md\:d-t0 {
24640
24636
  top: 0 !important;
24641
24637
  }
24642
- .md\:d-popover {
24643
- --popover-color-background: var(--black-100);
24644
- --popover-border-width: var(--size-100);
24645
- --popover-border-radius: var(--size-400);
24646
- --popover-color-shadow: hsla(var(--black-900-hsl) / 10%);
24647
- --popover-shadow: 0 0 0 1px var(--popover-color-shadow), var(--bs-card);
24648
- }
24649
24638
  .md\:d-popover__dialog {
24650
24639
  display: grid;
24651
24640
  grid-template-rows: 1fr;
24652
24641
  overflow: auto;
24642
+ background-color: var(--popover-color-background);
24653
24643
  border-radius: var(--popover-border-radius);
24654
24644
  box-shadow: var(--popover-shadow);
24655
24645
  }
@@ -26950,17 +26940,11 @@ body.theme-dark {
26950
26940
  .lg\:d-t0 {
26951
26941
  top: 0 !important;
26952
26942
  }
26953
- .lg\:d-popover {
26954
- --popover-color-background: var(--black-100);
26955
- --popover-border-width: var(--size-100);
26956
- --popover-border-radius: var(--size-400);
26957
- --popover-color-shadow: hsla(var(--black-900-hsl) / 10%);
26958
- --popover-shadow: 0 0 0 1px var(--popover-color-shadow), var(--bs-card);
26959
- }
26960
26943
  .lg\:d-popover__dialog {
26961
26944
  display: grid;
26962
26945
  grid-template-rows: 1fr;
26963
26946
  overflow: auto;
26947
+ background-color: var(--popover-color-background);
26964
26948
  border-radius: var(--popover-border-radius);
26965
26949
  box-shadow: var(--popover-shadow);
26966
26950
  }
@@ -29261,17 +29245,11 @@ body.theme-dark {
29261
29245
  .xl\:d-t0 {
29262
29246
  top: 0 !important;
29263
29247
  }
29264
- .xl\:d-popover {
29265
- --popover-color-background: var(--black-100);
29266
- --popover-border-width: var(--size-100);
29267
- --popover-border-radius: var(--size-400);
29268
- --popover-color-shadow: hsla(var(--black-900-hsl) / 10%);
29269
- --popover-shadow: 0 0 0 1px var(--popover-color-shadow), var(--bs-card);
29270
- }
29271
29248
  .xl\:d-popover__dialog {
29272
29249
  display: grid;
29273
29250
  grid-template-rows: 1fr;
29274
29251
  overflow: auto;
29252
+ background-color: var(--popover-color-background);
29275
29253
  border-radius: var(--popover-border-radius);
29276
29254
  box-shadow: var(--popover-shadow);
29277
29255
  }