settings/theme/osto

@import

code:style.css

@import "/api/code/nremiel/settings%2Ftheme%2Fcommon/style.css";

@import "/api/code/nremiel/settings%2Ftheme%2FYaru/palette.css";

@import "/api/code/nremiel/settings%2Ftheme%2FYaru%2FCode-block/light.css";

La haŭto

Vidu ankaŭ:

code:style.css

code:style.css

@container style(--project-theme: "nremiel.osto") {

body,

body *:has(.app),

.app {

--overwrite-native-themes: y;

--current-project-skin-name: "Anĝela Osto";

--yaru-color-palette: "yaru";

--code-block-color-scheme: "nremiel.yaru";

--body-bg: var(--c-bg-bottom);

}

body,

body *:has(.app),

.app,

.app *:not(.char-index) {

--blockquote: var(--smaller);

}

body,

body *:has(.app),

.app {

--c-ui-accent-color: var(--c-purple-3);

--c-ui-accent-color-selectable: var(--c-purple-2);

--c-caret-cursor: var(--c-nrem-sango-4);

--c-bg-text-selection: var(--c-red-1);

/* --c-bg-bottom: var(--c-nrem-osto-5); */

/* hsl(223, 7%, 81%); */

--c-bg-bottom: hsl(223, 12%, 84%);

--c-bg-card: var(--c-bg-page-main);

--c-bc-card-topline: var(--c-nrem-sango-3);

--c-bc-card-topline: hsl(0, 0%, 79%);

/* --c-bc-card-topline: var(--c-purple-1); */

--c-bg-card-pinned: var(--c-nrem-sango-2);

--c-fg-card-backside: var(--c-purple-3);

--c-tx-card-title: var(--c-tx-normal);

--border-page-main-top: 8px solid var(--c-purple-3);

--border-page-main-top: 8px solid var(--c-nrem-osto-3);

--c-shadow-box-page-main: hsl(from var(nrem-sango-5) h s 50%);

--c-shadow-box-page-main-alt: black;

--shadow-box-page-main:

0 0 0.25rem hsl(from var(--c-shadow-box-page-main) h s l / 0.2),

-2.8px 2.8px 2.2px hsl(from var(--c-shadow-box-page-main) h s l / 0.02),

-6.7px 6.7px 5.3px hsl(from var(--c-shadow-box-page-main) h s l / 0.028),

-12.5px 12.5px 10px hsl(from var(--c-shadow-box-page-main-alt) h s l / 0.035),

-22.3px 22.3px 17.9px hsl(from var(--c-shadow-box-page-main-alt) h s l / 0.021),

2.8px 2.8px 2.2px hsl(from var(--c-shadow-box-page-main) h s l / 0.02),

6.7px 6.7px 5.3px hsl(from var(--c-shadow-box-page-main) h s l / 0.028),

12.5px 12.5px 10px hsl(from var(--c-shadow-box-page-main) h s l / 0.035),

22.3px 22.3px 17.9px hsl(from var(--c-shadow-box-page-main-alt) h s l / 0.042),

41.8px 41.8px 33.4px hsl(from var(--c-shadow-box-page-main-alt) h s l / 0.05),

100px 100px 80px hsl(from var(--c-shadow-box-page-main-alt) h s l / 0.035);

--c-bg-page-main: var(--c-light-2);

--c-bg-page-main-lines: var(--c-light-2);

--shadow-box-page-main-lines: ;

--c-bg-current-line: var(--c-nrem-osto-2);

--c-fg-indent-mark: darkslategray;

--c-fg-indent-mark: var(--c-dark-2);

--c-tx-normal: black;

--c-tx-strong: var(--c-dark-4);

--c-tx-week: var(--c-dark-1);

--c-bg-code: var(--c-light-5);

--c-tx-code: var(--c-dark-4);

--c-tx-link-hashtag: var(--c-green-1);

--c-tx-link-empty: var(--c-red-1);

--c-tx-link: var(--c-nrem-larmo-1);

--c-tx-link: var(--c-blue-4);

--c-tx-link-hashtag: var(--c-green-4);

--c-tx-link-empty: var(--c-red-1);

--c-bg-line-permalink: hsl(from var(--c-nrem-nervo-4) h s l / 35%);

--c-bg-line-permalink: hsl(from var(--c-caret-cursor) h s l / 35%);

--c-bg-indent-level-1: transparent;

--c-bg-indent-level-1-line: transparent;

--c-bg-indent-level-2: transparent;

--c-bg-indent-level-2-line: transparent;

--c-bg-indent-level-3: transparent;

--c-bg-indent-level-3-line: transparent;

--c-bg-indent-level-4: transparent;

--c-bg-indent-level-4-line: transparent;

--c-bg-a-indent-opacity: 0.5;

--c-bg-blockquote: hsl(from var(--c-light-4) h s l / 25%);

--c-bg-blockquote: hsl(from var(--c-bg-bottom) h s l / 20%);

--c-tx-blockquote: var(--c-nrem-);

--c-border-blockquote-left: var(--c-light-5);

--border-blockquote-left: var(--c-border-blockquote-left) solid 4px;

--c-border-blockquote-right: hsl(from var(--c-bg-bottom) h s l / 5%);

--border-blockquote-right: var(--c-border-blockquote-right) solid 8px;

--c-tx-h1: var(--c-tx-strong);

--c-tx-h2: var(--c-tx-alt);

--c-tx-h3: var(--c-tx-normal);

--c-tx-h4: var(--c-tx-alt);

--border-section: calc(0.05rem * var(--h-line-base)) solid var(--c-bg-bottom);

/* --c-bg-navbar: rgb(216, 215, 193); la koloro de la antaŭagordita haŭto */

/* --c-bg-navbar: hsl(0, 0%, 92%); */

/* --c-bg-navbar: hsla(0, 0%, 92%, 85%); */

--c-bg-navbar: hsla(0, 0%, 99%, 12.5%);

--c-bg-navbar: hsla(0, 0%, 93%, 82.5%);

--c-bg-navbar: hsla(0, 0%, 93%, 80%);

/* --c-tx-navbar-project-name: var(--c-dark-3); */

--c-tx-navbar-project-name: var(--c-dark-3);

--c-tx-navbar: var(--c-dark-3);

--c-ic-navbar: var(--c-tx-navbar);

--c-bg-navbar-search-form: hsl(0 0% 83% / 80%);

--c-bg-navbar-search-form: var(--c-nrem-osto-5);

--c-bg-navbar-search-form: hsl(from var(--c-nrem-osto-5) h s l / 82.5%);

--c-tx-navbar-search-form: var(--c-dark-7);

--c-tx-navbar-search-form-default-text: var(--c-light-7);

--c-ic-navbar-button-new-page: var(--c-white-5);

/* la implicita de Paper Light */

--c-ic-navbar-button-new-page: ;

--c-ic-navbar-button-new-page-hover: var(--c-nrem-sango-4);

/* la implicita de Default White */

--c-ic-navbar-button-new-page-hover: ;

--c-ic-navbar-button-new-page-vertical-line: red;

--c-ic-navbar-button-new-page-vertical-line: ;

--c-ic-navbar-button-new-page-horizontal-line: var(--c-nremi-vervo-5);

--c-ic-navbar-button-new-page-horizontal-line: ;

--c-bg-navbar-search-form-focus: var(--c-nrem-osto-3);

--c-tx-navbar-search-form-focus: black;

--shadow-box-navbar-search-form-focus:

0 0 4px hsl(from var(--c-ui-accent-color) h s l / 0.22),

0 0px 6px hsl(from var(--c-ui-accent-color) h s l / 0.22),

0 0 6px hsl(from var(--c-ui-accent-color) h s l / 0.22),

0 -3px 10px hsl(from var(--c-ui-accent-color) h s l / 0.22),

0 8px 16px hsl(from var(--c-ui-accent-color) h s l / 0.24);

--c-tx-toolbar-cardlist: var(--c-light-5);

--c-bg-dropdown-menu: hsl(0, 0%, 98%);

--c-bg-dropdown-menu-focus: var(--c-light-4);

--c-tx-dropdown-menu: var(--c-tx-normal);

--c-tx-dropdown-menu-activated: var(--c-ui-accent-color-selectable);

--c-border-dropdown-menu-activated: var(--c-ui-accent-color-selectable);

--border-dropdown-menu-activated: 2px solid var(--c-border-dropdown-menu-activated);

--c-bg-page-manu: hsl(0 0% 93% / 35%);

--c-bg-dropdown-button-focus: var(--c-light-4);

--c-tx-dropdown-button-text: var(--c-dark-5);

--c-tx-dropdown-button-icon: var(--c-dark-1);

--c-bg-popup-menu: black;

--c-tx-popup-menu-item: white;

--border-popup-menu-item: 1px solid hsl(0 0 10% / 35%);

--c-bg-bottom-related: --var(--c-bg-bottom);

/* --c-bg-bottom-related-toolbar: hsl(0, 0%, 77%); */

--c-bg-bottom-related-toolbar: --var(--c-bg-bottom);

--c-tx-related-search-form: black;

--c-bg-related-search-form-focus: white;

--c-bg-related-search-form-focus: hsl(0, 0%, 95%);

--border-related-search-form-focus: none;

--shadow-related-search-form-focus: ;

--shadow-box-page-list-search:

0 0 4px rgba(0, 0, 0, 0.12),

0 0 6px rgba(0, 0, 0, 0.12),

0 0 7px rgba(0, 0, 0, 0.12),

0 8px 16px rgba(0, 0, 0, 0.14),

0 8px 16px rgba(0, 0, 0, 0.14);

--shadow-box-page-list-search-focus:

0 0 4px hsl(from var(--ui-accent-color) h s l / 0.12),

0 0 6px hsl(from var(--ui-accent-color) h s l / 0.12),

0 0 7px hsl(from var(--ui-accent-color) h s l / 0.12),

0 8px 16px hsl(from var(--ui-accent-color) h s l / 0.14),

0 8px 16px hsl(from var(--ui-accent-color) h s l / 0.14);

--shadow-box-page-list-search-focus: var(--shadow-box-navbar-search-form-focus);

--c-bg-statusbar-page-title: var(--c-purple-1);

--c-tx-statusbar-page-title: var(--c-light-3);

--c-bg-statusbar-page-status-sync-confirmed: var(--c-green-4);

--c-fg-statusbar-page-status-sync-confirmed: var(--c-light-1);

--c-bg-statusbar-page-status-error: var(--c-red-1);

--c-tx-statusbar-page-status-error: var(--c-light-6);

--c-bg-statusbar-page-list-status: var(--c-purple-1);

--c-tx-statusbar-page-list-status: var(--c-light-3);

--c-bg-statusbar-project-status-private: var(--c-blue-4);

--c-ic-statusbar-project-status-private: var(--c-light-1);

--c-bg-statusbar-project-plan-badge: var(--c-bg-navbar);

--c-tx-statusbar-project-plan-badge: var(--c-tx-navbar-project-name);

--c-tx-normal-nofocus: black;

/* --c-bg-bottom: var(--c-nrem-osto-3); */

--c-bg-navbar: hsla(0, 0%, 93%, 1.5%);

--c-bg-navbar: hsla(0, 0%, 93%, 32.5%);

--c-tx-navbar-project-name: var(--c-sango-1);

--c-bg-navbar-search-form: hsl(from var(--c-nrem-osto-3) h s l /32.5%);

--c-tx-normal: var(--c-tx-normal-nofocus);

--c-tx-dropdown-menu: var(--c-tx-normal-nofocus);

--c-tx-card-title: var(--c-tx-normal-nofocus);

--c-tx-card-description: var(--c-tx-normal-nofocus);

--shadow-box-page-list-search:

0 0 4px rgba(0, 0, 0, 0.12),

0 0 6px rgba(0, 0, 0, 0.12),

0 8px 16px rgba(0, 0, 0, 0.14);

}

}

}