@uxf/ui 1.0.0-beta.75 → 1.0.0-beta.76

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.
Files changed (4) hide show
  1. package/css/button.css +16 -16
  2. package/css/list-item.css +1 -1
  3. package/css/text-link.css +2 -2
  4. package/package.json +1 -1
package/css/button.css CHANGED
@@ -87,11 +87,11 @@
87
87
  }
88
88
 
89
89
  &--variant-outlined {
90
- @apply before:absolute before:pointer-events-none before:inset-0 before:border hover:before:border-2
90
+ @apply before:absolute before:pointer-events-none before:inset-0 before:border is-hoverable:before:border-2
91
91
  bg-transparent;
92
92
 
93
93
  :root .light & {
94
- @apply before:border-gray-300 hover:bg-primary-100 hover:before:border-primary-400
94
+ @apply before:border-gray-300 is-hoverable:bg-primary-100 is-hoverable:before:border-primary-400
95
95
  focus-visible:ring-primary-500 focus-visible:ring-offset-white;
96
96
 
97
97
  &.is-disabled {
@@ -100,7 +100,7 @@
100
100
  }
101
101
 
102
102
  :root .dark & {
103
- @apply before:border-gray-300 hover:bg-white/10 focus-visible:ring-primary-500
103
+ @apply before:border-gray-300 is-hoverable:bg-white/10 focus-visible:ring-primary-500
104
104
  focus-visible:ring-offset-gray-900;
105
105
 
106
106
  &.is-disabled {
@@ -114,7 +114,7 @@
114
114
 
115
115
  &.uxf-button--color-default {
116
116
  :root .light & {
117
- @apply text-white bg-primary-500 hover:bg-primary-400 focus-visible:ring-primary-500;
117
+ @apply text-white bg-primary-500 is-hoverable:bg-primary-400 focus-visible:ring-primary-500;
118
118
 
119
119
  &.is-disabled {
120
120
  @apply bg-gray-100 text-gray-400;
@@ -122,7 +122,7 @@
122
122
  }
123
123
 
124
124
  :root .dark & {
125
- @apply text-white bg-primary-500 hover:bg-primary-400 focus-visible:ring-primary-500
125
+ @apply text-white bg-primary-500 is-hoverable:bg-primary-400 focus-visible:ring-primary-500
126
126
  focus-visible:ring-offset-gray-900;
127
127
 
128
128
  &.is-disabled {
@@ -133,7 +133,7 @@
133
133
 
134
134
  &.uxf-button--color-white {
135
135
  :root .light & {
136
- @apply bg-white hover:bg-gray-200 focus-visible:ring-gray-200;
136
+ @apply bg-white is-hoverable:bg-gray-200 focus-visible:ring-gray-200;
137
137
 
138
138
  &.is-disabled {
139
139
  @apply bg-gray-100 text-gray-400;
@@ -141,19 +141,19 @@
141
141
  }
142
142
 
143
143
  :root .dark & {
144
- @apply bg-white hover:bg-gray-200 focus-visible:ring-gray-200;
144
+ @apply bg-white is-hoverable:bg-gray-200 focus-visible:ring-gray-200;
145
145
 
146
146
  &.is-disabled {
147
147
  @apply bg-gray-100 text-gray-400;
148
148
  }
149
149
  }
150
150
 
151
- @apply bg-gray-50 text-gray-700 hover:bg-gray-100 focus-visible:ring-gray-500;
151
+ @apply bg-gray-50 text-gray-700 is-hoverable:bg-gray-100 focus-visible:ring-gray-500;
152
152
  }
153
153
 
154
154
  &.uxf-button--color-success {
155
155
  :root .light & {
156
- @apply text-white bg-success-500 hover:bg-success-400 focus-visible:ring-success-500;
156
+ @apply text-white bg-success-500 is-hoverable:bg-success-400 focus-visible:ring-success-500;
157
157
 
158
158
  &.is-disabled {
159
159
  @apply bg-gray-100 text-gray-400;
@@ -161,7 +161,7 @@
161
161
  }
162
162
 
163
163
  :root .dark & {
164
- @apply text-white bg-success-500 hover:bg-success-400 focus-visible:ring-success-500
164
+ @apply text-white bg-success-500 is-hoverable:bg-success-400 focus-visible:ring-success-500
165
165
  focus-visible:ring-offset-gray-900;
166
166
 
167
167
  &.is-disabled {
@@ -172,7 +172,7 @@
172
172
 
173
173
  &.uxf-button--color-warning {
174
174
  :root .light & {
175
- @apply text-white bg-warning-500 hover:bg-warning-400 focus-visible:ring-warning-500;
175
+ @apply text-white bg-warning-500 is-hoverable:bg-warning-400 focus-visible:ring-warning-500;
176
176
 
177
177
  &.is-disabled {
178
178
  @apply bg-gray-100 text-gray-400;
@@ -180,7 +180,7 @@
180
180
  }
181
181
 
182
182
  :root .dark & {
183
- @apply text-white bg-warning-500 hover:bg-warning-400 focus-visible:ring-warning-500
183
+ @apply text-white bg-warning-500 is-hoverable:bg-warning-400 focus-visible:ring-warning-500
184
184
  focus-visible:ring-offset-gray-900;
185
185
 
186
186
  &.is-disabled {
@@ -191,7 +191,7 @@
191
191
 
192
192
  &.uxf-button--color-error {
193
193
  :root .light & {
194
- @apply text-white bg-error-500 hover:bg-error-400 focus-visible:ring-error-500;
194
+ @apply text-white bg-error-500 is-hoverable:bg-error-400 focus-visible:ring-error-500;
195
195
 
196
196
  &.is-disabled {
197
197
  @apply bg-gray-100 text-gray-400;
@@ -199,7 +199,7 @@
199
199
  }
200
200
 
201
201
  :root .dark & {
202
- @apply text-white bg-error-500 hover:bg-error-400 focus-visible:ring-error-500
202
+ @apply text-white bg-error-500 is-hoverable:bg-error-400 focus-visible:ring-error-500
203
203
  focus-visible:ring-offset-gray-900;
204
204
 
205
205
  &.is-disabled {
@@ -213,7 +213,7 @@
213
213
  @apply before:border-transparent;
214
214
 
215
215
  :root .light & {
216
- @apply hover:bg-gray-200 focus-visible:ring-primary-500 focus-visible:ring-offset-white;
216
+ @apply is-hoverable:bg-gray-200 focus-visible:ring-primary-500 focus-visible:ring-offset-white;
217
217
 
218
218
  &.is-disabled {
219
219
  @apply text-gray-400;
@@ -221,7 +221,7 @@
221
221
  }
222
222
 
223
223
  :root .dark & {
224
- @apply hover:bg-gray-800 focus-visible:ring-primary-500 focus-visible:ring-offset-gray-900;
224
+ @apply is-hoverable:bg-gray-800 focus-visible:ring-primary-500 focus-visible:ring-offset-gray-900;
225
225
 
226
226
  &.is-disabled {
227
227
  @apply text-gray-600;
package/css/list-item.css CHANGED
@@ -1,5 +1,5 @@
1
1
  .uxf-list-item {
2
- @apply flex justify-between grow py-4 px-5 min-h-[64px] space-x-3 transition-opacity hover:opacity-75
2
+ @apply flex justify-between grow py-4 px-5 min-h-[64px] space-x-3 transition-opacity is-hoverable:opacity-75
3
3
  outline-none relative before:absolute before:inset-0 before:rounded-lg focus-visible:before:border-2;
4
4
 
5
5
  &__inner {
package/css/text-link.css CHANGED
@@ -3,10 +3,10 @@
3
3
  focus-visible:before:border-2 focus-visible:before:rounded-lg;
4
4
 
5
5
  :root .light & {
6
- @apply text-primary-500 hover:text-primary-400 focus-visible:before:border-primary-500;
6
+ @apply text-primary-500 is-hoverable:text-primary-400 focus-visible:before:border-primary-500;
7
7
  }
8
8
 
9
9
  :root .dark & {
10
- @apply text-primary-500 hover:text-primary-400 focus-visible:before:border-primary-500;
10
+ @apply text-primary-500 is-hoverable:text-primary-400 focus-visible:before:border-primary-500;
11
11
  }
12
12
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@uxf/ui",
3
- "version": "1.0.0-beta.75",
3
+ "version": "1.0.0-beta.76",
4
4
  "description": "",
5
5
  "publishConfig": {
6
6
  "access": "public"