mirror of
https://github.com/He4eT/tabswitcher.git
synced 2026-05-04 17:07:23 +00:00
55 lines
1.3 KiB
CSS
55 lines
1.3 KiB
CSS
html, body {
|
|
font-family: sans;
|
|
margin: 0;
|
|
padding: 0;
|
|
|
|
--step: 8px;
|
|
|
|
/* @see https://acorn.firefox.com/latest/styles/color-MZHBVuZc#section-gray-c2 */
|
|
--gray-light-05: #fbfbfe;
|
|
--gray-light-10: #f9f9fb;
|
|
--gray-light-20: #f0f0f4;
|
|
--gray-light-30: #e0e0e6;
|
|
--gray-light-40: #cfcfd8;
|
|
--gray-light-50: #bfbfc9;
|
|
|
|
--gray-dark-05: #5b5b66;
|
|
--gray-dark-10: #52525e;
|
|
--gray-dark-30: #42414d;
|
|
--gray-dark-40: #3a3944;
|
|
--gray-dark-60: #2b2a33;
|
|
--gray-dark-80: #1c1b22;
|
|
--gray-dark-90: #15141a;
|
|
|
|
--green-20: #b3ffe3;
|
|
--green-40: #54ffbd;
|
|
--green-60: #2ac3a2;
|
|
}
|
|
|
|
body {
|
|
--color-bg: var(--gray-light-10);
|
|
--color-bg-selection: var(--gray-light-30);
|
|
--color-text: var(--gray-dark-80);
|
|
--color-text-alt: var(--gray-dark-10);
|
|
--color-indicator-active: var(--green-60);
|
|
--color-indicator-inactive: var(--gray-light-50);
|
|
}
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
body {
|
|
--color-bg: var(--gray-dark-60);
|
|
--color-bg-selection: var(--gray-dark-30);
|
|
--color-text: var(--gray-light-20);
|
|
--color-text-alt: var(--gray-light-50);
|
|
--color-indicator-active: var(--green-40);
|
|
--color-indicator-inactive: var(--gray-light-50);
|
|
}
|
|
}
|
|
|
|
/* Common */
|
|
|
|
body {
|
|
background-color: var(--color-bg);
|
|
color: var(--color-text);
|
|
font-size: calc(2 * var(--step));
|
|
}
|