@neo4j-ndl/base 3.2.10 → 3.2.12
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/lib/cjs/tokens/js/storybook-design-token.js +1 -1
- package/lib/cjs/tokens/js/tokens-esm.js +1 -1
- package/lib/cjs/tokens/js/tokens.js +1 -1
- package/lib/esm/tokens/js/storybook-design-token.js +1 -1
- package/lib/esm/tokens/js/tokens-esm.js +1 -1
- package/lib/esm/tokens/js/tokens.js +1 -1
- package/lib/neo4j-ds-styles.css +114 -169
- package/lib/tokens/css/tokens.css +1 -1
- package/lib/tokens/js/tokens-raw.js +1 -1
- package/lib/tokens/js/tokens.js +1 -1
- package/lib/tokens/scss/tokens.scss +1 -1
- package/lib/types/tokens/js/storybook-design-token.d.ts +1 -1
- package/package.json +1 -1
package/lib/neo4j-ds-styles.css
CHANGED
|
@@ -1228,13 +1228,11 @@ h6,
|
|
|
1228
1228
|
font-weight:700;
|
|
1229
1229
|
outline:2px solid transparent;
|
|
1230
1230
|
outline-offset:2px;
|
|
1231
|
-
--tw-ring-color:rgb(var(--theme-palette-primary-focus));
|
|
1232
1231
|
}
|
|
1233
1232
|
.ndl-btn:focus-visible {
|
|
1234
|
-
|
|
1235
|
-
|
|
1236
|
-
|
|
1237
|
-
--tw-ring-offset-width:2px;
|
|
1233
|
+
outline-width:2px;
|
|
1234
|
+
outline-offset:2px;
|
|
1235
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
1238
1236
|
}
|
|
1239
1237
|
.ndl-btn.ndl-loading {
|
|
1240
1238
|
cursor:default;
|
|
@@ -1323,33 +1321,16 @@ a.ndl-btn {
|
|
|
1323
1321
|
gap:2px;
|
|
1324
1322
|
border-radius:8px;
|
|
1325
1323
|
color:rgb(var(--theme-palette-neutral-text-weak));
|
|
1324
|
+
outline:2px solid transparent;
|
|
1325
|
+
outline-offset:2px;
|
|
1326
|
+
}
|
|
1327
|
+
.ndl-icon-btn:focus-visible {
|
|
1328
|
+
outline-width:2px;
|
|
1329
|
+
outline-offset:2px;
|
|
1330
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
1326
1331
|
}
|
|
1327
1332
|
.ndl-icon-btn:not(.ndl-clean) {
|
|
1328
1333
|
background-color:rgb(var(--theme-palette-neutral-bg-weak));
|
|
1329
|
-
--tw-ring-color:rgb(var(--theme-palette-primary-focus));
|
|
1330
|
-
}
|
|
1331
|
-
.ndl-icon-btn:not(.ndl-clean):focus {
|
|
1332
|
-
outline-width:0px;
|
|
1333
|
-
}
|
|
1334
|
-
.ndl-icon-btn:not(.ndl-clean):focus-visible {
|
|
1335
|
-
outline-width:0px;
|
|
1336
|
-
--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
|
1337
|
-
--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
1338
|
-
box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
1339
|
-
--tw-ring-offset-width:2px;
|
|
1340
|
-
}
|
|
1341
|
-
.ndl-icon-btn.ndl-clean {
|
|
1342
|
-
--tw-ring-color:rgb(var(--theme-palette-primary-focus));
|
|
1343
|
-
}
|
|
1344
|
-
.ndl-icon-btn.ndl-clean:focus {
|
|
1345
|
-
outline-width:0px;
|
|
1346
|
-
}
|
|
1347
|
-
.ndl-icon-btn.ndl-clean:focus-visible {
|
|
1348
|
-
outline-width:0px;
|
|
1349
|
-
--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
|
1350
|
-
--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
1351
|
-
box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
1352
|
-
--tw-ring-offset-width:0px;
|
|
1353
1334
|
}
|
|
1354
1335
|
.ndl-icon-btn.ndl-danger {
|
|
1355
1336
|
color:rgb(var(--theme-palette-danger-icon));
|
|
@@ -1647,13 +1628,12 @@ a.ndl-btn {
|
|
|
1647
1628
|
.ndl-tabs .ndl-tab.ndl-filled-tab.ndl-disabled {
|
|
1648
1629
|
color:rgb(var(--theme-palette-neutral-text-weakest));
|
|
1649
1630
|
}
|
|
1650
|
-
.ndl-tabs .ndl-tab.ndl-filled-tab:focus-visible{
|
|
1651
|
-
|
|
1652
|
-
|
|
1653
|
-
|
|
1654
|
-
|
|
1655
|
-
|
|
1656
|
-
}
|
|
1631
|
+
.ndl-tabs .ndl-tab.ndl-filled-tab:focus-visible {
|
|
1632
|
+
outline-style:solid;
|
|
1633
|
+
outline-width:2px;
|
|
1634
|
+
outline-offset:-2px;
|
|
1635
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
1636
|
+
}
|
|
1657
1637
|
.ndl-tabs .ndl-tab.ndl-filled-tab:hover:not(.ndl-disabled):not(.ndl-selected){
|
|
1658
1638
|
background-color:rgb(var(--theme-palette-neutral-hover));
|
|
1659
1639
|
}
|
|
@@ -2043,47 +2023,40 @@ a.ndl-btn {
|
|
|
2043
2023
|
box-sizing:content-box;
|
|
2044
2024
|
transition:background-color var(--transitions-stripped-quick);
|
|
2045
2025
|
}
|
|
2046
|
-
.ndl-form-item input[type='checkbox'][role='switch']:
|
|
2047
|
-
|
|
2048
|
-
|
|
2049
|
-
|
|
2050
|
-
--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
2051
|
-
box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
2052
|
-
--tw-ring-color:rgb(var(--theme-palette-primary-pressed-weak));
|
|
2053
|
-
--tw-ring-offset-width:1px;
|
|
2026
|
+
.ndl-form-item input[type='checkbox'][role='switch']:disabled {
|
|
2027
|
+
cursor:not-allowed;
|
|
2028
|
+
background-color:rgb(var(--theme-palette-neutral-bg-strong));
|
|
2029
|
+
outline-width:0px;
|
|
2054
2030
|
}
|
|
2055
|
-
.ndl-form-item input[type='checkbox'][role='switch']:
|
|
2056
|
-
outline:
|
|
2057
|
-
outline-
|
|
2058
|
-
|
|
2059
|
-
|
|
2060
|
-
box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
2061
|
-
--tw-ring-color:rgb(var(--theme-palette-neutral-pressed));
|
|
2062
|
-
--tw-ring-offset-width:1px;
|
|
2031
|
+
.ndl-form-item input[type='checkbox'][role='switch']:not(:disabled):active:checked {
|
|
2032
|
+
outline-style:solid;
|
|
2033
|
+
outline-width:3px;
|
|
2034
|
+
outline-offset:0px;
|
|
2035
|
+
outline-color:rgb(var(--theme-palette-primary-pressed-weak));
|
|
2063
2036
|
}
|
|
2064
|
-
.ndl-form-item input[type='checkbox'][role='switch']:
|
|
2065
|
-
outline:
|
|
2066
|
-
outline-
|
|
2067
|
-
|
|
2068
|
-
|
|
2069
|
-
box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
2070
|
-
--tw-ring-color:rgb(var(--theme-palette-primary-hover-weak));
|
|
2071
|
-
--tw-ring-offset-width:1px;
|
|
2037
|
+
.ndl-form-item input[type='checkbox'][role='switch']:not(:disabled):active:not(:checked) {
|
|
2038
|
+
outline-style:solid;
|
|
2039
|
+
outline-width:3px;
|
|
2040
|
+
outline-offset:0px;
|
|
2041
|
+
outline-color:rgb(var(--theme-palette-neutral-pressed));
|
|
2072
2042
|
}
|
|
2073
|
-
.ndl-form-item input[type='checkbox'][role='switch']:
|
|
2074
|
-
outline:
|
|
2075
|
-
outline-
|
|
2076
|
-
|
|
2077
|
-
|
|
2078
|
-
|
|
2079
|
-
|
|
2080
|
-
|
|
2043
|
+
.ndl-form-item input[type='checkbox'][role='switch']:not(:disabled):hover:checked:not(:active) {
|
|
2044
|
+
outline-style:solid;
|
|
2045
|
+
outline-width:3px;
|
|
2046
|
+
outline-offset:0px;
|
|
2047
|
+
outline-color:rgb(var(--theme-palette-primary-hover-weak));
|
|
2048
|
+
}
|
|
2049
|
+
.ndl-form-item input[type='checkbox'][role='switch']:not(:disabled):hover:not(:checked):not(:active) {
|
|
2050
|
+
outline-style:solid;
|
|
2051
|
+
outline-width:3px;
|
|
2052
|
+
outline-offset:0px;
|
|
2053
|
+
outline-color:rgb(var(--theme-palette-neutral-hover));
|
|
2081
2054
|
}
|
|
2082
|
-
.ndl-form-item input[type='checkbox'][role='switch']:focus-visible:enabled
|
|
2055
|
+
.ndl-form-item input[type='checkbox'][role='switch']:not(:disabled):focus-visible:enabled {
|
|
2083
2056
|
outline-style:solid;
|
|
2084
2057
|
outline-width:2px;
|
|
2085
2058
|
outline-offset:1px;
|
|
2086
|
-
outline-color:rgb(var(--theme-palette-primary-
|
|
2059
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
2087
2060
|
}
|
|
2088
2061
|
.ndl-form-item input[type='checkbox'][role='switch']::before{
|
|
2089
2062
|
inline-size:var(--thumb-size);
|
|
@@ -2128,25 +2101,11 @@ a.ndl-btn {
|
|
|
2128
2101
|
.ndl-form-item input[type='checkbox'][role='switch']:checked::before{
|
|
2129
2102
|
transform:translateX(calc(var(--track-size) - var(--thumb-size)));
|
|
2130
2103
|
}
|
|
2131
|
-
.ndl-form-item input[type='checkbox'][role='switch']:indeterminate {
|
|
2132
|
-
background-color:rgb(var(--theme-palette-neutral-bg-strong));
|
|
2133
|
-
}
|
|
2134
2104
|
.ndl-form-item input[type='checkbox'][role='switch']:indeterminate::before{
|
|
2135
2105
|
transform:translateX(
|
|
2136
2106
|
calc(var(--track-size) - var(--thumb-size) * 1.5)
|
|
2137
2107
|
);
|
|
2138
2108
|
}
|
|
2139
|
-
.ndl-form-item input[type='checkbox'][role='switch']:disabled {
|
|
2140
|
-
cursor:not-allowed;
|
|
2141
|
-
background-color:rgb(var(--theme-palette-neutral-bg-strong));
|
|
2142
|
-
outline:2px solid transparent;
|
|
2143
|
-
outline-offset:2px;
|
|
2144
|
-
}
|
|
2145
|
-
.ndl-form-item input[type='checkbox'][role='switch']:active:disabled {
|
|
2146
|
-
--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
|
2147
|
-
--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
2148
|
-
box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
2149
|
-
}
|
|
2150
2109
|
.ndl-form-item input[type='radio'] {
|
|
2151
2110
|
border-radius:9999px;
|
|
2152
2111
|
}
|
|
@@ -2749,7 +2708,6 @@ a.ndl-btn {
|
|
|
2749
2708
|
border-width:1px;
|
|
2750
2709
|
border-color:rgb(var(--theme-palette-neutral-border-strong));
|
|
2751
2710
|
background-color:rgb(var(--theme-palette-neutral-bg-weak));
|
|
2752
|
-
padding:24px;
|
|
2753
2711
|
--tw-shadow:var(--theme-shadow-overlay);
|
|
2754
2712
|
--tw-shadow-colored:var(--theme-shadow-overlay);
|
|
2755
2713
|
box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
@@ -2759,6 +2717,7 @@ a.ndl-btn {
|
|
|
2759
2717
|
}
|
|
2760
2718
|
.ndl-datepicker .react-datepicker {
|
|
2761
2719
|
width:100%;
|
|
2720
|
+
padding:24px;
|
|
2762
2721
|
}
|
|
2763
2722
|
.ndl-datepicker .ndl-datepicker-header {
|
|
2764
2723
|
display:flex;
|
|
@@ -2772,6 +2731,16 @@ a.ndl-btn {
|
|
|
2772
2731
|
display:flex;
|
|
2773
2732
|
gap:16px;
|
|
2774
2733
|
}
|
|
2734
|
+
.ndl-datepicker .ndl-datepicker-header .ndl-datepicker-selects button {
|
|
2735
|
+
border-radius:4px;
|
|
2736
|
+
outline:2px solid transparent;
|
|
2737
|
+
outline-offset:2px;
|
|
2738
|
+
}
|
|
2739
|
+
.ndl-datepicker .ndl-datepicker-header .ndl-datepicker-selects button:focus-visible {
|
|
2740
|
+
outline-width:2px;
|
|
2741
|
+
outline-offset:2px;
|
|
2742
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
2743
|
+
}
|
|
2775
2744
|
.ndl-datepicker .ndl-datepicker-header .ndl-datepicker-chevron {
|
|
2776
2745
|
width:16px;
|
|
2777
2746
|
height:16px;
|
|
@@ -3482,16 +3451,14 @@ a.ndl-btn {
|
|
|
3482
3451
|
flex-grow:1;
|
|
3483
3452
|
}
|
|
3484
3453
|
.ndl-data-grid-root .ndl-data-grid-scrollable:focus {
|
|
3454
|
+
z-index:1;
|
|
3485
3455
|
outline:2px solid transparent;
|
|
3486
3456
|
outline-offset:2px;
|
|
3487
|
-
--tw-ring-color:rgb(var(--theme-palette-primary-focus));
|
|
3488
|
-
--tw-ring-offset-color:rgb(var(--theme-palette-neutral-bg-weak));
|
|
3489
3457
|
}
|
|
3490
3458
|
.ndl-data-grid-root .ndl-data-grid-scrollable:focus:focus-visible {
|
|
3491
|
-
|
|
3492
|
-
|
|
3493
|
-
|
|
3494
|
-
--tw-ring-offset-width:1px;
|
|
3459
|
+
outline-width:2px;
|
|
3460
|
+
outline-offset:1px;
|
|
3461
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
3495
3462
|
}
|
|
3496
3463
|
.ndl-data-grid-root .ndl-data-grid-scrollable:has(+ .ndl-data-grid-navigation)
|
|
3497
3464
|
.ndl-data-grid-tbody
|
|
@@ -3798,8 +3765,8 @@ a.ndl-btn {
|
|
|
3798
3765
|
align-items:center;
|
|
3799
3766
|
justify-content:space-between;
|
|
3800
3767
|
gap:8px;
|
|
3801
|
-
-moz-column-gap:
|
|
3802
|
-
column-gap:
|
|
3768
|
+
-moz-column-gap:24px;
|
|
3769
|
+
column-gap:24px;
|
|
3803
3770
|
}
|
|
3804
3771
|
.ndl-data-grid-root .ndl-data-grid-navigation .ndl-data-grid-nav {
|
|
3805
3772
|
position:relative;
|
|
@@ -3807,8 +3774,8 @@ a.ndl-btn {
|
|
|
3807
3774
|
display:inline-flex;
|
|
3808
3775
|
max-width:-moz-min-content;
|
|
3809
3776
|
max-width:min-content;
|
|
3810
|
-
-moz-column-gap:
|
|
3811
|
-
column-gap:
|
|
3777
|
+
-moz-column-gap:2px;
|
|
3778
|
+
column-gap:2px;
|
|
3812
3779
|
border-radius:6px;
|
|
3813
3780
|
}
|
|
3814
3781
|
.ndl-data-grid-root .ndl-data-grid-navigation .ndl-data-grid-rows-per-page {
|
|
@@ -3819,6 +3786,11 @@ a.ndl-btn {
|
|
|
3819
3786
|
-moz-column-gap:16px;
|
|
3820
3787
|
column-gap:16px;
|
|
3821
3788
|
color:rgb(var(--theme-palette-neutral-text-weaker));
|
|
3789
|
+
font-family:var(--font-font-family-body-medium), sans-serif;
|
|
3790
|
+
font-size:var(--font-size-body-medium);
|
|
3791
|
+
font-weight:var(--font-weight-normal);
|
|
3792
|
+
letter-spacing:0.016rem;
|
|
3793
|
+
line-height:1.25rem;
|
|
3822
3794
|
}
|
|
3823
3795
|
.ndl-data-grid-root .ndl-data-grid-navigation .ndl-data-grid-results {
|
|
3824
3796
|
white-space:nowrap;
|
|
@@ -5110,13 +5082,11 @@ a.ndl-btn {
|
|
|
5110
5082
|
font-weight:700;
|
|
5111
5083
|
outline:2px solid transparent;
|
|
5112
5084
|
outline-offset:2px;
|
|
5113
|
-
--tw-ring-color:rgb(var(--theme-palette-primary-focus));
|
|
5114
5085
|
}
|
|
5115
5086
|
.ndl-cypher-editor .cm-editor .cm-button:focus-visible, .ndl-codemirror-editor .cm-editor .cm-button:focus-visible {
|
|
5116
|
-
|
|
5117
|
-
|
|
5118
|
-
|
|
5119
|
-
--tw-ring-offset-width:2px;
|
|
5087
|
+
outline-width:2px;
|
|
5088
|
+
outline-offset:2px;
|
|
5089
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
5120
5090
|
}
|
|
5121
5091
|
.ndl-cypher-editor .cm-editor .cm-button.ndl-loading, .ndl-codemirror-editor .cm-editor .cm-button.ndl-loading {
|
|
5122
5092
|
cursor:default;
|
|
@@ -5953,6 +5923,7 @@ a.ndl-cypher-editor .cm-editor .cm-button,a .ndl-codemirror-editor .cm-editor .c
|
|
|
5953
5923
|
.ndl-breadcrumbs ol {
|
|
5954
5924
|
display:flex;
|
|
5955
5925
|
flex-wrap:wrap;
|
|
5926
|
+
align-items:center;
|
|
5956
5927
|
}
|
|
5957
5928
|
.ndl-breadcrumbs li {
|
|
5958
5929
|
display:flex;
|
|
@@ -5962,19 +5933,16 @@ a.ndl-cypher-editor .cm-editor .cm-button,a .ndl-codemirror-editor .cm-editor .c
|
|
|
5962
5933
|
border-radius:6px;
|
|
5963
5934
|
}
|
|
5964
5935
|
.ndl-breadcrumbs .ndl-breadcrumbs-base-item-link {
|
|
5965
|
-
padding:0px;
|
|
5966
5936
|
border-radius:6px;
|
|
5937
|
+
padding:0px;
|
|
5967
5938
|
color:rgb(var(--theme-palette-neutral-text-weaker));
|
|
5968
|
-
|
|
5969
|
-
|
|
5970
|
-
.ndl-breadcrumbs .ndl-breadcrumbs-base-item-link:focus {
|
|
5971
|
-
outline-width:0px;
|
|
5939
|
+
outline:2px solid transparent;
|
|
5940
|
+
outline-offset:2px;
|
|
5972
5941
|
}
|
|
5973
5942
|
.ndl-breadcrumbs .ndl-breadcrumbs-base-item-link:focus-visible {
|
|
5974
|
-
|
|
5975
|
-
|
|
5976
|
-
|
|
5977
|
-
--tw-ring-offset-width:0px;
|
|
5943
|
+
outline-width:2px;
|
|
5944
|
+
outline-offset:1px;
|
|
5945
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
5978
5946
|
}
|
|
5979
5947
|
.ndl-breadcrumbs .ndl-breadcrumbs-base-item-link-active {
|
|
5980
5948
|
color:rgb(var(--theme-palette-neutral-text-default));
|
|
@@ -5990,20 +5958,15 @@ a.ndl-cypher-editor .cm-editor .cm-button,a .ndl-codemirror-editor .cm-editor .c
|
|
|
5990
5958
|
align-items:center;
|
|
5991
5959
|
}
|
|
5992
5960
|
.ndl-breadcrumbs .ndl-breadcrumbs-item-link {
|
|
5993
|
-
padding-top:1px;
|
|
5994
|
-
padding-bottom:1px;
|
|
5995
5961
|
border-radius:6px;
|
|
5996
5962
|
color:rgb(var(--theme-palette-neutral-text-weaker));
|
|
5997
|
-
|
|
5998
|
-
|
|
5999
|
-
.ndl-breadcrumbs .ndl-breadcrumbs-item-link:focus {
|
|
6000
|
-
outline-width:0px;
|
|
5963
|
+
outline:2px solid transparent;
|
|
5964
|
+
outline-offset:2px;
|
|
6001
5965
|
}
|
|
6002
5966
|
.ndl-breadcrumbs .ndl-breadcrumbs-item-link:focus-visible {
|
|
6003
|
-
|
|
6004
|
-
|
|
6005
|
-
|
|
6006
|
-
--tw-ring-offset-width:0px;
|
|
5967
|
+
outline-width:2px;
|
|
5968
|
+
outline-offset:1px;
|
|
5969
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
6007
5970
|
}
|
|
6008
5971
|
.ndl-breadcrumbs .ndl-breadcrumbs-item-link:hover {
|
|
6009
5972
|
color:rgb(var(--theme-palette-neutral-text-default));
|
|
@@ -6045,30 +6008,19 @@ a.ndl-cypher-editor .cm-editor .cm-button,a .ndl-codemirror-editor .cm-editor .c
|
|
|
6045
6008
|
display:flex;
|
|
6046
6009
|
align-self:center;
|
|
6047
6010
|
height:22px;
|
|
6048
|
-
--tw-ring-color:rgb(var(--theme-palette-primary-focus));
|
|
6049
6011
|
}
|
|
6050
6012
|
.ndl-breadcrumbs .ndl-breadcrumbs-ellipsis-menu-button:focus {
|
|
6051
|
-
outline
|
|
6013
|
+
outline:2px solid transparent;
|
|
6014
|
+
outline-offset:2px;
|
|
6052
6015
|
}
|
|
6053
6016
|
.ndl-breadcrumbs .ndl-breadcrumbs-ellipsis-menu-button:focus-visible {
|
|
6054
|
-
|
|
6055
|
-
|
|
6056
|
-
|
|
6057
|
-
--tw-ring-offset-width:0px;
|
|
6017
|
+
outline-width:2px;
|
|
6018
|
+
outline-offset:1px;
|
|
6019
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
6058
6020
|
}
|
|
6059
6021
|
.ndl-breadcrumbs .ndl-breadcrumbs-ellipsis-menu-button:hover {
|
|
6060
6022
|
text-decoration-line:underline;
|
|
6061
6023
|
}
|
|
6062
|
-
.ndl-breadcrumbs-item-link:focus {
|
|
6063
|
-
border-radius:6px;
|
|
6064
|
-
background-color:rgb(var(--theme-palette-neutral-bg-weak));
|
|
6065
|
-
outline-width:0px;
|
|
6066
|
-
--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
|
6067
|
-
--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
6068
|
-
box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
6069
|
-
--tw-ring-color:rgb(var(--theme-palette-primary-focus));
|
|
6070
|
-
--tw-ring-offset-width:3px;
|
|
6071
|
-
}
|
|
6072
6024
|
.ndl-breadcrumbs-ellipsis-menu-item {
|
|
6073
6025
|
padding-top:4px;
|
|
6074
6026
|
padding-bottom:4px;
|
|
@@ -6330,14 +6282,11 @@ button.ndl-avatar .ndl-avatar-letters:active:not(.ndl-avatar-disabled) {
|
|
|
6330
6282
|
button.ndl-avatar {
|
|
6331
6283
|
outline:2px solid transparent;
|
|
6332
6284
|
outline-offset:2px;
|
|
6333
|
-
--tw-ring-color:rgb(var(--theme-palette-primary-focus));
|
|
6334
|
-
--tw-ring-offset-color:rgb(var(--theme-palette-neutral-bg-weak));
|
|
6335
6285
|
}
|
|
6336
6286
|
button.ndl-avatar:focus-visible {
|
|
6337
|
-
|
|
6338
|
-
|
|
6339
|
-
|
|
6340
|
-
--tw-ring-offset-width:1px;
|
|
6287
|
+
outline-width:2px;
|
|
6288
|
+
outline-offset:1px;
|
|
6289
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
6341
6290
|
}
|
|
6342
6291
|
.ndl-slider{
|
|
6343
6292
|
display:flex;
|
|
@@ -6406,10 +6355,9 @@ button.ndl-avatar:focus-visible {
|
|
|
6406
6355
|
background-color:rgb(var(--theme-palette-primary-pressed-weak));
|
|
6407
6356
|
}
|
|
6408
6357
|
.ndl-slider .ndl-track .ndl-thumb.ndl-focus {
|
|
6409
|
-
|
|
6410
|
-
|
|
6411
|
-
|
|
6412
|
-
--tw-ring-color:rgb(var(--theme-palette-primary-focus));
|
|
6358
|
+
outline-style:solid;
|
|
6359
|
+
outline-width:2px;
|
|
6360
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
6413
6361
|
}
|
|
6414
6362
|
.ndl-slider .ndl-filled-track{
|
|
6415
6363
|
height:4px;
|
|
@@ -6512,7 +6460,6 @@ button.ndl-avatar:focus-visible {
|
|
|
6512
6460
|
border-color:rgb(var(--theme-palette-neutral-border-strong));
|
|
6513
6461
|
outline:2px solid transparent;
|
|
6514
6462
|
outline-offset:2px;
|
|
6515
|
-
--tw-ring-color:rgb(var(--theme-palette-primary-focus));
|
|
6516
6463
|
font-family:var(--font-font-family-body-medium), sans-serif;
|
|
6517
6464
|
font-size:var(--font-size-body-medium);
|
|
6518
6465
|
font-weight:var(--font-weight-normal);
|
|
@@ -6520,9 +6467,9 @@ button.ndl-avatar:focus-visible {
|
|
|
6520
6467
|
line-height:1.25rem;
|
|
6521
6468
|
}
|
|
6522
6469
|
.ndl-dropdown-btn:focus-visible {
|
|
6523
|
-
|
|
6524
|
-
|
|
6525
|
-
|
|
6470
|
+
outline-width:2px;
|
|
6471
|
+
outline-offset:-2px;
|
|
6472
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
6526
6473
|
}
|
|
6527
6474
|
.ndl-dropdown-btn.ndl-small {
|
|
6528
6475
|
height:24px;
|
|
@@ -6586,10 +6533,9 @@ button.ndl-avatar:focus-visible {
|
|
|
6586
6533
|
box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
6587
6534
|
}
|
|
6588
6535
|
.ndl-dropdown-btn.ndl-open {
|
|
6589
|
-
|
|
6590
|
-
|
|
6591
|
-
|
|
6592
|
-
--tw-ring-color:rgb(var(--theme-palette-primary-focus));
|
|
6536
|
+
outline-width:2px;
|
|
6537
|
+
outline-offset:-2px;
|
|
6538
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
6593
6539
|
}
|
|
6594
6540
|
.ndl-dropdown-btn-left-wrapper {
|
|
6595
6541
|
display:flex;
|
|
@@ -6618,20 +6564,21 @@ button.ndl-avatar:focus-visible {
|
|
|
6618
6564
|
background-color:rgb(var(--theme-palette-neutral-bg-on-bg-weak));
|
|
6619
6565
|
padding-left:2px;
|
|
6620
6566
|
padding-right:2px;
|
|
6621
|
-
outline:2px solid transparent;
|
|
6622
|
-
outline-offset:2px;
|
|
6623
|
-
--tw-ring-color:rgb(var(--theme-palette-primary-focus));
|
|
6624
|
-
}
|
|
6625
|
-
.ndl-inline-code:focus-visible {
|
|
6626
|
-
--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
|
6627
|
-
--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
6628
|
-
box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
6629
|
-
}
|
|
6630
|
-
.ndl-inline-code:not(:focus) {
|
|
6631
6567
|
outline-style:solid;
|
|
6632
6568
|
outline-width:1px;
|
|
6633
6569
|
outline-offset:-1px;
|
|
6634
6570
|
outline-color:rgb(var(--theme-palette-neutral-border-weak));
|
|
6571
|
+
font-family:var(--font-font-family-code), 'monospace';
|
|
6572
|
+
font-size:var(--font-size-code);
|
|
6573
|
+
font-weight:var(--font-weight-normal);
|
|
6574
|
+
letter-spacing:0;
|
|
6575
|
+
line-height:1.25rem;
|
|
6576
|
+
}
|
|
6577
|
+
.ndl-inline-code:focus-visible {
|
|
6578
|
+
outline-style:solid;
|
|
6579
|
+
outline-width:2px;
|
|
6580
|
+
outline-offset:-2px;
|
|
6581
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
6635
6582
|
}
|
|
6636
6583
|
.ndl-inline-code:hover:not(.ndl-disabled) {
|
|
6637
6584
|
background-color:rgb(var(--theme-palette-neutral-hover));
|
|
@@ -7522,16 +7469,14 @@ button.ndl-avatar:focus-visible {
|
|
|
7522
7469
|
.ndl-spotlight-target {
|
|
7523
7470
|
position:relative;
|
|
7524
7471
|
cursor:pointer;
|
|
7525
|
-
|
|
7472
|
+
outline:2px solid transparent;
|
|
7473
|
+
outline-offset:2px;
|
|
7526
7474
|
}
|
|
7527
7475
|
.ndl-spotlight-target:focus-visible {
|
|
7528
7476
|
border-style:none;
|
|
7529
|
-
outline:2px
|
|
7477
|
+
outline-width:2px;
|
|
7530
7478
|
outline-offset:2px;
|
|
7531
|
-
|
|
7532
|
-
--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
7533
|
-
box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
7534
|
-
--tw-ring-offset-width:2px;
|
|
7479
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
7535
7480
|
}
|
|
7536
7481
|
.ndl-spotlight-target .ndl-spotlight-target-inert:focus-visible {
|
|
7537
7482
|
border-style:none;
|
package/lib/tokens/js/tokens.js
CHANGED