Skip to content

Commit 83d91c4

Browse files
authored
refactor: remove no longer needed Aura button workaround (#10177)
1 parent e8254b5 commit 83d91c4

File tree

1 file changed

+10
-13
lines changed

1 file changed

+10
-13
lines changed

packages/aura/src/components/button.css

Lines changed: 10 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,12 @@
33
--vaadin-button-shadow: 0 1px 4px -1px hsla(0, 0%, 0%, 0.07);
44
}
55

6-
/* TODO Avoid styling message-input button with :not([slot=button]) */
7-
:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):where(:not([slot='button'])) {
6+
:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle) {
87
transition: scale 180ms;
98
position: relative;
109
}
1110

12-
:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):where(:not([slot='button'], [theme~='tertiary'])) {
11+
:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):where(:not([theme~='tertiary'])) {
1312
--aura-surface-level: 6;
1413
--aura-surface-opacity: 0.3;
1514
box-shadow: var(--vaadin-button-shadow);
@@ -32,20 +31,19 @@ Increase padding, but only for buttons that don't have an icon in the default sl
3231
Buttons that place an icon in the default slot are assumed to be icon-only buttons.
3332
*/
3433
/* prettier-ignore */
35-
:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):not([slot='button']):not(:has(:is(vaadin-icon, svg, i[class*='fa-'], vaadin-avatar):not([slot]))) {
34+
:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):not(:has(:is(vaadin-icon, svg, i[class*='fa-'], vaadin-avatar):not([slot]))) {
3635
--vaadin-button-padding: round(var(--vaadin-padding-s) / 1.4, 1px)
3736
max(var(--vaadin-padding-m), round(var(--vaadin-radius-m) / 1.5, 1px));
3837
}
3938

4039
/* Decrease padding when an icon is placed in the prefix or suffix slot */
41-
/* prettier-ignore */
42-
:is(vaadin-button, vaadin-menu-bar-button):not([slot='button']):has([slot='prefix']:is(vaadin-icon, svg, i[class*='fa-'], vaadin-avatar)),
40+
:is(vaadin-button, vaadin-menu-bar-button):has([slot='prefix']:is(vaadin-icon, svg, i[class*='fa-'], vaadin-avatar)),
4341
vaadin-drawer-toggle:empty {
4442
padding-inline-start: max(var(--vaadin-padding-s), round(var(--vaadin-radius-m) / 1.75, 1px));
4543
}
4644

4745
/* prettier-ignore */
48-
:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):not([slot='button']):has([slot='suffix']:is(vaadin-icon, svg, i[class*='fa-'], vaadin-avatar)),
46+
:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):has([slot='suffix']:is(vaadin-icon, svg, i[class*='fa-'], vaadin-avatar)),
4947
vaadin-drawer-toggle:empty,
5048
vaadin-menu-bar-button[aria-haspopup='true'] {
5149
padding-inline-end: max(var(--vaadin-padding-s), round(var(--vaadin-radius-m) / 1.75, 1px));
@@ -60,7 +58,7 @@ vaadin-menu-bar-button[aria-haspopup='true'] {
6058
--vaadin-button-text-color: var(--vaadin-color-subtle);
6159
}
6260

63-
:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):not([slot='button'], [disabled])::before {
61+
:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):not([disabled])::before {
6462
content: '';
6563
position: absolute;
6664
inset: calc(var(--vaadin-button-border-width, 1px) * -1);
@@ -74,7 +72,7 @@ vaadin-menu-bar-button[aria-haspopup='true'] {
7472
}
7573

7674
@supports (color: hsl(0 0 0)) {
77-
:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):not([slot='button'], [disabled])::before {
75+
:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle):not([disabled])::before {
7876
background-color: oklch(from currentColor calc(l + 0.4 - c) c h);
7977
}
8078
}
@@ -92,20 +90,19 @@ vaadin-menu-bar-button[aria-haspopup='true'] {
9290

9391
@media (min-resolution: 2x) {
9492
/* prettier-ignore */
95-
:is(vaadin-button, vaadin-menu-bar-button[first-visible][last-visible], vaadin-drawer-toggle)[active]:not([slot='button'], [disabled], [aria-disabled='true']) {
93+
:is(vaadin-button, vaadin-menu-bar-button[first-visible][last-visible], vaadin-drawer-toggle)[active]:not([disabled], [aria-disabled='true']) {
9694
scale: 0.98;
9795
transition-duration: 50ms;
9896
}
9997
}
10098

101-
:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle)[active]:not([slot='button'], [disabled])::before {
99+
:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle)[active]:not([disabled])::before {
102100
transition-duration: 0s;
103101
opacity: 0.08;
104102
background: oklch(from currentColor min(c, 1 - l + c) calc(c * 0.9) h);
105103
}
106104

107-
/* prettier-ignore */
108-
:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle)[theme~='primary'][active]:not([slot='button'], [disabled])::before {
105+
:is(vaadin-button, vaadin-menu-bar-button, vaadin-drawer-toggle)[theme~='primary'][active]:not([disabled])::before {
109106
opacity: 0.16;
110107
}
111108

0 commit comments

Comments
 (0)