52 lines
1.4 KiB
CSS
52 lines
1.4 KiB
CSS
:root {
|
|
--background-color-light: #f4e8e9;
|
|
--background-color-light-2: #f5e6f3;
|
|
--text-color-light: #333;
|
|
--confirm-color-light: #91d9bb;
|
|
--link-color-light: #d291bc;
|
|
--container-bg-light: #fff7f87a;
|
|
--border-color-light: #692fcc;
|
|
--error-color-light: #a83254;
|
|
|
|
--background-color-dark: #333;
|
|
--background-color-dark-2: #2c2c2c;
|
|
--text-color-dark: #f4e8e9;
|
|
--confirm-color-dark: #4d8f73;
|
|
--link-color-dark: #b86b77;
|
|
--container-bg-dark: #424242ea;
|
|
--border-color-dark: #956ade;
|
|
--error-color-dark: #851736;
|
|
}
|
|
|
|
[data-theme="DARK"] {
|
|
--background-color: var(--background-color-dark);
|
|
--background-color-2: var(--background-color-dark-2);
|
|
--text-color: var(--text-color-dark);
|
|
--link-color: var(--link-color-dark);
|
|
--container-bg: var(--container-bg-dark);
|
|
--border-color: var(--border-color-dark);
|
|
--error-color: var(--error-color-dark);
|
|
--confirm-color: var(--confirm-color-dark);
|
|
}
|
|
|
|
[data-theme="LIGHT"] {
|
|
--background-color: var(--background-color-light);
|
|
--background-color-2: var(--background-color-light-2);
|
|
--text-color: var(--text-color-light);
|
|
--link-color: var(--link-color-light);
|
|
--container-bg: var(--container-bg-light);
|
|
--border-color: var(--border-color-light);
|
|
--error-color: var(--error-color-light);
|
|
--confirm-color: var(--confirm-color-light);
|
|
}
|
|
|
|
.error {
|
|
background-color: var(--error-color);
|
|
padding: 1rem;
|
|
}
|
|
|
|
.success {
|
|
background-color: var(--confirm-color);
|
|
padding: 1rem;
|
|
}
|