mirror of
https://github.com/zen-browser/www.git
synced 2025-07-07 17:05:32 +02:00
chore(bg): replace the bg for buttons with a subtle background color
This commit is contained in:
parent
03906ef819
commit
3f11a2d6b3
4 changed files with 9 additions and 6 deletions
|
@ -24,7 +24,7 @@ const {
|
||||||
: isAlert
|
: isAlert
|
||||||
? 'bg-red-300 text-dark'
|
? 'bg-red-300 text-dark'
|
||||||
: !isBordered
|
: !isBordered
|
||||||
? 'bg-[rgba(0,0,0,.05)]'
|
? 'bg-subtle'
|
||||||
: '!transition-bg border-2 border-dark hover:bg-dark hover:text-paper hover:shadow-sm',
|
: '!transition-bg border-2 border-dark hover:bg-dark hover:text-paper hover:shadow-sm',
|
||||||
]}
|
]}
|
||||||
>
|
>
|
||||||
|
|
|
@ -235,20 +235,20 @@ const {
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.feature {
|
.feature {
|
||||||
@apply w-full cursor-pointer select-none rounded-lg p-4 hover:bg-[rgba(0,0,0,.05)] dark:hover:bg-white/10;
|
@apply w-full cursor-pointer select-none rounded-lg p-4 hover:bg-subtle;
|
||||||
transition: all 0.2s ease-in-out;
|
transition: all 0.2s ease-in-out;
|
||||||
|
|
||||||
&[data-active='true'] {
|
&[data-active='true'] {
|
||||||
@apply bg-[rgba(0,0,0,.05)] dark:bg-white/10;
|
@apply bg-subtle;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.feature-tab {
|
.feature-tab {
|
||||||
@apply rounded-lg px-4 py-2 text-lg font-medium hover:bg-[rgba(0,0,0,.05)] dark:hover:bg-white/10;
|
@apply rounded-lg px-4 py-2 text-lg font-medium hover:bg-subtle;
|
||||||
transition: all 0.2s ease-in-out;
|
transition: all 0.2s ease-in-out;
|
||||||
|
|
||||||
&[data-active='true'] {
|
&[data-active='true'] {
|
||||||
@apply bg-[rgba(0,0,0,.05)] dark:bg-white/10;
|
@apply bg-subtle;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -127,11 +127,13 @@ import MobileNavBar from '../components/MobileNavBar'
|
||||||
--zen-paper: #f2f0e3;
|
--zen-paper: #f2f0e3;
|
||||||
--zen-dark: #2e2e2e;
|
--zen-dark: #2e2e2e;
|
||||||
--zen-muted: rgba(0, 0, 0, 0.05);
|
--zen-muted: rgba(0, 0, 0, 0.05);
|
||||||
|
--zen-subtle: rgba(0,0,0,0.05);
|
||||||
|
|
||||||
&[data-theme='dark'] {
|
&[data-theme='dark'] {
|
||||||
--zen-paper: #1f1f1f;
|
--zen-paper: #1f1f1f;
|
||||||
--zen-dark: #d1cfc0;
|
--zen-dark: #d1cfc0;
|
||||||
--zen-muted: rgba(255, 255, 255, 0.05);
|
--zen-muted: rgba(255, 255, 255, 0.05);
|
||||||
|
--zen-subtle: rgba(255,255,255,0.1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -12,6 +12,7 @@ export default {
|
||||||
paper: 'var(--zen-paper)',
|
paper: 'var(--zen-paper)',
|
||||||
coral: '#F76F53',
|
coral: '#F76F53',
|
||||||
dark: 'var(--zen-dark)',
|
dark: 'var(--zen-dark)',
|
||||||
|
subtle: 'var(--zen-subtle)',
|
||||||
muted: 'var(--zen-muted)',
|
muted: 'var(--zen-muted)',
|
||||||
'zen-blue': '#6287f5',
|
'zen-blue': '#6287f5',
|
||||||
'zen-green': '#63f78b',
|
'zen-green': '#63f78b',
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue