banteg
60 lines
1.9 KiB
CSS
60 lines
1.9 KiB
CSS
/* Takopi palette */
|
|
:root {
|
|
--takopi-pink: #f4a5b8;
|
|
--takopi-flower: #e87a9f;
|
|
--takopi-teal: #4a9b8e;
|
|
--takopi-teal-bright: #5ab5a6;
|
|
}
|
|
|
|
:root[data-md-color-scheme="default"] {
|
|
--md-primary-fg-color: var(--takopi-flower);
|
|
--md-primary-fg-color--light: var(--takopi-pink);
|
|
--md-primary-fg-color--dark: #d95f86;
|
|
--md-accent-fg-color: var(--takopi-teal);
|
|
--md-accent-fg-color--transparent: rgba(74, 155, 142, 0.12);
|
|
--md-typeset-a-color: var(--takopi-teal);
|
|
--md-default-bg-color: #fffaf7;
|
|
--md-code-bg-color: rgba(244, 165, 184, 0.1);
|
|
}
|
|
|
|
:root[data-md-color-scheme="slate"] {
|
|
--md-primary-fg-color: var(--takopi-pink);
|
|
--md-primary-fg-color--light: #f7b9c8;
|
|
--md-primary-fg-color--dark: var(--takopi-flower);
|
|
--md-accent-fg-color: var(--takopi-teal-bright);
|
|
--md-accent-fg-color--transparent: rgba(90, 181, 166, 0.12);
|
|
--md-typeset-a-color: var(--takopi-teal-bright);
|
|
--md-code-bg-color: rgba(244, 165, 184, 0.12);
|
|
}
|
|
|
|
/* Warm bokeh-ish background */
|
|
:root[data-md-color-scheme="default"] body {
|
|
background:
|
|
radial-gradient(1100px circle at 12% 6%, rgba(244, 165, 184, 0.3), transparent 55%),
|
|
radial-gradient(900px circle at 88% 0%, rgba(74, 155, 142, 0.22), transparent 55%),
|
|
radial-gradient(1000px circle at 45% 95%, rgba(255, 230, 199, 0.55), transparent 60%),
|
|
var(--md-default-bg-color);
|
|
}
|
|
|
|
:root[data-md-color-scheme="slate"] body {
|
|
background:
|
|
radial-gradient(900px circle at 12% 0%, rgba(244, 165, 184, 0.12), transparent 55%),
|
|
radial-gradient(900px circle at 85% 0%, rgba(90, 181, 166, 0.1), transparent 55%),
|
|
radial-gradient(1000px circle at 50% 100%, rgba(255, 230, 199, 0.06), transparent 60%),
|
|
var(--md-default-bg-color);
|
|
}
|
|
|
|
/* Softer shapes */
|
|
.md-typeset .admonition,
|
|
.md-typeset details {
|
|
border-radius: 12px;
|
|
}
|
|
|
|
.md-typeset .md-button {
|
|
border-radius: 999px;
|
|
}
|
|
|
|
::selection {
|
|
background: rgba(232, 122, 159, 0.35);
|
|
}
|