@evotecit/canopyx 0.3.16 → 0.3.18
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/CanopyX.Html/Assets/canopyx-board.css +50 -0
- package/CanopyX.Html/Assets/canopyx-board.js +39 -0
- package/CanopyX.Html/Assets/canopyx-buckets.js +15 -0
- package/CanopyX.Html/Assets/canopyx-calculations.css +7 -0
- package/CanopyX.Html/Assets/canopyx-calculations.js +52 -0
- package/CanopyX.Html/Assets/canopyx-calendar-edit.js +3 -3
- package/CanopyX.Html/Assets/canopyx-calendar.css +5 -24
- package/CanopyX.Html/Assets/canopyx-calendar.js +14 -19
- package/CanopyX.Html/Assets/canopyx-cell-range.js +16 -14
- package/CanopyX.Html/Assets/canopyx-changes.css +6 -24
- package/CanopyX.Html/Assets/canopyx-changes.js +18 -15
- package/CanopyX.Html/Assets/canopyx-compare.css +37 -0
- package/CanopyX.Html/Assets/canopyx-compare.js +12 -0
- package/CanopyX.Html/Assets/canopyx-data.js +3 -3
- package/CanopyX.Html/Assets/canopyx-editing.css +2 -2
- package/CanopyX.Html/Assets/canopyx-editing.js +2 -2
- package/CanopyX.Html/Assets/canopyx-enhance.js +4 -4
- package/CanopyX.Html/Assets/canopyx-export.js +54 -13
- package/CanopyX.Html/Assets/canopyx-facets.css +14 -5
- package/CanopyX.Html/Assets/canopyx-facets.js +19 -15
- package/CanopyX.Html/Assets/canopyx-filter-editor.css +71 -85
- package/CanopyX.Html/Assets/canopyx-filter-editor.js +20 -16
- package/CanopyX.Html/Assets/canopyx-flow-checks.css +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-checks.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-dialog.css +2 -2
- package/CanopyX.Html/Assets/canopyx-flow-dialog.js +1 -1
- package/CanopyX.Html/Assets/canopyx-flow-entry.css +136 -12
- package/CanopyX.Html/Assets/canopyx-flow-entry.js +2 -2
- package/CanopyX.Html/Assets/canopyx-flow-module.mjs +2 -2
- package/CanopyX.Html/Assets/canopyx-format-editor.js +2 -2
- package/CanopyX.Html/Assets/canopyx-formatting.js +10 -9
- package/CanopyX.Html/Assets/canopyx-grid-module.mjs +182 -128
- package/CanopyX.Html/Assets/canopyx-grid.css +228 -96
- package/CanopyX.Html/Assets/canopyx-grid.js +182 -128
- package/CanopyX.Html/Assets/canopyx-grouping.css +22 -15
- package/CanopyX.Html/Assets/canopyx-grouping.js +24 -17
- package/CanopyX.Html/Assets/canopyx-interactive.css +197 -74
- package/CanopyX.Html/Assets/canopyx-interactive.js +38 -45
- package/CanopyX.Html/Assets/canopyx-labels-de.js +177 -9
- package/CanopyX.Html/Assets/canopyx-labels-es.js +177 -9
- package/CanopyX.Html/Assets/canopyx-labels-fr.js +176 -8
- package/CanopyX.Html/Assets/canopyx-labels-it.js +176 -8
- package/CanopyX.Html/Assets/canopyx-labels-pl.js +176 -8
- package/CanopyX.Html/Assets/canopyx-layouts.css +48 -20
- package/CanopyX.Html/Assets/canopyx-layouts.js +36 -14
- package/CanopyX.Html/Assets/canopyx-link.js +2 -2
- package/CanopyX.Html/Assets/canopyx-live.css +1 -3
- package/CanopyX.Html/Assets/canopyx-live.js +3 -3
- package/CanopyX.Html/Assets/canopyx-matrix.css +1 -8
- package/CanopyX.Html/Assets/canopyx-matrix.js +11 -11
- package/CanopyX.Html/Assets/canopyx-module.mjs +38 -45
- package/CanopyX.Html/Assets/canopyx-office-export.js +2936 -0
- package/CanopyX.Html/Assets/canopyx-path.css +45 -0
- package/CanopyX.Html/Assets/canopyx-path.js +28 -0
- package/CanopyX.Html/Assets/canopyx-pivot.css +75 -0
- package/CanopyX.Html/Assets/canopyx-pivot.js +72 -0
- package/CanopyX.Html/Assets/canopyx-plan.css +56 -0
- package/CanopyX.Html/Assets/canopyx-plan.js +67 -0
- package/CanopyX.Html/Assets/canopyx-presenters.js +2 -2
- package/CanopyX.Html/Assets/canopyx-record-panel.css +8 -7
- package/CanopyX.Html/Assets/canopyx-record-panel.js +15 -14
- package/CanopyX.Html/Assets/canopyx-reporting-module.mjs +222 -161
- package/CanopyX.Html/Assets/canopyx-reporting.css +240 -107
- package/CanopyX.Html/Assets/canopyx-reporting.js +222 -161
- package/CanopyX.Html/Assets/canopyx-stack.css +35 -0
- package/CanopyX.Html/Assets/canopyx-stack.js +24 -0
- package/CanopyX.Html/Assets/canopyx-time-slider.css +18 -0
- package/CanopyX.Html/Assets/canopyx-time-slider.js +27 -0
- package/CanopyX.Html/Assets/canopyx-timeline.js +6 -5
- package/CanopyX.Html/Assets/canopyx-tree-tools.css +36 -35
- package/CanopyX.Html/Assets/canopyx-tree-tools.js +15 -12
- package/CanopyX.Html/Assets/canopyx-ui-menu.css +41 -0
- package/CanopyX.Html/Assets/canopyx-ui-menu.js +64 -0
- package/CanopyX.Html/Assets/canopyx-ui-navigation.css +73 -0
- package/CanopyX.Html/Assets/canopyx-ui-navigation.js +39 -0
- package/CanopyX.Html/Assets/canopyx-ui-overlays.css +79 -0
- package/CanopyX.Html/Assets/canopyx-ui-overlays.js +42 -0
- package/CanopyX.Html/Assets/canopyx-ui-picker.css +12 -0
- package/CanopyX.Html/Assets/canopyx-ui-picker.js +6 -0
- package/CanopyX.Html/Assets/canopyx-ui-stepper.css +174 -0
- package/CanopyX.Html/Assets/canopyx-ui-stepper.js +48 -0
- package/CanopyX.Html/Assets/canopyx-ui-tabs.css +153 -0
- package/CanopyX.Html/Assets/canopyx-ui-tabs.js +47 -0
- package/CanopyX.Html/Assets/canopyx-values.css +5 -0
- package/CanopyX.Html/Assets/canopyx-values.js +13 -0
- package/CanopyX.Html/Assets/canopyx-view-intents.css +12 -0
- package/CanopyX.Html/Assets/canopyx-view-intents.js +56 -0
- package/CanopyX.Html/Assets/canopyx.css +197 -71
- package/CanopyX.Html/Assets/canopyx.js +29 -19
- package/JavaScript/board.d.ts +30 -0
- package/JavaScript/changes.d.ts +4 -1
- package/JavaScript/facets.d.ts +5 -3
- package/JavaScript/grid.d.ts +150 -16
- package/JavaScript/hosts.d.ts +14 -1
- package/JavaScript/index.d.ts +4 -2
- package/JavaScript/locales/de.mjs +177 -9
- package/JavaScript/locales/es.mjs +177 -9
- package/JavaScript/locales/fr.mjs +176 -8
- package/JavaScript/locales/it.mjs +176 -8
- package/JavaScript/locales/pl.mjs +176 -8
- package/JavaScript/matrix.d.ts +4 -1
- package/JavaScript/path.d.ts +33 -0
- package/JavaScript/pivot.d.ts +135 -0
- package/JavaScript/plan.d.ts +23 -0
- package/JavaScript/protocol.d.ts +16 -3
- package/JavaScript/records.d.ts +2 -0
- package/JavaScript/stack.d.ts +28 -0
- package/JavaScript/time-slider.d.ts +58 -0
- package/JavaScript/ui.d.ts +261 -0
- package/JavaScript/view-intents.d.ts +45 -0
- package/README.md +22 -3
- package/ThirdParty/OfficeIMO/LICENSE +21 -0
- package/ThirdParty/OfficeIMO/README.md +13 -0
- package/package.json +76 -3
|
@@ -36,7 +36,6 @@
|
|
|
36
36
|
--cx-size-10px:10px;
|
|
37
37
|
--cx-size-11px:11px;
|
|
38
38
|
--cx-size-1d5px:1.5px;
|
|
39
|
-
--cx-size-21px:21px;
|
|
40
39
|
--cx-size-5px:5px;
|
|
41
40
|
--cx-size-280px:280px;
|
|
42
41
|
--cx-size-34px:34px;
|
|
@@ -48,17 +47,13 @@
|
|
|
48
47
|
--cx-size-16px:16px;
|
|
49
48
|
--cx-size-320px:320px;
|
|
50
49
|
--cx-size-2px:2px;
|
|
51
|
-
--cx-size-d8em:.8em;
|
|
52
|
-
--cx-size-d85em:.85em;
|
|
53
50
|
--cx-size-neg-2px:-2px;
|
|
54
51
|
--cx-size-180px:180px;
|
|
55
|
-
--cx-size-d92em:.92em;
|
|
56
52
|
--cx-size-9px:9px;
|
|
57
53
|
--cx-size-neg-3px:-3px;
|
|
58
54
|
--cx-size-18px:18px;
|
|
59
55
|
--cx-size-1d6px:1.6px;
|
|
60
56
|
--cx-size-999px:999px;
|
|
61
|
-
--cx-size-12em:12em;
|
|
62
57
|
--cx-size-100vh:100vh;
|
|
63
58
|
--cx-size-340px:340px;
|
|
64
59
|
--cx-size-20px:20px;
|
|
@@ -83,30 +78,36 @@
|
|
|
83
78
|
box-sizing:border-box;
|
|
84
79
|
display:flex;
|
|
85
80
|
flex-direction:column;
|
|
86
|
-
height:
|
|
81
|
+
height:480px;
|
|
87
82
|
min-height:0;
|
|
88
83
|
color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));
|
|
89
84
|
background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));
|
|
90
85
|
font-family:var(--hfx-font-sans,"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif);
|
|
91
86
|
font-size:var(--hfx-control-font-size,calc(var(--hfx-type-body-size,0.875rem) - var(--cx-compact,0) * .0625rem));
|
|
92
|
-
line-height:1.4;
|
|
87
|
+
line-height:var(--hfx-type-small-line,1.4);
|
|
93
88
|
}
|
|
89
|
+
.cx-host[data-cx-chrome="embedded"]{background:transparent;border:0;border-radius:0;}
|
|
90
|
+
.cx-host[data-cx-chrome="embedded"] > .cx-grid{border-inline:0;border-bottom:0;border-radius:0;background:transparent;}
|
|
91
|
+
.cx-host[data-cx-chrome="embedded"] > :is(.cx-grid-notice,.cx-grid-status,.cx-grid-pager){background:transparent;}
|
|
92
|
+
.cx-host[data-cx-chrome="embedded"] :is(.cx-toolbar,.cx-grid-query-summary,.cx-grid-status,.cx-grid-pager){padding-inline:var(--hfx-card-padding-x,calc(20px - var(--cx-compact,0) * 4px));}
|
|
93
|
+
.cx-host[data-cx-chrome="embedded"] :is(.cx-hrow,.cx-row) > :first-child{padding-inline-start:var(--hfx-card-padding-x,calc(20px - var(--cx-compact,0) * 4px));}
|
|
94
|
+
.cx-host[data-cx-chrome="embedded"] :is(.cx-hrow,.cx-row) > :last-child{padding-inline-end:var(--hfx-card-padding-x,calc(20px - var(--cx-compact,0) * 4px));}
|
|
94
95
|
.cx-host *,.cx-host *::before,.cx-host *::after{box-sizing:border-box;}
|
|
95
|
-
.cx-host .cx-button.cx-filter-chip{display:inline-flex;align-items:center;justify-content:flex-start;gap:var(--
|
|
96
|
-
.cx-filter-chip > .cx-chip-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
|
|
96
|
+
.cx-host .cx-button.cx-filter-chip{display:inline-flex;align-items:center;justify-content:flex-start;gap:var(--hfx-space-1-5,6px);min-width:0;}
|
|
97
|
+
.cx-filter-chip > .cx-chip-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:var(--hfx-type-small-line,1.4);}
|
|
97
98
|
.cx-filter-chip > .cx-chip-remove{flex:none;}
|
|
98
99
|
@media print{.cx-filter-chip > .cx-chip-label{white-space:normal;overflow:visible;text-overflow:clip;}}
|
|
99
100
|
@media not (forced-colors:active){
|
|
100
101
|
:where(.cx-host,.cx-host *){scrollbar-color:var(--cx-scrollbar-thumb) var(--cx-scrollbar-track);scrollbar-width:thin;}
|
|
101
102
|
.cx-host::-webkit-scrollbar,.cx-host ::-webkit-scrollbar{width:var(--cx-scrollbar-size);height:var(--cx-scrollbar-size);}
|
|
102
103
|
.cx-host::-webkit-scrollbar-track,.cx-host ::-webkit-scrollbar-track,.cx-host ::-webkit-scrollbar-corner{background:var(--cx-scrollbar-track);}
|
|
103
|
-
.cx-host::-webkit-scrollbar-thumb,.cx-host ::-webkit-scrollbar-thumb{background:var(--cx-scrollbar-thumb) padding-box;border:var(--
|
|
104
|
+
.cx-host::-webkit-scrollbar-thumb,.cx-host ::-webkit-scrollbar-thumb{background:var(--cx-scrollbar-thumb) padding-box;border:calc(var(--hfx-border-width,1px)*2) solid transparent;border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));}
|
|
104
105
|
.cx-host ::-webkit-scrollbar-thumb:hover{background-color:var(--cx-scrollbar-thumb-hover);}
|
|
105
106
|
}
|
|
106
107
|
.cx-sr-only{
|
|
107
|
-
--cx-size-1px:1px;--cx-size-neg-1px:-1px;
|
|
108
108
|
position:absolute !important;
|
|
109
|
-
width:
|
|
109
|
+
width:1px;height:1px;padding:0;
|
|
110
|
+
margin:calc(var(--hfx-border-width,1px)*-1);
|
|
110
111
|
overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
|
|
111
112
|
}
|
|
112
113
|
.cx-host[data-cx-density="compact"]{--cx-compact:1;}
|
|
@@ -115,57 +116,181 @@ overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
|
|
|
115
116
|
:where([data-cx-fallback-mode="light"],.cx-static[data-theme="light"],.cx-static[data-cx-theme="light"]){color-scheme:light;}
|
|
116
117
|
:where([data-cx-fallback-mode="dark"],.cx-static[data-theme="dark"],.cx-static[data-cx-theme="dark"]){color-scheme:dark;}
|
|
117
118
|
}
|
|
118
|
-
.
|
|
119
|
+
@layer hfx.components{
|
|
120
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close){
|
|
121
|
+
display:inline-flex;align-items:center;justify-content:center;gap:var(--hfx-space-1-5,6px);
|
|
122
|
+
min-block-size:var(--cx-ui-touch-target,var(--hfx-control-height-md,calc(36px - var(--cx-compact,0) * 8px)));block-size:var(--hfx-control-height-md,calc(36px - var(--cx-compact,0) * 8px));padding:0 var(--hfx-control-padding-x,calc(14px - var(--cx-compact,0) * 4px));
|
|
123
|
+
border:var(--hfx-border-width,1px) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));
|
|
124
|
+
background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));
|
|
125
|
+
font:var(--hfx-weight-medium,500) var(--hfx-control-font-size,calc(var(--hfx-type-body-size,0.875rem) - var(--cx-compact,0) * .0625rem)) var(--hfx-font-sans,"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif);line-height:1;white-space:nowrap;cursor:pointer;
|
|
126
|
+
}
|
|
127
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close):hover{background:var(--hfx-color-hover,light-dark(#f5f5f5,#232529));}
|
|
128
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close):active{background:var(--hfx-color-active,light-dark(#ebebec,#2e3034));}
|
|
129
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close):focus-visible{outline:var(--hfx-focus-width,2px) solid var(--hfx-color-focus-ring,light-dark(#02726a,#37c9b8));outline-offset:var(--hfx-focus-offset,2px);}
|
|
130
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close):is([data-variant="primary"],[data-primary],.primary){
|
|
131
|
+
background:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));border-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));color:var(--hfx-color-accent-contrast,light-dark(#ffffff,#0c0d10));
|
|
132
|
+
}
|
|
133
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close):is([data-variant="primary"],[data-primary],.primary):hover{background:var(--hfx-color-accent-hover,light-dark(#0d6760,#4dd9c8));border-color:var(--hfx-color-accent-hover,light-dark(#0d6760,#4dd9c8));}
|
|
134
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close):is([data-variant="ghost"],[data-ghost],.ghost){background:transparent;border-color:transparent;color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));}
|
|
135
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close):is([data-variant="ghost"],[data-ghost],.ghost):hover{background:var(--hfx-color-hover,light-dark(#f5f5f5,#232529));color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));}
|
|
136
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close):is([data-variant="danger"],.danger){color:var(--hfx-color-status-bad-fg,light-dark(#b8292a,#f47171));border-color:var(--hfx-color-status-bad-border,light-dark(#eeacac,#814345));}
|
|
137
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close):is([aria-pressed="true"],.active){
|
|
138
|
+
border-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));background:var(--hfx-color-accent-subtle,light-dark(#e7f1f1,#1b3435));color:var(--hfx-color-accent-text,light-dark(#02726a,#37c9b8));
|
|
139
|
+
}
|
|
140
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close):is(:disabled,[aria-disabled="true"]),:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close):is(:disabled,[aria-disabled="true"]):hover{color:var(--hfx-color-text-disabled,light-dark(#a3a8b0,#5a5f68));background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));border-color:var(--hfx-color-border,light-dark(#e2e4e7,#272a30));cursor:default;}
|
|
141
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close):is([data-variant="ghost"],[data-ghost],.ghost):is(:disabled,[aria-disabled="true"]),:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close):is([data-variant="ghost"],[data-ghost],.ghost):is(:disabled,[aria-disabled="true"]):hover{background:transparent;border-color:transparent;}
|
|
142
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close):is([data-size="sm"],.sm){block-size:var(--hfx-control-height-sm,calc(28px - var(--cx-compact,0) * 4px));min-block-size:var(--hfx-control-height-sm,calc(28px - var(--cx-compact,0) * 4px));padding:0 var(--hfx-space-2,0.5rem);}
|
|
143
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close):is([data-size="lg"],.lg){block-size:var(--hfx-control-height-lg,calc(44px - var(--cx-compact,0) * 8px));min-block-size:var(--hfx-control-height-lg,calc(44px - var(--cx-compact,0) * 8px));}
|
|
144
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close):is([data-icon],.icon){inline-size:var(--hfx-control-height-md,calc(36px - var(--cx-compact,0) * 8px));padding:0;}
|
|
145
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close):is([data-icon],.icon):is([data-size="sm"],.sm){inline-size:var(--hfx-control-height-sm,calc(28px - var(--cx-compact,0) * 4px));}
|
|
146
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,[data-cx-open],.cx-overlay-close) :where(.badge,.cx-count){
|
|
147
|
+
display:inline-grid;place-items:center;min-inline-size:var(--hfx-badge-height,20px);block-size:var(--hfx-badge-height,20px);padding:0 var(--hfx-space-1,0.25rem);
|
|
148
|
+
border-radius:var(--hfx-radius-pill,999px);background:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));color:var(--hfx-color-accent-contrast,light-dark(#ffffff,#0c0d10));
|
|
149
|
+
font-size:var(--hfx-type-caption-size,0.75rem);font-weight:var(--hfx-weight-semibold,600);
|
|
150
|
+
}
|
|
151
|
+
:where(.cx-input,.cx-select,.cx-textarea){
|
|
152
|
+
min-inline-size:0;block-size:var(--hfx-control-height-md,calc(36px - var(--cx-compact,0) * 8px));padding:0 calc(var(--hfx-space-1,0.25rem)*2.5);
|
|
153
|
+
border:var(--hfx-border-width,1px) solid var(--hfx-color-border-control,light-dark(#8a8f98,#6e737c));border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));
|
|
154
|
+
background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));font:inherit;font-size:var(--hfx-control-font-size,calc(var(--hfx-type-body-size,0.875rem) - var(--cx-compact,0) * .0625rem));
|
|
155
|
+
}
|
|
156
|
+
:where(.cx-textarea){block-size:auto;min-block-size:calc(var(--hfx-control-height-md,calc(36px - var(--cx-compact,0) * 8px))*2);padding-block:var(--hfx-space-2,0.5rem);}
|
|
157
|
+
:where(.cx-input,.cx-select,.cx-textarea)::placeholder{color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));opacity:1;}
|
|
158
|
+
:where(.cx-input,.cx-select,.cx-textarea):focus-visible{outline:var(--hfx-focus-width,2px) solid var(--hfx-color-focus-ring,light-dark(#02726a,#37c9b8));outline-offset:var(--hfx-focus-offset,2px);border-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));}
|
|
159
|
+
:where(.cx-input,.cx-select,.cx-textarea):disabled{color:var(--hfx-color-text-disabled,light-dark(#a3a8b0,#5a5f68));background:var(--hfx-color-surface-sunken,light-dark(#f7f8f9,#111317));}
|
|
160
|
+
:where(.cx-input,.cx-select,.cx-textarea)[aria-invalid="true"]{border-color:var(--hfx-color-status-bad-fg,light-dark(#b8292a,#f47171));}
|
|
161
|
+
:where(.cx-input,.cx-select,.cx-textarea):is([data-size="sm"],.sm){block-size:var(--hfx-control-height-sm,calc(28px - var(--cx-compact,0) * 4px));padding:0 var(--hfx-space-2,0.5rem);}
|
|
162
|
+
:where(.cx-check){inline-size:var(--hfx-icon-md,16px);block-size:var(--hfx-icon-md,16px);margin:0;accent-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));flex:none;}
|
|
163
|
+
:where(.cx-toggle){
|
|
164
|
+
appearance:none;flex:none;position:relative;inline-size:calc(var(--hfx-icon-md,16px)*2.25);block-size:calc(var(--hfx-icon-md,16px)*1.25);margin:0;
|
|
165
|
+
border-radius:var(--hfx-radius-pill,999px);background:var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));cursor:pointer;
|
|
166
|
+
transition:background-color var(--hfx-motion-duration-fast,120ms) var(--hfx-motion-easing-standard,cubic-bezier(.2,0,0,1));
|
|
167
|
+
}
|
|
168
|
+
:where(.cx-toggle)::before{
|
|
169
|
+
content:"";position:absolute;inset-block-start:calc(var(--hfx-icon-md,16px)*.125);inset-inline-start:calc(var(--hfx-icon-md,16px)*.125);
|
|
170
|
+
inline-size:var(--hfx-icon-md,16px);block-size:var(--hfx-icon-md,16px);border-radius:var(--hfx-radius-pill,999px);background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));box-shadow:var(--hfx-elevation-1,0 1px 2px rgba(22,24,28,.06));
|
|
171
|
+
transition:transform var(--hfx-motion-duration-fast,120ms) var(--hfx-motion-easing-standard,cubic-bezier(.2,0,0,1));
|
|
172
|
+
}
|
|
173
|
+
:where(.cx-toggle):checked{background:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));}
|
|
174
|
+
:where(.cx-toggle):checked::before{transform:translateX(var(--hfx-icon-md,16px));}
|
|
175
|
+
:where(:dir(rtl)) :where(.cx-toggle):checked::before{transform:translateX(calc(var(--hfx-icon-md,16px)*-1));}
|
|
176
|
+
:where(.cx-toggle):disabled{background:var(--hfx-color-border,light-dark(#e2e4e7,#272a30));cursor:default;}
|
|
177
|
+
:where(.cx-toggle,.cx-check):focus-visible{outline:var(--hfx-focus-width,2px) solid var(--hfx-color-focus-ring,light-dark(#02726a,#37c9b8));outline-offset:var(--hfx-focus-offset,2px);}
|
|
178
|
+
:where(.cx-segmented,.cx-seg){
|
|
179
|
+
display:inline-flex;align-items:center;gap:var(--hfx-space-0-5,2px);padding:var(--hfx-space-0-5,2px);
|
|
180
|
+
border:var(--hfx-border-width,1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));background:var(--hfx-color-surface-sunken,light-dark(#f7f8f9,#111317));
|
|
181
|
+
}
|
|
182
|
+
:where(.cx-segmented,.cx-seg) > :where(button,[role="radio"]){
|
|
183
|
+
display:inline-flex;align-items:center;justify-content:center;gap:var(--hfx-space-1-5,6px);
|
|
184
|
+
block-size:calc(var(--hfx-control-height-md,calc(36px - var(--cx-compact,0) * 8px)) - var(--hfx-space-1,0.25rem));padding:0 var(--hfx-space-3,0.75rem);border:0;border-radius:calc(var(--hfx-radius-control,var(--hfx-radius-md,6px)) - var(--hfx-space-0-5,2px));
|
|
185
|
+
background:transparent;color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));font:var(--hfx-weight-medium,500) var(--hfx-control-font-size,calc(var(--hfx-type-body-size,0.875rem) - var(--cx-compact,0) * .0625rem)) var(--hfx-font-sans,"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif);cursor:pointer;white-space:nowrap;
|
|
186
|
+
}
|
|
187
|
+
:where(.cx-segmented,.cx-seg) > :where(button,[role="radio"]):hover{color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));}
|
|
188
|
+
:where(.cx-segmented,.cx-seg) > :where([aria-pressed="true"],[aria-checked="true"],.active,.on){background:var(--hfx-color-surface-raised,light-dark(#ffffff,#1e2126));color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));box-shadow:var(--hfx-elevation-1,0 1px 2px rgba(22,24,28,.06));outline:var(--hfx-border-width,1px) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));outline-offset:calc(var(--hfx-border-width,1px)*-1);}
|
|
189
|
+
:where(.cx-segmented,.cx-seg) > :where(button,[role="radio"]):focus-visible{outline:var(--hfx-focus-width,2px) solid var(--hfx-color-focus-ring,light-dark(#02726a,#37c9b8));outline-offset:calc(var(--hfx-focus-width,2px)*-1);}
|
|
190
|
+
:where(.cx-segmented,.cx-seg):is([data-size="sm"],.sm) > :where(button,[role="radio"]){block-size:calc(var(--hfx-control-height-sm,calc(28px - var(--cx-compact,0) * 4px)) - var(--hfx-space-1,0.25rem));padding:0 var(--hfx-space-2,0.5rem);}
|
|
191
|
+
:where(.cx-chip){
|
|
192
|
+
display:inline-flex;align-items:center;gap:var(--hfx-space-1-5,6px);max-inline-size:100%;block-size:var(--hfx-control-height-sm,calc(28px - var(--cx-compact,0) * 4px));padding:0 calc(var(--hfx-space-1,0.25rem)*2.5);
|
|
193
|
+
border:var(--hfx-border-width,1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));border-radius:var(--hfx-radius-status,999px);
|
|
194
|
+
background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));font:var(--hfx-weight-medium,500) var(--hfx-type-small-size,0.8125rem) var(--hfx-font-sans,"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif);white-space:nowrap;
|
|
195
|
+
}
|
|
196
|
+
:where(button.cx-chip){cursor:pointer;}
|
|
197
|
+
:where(button.cx-chip):hover{background:var(--hfx-color-hover,light-dark(#f5f5f5,#232529));}
|
|
198
|
+
:where(.cx-chip):is([aria-pressed="true"],.active){border-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));background:var(--hfx-color-accent-subtle,light-dark(#e7f1f1,#1b3435));color:var(--hfx-color-accent-text,light-dark(#02726a,#37c9b8));}
|
|
199
|
+
:where(.cx-chip):focus-visible{outline:var(--hfx-focus-width,2px) solid var(--hfx-color-focus-ring,light-dark(#02726a,#37c9b8));outline-offset:var(--hfx-focus-offset,2px);}
|
|
200
|
+
:where(.cx-pill,.p-pill){
|
|
201
|
+
display:inline-flex;align-items:center;gap:var(--hfx-space-1,0.25rem);block-size:var(--hfx-pill-height,22px);padding:0 var(--hfx-space-2,0.5rem);
|
|
202
|
+
border-radius:var(--hfx-radius-status,999px);background:var(--hfx-color-status-neutral-bg,light-dark(#eeeff0,#2a2c31));color:var(--hfx-color-status-neutral-fg,light-dark(#5b6069,#a0a5ae));
|
|
203
|
+
font:var(--hfx-weight-semibold,600) var(--hfx-type-caption-size,0.75rem) var(--hfx-font-sans,"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif);white-space:nowrap;
|
|
204
|
+
outline:var(--hfx-border-width,1px) solid color-mix(in srgb,currentColor 24%,transparent);outline-offset:calc(var(--hfx-border-width,1px)*-1);
|
|
205
|
+
}
|
|
206
|
+
:where(.cx-pill,.p-pill):is(.cx-tone-info,.info){background:var(--hfx-color-status-info-bg,light-dark(#e4ecfa,#262f41));color:var(--hfx-color-status-info-fg,light-dark(#2b5fc0,#74a2f7));}
|
|
207
|
+
:where(.cx-pill,.p-pill):is(.cx-tone-success,.success){background:var(--hfx-color-status-good-bg,light-dark(#e2f0e9,#1f362f));color:var(--hfx-color-status-good-fg,light-dark(#177345,#4cc78a));}
|
|
208
|
+
:where(.cx-pill,.p-pill):is(.cx-tone-warning,.warning){background:var(--hfx-color-status-warn-bg,light-dark(#f8efde,#3b3322));color:var(--hfx-color-status-warn-fg,light-dark(#8c5c05,#eeb640));}
|
|
209
|
+
:where(.cx-pill,.p-pill):is(.cx-tone-danger,.danger){background:var(--hfx-color-status-bad-bg,light-dark(#f9e4e4,#3c272a));color:var(--hfx-color-status-bad-fg,light-dark(#b8292a,#f47171));}
|
|
210
|
+
:where(.cx-pill,.p-pill).cx-toned{background:var(--cx-t-bg,color-mix(in srgb,var(--cx-t,var(--hfx-color-text,light-dark(#16181c,#f2f3f5))) 12%,var(--hfx-color-surface,light-dark(#ffffff,#16181c))));color:var(--cx-t,var(--hfx-color-text,light-dark(#16181c,#f2f3f5)));}
|
|
211
|
+
:where(.cx-disclosure){
|
|
212
|
+
flex:none;display:inline-grid;place-items:center;inline-size:var(--hfx-icon-md,16px);block-size:var(--hfx-icon-md,16px);color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));
|
|
213
|
+
transition:transform var(--hfx-motion-duration-fast,120ms) var(--hfx-motion-easing-standard,cubic-bezier(.2,0,0,1));
|
|
214
|
+
}
|
|
215
|
+
:where(.cx-disclosure)::before{
|
|
216
|
+
content:"";inline-size:calc(var(--hfx-icon-md,16px)*.4375);block-size:calc(var(--hfx-icon-md,16px)*.4375);
|
|
217
|
+
border-inline-end:calc(var(--hfx-border-width,1px)*1.6) solid currentColor;border-block-end:calc(var(--hfx-border-width,1px)*1.6) solid currentColor;transform:rotate(-45deg);
|
|
218
|
+
}
|
|
219
|
+
:where([aria-expanded="true"]) > :where(.cx-disclosure),:where(.cx-disclosure)[data-open]{transform:rotate(90deg);}
|
|
220
|
+
:where(:dir(rtl)) :where(.cx-disclosure)::before{transform:rotate(135deg);}
|
|
221
|
+
:where(.cx-empty-state){
|
|
222
|
+
display:grid;justify-items:center;gap:var(--hfx-space-2,0.5rem);padding:var(--hfx-space-6,2rem) var(--hfx-space-4,1rem);text-align:center;color:var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc));
|
|
223
|
+
}
|
|
224
|
+
:where(.cx-empty-state) > :where(strong,h2,h3){color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));font-size:var(--hfx-type-heading-size,0.9375rem);font-weight:var(--hfx-weight-semibold,600);}
|
|
225
|
+
:where(.cx-empty-state)[data-tone="danger"] > :where(strong,h2,h3){color:var(--hfx-color-status-bad-fg,light-dark(#b8292a,#f47171));}
|
|
226
|
+
:where(.cx-notice){
|
|
227
|
+
display:flex;align-items:center;gap:var(--hfx-space-2,0.5rem);padding:var(--hfx-space-2,0.5rem) var(--hfx-space-3,0.75rem);
|
|
228
|
+
border:var(--hfx-border-width,1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));border-inline-start:calc(var(--hfx-border-width,1px)*3) solid var(--cx-notice,var(--hfx-color-accent,light-dark(#11776f,#37c9b8)));
|
|
229
|
+
border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));font-size:var(--hfx-type-small-size,0.8125rem);
|
|
230
|
+
}
|
|
231
|
+
:where(.cx-notice).cx-tone-info{--cx-notice:var(--hfx-color-status-info-fg,light-dark(#2b5fc0,#74a2f7));}
|
|
232
|
+
:where(.cx-notice).cx-tone-success{--cx-notice:var(--hfx-color-status-good-fg,light-dark(#177345,#4cc78a));}
|
|
233
|
+
:where(.cx-notice).cx-tone-warning{--cx-notice:var(--hfx-color-status-warn-fg,light-dark(#8c5c05,#eeb640));}
|
|
234
|
+
:where(.cx-notice).cx-tone-danger{--cx-notice:var(--hfx-color-status-bad-fg,light-dark(#b8292a,#f47171));}
|
|
235
|
+
@media (prefers-reduced-motion:reduce){:where(.cx-toggle,.cx-toggle::before,.cx-disclosure){transition:none;}}
|
|
236
|
+
@media (forced-colors:active){
|
|
237
|
+
:where(.cx-btn,.cx-button,.cx-ui-button,.cx-chip,.cx-segmented > *):is([aria-pressed="true"],[aria-checked="true"],.active){forced-color-adjust:none;background:Highlight;color:HighlightText;}
|
|
238
|
+
:where(.cx-toggle){border:var(--hfx-border-width,1px) solid ButtonText;}
|
|
239
|
+
:where(.cx-toggle):checked{background:Highlight;}
|
|
240
|
+
}
|
|
241
|
+
}
|
|
242
|
+
.cx-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--hfx-space-2,0.5rem) var(--hfx-space-3,0.75rem);padding:var(--hfx-space-1,0.25rem) 0 calc(var(--hfx-space-1,0.25rem)*2.5);}
|
|
119
243
|
.cx-search{position:relative;min-width:0;max-width:100%;}
|
|
120
|
-
.cx-search::before{content:"";position:absolute;left:var(--
|
|
121
|
-
.cx-search::after{content:"";position:absolute;left:var(--
|
|
244
|
+
.cx-search::before{content:"";position:absolute;left:var(--hfx-space-3,0.75rem);top:calc(var(--hfx-space-1,0.25rem)*2.75);width:calc(var(--hfx-space-1,0.25rem)*2.5);height:calc(var(--hfx-space-1,0.25rem)*2.5);border:calc(var(--hfx-border-width,1px)*1.5) solid var(--hfx-color-text-muted,light-dark(#626770,#8f949d));border-radius:50%;pointer-events:none;}
|
|
245
|
+
.cx-search::after{content:"";position:absolute;left:calc(var(--hfx-space-1,0.25rem)*5.25);top:calc(var(--hfx-space-1,0.25rem)*5.25);width:calc(var(--hfx-space-1,0.25rem)*1.25);border-top:calc(var(--hfx-border-width,1px)*1.5) solid var(--hfx-color-text-muted,light-dark(#626770,#8f949d));transform:rotate(45deg);pointer-events:none;}
|
|
122
246
|
.cx-search-input{
|
|
123
|
-
font:inherit;width:
|
|
124
|
-
border:var(--
|
|
247
|
+
font:inherit;width:280px;max-width:100%;min-height:calc(var(--hfx-space-1,0.25rem)*8.5);padding:var(--hfx-space-1-5,6px) calc(var(--hfx-space-1,0.25rem)*2.5) var(--hfx-space-1-5,6px) var(--hfx-space-6,2rem);border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));
|
|
248
|
+
border:var(--hfx-border-width,1px) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));
|
|
125
249
|
}
|
|
126
250
|
.cx-search-input::placeholder{color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));opacity:1;}
|
|
127
251
|
.cx-results{
|
|
128
|
-
position:absolute;z-index:
|
|
129
|
-
margin:0;padding:var(--
|
|
130
|
-
border:var(--
|
|
252
|
+
position:absolute;z-index:var(--hfx-z-popover,1000);top:100%;left:0;width:420px;max-width:calc(100vw - var(--hfx-space-4,1rem));max-height:320px;overflow:auto;
|
|
253
|
+
margin:0;padding:var(--hfx-space-1,0.25rem);list-style:none;background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));
|
|
254
|
+
border:var(--hfx-border-width,1px) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));border-radius:var(--hfx-radius-overlay,var(--hfx-radius-lg,10px));box-shadow:var(--hfx-elevation-2,0 1px 2px rgba(22,24,28,.05),0 6px 18px -10px rgba(22,24,28,.18));
|
|
131
255
|
}
|
|
132
|
-
.cx-result{display:grid;grid-template-columns:1fr auto;gap:var(--
|
|
256
|
+
.cx-result{display:grid;grid-template-columns:1fr auto;gap:var(--hfx-space-0-5,2px) var(--hfx-space-2,0.5rem);padding:var(--hfx-space-1-5,6px) var(--hfx-space-2,0.5rem);border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));cursor:pointer;}
|
|
133
257
|
.cx-result-label{min-width:0;overflow-wrap:anywhere;}
|
|
134
258
|
.cx-result[aria-selected="true"],.cx-result:hover{background:var(--hfx-color-accent-subtle,light-dark(#e7f1f1,#1b3435));}
|
|
135
|
-
.cx-result-kind{font-size
|
|
136
|
-
.cx-result-context{grid-column:1 / -1;font-size
|
|
137
|
-
.cx-switch{display:inline-flex;align-items:center;gap:var(--
|
|
138
|
-
.cx-switch input{accent-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));width:var(--
|
|
259
|
+
.cx-result-kind{font-size:.8em;color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));text-transform:uppercase;}
|
|
260
|
+
.cx-result-context{grid-column:1 / -1;font-size:.85em;color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
|
|
261
|
+
.cx-switch{display:inline-flex;align-items:center;gap:calc(var(--hfx-space-1,0.25rem)*1.75);min-height:calc(var(--hfx-space-1,0.25rem)*8.5);cursor:pointer;}
|
|
262
|
+
.cx-switch input{accent-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));width:var(--hfx-space-4,1rem);height:var(--hfx-space-4,1rem);margin:0;}
|
|
139
263
|
.cx-columns{position:relative;}
|
|
140
264
|
.cx-columns:not([open]) > .cx-columns-list{display:none;}
|
|
141
|
-
.cx-columns > summary{display:flex;align-items:center;
|
|
142
|
-
.cx-columns > summary
|
|
265
|
+
.cx-columns > summary{display:flex;align-items:center;cursor:pointer;list-style:none;}
|
|
266
|
+
.cx-columns > summary:where(:not(.cx-btn,.cx-button)){gap:calc(var(--hfx-space-1,0.25rem)*2.5);min-height:calc(var(--hfx-space-1,0.25rem)*8.5);padding:var(--hfx-space-1-5,6px) calc(var(--hfx-space-1,0.25rem)*2.5);border:var(--hfx-border-width,1px) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));}
|
|
267
|
+
.cx-columns > summary::after{content:"";width:var(--hfx-space-1-5,6px);height:var(--hfx-space-1-5,6px);border-right:calc(var(--hfx-border-width,1px)*1.5) solid currentColor;border-bottom:calc(var(--hfx-border-width,1px)*1.5) solid currentColor;transform:rotate(45deg) translateY(calc(var(--hfx-space-0-5,2px)*-1));}
|
|
143
268
|
.cx-columns[open] > summary,.cx-columns > summary:hover{background:var(--hfx-color-hover,light-dark(#f5f5f5,#232529));}
|
|
144
269
|
.cx-columns > summary::-webkit-details-marker{display:none;}
|
|
145
270
|
.cx-columns-list{
|
|
146
|
-
position:absolute;z-index:
|
|
147
|
-
width:max-content;min-width:min(
|
|
148
|
-
display:grid;gap:var(--
|
|
271
|
+
position:absolute;z-index:var(--hfx-z-popover,1000);top:100%;left:0;margin:0;padding:var(--hfx-space-1-5,6px);
|
|
272
|
+
width:max-content;min-width:min(180px,calc(100vw - var(--hfx-space-4,1rem)));max-width:calc(100vw - var(--hfx-space-4,1rem));max-height:320px;overflow:auto;
|
|
273
|
+
display:grid;gap:var(--hfx-space-0-5,2px);background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));border:var(--hfx-border-width,1px) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));border-radius:var(--hfx-radius-overlay,var(--hfx-radius-lg,10px));box-shadow:var(--hfx-elevation-2,0 1px 2px rgba(22,24,28,.05),0 6px 18px -10px rgba(22,24,28,.18));
|
|
149
274
|
}
|
|
150
|
-
.cx-columns-list label{display:flex;gap:var(--
|
|
275
|
+
.cx-columns-list label{display:flex;gap:var(--hfx-space-2,0.5rem);align-items:center;min-height:var(--hfx-space-6,2rem);padding:var(--hfx-space-1,0.25rem) var(--hfx-space-1-5,6px);border-radius:var(--hfx-radius-sm,4px);cursor:pointer;overflow-wrap:anywhere;}
|
|
151
276
|
.cx-columns-list label:hover{background:var(--hfx-color-hover,light-dark(#f5f5f5,#232529));}
|
|
152
|
-
.cx-columns-list input{flex:none;width:var(--
|
|
277
|
+
.cx-columns-list input{flex:none;width:var(--hfx-space-4,1rem);height:var(--hfx-space-4,1rem);margin:0;accent-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));}
|
|
153
278
|
.cx-host :is(.cx-search-input,.cx-sort,.cx-columns > summary,.cx-switch input):focus-visible{outline:var(--hfx-focus-width,2px) solid var(--hfx-color-focus-ring,light-dark(#02726a,#37c9b8));outline-offset:var(--hfx-focus-offset,2px);}
|
|
154
279
|
.cx-grid{
|
|
155
280
|
position:relative;flex:1 1 auto;min-height:0;overflow:auto;outline:none;contain:strict;
|
|
156
|
-
background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));border:var(--
|
|
281
|
+
background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));border:var(--hfx-border-width,1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));
|
|
157
282
|
}
|
|
158
|
-
.cx-head{position:sticky;top:0;z-index:2;min-width:100%;width:max-content;background:var(--hfx-table-header-background,var(--hfx-color-surface-sunken,light-dark(#f7f8f9,#111317)));border-bottom:var(--
|
|
283
|
+
.cx-head{position:sticky;top:0;z-index:2;min-width:100%;width:max-content;background:var(--hfx-table-header-background,var(--hfx-color-surface-sunken,light-dark(#f7f8f9,#111317)));border-bottom:var(--hfx-border-width,1px) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));}
|
|
159
284
|
.cx-hrow{display:flex;height:var(--hfx-table-header-height,calc(40px - var(--cx-compact,0) * 8px));}
|
|
160
285
|
.cx-hcell{
|
|
161
|
-
flex:none;position:relative;display:flex;align-items:center;padding:0 var(--
|
|
162
|
-
font-weight:var(--hfx-table-header-weight,var(--hfx-weight-semibold,600));font-size:var(--hfx-table-header-size,var(--hfx-type-caption-size,0.75rem));line-height:var(--hfx-table-header-line-height,var(--hfx-type-caption-line-height,1.35));color:var(--hfx-table-header-color,var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc)));border-right:var(--
|
|
286
|
+
flex:none;position:relative;display:flex;align-items:center;padding:0 var(--hfx-space-2,0.5rem);overflow:hidden;white-space:nowrap;
|
|
287
|
+
font-weight:var(--hfx-table-header-weight,var(--hfx-weight-semibold,600));font-size:var(--hfx-table-header-size,var(--hfx-type-caption-size,0.75rem));line-height:var(--hfx-table-header-line-height,var(--hfx-type-caption-line-height,1.35));color:var(--hfx-table-header-color,var(--hfx-color-text-secondary,light-dark(#4d525b,#b0b4bc)));border-right:var(--hfx-border-width,1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));user-select:none;
|
|
163
288
|
}
|
|
164
289
|
.cx-hcell.cx-kind-number{justify-content:flex-end;}
|
|
165
|
-
.cx-sort{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;display:inline-flex;gap:var(--
|
|
166
|
-
.cx-hcell[aria-sort="ascending"] .cx-sort::after{content:"\25B2";font-size:var(--
|
|
167
|
-
.cx-hcell[aria-sort="descending"] .cx-sort::after{content:"\25BC";font-size:var(--
|
|
168
|
-
.cx-resize{padding:0;border:0;background:transparent;position:absolute;right:var(--
|
|
290
|
+
.cx-sort{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;display:inline-flex;gap:var(--hfx-space-1,0.25rem);align-items:center;min-height:var(--hfx-space-5,1.5rem);min-width:var(--hfx-space-5,1.5rem);}
|
|
291
|
+
.cx-hcell[aria-sort="ascending"] .cx-sort::after{content:"\25B2";font-size:calc(var(--hfx-type-caption-size,0.75rem)*.75);}
|
|
292
|
+
.cx-hcell[aria-sort="descending"] .cx-sort::after{content:"\25BC";font-size:calc(var(--hfx-type-caption-size,0.75rem)*.75);}
|
|
293
|
+
.cx-resize{padding:0;border:0;background:transparent;position:absolute;right:calc(var(--hfx-space-1,0.25rem)*-.75);top:0;bottom:0;width:calc(var(--hfx-space-1,0.25rem)*1.75);cursor:col-resize;z-index:1;}
|
|
169
294
|
.cx-pin-tree .cx-hcell:first-child,.cx-pin-tree .cx-row > .cx-tree{position:sticky;left:0;z-index:1;}
|
|
170
295
|
.cx-pin-tree .cx-hcell:first-child{z-index:2;background:var(--hfx-table-header-background,var(--hfx-color-surface-sunken,light-dark(#f7f8f9,#111317)));}
|
|
171
296
|
.cx-pin-tree .cx-row > .cx-tree{background:inherit;}
|
|
@@ -174,8 +299,9 @@ font-weight:var(--hfx-table-header-weight,var(--hfx-weight-semibold,600));font-s
|
|
|
174
299
|
.cx-canvas[data-cx-scaled]{overflow:clip;}
|
|
175
300
|
.cx-row{
|
|
176
301
|
position:absolute;left:0;top:0;display:flex;height:var(--cx-row-h);min-width:100%;
|
|
177
|
-
background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));border-bottom:var(--
|
|
302
|
+
background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));border-bottom:var(--hfx-border-width,1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));cursor:default;contain:strict;
|
|
178
303
|
}
|
|
304
|
+
:where(.cx-host[data-cx-chrome="embedded"]) .cx-row{background:transparent;}
|
|
179
305
|
.cx-row.cx-alt{background:var(--hfx-color-row-alt,light-dark(#fafafa,#1d1f23));}
|
|
180
306
|
.cx-row:hover{background:var(--hfx-color-hover,light-dark(#f5f5f5,#232529));}
|
|
181
307
|
.cx-row[aria-selected="true"]{background:var(--hfx-color-accent-subtle,light-dark(#e7f1f1,#1b3435));}
|
|
@@ -184,47 +310,47 @@ background:var(--hfx-color-surface,light-dark(#ffffff,#16181c));border-bottom:va
|
|
|
184
310
|
.cx-cell:focus,.cx-detail-body:focus{outline:none;}
|
|
185
311
|
.cx-cell:focus-visible,.cx-detail-body:focus-visible{outline:var(--hfx-focus-width,2px) solid var(--hfx-color-focus-ring,light-dark(#02726a,#37c9b8));outline-offset:calc(-1 * var(--hfx-focus-width,2px));}
|
|
186
312
|
.cx-cell{
|
|
187
|
-
flex:none;display:flex;align-items:center;gap:var(--
|
|
313
|
+
flex:none;display:flex;align-items:center;gap:var(--hfx-space-1-5,6px);padding:0 var(--hfx-space-2,0.5rem);min-width:0;overflow:hidden;
|
|
188
314
|
white-space:nowrap;text-overflow:ellipsis;
|
|
189
315
|
}
|
|
190
316
|
.cx-cell.cx-kind-number{justify-content:flex-end;font-variant-numeric:tabular-nums;}
|
|
191
|
-
.cx-cell.cx-tree{gap:var(--
|
|
192
|
-
.cx-content{display:inline-flex;align-items:center;gap:var(--
|
|
317
|
+
.cx-cell.cx-tree{gap:var(--hfx-space-0-5,2px);}
|
|
318
|
+
.cx-content{display:inline-flex;align-items:center;gap:var(--hfx-space-1-5,6px);min-width:0;max-width:100%;}
|
|
193
319
|
.cx-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
|
|
194
320
|
.cx-indent{flex:none;display:inline-block;}
|
|
195
|
-
.cx-ico{width:var(--
|
|
196
|
-
.cx-icon{flex:none;display:inline-flex;width:var(--
|
|
197
|
-
.cx-icon svg{width:var(--
|
|
321
|
+
.cx-ico{width:var(--hfx-icon-md,16px);height:var(--hfx-icon-md,16px);flex:none;stroke:currentColor;fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;}
|
|
322
|
+
.cx-icon{flex:none;display:inline-flex;width:var(--hfx-icon-md,16px);height:var(--hfx-icon-md,16px);margin-right:var(--hfx-space-1,0.25rem);color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
323
|
+
.cx-icon svg{width:var(--hfx-icon-md,16px);height:var(--hfx-icon-md,16px);}
|
|
198
324
|
.cx-exp{
|
|
199
|
-
flex:none;width:var(--
|
|
325
|
+
flex:none;width:calc(var(--hfx-space-1,0.25rem)*4.5);height:calc(var(--hfx-space-1,0.25rem)*4.5);display:inline-flex;align-items:center;justify-content:center;
|
|
200
326
|
cursor:pointer;color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));border-radius:var(--hfx-radius-control,var(--hfx-radius-md,6px));position:relative;
|
|
201
327
|
}
|
|
202
|
-
.cx-exp:not(.cx-leaf)::after{content:"";position:absolute;inset:var(--
|
|
203
|
-
.cx-exp::before{content:"";width:var(--
|
|
328
|
+
.cx-exp:not(.cx-leaf)::after{content:"";position:absolute;inset:calc(var(--hfx-space-1,0.25rem)*-.75);}
|
|
329
|
+
.cx-exp::before{content:"";width:calc(var(--hfx-space-1,0.25rem)*1.75);height:calc(var(--hfx-space-1,0.25rem)*1.75);border-right:calc(var(--hfx-border-width,1px)*1.6) solid currentColor;border-bottom:calc(var(--hfx-border-width,1px)*1.6) solid currentColor;transform:rotate(-45deg);transition:transform .12s ease;}
|
|
204
330
|
.cx-row[aria-expanded="true"] > .cx-tree .cx-exp::before{transform:rotate(45deg);}
|
|
205
331
|
.cx-exp.cx-leaf{cursor:default;}
|
|
206
332
|
.cx-exp:not(.cx-leaf):hover{background:var(--hfx-color-accent-subtle,light-dark(#e7f1f1,#1b3435));color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));}
|
|
207
333
|
.cx-exp.cx-leaf::before{display:none;}
|
|
208
|
-
.cx-row[aria-busy="true"] .cx-exp::before{width:var(--
|
|
334
|
+
.cx-row[aria-busy="true"] .cx-exp::before{width:calc(var(--hfx-space-1,0.25rem)*2.5);height:calc(var(--hfx-space-1,0.25rem)*2.5);transform:none;border:calc(var(--hfx-border-width,1px)*1.6) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));border-top-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));border-radius:50%;animation:cx-spin .8s linear infinite;}
|
|
209
335
|
@keyframes cx-spin{to{transform:rotate(360deg);}}
|
|
210
336
|
@media (prefers-reduced-motion:reduce){
|
|
211
337
|
.cx-host,.cx-host *,.cx-host ::before,.cx-host ::after{transition:none!important;animation:none!important;scroll-behavior:auto!important;}
|
|
212
338
|
}
|
|
213
|
-
.cx-group .cx-text{font-weight:600;}
|
|
339
|
+
.cx-group .cx-text{font-weight:var(--hfx-weight-semibold,600);}
|
|
214
340
|
.cx-row.cx-status .cx-cell{color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));font-style:italic;}
|
|
215
341
|
.cx-row.cx-more .cx-cell{color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));font-style:normal;}
|
|
216
|
-
.cx-more-btn{cursor:pointer;text-decoration:underline;text-underline-offset:var(--
|
|
342
|
+
.cx-more-btn{cursor:pointer;text-decoration:underline;text-underline-offset:var(--hfx-space-0-5,2px);}
|
|
217
343
|
.cx-row.cx-error .cx-cell{color:var(--hfx-color-status-bad-fg,light-dark(#b8292a,#f47171));}
|
|
218
|
-
.cx-mount-error{padding:var(--
|
|
344
|
+
.cx-mount-error{padding:var(--hfx-space-2,0.5rem);color:var(--hfx-color-status-bad-fg,light-dark(#b8292a,#f47171));}
|
|
219
345
|
.cx-tone-info{color:var(--hfx-color-status-info-fg,light-dark(#2b5fc0,#74a2f7));}
|
|
220
346
|
.cx-tone-success{color:var(--hfx-color-status-good-fg,light-dark(#177345,#4cc78a));}
|
|
221
347
|
.cx-tone-warning{color:var(--hfx-color-status-warn-fg,light-dark(#8c5c05,#eeb640));}
|
|
222
348
|
.cx-tone-danger{color:var(--hfx-color-status-bad-fg,light-dark(#b8292a,#f47171));}
|
|
223
349
|
.cx-tone-muted{color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
224
350
|
.cx-badge{
|
|
225
|
-
flex:none;display:inline-block;padding:0 var(--
|
|
226
|
-
font-style:normal;font-weight:400;font-variant-numeric:tabular-nums;
|
|
227
|
-
color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));background:var(--hfx-color-row-alt,light-dark(#fafafa,#1d1f23));border:var(--
|
|
351
|
+
flex:none;display:inline-block;padding:0 var(--hfx-space-1-5,6px);border-radius:var(--hfx-radius-badge,var(--hfx-radius-sm,4px));font-size:.8em;line-height:calc(var(--hfx-space-1,0.25rem)*4.5);
|
|
352
|
+
font-style:normal;font-weight:var(--hfx-weight-regular,400);font-variant-numeric:tabular-nums;
|
|
353
|
+
color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));background:var(--hfx-color-row-alt,light-dark(#fafafa,#1d1f23));border:var(--hfx-border-width,1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));
|
|
228
354
|
}
|
|
229
355
|
.cx-badge.cx-tone-info{color:var(--hfx-color-status-info-fg,light-dark(#2b5fc0,#74a2f7));background:var(--hfx-color-status-info-bg,light-dark(#e4ecfa,#262f41));border-color:transparent;}
|
|
230
356
|
.cx-badge.cx-tone-success{color:var(--hfx-color-status-good-fg,light-dark(#177345,#4cc78a));background:var(--hfx-color-status-good-bg,light-dark(#e2f0e9,#1f362f));border-color:transparent;}
|
|
@@ -236,23 +362,23 @@ color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));background:var(--hfx-col
|
|
|
236
362
|
.cx-row[aria-selected="true"] :is(.cx-tone-muted,.cx-badge.cx-tone-muted){color:var(--hfx-color-text,light-dark(#16181c,#f2f3f5));}
|
|
237
363
|
.cx-row.cx-detail{background:var(--hfx-color-row-alt,light-dark(#fafafa,#1d1f23));cursor:auto;contain:layout style;}
|
|
238
364
|
.cx-row.cx-detail > .cx-cell{align-items:stretch;padding:0;white-space:normal;overflow:visible;}
|
|
239
|
-
.cx-detail-body{overflow:auto;padding:var(--
|
|
365
|
+
.cx-detail-body{overflow:auto;padding:var(--hfx-space-2,0.5rem) var(--hfx-space-3,0.75rem);}
|
|
240
366
|
.cx-row .cx-detail-body{
|
|
241
|
-
flex:none;position:sticky;left:var(--cx-detail-left,var(--
|
|
242
|
-
width:max(
|
|
367
|
+
flex:none;position:sticky;left:var(--cx-detail-left,var(--hfx-space-2,0.5rem));height:100%;
|
|
368
|
+
width:max(12em,calc(var(--cx-view-w,100%) - var(--cx-detail-left,var(--hfx-space-2,0.5rem)) - var(--hfx-space-2,0.5rem)));
|
|
243
369
|
}
|
|
244
370
|
.cx-row.cx-detail-auto{min-height:var(--cx-row-h);}
|
|
245
371
|
.cx-detail-auto .cx-detail-body{height:auto;}
|
|
246
|
-
.cx-detail-table{width:100%;border-collapse:collapse;font-size
|
|
247
|
-
.cx-detail-table caption{text-align:left;color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));padding-bottom:var(--
|
|
248
|
-
.cx-detail-table th{text-align:left;font-weight:600;border-bottom:var(--
|
|
249
|
-
.cx-detail-table td{padding:var(--
|
|
250
|
-
.cx-props{display:grid;grid-template-columns:max-content 1fr;gap:var(--
|
|
372
|
+
.cx-detail-table{width:100%;border-collapse:collapse;font-size:.92em;table-layout:fixed;}
|
|
373
|
+
.cx-detail-table caption{text-align:left;color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));padding-bottom:var(--hfx-space-1-5,6px);}
|
|
374
|
+
.cx-detail-table th{text-align:left;font-weight:var(--hfx-weight-semibold,600);border-bottom:var(--hfx-border-width,1px) solid var(--hfx-color-border-strong,light-dark(#cdd0d5,#363a42));padding:calc(var(--hfx-space-1,0.25rem)*1.25) var(--hfx-space-2,0.5rem);overflow-wrap:anywhere;}
|
|
375
|
+
.cx-detail-table td{padding:calc(var(--hfx-space-1,0.25rem)*1.25) var(--hfx-space-2,0.5rem);border-bottom:var(--hfx-border-width,1px) solid var(--hfx-color-border,light-dark(#e2e4e7,#272a30));vertical-align:top;overflow-wrap:anywhere;}
|
|
376
|
+
.cx-props{display:grid;grid-template-columns:max-content 1fr;gap:var(--hfx-space-0-5,2px) var(--hfx-space-4,1rem);margin:0;font-size:.92em;}
|
|
251
377
|
.cx-props dt{color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
252
378
|
.cx-props dd{margin:0;overflow-wrap:anywhere;}
|
|
253
379
|
.cx-outline{display:none;}
|
|
254
|
-
.cx-outline-table{border-collapse:collapse;font-size:var(--
|
|
255
|
-
.cx-outline-table td,.cx-outline-table th{border:var(--
|
|
380
|
+
.cx-outline-table{border-collapse:collapse;font-size:calc(var(--hfx-type-caption-size,0.75rem)*.9167);}
|
|
381
|
+
.cx-outline-table td,.cx-outline-table th{border:var(--hfx-border-width,1px) solid var(--hfx-color-border-control,light-dark(#8a8f98,#6e737c));padding:var(--hfx-border-width,1px) var(--hfx-space-1,0.25rem);text-align:left;}
|
|
256
382
|
@media print{
|
|
257
383
|
.cx-host,.cx-host[data-cx-theme],.cx-static,.cx-static[data-cx-theme]{
|
|
258
384
|
color-scheme:light !important;height:auto !important;color:#16181c !important;background:#ffffff !important;
|
|
@@ -263,16 +389,16 @@ color-scheme:light !important;height:auto !important;color:#16181c !important;ba
|
|
|
263
389
|
.cx-outline{display:block;}
|
|
264
390
|
}
|
|
265
391
|
body.cx-page{margin:0;font-family:var(--hfx-font-sans,"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif);}
|
|
266
|
-
body.cx-page > .cx-host,body.cx-page > .cx-main > .cx-host{height:
|
|
392
|
+
body.cx-page > .cx-host,body.cx-page > .cx-main > .cx-host{height:100vh;padding:var(--hfx-space-3,0.75rem) var(--hfx-space-4,1rem);}
|
|
267
393
|
.cx-resize:focus{outline:var(--hfx-focus-width,2px) solid var(--hfx-color-focus-ring,light-dark(#02726a,#37c9b8));outline-offset:calc(-1 * var(--hfx-focus-width,2px));}
|
|
268
394
|
@media (forced-colors:active){
|
|
269
|
-
:is(.cx-row,.cx-result)[aria-selected="true"]{forced-color-adjust:none;background:Highlight;color:HighlightText;border:var(--
|
|
395
|
+
:is(.cx-row,.cx-result)[aria-selected="true"]{forced-color-adjust:none;background:Highlight;color:HighlightText;border:var(--hfx-border-width,1px) solid Highlight;}
|
|
270
396
|
:is(.cx-row,.cx-result)[aria-selected="true"] :not(input,select){forced-color-adjust:none;color:HighlightText!important;background-color:transparent!important;border-color:HighlightText!important;outline-color:HighlightText!important;}
|
|
271
397
|
:is(.cx-row,.cx-result)[aria-selected="true"] .cx-cell{background-color:Highlight!important;}
|
|
272
398
|
:is(.cx-row,.cx-result)[aria-selected="true"]:focus-visible{outline-color:HighlightText;}
|
|
273
|
-
:where(.cx-host) :is([role^="menuitem"],[role="option"],.cx-result,summary,button):focus-visible{outline:var(--
|
|
399
|
+
:where(.cx-host) :is([role^="menuitem"],[role="option"],.cx-result,summary,button):focus-visible{outline:calc(var(--hfx-border-width,1px)*2) solid;outline-offset:var(--hfx-focus-offset,2px);}
|
|
274
400
|
:where(.cx-host) [aria-pressed="true"]{forced-color-adjust:none;background:Highlight;color:HighlightText;}
|
|
275
|
-
.cx-badge{outline:var(--
|
|
401
|
+
.cx-badge{outline:var(--hfx-border-width,1px) solid;outline-offset:calc(-1 * var(--hfx-border-width,1px));}
|
|
276
402
|
}
|
|
277
403
|
.cx-check{flex:none;margin:0 0 0 var(--cx-size-6px);width:var(--cx-size-16px);height:var(--cx-size-16px);accent-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));}
|
|
278
404
|
.cx-check:focus-visible{outline:var(--hfx-focus-width,2px) solid var(--hfx-color-focus-ring,light-dark(#02726a,#37c9b8));outline-offset:var(--hfx-focus-offset,2px);}
|
|
@@ -286,9 +412,6 @@ body.cx-page > .cx-host,body.cx-page > .cx-main > .cx-host{height:var(--cx-size-
|
|
|
286
412
|
.cx-interaction-title{font-weight:600;margin-bottom:var(--cx-size-10px);}
|
|
287
413
|
.cx-interaction-buttons{display:flex;justify-content:flex-end;gap:var(--cx-size-8px);}
|
|
288
414
|
.cx-interaction-panel .cx-save{background:var(--hfx-color-accent-subtle,light-dark(#e7f1f1,#1b3435));border-color:var(--hfx-color-accent,light-dark(#11776f,#37c9b8));font-weight:600;}
|
|
289
|
-
.cx-interaction-panel[role="menu"]{padding:var(--cx-size-5px);}
|
|
290
|
-
.cx-action-item{display:block;width:100%;min-height:var(--cx-size-36px);text-align:start;border:0 !important;}
|
|
291
|
-
.cx-action-item[aria-disabled="true"]{color:var(--hfx-color-text-muted,light-dark(#626770,#8f949d));}
|
|
292
415
|
.cx-interaction-panel button:not(:disabled):not([aria-disabled="true"]):hover{background:var(--hfx-color-hover,light-dark(#f5f5f5,#232529));}
|
|
293
416
|
.cx-interaction-panel :focus-visible{outline:var(--hfx-focus-width,2px) solid var(--hfx-color-focus-ring,light-dark(#02726a,#37c9b8));outline-offset:var(--hfx-focus-offset,2px);}
|
|
294
417
|
.cx-drop-target{outline:var(--hfx-focus-width,2px) solid var(--hfx-color-focus-ring,light-dark(#02726a,#37c9b8));outline-offset:var(--hfx-focus-offset,2px);}
|