@floegence/floe-webapp-core 0.53.3 → 0.53.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/dist/styles/themes/presets.js +5 -5
- package/dist/styles.css +1 -1
- package/dist/surface.css +16 -3
- package/dist/themes/shell-presets.generated.css +6 -6
- package/dist/ui.css +4 -23
- package/package.json +1 -1
package/dist/surface.css
CHANGED
|
@@ -287,10 +287,14 @@
|
|
|
287
287
|
& [data-floe-surface-part='choice'][data-floe-selected='true'] {
|
|
288
288
|
background-color: var(--accent);
|
|
289
289
|
}
|
|
290
|
-
|
|
291
|
-
|
|
290
|
+
/* Compact choices need a clear selected face, independent of material.
|
|
291
|
+
* Large choice cards retain their native dot/checkmark and quiet tint. */
|
|
292
|
+
& [data-floe-choice-variant='button'][data-floe-selected='true'],
|
|
293
|
+
& [data-floe-surface-part='segment'][aria-checked='true'] {
|
|
294
|
+
background-color: var(--primary);
|
|
295
|
+
color: var(--primary-foreground);
|
|
296
|
+
--floe-surface-decoration: 0 0 transparent;
|
|
292
297
|
}
|
|
293
|
-
& [data-floe-surface-part='segment'][aria-checked='true'],
|
|
294
298
|
& [data-floe-surface-part='tab'][aria-selected='true'] {
|
|
295
299
|
background-color: var(--accent);
|
|
296
300
|
color: var(--foreground);
|
|
@@ -493,6 +497,15 @@
|
|
|
493
497
|
border-color: var(--wb-accent);
|
|
494
498
|
}
|
|
495
499
|
@media (forced-colors: active) {
|
|
500
|
+
.floe-segmented-control__item[aria-checked='true'],
|
|
501
|
+
[data-floe-choice-variant='button'][data-floe-selected='true'] {
|
|
502
|
+
forced-color-adjust: none;
|
|
503
|
+
background-color: Highlight;
|
|
504
|
+
border-color: Highlight;
|
|
505
|
+
color: HighlightText;
|
|
506
|
+
box-shadow: none;
|
|
507
|
+
transition: none;
|
|
508
|
+
}
|
|
496
509
|
[data-floe-surface-style='soft-neumorphic'] [data-floe-surface] {
|
|
497
510
|
--floe-surface-decoration: 0 0 transparent;
|
|
498
511
|
}
|
|
@@ -1499,8 +1499,8 @@
|
|
|
1499
1499
|
--floe-window-shadow: 0 1px 3px rgb(0 0 0 / 30%), 0 12px 28px -8px rgb(0 0 0 / 32%);
|
|
1500
1500
|
--background: #1c1c1e;
|
|
1501
1501
|
--foreground: #f2f2f7;
|
|
1502
|
-
--primary: #
|
|
1503
|
-
--primary-foreground: #
|
|
1502
|
+
--primary: #0a84ff;
|
|
1503
|
+
--primary-foreground: #101012;
|
|
1504
1504
|
--secondary: #3a3a3c;
|
|
1505
1505
|
--secondary-foreground: #f2f2f7;
|
|
1506
1506
|
--muted: #3a3a3c;
|
|
@@ -1535,8 +1535,8 @@
|
|
|
1535
1535
|
--highlight-block-tip-accent: #71c8c0;
|
|
1536
1536
|
--sidebar: #242426;
|
|
1537
1537
|
--sidebar-foreground: #f2f2f7;
|
|
1538
|
-
--sidebar-primary: #
|
|
1539
|
-
--sidebar-primary-foreground: #
|
|
1538
|
+
--sidebar-primary: #0a84ff;
|
|
1539
|
+
--sidebar-primary-foreground: #101012;
|
|
1540
1540
|
--sidebar-accent: #3a3a3c;
|
|
1541
1541
|
--sidebar-accent-foreground: #f2f2f7;
|
|
1542
1542
|
--sidebar-border: #38383a;
|
|
@@ -1544,8 +1544,8 @@
|
|
|
1544
1544
|
--activity-bar: #242426;
|
|
1545
1545
|
--activity-bar-foreground: #aeaeb2;
|
|
1546
1546
|
--activity-bar-foreground-active: #f2f2f7;
|
|
1547
|
-
--activity-bar-badge: #
|
|
1548
|
-
--activity-bar-badge-foreground: #
|
|
1547
|
+
--activity-bar-badge: #0a84ff;
|
|
1548
|
+
--activity-bar-badge-foreground: #101012;
|
|
1549
1549
|
--terminal-background: #141416;
|
|
1550
1550
|
--terminal-foreground: #e5e5ea;
|
|
1551
1551
|
--chart-1: #2dd4d4;
|
package/dist/ui.css
CHANGED
|
@@ -762,16 +762,10 @@
|
|
|
762
762
|
--segmented-control-item-color: var(--muted-foreground);
|
|
763
763
|
--segmented-control-item-hover-bg: color-mix(in srgb, var(--background) 74%, var(--muted) 26%);
|
|
764
764
|
--segmented-control-item-hover-color: var(--foreground);
|
|
765
|
-
--segmented-control-item-active-bg:
|
|
766
|
-
--segmented-control-item-active-border:
|
|
767
|
-
|
|
768
|
-
|
|
769
|
-
var(--foreground) 30%
|
|
770
|
-
);
|
|
771
|
-
--segmented-control-item-active-color: var(--foreground);
|
|
772
|
-
--segmented-control-item-active-shadow:
|
|
773
|
-
inset 0 1px 0 color-mix(in srgb, white 55%, transparent),
|
|
774
|
-
0 1px 2px color-mix(in srgb, black 10%, transparent);
|
|
765
|
+
--segmented-control-item-active-bg: var(--primary);
|
|
766
|
+
--segmented-control-item-active-border: var(--primary);
|
|
767
|
+
--segmented-control-item-active-color: var(--primary-foreground);
|
|
768
|
+
--segmented-control-item-active-shadow: none;
|
|
775
769
|
|
|
776
770
|
background-color: var(--segmented-control-bg);
|
|
777
771
|
border-color: var(--segmented-control-border);
|
|
@@ -785,19 +779,6 @@
|
|
|
785
779
|
var(--foreground) 8%,
|
|
786
780
|
var(--background) 92%
|
|
787
781
|
);
|
|
788
|
-
--segmented-control-item-active-bg: color-mix(
|
|
789
|
-
in srgb,
|
|
790
|
-
var(--foreground) 14%,
|
|
791
|
-
var(--background) 86%
|
|
792
|
-
);
|
|
793
|
-
--segmented-control-item-active-border: color-mix(
|
|
794
|
-
in srgb,
|
|
795
|
-
var(--foreground) 28%,
|
|
796
|
-
var(--border) 72%
|
|
797
|
-
);
|
|
798
|
-
--segmented-control-item-active-shadow:
|
|
799
|
-
inset 0 1px 0 color-mix(in srgb, white 12%, transparent),
|
|
800
|
-
0 1px 2px color-mix(in srgb, black 30%, transparent);
|
|
801
782
|
}
|
|
802
783
|
|
|
803
784
|
.floe-segmented-control__item {
|