@nexxtmove/ui 0.0.15 → 0.0.17
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/package.json
CHANGED
|
@@ -7,6 +7,24 @@
|
|
|
7
7
|
@apply px-(--button-padding-x) py-(--button-padding-y) gap-(--button-gap);
|
|
8
8
|
}
|
|
9
9
|
|
|
10
|
+
.button-delete {
|
|
11
|
+
@apply bg-button-color-bg-delete-default text-button-color-text-delete-default;
|
|
12
|
+
&:hover {
|
|
13
|
+
@media (hover: hover) {
|
|
14
|
+
@apply bg-button-color-bg-delete-hover;
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
&:focus-visible {
|
|
18
|
+
@apply bg-button-color-bg-delete-focussed outline-button-color-border-delete-focussed outline outline-solid;
|
|
19
|
+
}
|
|
20
|
+
&:active {
|
|
21
|
+
@apply bg-button-color-bg-delete-selected;
|
|
22
|
+
}
|
|
23
|
+
&:disabled {
|
|
24
|
+
@apply bg-button-color-bg-delete-disabled text-button-color-text-delete-disabled;
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
|
|
10
28
|
.button-link {
|
|
11
29
|
@apply text-button-color-text-link-default px-(--button-padding-link-x) py-(--button-padding-link-y);
|
|
12
30
|
&:hover {
|
|
@@ -61,4 +79,34 @@
|
|
|
61
79
|
}
|
|
62
80
|
}
|
|
63
81
|
|
|
82
|
+
.button-success {
|
|
83
|
+
@apply bg-button-color-bg-success-default text-button-color-text-success-default;
|
|
84
|
+
&:hover {
|
|
85
|
+
@media (hover: hover) {
|
|
86
|
+
@apply bg-button-color-bg-success-hover;
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
&:focus-visible {
|
|
90
|
+
@apply bg-button-color-bg-success-focussed outline-button-color-border-success-focussed outline outline-solid;
|
|
91
|
+
}
|
|
92
|
+
&:active {
|
|
93
|
+
@apply bg-button-color-bg-success-selected;
|
|
94
|
+
}
|
|
95
|
+
&:disabled {
|
|
96
|
+
@apply bg-button-color-bg-success-disabled text-button-color-text-success-disabled;
|
|
97
|
+
}
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
.progress-bar-bar {
|
|
101
|
+
@apply bg-progress-bar-color-bg-bar;
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
.progress-bar-progress {
|
|
105
|
+
@apply bg-progress-bar-color-bg-progress;
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
.progress-nav {
|
|
109
|
+
@apply gap-(--progress-nav-gap);
|
|
110
|
+
}
|
|
111
|
+
|
|
64
112
|
}
|
|
@@ -94,6 +94,17 @@
|
|
|
94
94
|
--color-yale-blue-900: oklch(17.689% 0.03482 257.71215);
|
|
95
95
|
--color-yale-blue-950: oklch(14.945% 0.03121 258.39122);
|
|
96
96
|
--color-white: oklch(100% 0 0);
|
|
97
|
+
--color-brick-50: oklch(81.463% 0.02626 17.7106);
|
|
98
|
+
--color-brick-100: oklch(76.079% 0.04235 16.2483);
|
|
99
|
+
--color-brick-200: oklch(70.685% 0.06322 17.50055);
|
|
100
|
+
--color-brick-300: oklch(65.447% 0.0891 18.85182);
|
|
101
|
+
--color-brick-400: oklch(60.303% 0.11957 19.93684);
|
|
102
|
+
--color-brick-500: oklch(55.746% 0.15125 22.41764);
|
|
103
|
+
--color-brick-600: oklch(51.177% 0.12761 21.48042);
|
|
104
|
+
--color-brick-700: oklch(46.615% 0.10001 20.85777);
|
|
105
|
+
--color-brick-800: oklch(37.589% 0.05484 18.2995);
|
|
106
|
+
--color-brick-900: oklch(32.852% 0.03404 19.047);
|
|
107
|
+
--color-brick-950: oklch(27.734% 0.02143 13.77033);
|
|
97
108
|
--color-button-color-bg-primary-default: var(--color-cornflower-blue-500);
|
|
98
109
|
--color-button-color-bg-primary-hover: var(--color-cornflower-blue-400);
|
|
99
110
|
--color-button-color-bg-primary-focussed: var(--color-cornflower-blue-500);
|
|
@@ -104,6 +115,16 @@
|
|
|
104
115
|
--color-button-color-bg-secondary-focussed: var(--color-white);
|
|
105
116
|
--color-button-color-bg-secondary-selected: var(--color-cornflower-blue-50);
|
|
106
117
|
--color-button-color-bg-secondary-disabled: var(--color-white);
|
|
118
|
+
--color-button-color-bg-success-default: var(--color-green-400);
|
|
119
|
+
--color-button-color-bg-success-hover: var(--color-green-500);
|
|
120
|
+
--color-button-color-bg-success-focussed: var(--color-green-400);
|
|
121
|
+
--color-button-color-bg-success-selected: var(--color-green-600);
|
|
122
|
+
--color-button-color-bg-success-disabled: var(--color-green-200);
|
|
123
|
+
--color-button-color-bg-delete-default: var(--color-brick-500);
|
|
124
|
+
--color-button-color-bg-delete-hover: var(--color-brick-600);
|
|
125
|
+
--color-button-color-bg-delete-focussed: var(--color-brick-500);
|
|
126
|
+
--color-button-color-bg-delete-selected: var(--color-brick-700);
|
|
127
|
+
--color-button-color-bg-delete-disabled: var(--color-brick-100);
|
|
107
128
|
--color-button-color-text-primary-default: var(--color-white);
|
|
108
129
|
--color-button-color-text-primary-disabled: var(--color-gray-600);
|
|
109
130
|
--color-button-color-text-secondary-default: var(--color-gray-950);
|
|
@@ -113,13 +134,21 @@
|
|
|
113
134
|
--color-button-color-text-link-focussed: var(--color-cornflower-blue-600);
|
|
114
135
|
--color-button-color-text-link-selected: var(--color-cornflower-blue-800);
|
|
115
136
|
--color-button-color-text-link-disabled: var(--color-gray-400);
|
|
137
|
+
--color-button-color-text-success-default: var(--color-white);
|
|
138
|
+
--color-button-color-text-success-disabled: var(--color-gray-100);
|
|
139
|
+
--color-button-color-text-delete-default: var(--color-white);
|
|
140
|
+
--color-button-color-text-delete-disabled: var(--color-gray-100);
|
|
116
141
|
--color-button-color-border-primary-focussed: var(--color-cornflower-blue-100);
|
|
117
142
|
--color-button-color-border-secondary-focussed: var(--color-cornflower-blue-100);
|
|
118
143
|
--color-button-color-border-secondary-hover: var(--color-cornflower-blue-700);
|
|
119
144
|
--color-button-color-border-secondary-selected: var(--color-cornflower-blue-500);
|
|
120
145
|
--color-button-color-border-secondary-disabled: var(--color-gray-400);
|
|
121
|
-
--color-button-color-border-secondary-default: var(--color-gray-
|
|
146
|
+
--color-button-color-border-secondary-default: var(--color-gray-200);
|
|
122
147
|
--color-button-color-border-link-focussed: var(--color-cornflower-blue-100);
|
|
148
|
+
--color-button-color-border-success-focussed: var(--color-green-100);
|
|
149
|
+
--color-button-color-border-delete-focussed: var(--color-brick-100);
|
|
150
|
+
--color-progress-bar-color-bg-progress: var(--color-cornflower-blue-500);
|
|
151
|
+
--color-progress-bar-color-bg-bar: var(--color-gray-50);
|
|
123
152
|
--text-xs: 0.75rem;
|
|
124
153
|
--text-base: 1rem;
|
|
125
154
|
--text-lg: 1.125rem;
|
|
@@ -183,6 +212,7 @@
|
|
|
183
212
|
--button-padding-link-y: var(--spacing-0\.5);
|
|
184
213
|
--button-gap: var(--spacing-1);
|
|
185
214
|
--button-border-radius: var(--radius-lg);
|
|
215
|
+
--progress-nav-gap: var(--spacing-3\.5);
|
|
186
216
|
--font-sans: 'Poppins', ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
|
187
217
|
--font-serif: 'Playfair Display', ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
|
|
188
218
|
--font-mono: 'Roboto Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|