@neo4j-ndl/base 3.0.0-alpha-4904fb7 → 3.0.0-alpha-73cdbc3
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 +85 -52
- 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
|
@@ -1232,8 +1232,8 @@ h6,
|
|
|
1232
1232
|
}
|
|
1233
1233
|
.ndl-btn.ndl-medium {
|
|
1234
1234
|
height:36px;
|
|
1235
|
-
padding-left:
|
|
1236
|
-
padding-right:
|
|
1235
|
+
padding-left:16px;
|
|
1236
|
+
padding-right:16px;
|
|
1237
1237
|
padding-top:8px;
|
|
1238
1238
|
padding-bottom:8px;
|
|
1239
1239
|
font-family:var(--font-font-family-body-label), sans-serif;
|
|
@@ -2936,11 +2936,14 @@ a.ndl-btn {
|
|
|
2936
2936
|
.ndl-dialog {
|
|
2937
2937
|
border-radius:16px;
|
|
2938
2938
|
background-color:rgb(var(--theme-palette-neutral-bg-weak));
|
|
2939
|
-
padding:
|
|
2939
|
+
padding:32px;
|
|
2940
2940
|
--tw-shadow:var(--theme-shadow-overlay);
|
|
2941
2941
|
--tw-shadow-colored:var(--theme-shadow-overlay);
|
|
2942
2942
|
box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
2943
2943
|
}
|
|
2944
|
+
.ndl-dialog .ndl-dialog-type-icon{
|
|
2945
|
+
width:88px;
|
|
2946
|
+
}
|
|
2944
2947
|
.ndl-dialog .ndl-dialog-type-icon.ndl-info {
|
|
2945
2948
|
color:rgb(var(--theme-palette-primary-icon));
|
|
2946
2949
|
}
|
|
@@ -2953,13 +2956,18 @@ a.ndl-btn {
|
|
|
2953
2956
|
.ndl-dialog .ndl-dialog-type-icon.ndl-danger {
|
|
2954
2957
|
color:rgb(var(--theme-palette-danger-icon));
|
|
2955
2958
|
}
|
|
2959
|
+
.ndl-dialog.ndl-with-icon .ndl-dialog-close {
|
|
2960
|
+
top:48px;
|
|
2961
|
+
}
|
|
2962
|
+
.ndl-dialog.ndl-with-icon .ndl-dialog-header {
|
|
2963
|
+
margin-bottom:24px;
|
|
2964
|
+
}
|
|
2956
2965
|
.ndl-dialog .ndl-dialog-close {
|
|
2957
2966
|
position:absolute;
|
|
2958
|
-
top:48px;
|
|
2959
2967
|
right:48px;
|
|
2960
2968
|
}
|
|
2961
2969
|
.ndl-dialog-header {
|
|
2962
|
-
margin-bottom:
|
|
2970
|
+
margin-bottom:4px;
|
|
2963
2971
|
}
|
|
2964
2972
|
.ndl-dialog.ndl-with-close-button .ndl-dialog-header {
|
|
2965
2973
|
margin-right:48px;
|
|
@@ -3148,18 +3156,20 @@ a.ndl-btn {
|
|
|
3148
3156
|
padding:4px;
|
|
3149
3157
|
color:rgb(var(--theme-palette-neutral-text-weak));
|
|
3150
3158
|
}
|
|
3159
|
+
.ndl-segmented-control.ndl-floating {
|
|
3160
|
+
--tw-shadow:var(--theme-shadow-overlay);
|
|
3161
|
+
--tw-shadow-colored:var(--theme-shadow-overlay);
|
|
3162
|
+
box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
3163
|
+
}
|
|
3151
3164
|
.ndl-segmented-control > button {
|
|
3152
3165
|
cursor:pointer;
|
|
3153
3166
|
border-radius:4px;
|
|
3154
3167
|
}
|
|
3155
3168
|
.ndl-segmented-control > button:focus-visible {
|
|
3156
|
-
outline:
|
|
3157
|
-
outline-
|
|
3158
|
-
|
|
3159
|
-
|
|
3160
|
-
box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
3161
|
-
--tw-ring-inset:inset;
|
|
3162
|
-
--tw-ring-color:rgb(var(--theme-palette-primary-focus));
|
|
3169
|
+
outline-style:solid;
|
|
3170
|
+
outline-width:2px;
|
|
3171
|
+
outline-offset:-2px;
|
|
3172
|
+
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
3163
3173
|
}
|
|
3164
3174
|
.ndl-segmented-control > button:hover {
|
|
3165
3175
|
background-color:rgb(var(--theme-palette-neutral-hover));
|
|
@@ -3168,14 +3178,19 @@ a.ndl-btn {
|
|
|
3168
3178
|
background-color:rgb(var(--theme-palette-neutral-pressed));
|
|
3169
3179
|
}
|
|
3170
3180
|
.ndl-segmented-control .ndl-current {
|
|
3171
|
-
|
|
3172
|
-
|
|
3173
|
-
|
|
3174
|
-
|
|
3175
|
-
|
|
3181
|
+
border-width:1px;
|
|
3182
|
+
border-style:solid;
|
|
3183
|
+
border-color:rgb(var(--theme-palette-primary-border-weak));
|
|
3184
|
+
background-color:rgb(var(--theme-palette-primary-bg-weak));
|
|
3185
|
+
color:rgb(var(--theme-palette-primary-text));
|
|
3176
3186
|
}
|
|
3177
3187
|
.ndl-segmented-control .ndl-current:hover {
|
|
3178
|
-
|
|
3188
|
+
border-style:none;
|
|
3189
|
+
background-color:rgb(var(--theme-palette-neutral-hover));
|
|
3190
|
+
color:rgb(var(--theme-neutral-text-weak));
|
|
3191
|
+
}
|
|
3192
|
+
.ndl-segmented-control .ndl-current:active {
|
|
3193
|
+
background-color:rgb(var(--theme-palette-neutral-pressed));
|
|
3179
3194
|
}
|
|
3180
3195
|
.ndl-segmented-control.ndl-large {
|
|
3181
3196
|
height:48px;
|
|
@@ -3194,9 +3209,18 @@ a.ndl-btn {
|
|
|
3194
3209
|
.ndl-segmented-control.ndl-large .ndl-segment-icon {
|
|
3195
3210
|
padding:10px;
|
|
3196
3211
|
}
|
|
3212
|
+
.ndl-segmented-control.ndl-large .ndl-segment-icon.ndl-current:not(:hover) {
|
|
3213
|
+
padding:9px;
|
|
3214
|
+
}
|
|
3197
3215
|
.ndl-segmented-control.ndl-large > button {
|
|
3198
3216
|
height:40px;
|
|
3199
3217
|
}
|
|
3218
|
+
.ndl-segmented-control.ndl-large .ndl-current.ndl-segment-item:not(:hover) {
|
|
3219
|
+
padding-left:15px;
|
|
3220
|
+
padding-right:15px;
|
|
3221
|
+
padding-top:7px;
|
|
3222
|
+
padding-bottom:7px;
|
|
3223
|
+
}
|
|
3200
3224
|
.ndl-segmented-control.ndl-small {
|
|
3201
3225
|
height:36px;
|
|
3202
3226
|
font-family:var(--font-font-family-subheading-small), sans-serif;
|
|
@@ -3214,9 +3238,18 @@ a.ndl-btn {
|
|
|
3214
3238
|
.ndl-segmented-control.ndl-small .ndl-segment-icon {
|
|
3215
3239
|
padding:6px;
|
|
3216
3240
|
}
|
|
3241
|
+
.ndl-segmented-control.ndl-small .ndl-segment-icon.ndl-current:not(:hover) {
|
|
3242
|
+
padding:5px;
|
|
3243
|
+
}
|
|
3217
3244
|
.ndl-segmented-control.ndl-small > button {
|
|
3218
3245
|
height:28px;
|
|
3219
3246
|
}
|
|
3247
|
+
.ndl-segmented-control.ndl-small .ndl-current.ndl-segment-item:not(:hover) {
|
|
3248
|
+
padding-left:11px;
|
|
3249
|
+
padding-right:11px;
|
|
3250
|
+
padding-top:3px;
|
|
3251
|
+
padding-bottom:3px;
|
|
3252
|
+
}
|
|
3220
3253
|
@keyframes ndl-spinner{
|
|
3221
3254
|
0%{
|
|
3222
3255
|
transform:translate3d(0%, 0%, 0) rotate(0deg);
|
|
@@ -4765,8 +4798,8 @@ a.ndl-btn {
|
|
|
4765
4798
|
}
|
|
4766
4799
|
.ndl-cypher-editor .cm-editor .cm-button.ndl-medium, .ndl-codemirror-editor .cm-editor .cm-button.ndl-medium {
|
|
4767
4800
|
height:36px;
|
|
4768
|
-
padding-left:
|
|
4769
|
-
padding-right:
|
|
4801
|
+
padding-left:16px;
|
|
4802
|
+
padding-right:16px;
|
|
4770
4803
|
padding-top:8px;
|
|
4771
4804
|
padding-bottom:8px;
|
|
4772
4805
|
font-family:var(--font-font-family-body-label), sans-serif;
|
|
@@ -5008,17 +5041,17 @@ a.ndl-cypher-editor .cm-editor .cm-button,a .ndl-codemirror-editor .cm-editor .c
|
|
|
5008
5041
|
border-radius:4px;
|
|
5009
5042
|
outline-offset:0px;
|
|
5010
5043
|
}
|
|
5011
|
-
.ndl-
|
|
5044
|
+
.ndl-text-area .ndl-text-area-wrapper {
|
|
5012
5045
|
position:relative;
|
|
5013
5046
|
width:100%;
|
|
5014
5047
|
}
|
|
5015
|
-
.ndl-
|
|
5048
|
+
.ndl-text-area textarea::-moz-placeholder {
|
|
5016
5049
|
color:rgb(var(--theme-palette-neutral-text-weaker));
|
|
5017
5050
|
}
|
|
5018
|
-
.ndl-
|
|
5051
|
+
.ndl-text-area textarea::placeholder {
|
|
5019
5052
|
color:rgb(var(--theme-palette-neutral-text-weaker));
|
|
5020
5053
|
}
|
|
5021
|
-
.ndl-
|
|
5054
|
+
.ndl-text-area textarea {
|
|
5022
5055
|
width:100%;
|
|
5023
5056
|
border-radius:4px;
|
|
5024
5057
|
border-width:1px;
|
|
@@ -5034,23 +5067,23 @@ a.ndl-cypher-editor .cm-editor .cm-button,a .ndl-codemirror-editor .cm-editor .c
|
|
|
5034
5067
|
|
|
5035
5068
|
min-height:80px;
|
|
5036
5069
|
}
|
|
5037
|
-
.ndl-
|
|
5038
|
-
.ndl-
|
|
5070
|
+
.ndl-text-area textarea:active,
|
|
5071
|
+
.ndl-text-area textarea:focus {
|
|
5039
5072
|
outline-style:solid;
|
|
5040
5073
|
outline-width:2px;
|
|
5041
5074
|
outline-offset:-1px;
|
|
5042
5075
|
outline-color:rgb(var(--theme-palette-primary-focus));
|
|
5043
5076
|
}
|
|
5044
|
-
.ndl-
|
|
5077
|
+
.ndl-text-area textarea:disabled {
|
|
5045
5078
|
cursor:not-allowed;
|
|
5046
5079
|
color:rgb(var(--theme-palette-neutral-text-weakest));
|
|
5047
5080
|
background-color:inherit;
|
|
5048
5081
|
}
|
|
5049
|
-
.ndl-
|
|
5082
|
+
.ndl-text-area textarea:disabled:active {
|
|
5050
5083
|
outline:2px solid transparent;
|
|
5051
5084
|
outline-offset:2px;
|
|
5052
5085
|
}
|
|
5053
|
-
.ndl-
|
|
5086
|
+
.ndl-text-area .ndl-text-area-label {
|
|
5054
5087
|
display:inline-flex;
|
|
5055
5088
|
align-items:flex-start;
|
|
5056
5089
|
-moz-column-gap:12px;
|
|
@@ -5061,57 +5094,57 @@ a.ndl-cypher-editor .cm-editor .cm-button,a .ndl-codemirror-editor .cm-editor .c
|
|
|
5061
5094
|
letter-spacing:0.016rem;
|
|
5062
5095
|
line-height:1.25rem;
|
|
5063
5096
|
}
|
|
5064
|
-
.ndl-
|
|
5097
|
+
.ndl-text-area .ndl-text-area-label.ndl-fluid {
|
|
5065
5098
|
display:flex;
|
|
5066
5099
|
width:100%;
|
|
5067
5100
|
}
|
|
5068
|
-
.ndl-
|
|
5101
|
+
.ndl-text-area .ndl-text-area-label.ndl-label-before {
|
|
5069
5102
|
flex-direction:row-reverse;
|
|
5070
5103
|
}
|
|
5071
|
-
.ndl-
|
|
5104
|
+
.ndl-text-area .ndl-text-area-wrapper{
|
|
5072
5105
|
display:flex;
|
|
5073
5106
|
width:100%;
|
|
5074
5107
|
}
|
|
5075
|
-
.ndl-
|
|
5108
|
+
.ndl-text-area .ndl-text-area-wrapper .ndl-text-area-optional {
|
|
5076
5109
|
color:rgb(var(--theme-palette-neutral-text-weaker));
|
|
5077
5110
|
font-style:italic;
|
|
5078
5111
|
margin-left:auto;
|
|
5079
5112
|
}
|
|
5080
|
-
.ndl-
|
|
5113
|
+
.ndl-text-area .ndl-text-area-wrapper .ndl-information-icon-small {
|
|
5081
5114
|
margin-top:2px;
|
|
5082
5115
|
margin-left:3px;
|
|
5083
5116
|
width:16px;
|
|
5084
5117
|
height:16px;
|
|
5085
5118
|
color:rgb(var(--theme-palette-neutral-text-weak));
|
|
5086
5119
|
}
|
|
5087
|
-
.ndl-
|
|
5120
|
+
.ndl-text-area .ndl-text-area-wrapper .ndl-information-icon-large {
|
|
5088
5121
|
margin-top:2px;
|
|
5089
5122
|
margin-left:3px;
|
|
5090
5123
|
width:20px;
|
|
5091
5124
|
height:20px;
|
|
5092
5125
|
color:rgb(var(--theme-palette-neutral-text-weak));
|
|
5093
5126
|
}
|
|
5094
|
-
.ndl-
|
|
5127
|
+
.ndl-text-area.ndl-type-text .ndl-text-area-label {
|
|
5095
5128
|
flex-direction:column-reverse;
|
|
5096
5129
|
align-items:flex-start;
|
|
5097
5130
|
row-gap:5px;
|
|
5098
5131
|
}
|
|
5099
|
-
.ndl-
|
|
5132
|
+
.ndl-text-area.ndl-type-text .ndl-text-area-label .ndl-text-area-label-text {
|
|
5100
5133
|
color:rgb(var(--theme-palette-neutral-text-weak));
|
|
5101
5134
|
}
|
|
5102
|
-
.ndl-
|
|
5135
|
+
.ndl-text-area.ndl-type-text .ndl-text-area-no-label {
|
|
5103
5136
|
row-gap:0px;
|
|
5104
5137
|
}
|
|
5105
|
-
.ndl-
|
|
5138
|
+
.ndl-text-area.ndl-type-radio {
|
|
5106
5139
|
display:flex;
|
|
5107
5140
|
align-items:center;
|
|
5108
5141
|
color:rgb(var(--theme-palette-neutral-text-default));
|
|
5109
5142
|
}
|
|
5110
|
-
.ndl-
|
|
5143
|
+
.ndl-text-area.ndl-disabled .ndl-text-area-label {
|
|
5111
5144
|
cursor:not-allowed;
|
|
5112
5145
|
color:rgb(var(--theme-palette-neutral-text-weakest));
|
|
5113
5146
|
}
|
|
5114
|
-
.ndl-
|
|
5147
|
+
.ndl-text-area .ndl-text-area-msg {
|
|
5115
5148
|
margin-top:4px;
|
|
5116
5149
|
display:flex;
|
|
5117
5150
|
flex-direction:row;
|
|
@@ -5121,23 +5154,23 @@ a.ndl-cypher-editor .cm-editor .cm-button,a .ndl-codemirror-editor .cm-editor .c
|
|
|
5121
5154
|
line-height:1rem;
|
|
5122
5155
|
color:rgb(var(--theme-palette-neutral-text-weaker));
|
|
5123
5156
|
}
|
|
5124
|
-
.ndl-
|
|
5157
|
+
.ndl-text-area .ndl-text-area-msg .ndl-error-text{
|
|
5125
5158
|
display:inline-block;
|
|
5126
5159
|
}
|
|
5127
|
-
.ndl-
|
|
5160
|
+
.ndl-text-area.ndl-has-error textarea {
|
|
5128
5161
|
outline-color:rgb(var(--theme-palette-danger-border-strong));
|
|
5129
5162
|
border-width:2px;
|
|
5130
5163
|
border-color:rgb(var(--theme-palette-danger-border-strong));
|
|
5131
5164
|
}
|
|
5132
|
-
.ndl-
|
|
5165
|
+
.ndl-text-area.ndl-has-error .ndl-text-area-msg {
|
|
5133
5166
|
color:rgb(var(--theme-palette-danger-text));
|
|
5134
5167
|
}
|
|
5135
|
-
.ndl-
|
|
5168
|
+
.ndl-text-area.ndl-has-icon .ndl-error-icon {
|
|
5136
5169
|
width:20px;
|
|
5137
5170
|
height:20px;
|
|
5138
5171
|
color:rgb(var(--theme-palette-danger-text));
|
|
5139
5172
|
}
|
|
5140
|
-
.ndl-
|
|
5173
|
+
.ndl-text-area.ndl-large textarea {
|
|
5141
5174
|
padding-top:12px;
|
|
5142
5175
|
padding-bottom:12px;
|
|
5143
5176
|
font-family:var(--font-font-family-body-large), sans-serif;
|
|
@@ -5147,27 +5180,27 @@ a.ndl-cypher-editor .cm-editor .cm-button,a .ndl-codemirror-editor .cm-editor .c
|
|
|
5147
5180
|
line-height:1.5rem;
|
|
5148
5181
|
min-height:100px;
|
|
5149
5182
|
}
|
|
5150
|
-
.ndl-
|
|
5183
|
+
.ndl-text-area.ndl-large .ndl-text-area-label{
|
|
5151
5184
|
font-family:var(--font-font-family-body-large), sans-serif;
|
|
5152
5185
|
font-size:var(--font-size-body-large);
|
|
5153
5186
|
font-weight:var(--font-weight-normal);
|
|
5154
5187
|
letter-spacing:0.016rem;
|
|
5155
5188
|
line-height:1.5rem;
|
|
5156
5189
|
}
|
|
5157
|
-
.ndl-
|
|
5190
|
+
.ndl-text-area.ndl-large .ndl-text-area-msg{
|
|
5158
5191
|
font-family:var(--font-font-family-body-medium), sans-serif;
|
|
5159
5192
|
font-size:var(--font-size-body-medium);
|
|
5160
5193
|
font-weight:var(--font-weight-normal);
|
|
5161
5194
|
letter-spacing:0.016rem;
|
|
5162
5195
|
line-height:1.25rem;
|
|
5163
5196
|
}
|
|
5164
|
-
.ndl-
|
|
5197
|
+
.ndl-text-area.ndl-large.ndl-has-icon .ndl-icon {
|
|
5165
5198
|
position:absolute;
|
|
5166
5199
|
width:24px;
|
|
5167
5200
|
height:24px;
|
|
5168
5201
|
color:rgb(var(--theme-palette-neutral-text-weak));
|
|
5169
5202
|
}
|
|
5170
|
-
.ndl-
|
|
5203
|
+
.ndl-text-area.ndl-small textarea, .ndl-text-area.ndl-medium textarea {
|
|
5171
5204
|
padding-top:8px;
|
|
5172
5205
|
padding-bottom:8px;
|
|
5173
5206
|
font-family:var(--font-font-family-body-medium), sans-serif;
|
|
@@ -5176,14 +5209,14 @@ a.ndl-cypher-editor .cm-editor .cm-button,a .ndl-codemirror-editor .cm-editor .c
|
|
|
5176
5209
|
letter-spacing:0.016rem;
|
|
5177
5210
|
line-height:1.25rem;
|
|
5178
5211
|
}
|
|
5179
|
-
.ndl-
|
|
5212
|
+
.ndl-text-area.ndl-small .ndl-text-area-label, .ndl-text-area.ndl-medium .ndl-text-area-label{
|
|
5180
5213
|
font-family:var(--font-font-family-body-medium), sans-serif;
|
|
5181
5214
|
font-size:var(--font-size-body-medium);
|
|
5182
5215
|
font-weight:var(--font-weight-normal);
|
|
5183
5216
|
letter-spacing:0.016rem;
|
|
5184
5217
|
line-height:1.25rem;
|
|
5185
5218
|
}
|
|
5186
|
-
.ndl-
|
|
5219
|
+
.ndl-text-area.ndl-small.ndl-has-icon .ndl-icon, .ndl-text-area.ndl-medium.ndl-has-icon .ndl-icon {
|
|
5187
5220
|
width:20px;
|
|
5188
5221
|
height:20px;
|
|
5189
5222
|
position:absolute;
|
package/lib/tokens/js/tokens.js
CHANGED