v3: button styling consistency pass
This commit is contained in:
29
src/App.css
29
src/App.css
@@ -280,7 +280,7 @@
|
||||
}
|
||||
|
||||
/* ── Mode toggle — segmented control ── */
|
||||
.dump-mode-toggle {
|
||||
.visibility-toggle {
|
||||
display: flex;
|
||||
background: var(--color-bg);
|
||||
border: 1.5px solid var(--color-border);
|
||||
@@ -289,7 +289,7 @@
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
.dump-mode-toggle button {
|
||||
.visibility-toggle button {
|
||||
flex: 1;
|
||||
padding: 0.3rem 0.9rem;
|
||||
border-radius: 6px;
|
||||
@@ -303,12 +303,12 @@
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.dump-mode-toggle button.active {
|
||||
.visibility-toggle button.active {
|
||||
background: var(--color-accent);
|
||||
color: var(--color-on-accent);
|
||||
}
|
||||
|
||||
.dump-mode-toggle button:not(.active):hover {
|
||||
.visibility-toggle button:not(.active):hover {
|
||||
background: color-mix(in srgb, var(--color-accent) 12%, transparent);
|
||||
}
|
||||
|
||||
@@ -1059,7 +1059,7 @@ body.has-player .fab-new {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.profile-header .logout-btn {
|
||||
.profile-header .btn-border {
|
||||
margin-top: 0.5rem;
|
||||
}
|
||||
|
||||
@@ -1091,7 +1091,7 @@ body.has-player .fab-new {
|
||||
margin-top: 0.5rem;
|
||||
align-items: center;
|
||||
}
|
||||
.profile-own-actions .logout-btn {
|
||||
.profile-own-actions .btn-border {
|
||||
margin-top: 0;
|
||||
}
|
||||
.invite-generate {
|
||||
@@ -1189,7 +1189,10 @@ body.has-player .fab-new {
|
||||
color: var(--color-accent);
|
||||
}
|
||||
|
||||
.logout-btn {
|
||||
/* ── Border-tinted buttons ── */
|
||||
.btn-border-danger,
|
||||
.btn-border-success,
|
||||
.btn-border {
|
||||
padding: 0.3rem 0.9rem;
|
||||
border: 1.5px solid var(--color-border);
|
||||
border-radius: 6px;
|
||||
@@ -1197,14 +1200,22 @@ body.has-player .fab-new {
|
||||
color: var(--color-text-muted);
|
||||
font-size: 0.85rem;
|
||||
cursor: pointer;
|
||||
transition: border-color 0.15s, color 0.15s;
|
||||
transition: border-color 0.15s, color 0.15s, background 0.15s;
|
||||
}
|
||||
|
||||
.logout-btn:hover {
|
||||
.btn-border-danger:hover,
|
||||
.btn-border-danger.active,
|
||||
.btn-border:hover {
|
||||
border-color: var(--color-danger);
|
||||
color: var(--color-danger);
|
||||
}
|
||||
|
||||
.btn-border-success:hover,
|
||||
.btn-border-success.active {
|
||||
border-color: var(--color-success);
|
||||
color: var(--color-success);
|
||||
}
|
||||
|
||||
/* ── ErrorCard ── */
|
||||
.error-card-wrap {
|
||||
display: flex;
|
||||
|
||||
Reference in New Issue
Block a user