@dialpad/dialtone-css 8.64.1 → 8.64.3

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 (43) hide show
  1. package/lib/build/less/components/presence.less +11 -11
  2. package/lib/build/less/components/radio-checkbox.less +11 -9
  3. package/lib/build/less/recipes/leftbar_row.less +11 -3
  4. package/lib/dist/dialtone-default-theme.css +2730 -583
  5. package/lib/dist/dialtone-default-theme.min.css +1 -1
  6. package/lib/dist/dialtone-docs.json +1 -1
  7. package/lib/dist/dialtone.css +702 -63
  8. package/lib/dist/dialtone.min.css +1 -1
  9. package/lib/dist/tokens/tokens-aegean-dark.css +1112 -552
  10. package/lib/dist/tokens/tokens-aegean-light.css +1010 -450
  11. package/lib/dist/tokens/tokens-base-dark.css +5 -5
  12. package/lib/dist/tokens/tokens-base-deca-dark.css +5 -5
  13. package/lib/dist/tokens/tokens-base-deca-light.css +10 -10
  14. package/lib/dist/tokens/tokens-base-light.css +10 -10
  15. package/lib/dist/tokens/tokens-botany-dark.css +1095 -535
  16. package/lib/dist/tokens/tokens-botany-light.css +1014 -454
  17. package/lib/dist/tokens/tokens-buttercream-dark.css +1101 -541
  18. package/lib/dist/tokens/tokens-buttercream-light.css +1013 -453
  19. package/lib/dist/tokens/tokens-ceruleo-dark.css +1115 -555
  20. package/lib/dist/tokens/tokens-ceruleo-light.css +1035 -475
  21. package/lib/dist/tokens/tokens-debug-dp.css +930 -370
  22. package/lib/dist/tokens/tokens-deca-dark.css +19 -19
  23. package/lib/dist/tokens/tokens-deca-light.css +19 -19
  24. package/lib/dist/tokens/tokens-dp-dark.css +1094 -534
  25. package/lib/dist/tokens/tokens-dp-light.css +1010 -450
  26. package/lib/dist/tokens/tokens-expressive-dark.css +1094 -534
  27. package/lib/dist/tokens/tokens-expressive-light.css +1010 -450
  28. package/lib/dist/tokens/tokens-expressive-sm-dark.css +1094 -534
  29. package/lib/dist/tokens/tokens-expressive-sm-light.css +1010 -450
  30. package/lib/dist/tokens/tokens-high-desert-dark.css +1136 -576
  31. package/lib/dist/tokens/tokens-high-desert-light.css +1014 -454
  32. package/lib/dist/tokens/tokens-melon-dark.css +1094 -534
  33. package/lib/dist/tokens/tokens-melon-light.css +1017 -457
  34. package/lib/dist/tokens/tokens-plum-dark.css +1226 -666
  35. package/lib/dist/tokens/tokens-plum-light.css +1130 -570
  36. package/lib/dist/tokens/tokens-sunflower-dark.css +1329 -769
  37. package/lib/dist/tokens/tokens-sunflower-light.css +1045 -485
  38. package/lib/dist/tokens/tokens-tmo-dark.css +1094 -534
  39. package/lib/dist/tokens/tokens-tmo-light.css +1010 -450
  40. package/lib/dist/tokens/tokens-verdant-haze-dark.css +1094 -534
  41. package/lib/dist/tokens/tokens-verdant-haze-light.css +1010 -450
  42. package/lib/dist/tokens-docs.json +1 -1
  43. package/package.json +3 -3
package/lib/build/less/components/presence.less CHANGED
@@ -7,13 +7,13 @@
7
7
  // visit https://dialtone.dialpad.com/components/presence
8
8
 
9
9
  .d-presence {
10
- --presence-color-border-base: var(--dt-shell-color-surface-default);
11
- --presence-color-border-offline: var(--dt-color-border-bold);
12
- --presence-color-background-active: var(--dt-shell-presence-color-available);
13
- --presence-color-background-busy: var(--dt-shell-presence-color-unavailable);
14
- --presence-color-background-away: var(--dt-shell-presence-color-busy);
15
- --presence-color-background-offline: var(--dt-shell-presence-color-offline);
16
- --presence-border-size: var(--dt-size-200);
10
+ --presence-color-border-base: var(--dt-color-surface-secondary); // Probably won't be necessary after @jeverhart-dialpad's DLT-2665 PR
11
+ --presence-color-border-offline: var(--dt-presence-color-offline);
12
+ --presence-color-background-active: var(--dt-presence-color-available);
13
+ --presence-color-background-busy: var(--dt-presence-color-unavailable);
14
+ --presence-color-background-away: var(--dt-presence-color-busy);
15
+ --presence-color-background-offline: var(--dt-color-surface-primary);
16
+ --presence-border-size: var(--dt-size-border-200);
17
17
  --presence-size: var(--dt-size-400);
18
18
 
19
19
  display: inline-block;
@@ -24,7 +24,7 @@
24
24
  border-radius: var(--dt-size-radius-circle);
25
25
 
26
26
  .d-recipe-leftbar-row--selected & {
27
- --presence-color-border-base: var(--dt-shell-color-surface-default);
27
+ --presence-color-border-base: var(--dt-color-surface-secondary);
28
28
  }
29
29
 
30
30
  .d-recipe-leftbar-row__primary:hover & {
@@ -33,8 +33,8 @@
33
33
 
34
34
  &__inner {
35
35
  box-sizing: border-box;
36
- width: var(--presence-size);
37
- height: var(--presence-size);
36
+ inline-size: var(--presence-size);
37
+ block-size: var(--presence-size);
38
38
  border: none;
39
39
  border-radius: 50%;
40
40
 
@@ -54,7 +54,7 @@
54
54
  background-color: var(--presence-color-background-offline);
55
55
  border-color: var(--presence-color-border-offline);
56
56
  border-style: solid;
57
- border-width: var(--dt-size-200);
57
+ border-width: var(--dt-size-border-200);
58
58
  }
59
59
  }
60
60
  }
package/lib/build/less/components/radio-checkbox.less CHANGED
@@ -90,15 +90,17 @@
90
90
  .d-radio-group {
91
91
  display: inline-flex;
92
92
  gap: var(--dt-space-400); // 8
93
-
94
- // -- Wrapper Disabled State
95
- &.d-checkbox-group--disabled,
96
- &.d-radio-group--disabled {
97
- .d-checkbox__label,
98
- .d-radio__label {
99
- color: var(--dt-color-foreground-disabled);
100
- cursor: not-allowed;
101
- }
93
+ cursor: pointer;
94
+ }
95
+ // -- Wrapper Disabled State
96
+ .d-checkbox-group--disabled,
97
+ .d-radio-group--disabled {
98
+ cursor: not-allowed;
99
+
100
+ .d-checkbox__label,
101
+ .d-radio__label {
102
+ color: var(--dt-color-foreground-disabled);
103
+ cursor: not-allowed;
102
104
  }
103
105
  }
104
106
 
package/lib/build/less/recipes/leftbar_row.less CHANGED
@@ -23,6 +23,14 @@
23
23
  --leftbar-row-action-width: var(--dt-size-550);
24
24
  --leftbar-row-action-height: var(--leftbar-row-action-width);
25
25
 
26
+ .d-presence {
27
+ // Presence colors in shell have specific tokens
28
+ --presence-color-border-offline: var(--dt-shell-presence-color-offline);
29
+ --presence-color-background-active: var(--dt-shell-presence-color-available);
30
+ --presence-color-background-busy: var(--dt-shell-presence-color-unavailable);
31
+ --presence-color-background-away: var(--dt-shell-presence-color-busy);
32
+ }
33
+
26
34
  // ============================================================================
27
35
  // $ BASE STYLE
28
36
  // ----------------------------------------------------------------------------
@@ -62,10 +70,12 @@
62
70
  --leftbar-row-color-background: var(--dt-shell-action-color-background-primary-hover);
63
71
 
64
72
  .d-presence {
73
+ // TODO: Remove this once @jeverhart-dialpad's DLT-2665 PR
65
74
  --presence-color-border-base: var(--dt-color-black-200);
66
75
  }
67
76
 
68
77
  .d-avatar__count {
78
+ // TODO: Remove this once @jeverhart-dialpad's DLT-2665 PR
69
79
  --avatar-count-color-shadow: var(--dt-shell-action-color-background-primary-selected);
70
80
  }
71
81
  }
@@ -180,7 +190,7 @@
180
190
  // </div>
181
191
  //
182
192
 
183
- // Style overrides for leftbar button icon and background, using the shell tokens for theming
193
+ // Style overrides for leftbar button icon and background, using the shell tokens for theming
184
194
  .d-btn--inverted.d-btn--primary {
185
195
  --button-color-text: var(--dt-shell-mention-color-surface-primary);
186
196
  }
@@ -256,8 +266,6 @@
256
266
  min-width: 0;
257
267
  }
258
268
 
259
-
260
-
261
269
  &__omega {
262
270
  position: absolute;
263
271
  top: var(--leftbar-row-action-position-bottom);