Update button class name so it doesn't conflict with Monaco (#1536)

Avoids this: 

![image](https://github.com/user-attachments/assets/49b214e4-7dde-4c3a-be5d-0de7afe30dcc)
This commit is contained in:
Evan Simkowitz 2024-12-16 18:10:06 -08:00 committed by GitHub
parent 18fcab4346
commit 8a5ef4cb3e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
10 changed files with 17 additions and 17 deletions

View File

@ -124,9 +124,9 @@
opacity: 0.7; opacity: 0.7;
flex-grow: 1; flex-grow: 1;
&.flex-nogrow { &.flex-nogrow {
flex-grow: 0; flex-grow: 0;
} }
&.preview-filename { &.preview-filename {
direction: rtl; direction: rtl;
@ -166,7 +166,7 @@
flex: 1 2 auto; flex: 1 2 auto;
overflow: hidden; overflow: hidden;
padding-right: 4px; padding-right: 4px;
@include mixins.ellipsis() @include mixins.ellipsis();
} }
.connecting-svg { .connecting-svg {
@ -211,12 +211,12 @@
} }
} }
.button { .wave-button {
margin-left: 3px; margin-left: 3px;
} }
// webview specific. for refresh button // webview specific. for refresh button
.iconbutton { .wave-iconbutton {
height: 100%; height: 100%;
width: 27px; width: 27px;
display: flex; display: flex;
@ -226,7 +226,7 @@
} }
.menubutton { .menubutton {
.button { .wave-button {
font-size: 11px; font-size: 11px;
} }
} }
@ -373,7 +373,7 @@
} }
} }
.button:last-child { .wave-button:last-child {
margin-top: 1.5px; margin-top: 1.5px;
} }
} }

View File

@ -3,7 +3,7 @@
@use "../mixins.scss"; @use "../mixins.scss";
.button { .wave-button {
// override default button appearance // override default button appearance
border: 1px solid transparent; border: 1px solid transparent;
outline: 1px solid transparent; outline: 1px solid transparent;

View File

@ -32,7 +32,7 @@ const Button = memo(
<Component <Component
ref={btnRef} ref={btnRef}
tabIndex={disabled ? -1 : 0} tabIndex={disabled ? -1 : 0}
className={clsx("button", finalClassName)} className={clsx("wave-button", finalClassName)}
disabled={disabled} disabled={disabled}
{...props} {...props}
> >

View File

@ -1,4 +1,4 @@
.iconbutton { .wave-iconbutton {
display: flex; display: flex;
cursor: pointer; cursor: pointer;
opacity: 0.7; opacity: 0.7;

View File

@ -16,7 +16,7 @@ export const IconButton = memo(
return ( return (
<button <button
ref={ref} ref={ref}
className={clsx("iconbutton", className, decl.className, { className={clsx("wave-iconbutton", className, decl.className, {
disabled: decl.disabled, disabled: decl.disabled,
"no-action": decl.noAction, "no-action": decl.noAction,
})} })}

View File

@ -2,7 +2,7 @@
overflow: hidden; overflow: hidden;
.menu-anchor { .menu-anchor {
width: 100%; width: 100%;
.button { .wave-button {
width: 100%; width: 100%;
div { div {
max-width: 100%; max-width: 100%;

View File

@ -48,7 +48,7 @@
align-items: flex-start; align-items: flex-start;
gap: 10px; gap: 10px;
.button { .wave-button {
display: flex; display: flex;
align-items: center; align-items: center;

View File

@ -65,7 +65,7 @@
padding-top: 16px; padding-top: 16px;
border-top: 1px solid rgba(255, 255, 255, 0.1); border-top: 1px solid rgba(255, 255, 255, 0.1);
.button:last-child { .wave-button:last-child {
margin-left: 8px; margin-left: 8px;
} }
} }

View File

@ -81,7 +81,7 @@
} }
} }
.button { .wave-button {
position: absolute; position: absolute;
top: 50%; top: 50%;
right: 4px; right: 4px;

View File

@ -1,4 +1,4 @@
.button { .wave-button {
color: black; color: black;
background-color: var(--accent-color); background-color: var(--accent-color);
flex: 0 0 fit-content; flex: 0 0 fit-content;