Flatten control accents: no gradient or glow on buttons, tabs, or the FAB
Some checks are pending
DevPlace CI / test (pull_request) Blocked by required conditions
Some checks are pending
DevPlace CI / test (pull_request) Blocked by required conditions
The reference design uses flat primary buttons, so every interactive control drops the brand gradient and the accent glow: .btn-primary (flat accent, accent-hover on hover), the feed nav tabs, the projects tabs, the sidebar active link, and the create-post FAB (which keeps a neutral elevation shadow). Gradients remain only on decorative meters and stripes (XP fills, progress bars, the project card top stripe). The now-unused --glow-accent token is removed, and deepsearch.css loses its var() fallback on the progress gradient. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
parent
c09e6b328c
commit
3fca4be72e
@ -444,15 +444,13 @@ img {
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: var(--accent-gradient);
|
||||
background: var(--accent);
|
||||
color: var(--on-accent);
|
||||
box-shadow: 0 2px 12px rgba(var(--accent-rgb), 0.3);
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
background: var(--accent-hover);
|
||||
color: var(--white);
|
||||
box-shadow: var(--glow-accent);
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
|
||||
@ -160,7 +160,7 @@
|
||||
.ds-progress-bar {
|
||||
height: 100%;
|
||||
width: 0;
|
||||
background: var(--accent-gradient, var(--accent));
|
||||
background: var(--accent-gradient);
|
||||
transition: width 0.3s ease;
|
||||
}
|
||||
|
||||
|
||||
@ -38,9 +38,8 @@
|
||||
}
|
||||
|
||||
.feed-nav-btn.active {
|
||||
background: var(--accent-gradient);
|
||||
background: var(--accent);
|
||||
color: var(--on-accent);
|
||||
box-shadow: var(--glow-accent);
|
||||
}
|
||||
|
||||
.feed-nav-actions {
|
||||
@ -368,14 +367,14 @@
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
border-radius: 50%;
|
||||
background: var(--accent-gradient);
|
||||
background: var(--accent);
|
||||
color: var(--on-accent);
|
||||
font-size: 2rem;
|
||||
line-height: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-shadow: var(--glow-accent);
|
||||
box-shadow: var(--shadow);
|
||||
z-index: var(--z-fab);
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
|
||||
@ -27,9 +27,8 @@
|
||||
}
|
||||
|
||||
.projects-tab.active {
|
||||
background: var(--accent-gradient);
|
||||
background: var(--accent);
|
||||
color: var(--on-accent);
|
||||
box-shadow: var(--glow-accent);
|
||||
}
|
||||
|
||||
.projects-header {
|
||||
|
||||
@ -76,10 +76,9 @@
|
||||
|
||||
.sidebar-link.active,
|
||||
.sidebar-link.active:hover {
|
||||
background: var(--accent-gradient);
|
||||
background: var(--accent);
|
||||
color: var(--on-accent);
|
||||
font-weight: 600;
|
||||
box-shadow: var(--glow-accent);
|
||||
}
|
||||
|
||||
.sidebar-dot {
|
||||
|
||||
@ -36,7 +36,6 @@
|
||||
--shadow-sm: 0 2px 15px -3px rgba(0, 0, 0, 0.07), 0 10px 20px -2px rgba(0, 0, 0, 0.04);
|
||||
--shadow: 0 4px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
|
||||
--shadow-lg: 0 10px 40px -10px rgba(0, 0, 0, 0.15), 0 2px 10px -2px rgba(0, 0, 0, 0.05);
|
||||
--glow-accent: 0 6px 24px rgba(183, 63, 30, 0.45);
|
||||
|
||||
--white: #fff;
|
||||
--overlay-dark: rgba(0, 0, 0, 0.7);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user