def-peter_obsidian-aera-theme/theme.css
2026-07-16 20:44:46 +08:00

253 lines
7.8 KiB
CSS

/* Aera - A quiet interface for clear thinking. */
.theme-light {
--color-base-00: #f7f8f6;
--color-base-05: #f4f5f3;
--color-base-10: #eff1ef;
--color-base-20: #e8ebe8;
--color-base-25: #dde2de;
--color-base-30: #d1d7d2;
--color-base-35: #c4cbc5;
--color-base-40: #aeb7b0;
--color-base-50: #8b958e;
--color-base-60: #68756d;
--color-base-70: #4e5b53;
--color-base-100: #28302c;
--background-primary: var(--color-base-00);
--background-secondary: var(--color-base-10);
--text-normal: var(--color-base-100);
--text-muted: var(--color-base-60);
--text-faint: var(--color-base-50);
--text-highlight-bg: rgba(191, 168, 68, 0.26);
--accent-h: 152.9;
--accent-s: 28.8%;
--accent-l: 34.7%;
}
.theme-dark {
--color-base-00: #171c19;
--color-base-05: #1a201c;
--color-base-10: #202720;
--color-base-20: #262e29;
--color-base-25: #2d3630;
--color-base-30: #364139;
--color-base-35: #414d45;
--color-base-40: #526058;
--color-base-50: #6d7b72;
--color-base-60: #95a39b;
--color-base-70: #bbc7c0;
--color-base-100: #dce4df;
--background-primary: var(--color-base-00);
--background-secondary: var(--color-base-10);
--text-normal: var(--color-base-100);
--text-muted: var(--color-base-60);
--text-faint: var(--color-base-50);
--text-highlight-bg: rgba(191, 168, 68, 0.28);
--accent-h: 148.6;
--accent-s: 31.1%;
--accent-l: 59%;
}
body {
--font-text-theme: "Avenir Next", Avenir, system-ui, -apple-system,
BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei",
"Noto Sans CJK SC", sans-serif;
--font-monospace-theme: ui-monospace, SFMono-Regular, Consolas,
"Liberation Mono", monospace;
--line-height-normal: 1.8;
--p-spacing: var(--size-4-3);
--heading-spacing: var(--size-4-8);
--bold-modifier: 200;
}
body {
--callout-padding: var(--size-4-3) var(--size-4-4);
--callout-title-padding: 0;
--callout-content-padding: var(--size-4-2) 0 0;
--metadata-gap: var(--size-2-3);
--metadata-property-padding: var(--size-2-3) var(--size-4-2);
--embed-padding: 0 0 0 var(--size-4-4);
--tag-padding-x: var(--size-2-3);
--tag-padding-y: var(--size-2-1);
}
body {
--inline-title-color: var(--text-normal);
--inline-title-font: var(--font-text);
--inline-title-line-height: 1.25;
--inline-title-size: 2em;
--inline-title-weight: 650;
--h1-color: var(--text-normal);
--h2-color: var(--text-normal);
--h3-color: var(--text-normal);
--h4-color: var(--text-normal);
--h5-color: var(--text-normal);
--h6-color: var(--text-muted);
--h1-line-height: 1.28;
--h2-line-height: 1.35;
--h3-line-height: 1.4;
--h4-line-height: 1.45;
--h5-line-height: 1.5;
--h6-line-height: 1.5;
--h1-size: 1.85em;
--h2-size: 1.42em;
--h3-size: 1.16em;
--h4-size: 1.05em;
--h5-size: 1em;
--h6-size: 0.9em;
--h1-weight: 650;
--h2-weight: 650;
--h3-weight: 600;
--h4-weight: 600;
--h5-weight: 600;
--h6-weight: 600;
}
body {
--bold-color: var(--text-normal);
--italic-color: var(--text-normal);
--link-color: var(--text-accent);
--link-color-hover: var(--text-accent-hover);
--link-decoration: none;
--link-decoration-hover: underline;
--link-decoration-thickness: 1px;
--link-weight: 500;
--link-unresolved-color: var(--text-muted);
--link-unresolved-opacity: 1;
--link-unresolved-decoration-style: dotted;
--link-unresolved-decoration-color: var(--text-faint);
--link-external-color: var(--text-accent);
--link-external-color-hover: var(--text-accent-hover);
--link-external-decoration: none;
--link-external-decoration-hover: underline;
}
body {
--list-indent: 2em;
--list-indent-editing: 0.75em;
--list-spacing: var(--size-2-1);
--list-marker-color: var(--text-muted);
--list-marker-color-hover: var(--text-accent);
--list-marker-color-collapsed: var(--text-accent);
--list-bullet-border: 1px solid var(--text-muted);
--list-bullet-radius: 50%;
--list-bullet-size: 5px;
--checkbox-radius: 4px;
--checkbox-size: 16px;
--checkbox-marker-color: var(--text-on-accent);
--checkbox-color: var(--interactive-accent);
--checkbox-color-hover: var(--interactive-accent-hover);
--checkbox-border-color: var(--text-faint);
--checkbox-border-color-hover: var(--text-muted);
--checklist-done-decoration: line-through;
--checklist-done-color: var(--text-faint);
}
body {
--blockquote-background-color: transparent;
--blockquote-border-thickness: 2px;
--blockquote-border-color: var(--text-accent);
--blockquote-font-style: normal;
--blockquote-color: var(--text-muted);
--hr-color: var(--background-modifier-border);
--hr-thickness: 1px;
}
body {
--code-background: var(--background-secondary);
--code-white-space: pre;
--code-size: 0.88em;
--code-normal: var(--text-normal);
--code-comment: var(--text-faint);
--code-function: var(--color-blue);
--code-important: var(--color-orange);
--code-keyword: var(--text-accent);
--code-operator: var(--text-muted);
--code-property: var(--color-cyan);
--code-punctuation: var(--text-muted);
--code-string: var(--color-orange);
--code-tag: var(--color-red);
--code-value: var(--color-purple);
}
/* Obsidian has no code-block border or radius variable. */
.markdown-rendered pre {
border: var(--border-width) solid var(--background-modifier-border);
border-radius: 6px;
}
body {
--callout-border-width: 1px;
--callout-border-opacity: 0.25;
--callout-radius: 6px;
--callout-blend-mode: normal;
--callout-title-size: var(--font-small);
--callout-title-weight: 600;
--callout-content-background: transparent;
}
body {
--table-background: transparent;
--table-border-width: 1px;
--table-border-color: var(--background-modifier-border);
--table-cell-vertical-alignment: top;
--table-white-space: normal;
--table-header-background: var(--background-secondary);
--table-header-background-hover: var(--background-modifier-hover);
--table-header-border-width: 1px;
--table-header-border-color: var(--background-modifier-border);
--table-header-size: var(--font-small);
--table-header-weight: 600;
--table-header-color: var(--text-muted);
--table-line-height: 1.5;
--table-text-size: var(--font-small);
--table-text-color: var(--text-normal);
--table-row-background-hover: var(--background-modifier-hover);
--table-selection-border-color: var(--interactive-accent);
--table-selection-border-width: 1px;
--table-selection-border-radius: 4px;
}
body {
--metadata-background: transparent;
--metadata-border-color: transparent;
--metadata-border-radius: 0;
--metadata-border-width: 0px;
--metadata-divider-color: var(--background-modifier-border);
--metadata-divider-color-hover: var(--background-modifier-border-hover);
--metadata-divider-color-focus: var(--interactive-accent);
--metadata-divider-width: 1px;
--metadata-property-radius: 4px;
--metadata-property-radius-hover: 4px;
--metadata-property-radius-focus: 4px;
--metadata-label-font-size: var(--font-smallest);
--metadata-label-font-weight: 500;
--metadata-label-text-color: var(--text-faint);
--metadata-input-font-size: var(--font-small);
--metadata-input-text-color: var(--text-normal);
--metadata-input-background: transparent;
}
body {
--embed-background: transparent;
--embed-border-start: 2px solid var(--background-modifier-border);
--embed-border-end: 0;
--embed-border-top: 0;
--embed-border-bottom: 0;
--embed-font-style: normal;
--footnote-size: var(--font-smallest);
}
body {
--tag-size: var(--font-smallest);
--tag-color: var(--text-accent);
--tag-color-hover: var(--text-accent-hover);
--tag-decoration: none;
--tag-decoration-hover: none;
--tag-background: var(--background-secondary);
--tag-background-hover: var(--background-modifier-hover);
--tag-border-color: var(--background-modifier-border);
--tag-border-color-hover: var(--background-modifier-border-hover);
--tag-border-width: 1px;
--tag-radius: 4px;
--tag-weight: 500;
}