vitepress-theme-tui
Version:
A terminal UI theme for VitePress
359 lines (308 loc) • 17.1 kB
CSS
.tui-theme-default {
--vp-c-brand-1: #047857;
--vp-c-brand-2: #27272a;
--vp-c-brand-3: #3f3f46;
--vp-button-brand-bg: #047857;
--vp-button-brand-hover-bg: #065f46;
--vp-button-brand-active-bg: #064e3b;
--vp-button-brand-text: #f4f4f5;
--vp-button-brand-hover-text: #f4f4f5;
--vp-c-bg: #fff;
--vp-sidebar-bg-color: #fafafa;
--vp-c-text-1: #18181b;
--vp-c-text-2: #27272a;
--vp-c-text-3: #52525b;
}
.dark.tui-theme-default {
--vp-c-brand-1: #6ee7b7;
--vp-c-brand-2: #e4e4e7;
--vp-c-brand-3: #d4d4d8;
--vp-button-brand-bg: #6ee7b7;
--vp-button-brand-hover-bg: #34d399;
--vp-button-brand-active-bg: #10b981;
--vp-button-brand-text: #18181b;
--vp-button-brand-hover-text: #18181b;
--vp-c-bg: #18181b;
--vp-sidebar-bg-color: #27272a;
--vp-c-text-1: #f4f4f5;
--vp-c-text-2: #e4e4e7;
--vp-c-text-3: #a1a1aa;
}
@layer theme {
.tui-theme-default {
--vp-tui-font-family: 'IBM Plex Mono', monospace;
--vp-tui-c-bg: var(--vp-c-bg);
--vp-tui-border-color: #27272a;
--vp-tui-border-radius: 0;
--vp-tui-border-width: 2px;
--vp-tui-shadow: none;
--vp-tui-table-bg: #ffffff;
--vp-tui-table-border-width: var(--vp-tui-border-width);
--vp-tui-table-border-color: #27272a;
--vp-tui-table-border-radius: var(--vp-tui-border-radius);
--vp-tui-table-row-alt-bg: #d4d4d8;
--vp-tui-table-header-bg: #27272a;
--vp-tui-table-header-fg: #f4f4f5;
--vp-tui-table-header-border-color: #d4d4d8;
--vp-tui-sidebar-bg: var(--vp-c-bg);
--vp-tui-sidebar-border-color: var(--vp-tui-border-color);
--vp-tui-sidebar-border-width: var(--vp-tui-border-width);
--vp-tui-sidebar-item-active-fg: var(--vp-c-brand-1);
--vp-tui-sidebar-item-active-font-weight: 700;
--vp-tui-sidebar-item-active-indicator-bg: #27272a;
--vp-tui-sidebar-item-hover-bg: #27272a;
--vp-tui-sidebar-item-hover-fg: #f4f4f5;
--vp-tui-h2-border-top: 1px dashed var(--vp-tui-border-color);
--vp-tui-hr-border-top: 1px dashed var(--vp-tui-border-color);
--vp-tui-link-fg: #52525b;
--vp-tui-link-active-fg: #18181b;
--vp-tui-link-visited-fg: #c026d3;
--vp-tui-link-border-color: #52525b;
--vp-tui-link-hover-fg: #f4f4f5;
--vp-tui-link-hover-bg: #27272a;
--vp-tui-link-hover-border-color: #d4d4d8;
--vp-tui-inline-code-bg: #f4f4f5;
--vp-tui-inline-code-fg: #27272a;
--vp-tui-inline-code-border-width: 1px;
--vp-tui-inline-code-border-style: solid;
--vp-tui-inline-code-border-color: #d4d4d8;
--vp-tui-inline-code-border-radius: 0;
--vp-tui-blockquote-border-color: var(--vp-tui-border-color);
--vp-tui-blockquote-border-style: dashed;
--vp-tui-blockquote-bg: var(--vp-tui-c-bg);
--vp-tui-blockquote-fg: inherit;
--vp-tui-aside-border-color: var(--vp-tui-border-color);
--vp-tui-aside-border-width: 1px;
--vp-tui-aside-border-style: dashed;
--vp-tui-aside-item-active-bg: color-mix(in srgb, var(--vp-c-brand-1) 20%, transparent);
--vp-tui-aside-item-hover-bg: #27272a;
--vp-tui-aside-item-hover-fg: #f4f4f5;
--vp-tui-code-group-border-style: solid;
--vp-tui-code-group-border-width: 2px;
--vp-tui-code-group-border-color: #18181b;
--vp-tui-code-group-border-radius: var(--vp-tui-border-radius);
--vp-tui-code-group-standalone-border-radius: var(--vp-tui-border-radius);
--vp-tui-code-group-bg: transparent;
--vp-tui-code-group-tabs-border-style: solid;
--vp-tui-code-group-tabs-border-width: 2px;
--vp-tui-code-group-tabs-border-radius: var(--vp-tui-border-radius);
--vp-tui-code-group-tabs-bg: #f4f4f5;
--vp-tui-code-group-tabs-border-color: #18181b;
--vp-tui-code-group-tabs-label-active-bg: #18181b;
--vp-tui-code-group-tabs-label-active-fg: #f4f4f5;
--vp-tui-code-group-tabs-label-active-border-radius: var(--vp-tui-border-radius);
--vp-tui-code-copy-bg: #f4f4f5;
--vp-tui-code-copy-bg-hover: #e4e4e7;
--vp-tui-code-copy-border-radius: 4px;
--vp-tui-code-copy-border-color: #27272a;
--vp-tui-code-copy-border-color-hover: #3f3f46;
--vp-tui-code-copy-border-width: 1px;
--vp-tui-hero-button-border-radius: var(--vp-tui-border-radius);
--vp-tui-hero-feature-border-radius: var(--vp-tui-border-radius);
--vp-tui-hero-feature-bg: var(--vp-tui-c-bg);
--vp-tui-hero-feature-fg: #27272a;
--vp-tui-hero-feature-border-width: var(--vp-tui-border-width);
--vp-tui-hero-feature-border-color: var(--vp-tui-border-color);
--vp-tui-hero-feature-title-bg: var(--vp-tui-c-bg);
--vp-tui-custom-block-info-accent: #1e40af;
--vp-tui-custom-block-info-accent-fg: #dbeafe;
--vp-tui-custom-block-info-border: var(--vp-tui-custom-block-info-accent);
--vp-tui-custom-block-info-bg: var(--vp-tui-c-bg);
--vp-tui-custom-block-info-fg: #1e3a8a;
--vp-tui-custom-block-info-title-bg: var(--vp-tui-custom-block-info-accent);
--vp-tui-custom-block-info-title-fg: var(--vp-tui-custom-block-info-accent-fg);
--vp-tui-custom-block-note-accent: #075985;
--vp-tui-custom-block-note-accent-fg: #e0f2fe;
--vp-tui-custom-block-note-border: var(--vp-tui-custom-block-note-accent);
--vp-tui-custom-block-note-bg: var(--vp-tui-c-bg);
--vp-tui-custom-block-note-fg: #0c4a6e;
--vp-tui-custom-block-note-title-bg: var(--vp-tui-custom-block-note-accent);
--vp-tui-custom-block-note-title-fg: var(--vp-tui-custom-block-note-accent-fg);
--vp-tui-custom-block-tip-accent: #065f46;
--vp-tui-custom-block-tip-accent-fg: #d1fae5;
--vp-tui-custom-block-tip-border: var(--vp-tui-custom-block-tip-accent);
--vp-tui-custom-block-tip-bg: var(--vp-tui-c-bg);
--vp-tui-custom-block-tip-fg: #064e3b;
--vp-tui-custom-block-tip-title-bg: var(--vp-tui-custom-block-tip-accent);
--vp-tui-custom-block-tip-title-fg: var(--vp-tui-custom-block-tip-accent-fg);
--vp-tui-custom-block-important-accent: #5b21b6;
--vp-tui-custom-block-important-accent-fg: #ede9fe;
--vp-tui-custom-block-important-border: var(--vp-tui-custom-block-important-accent);
--vp-tui-custom-block-important-bg: var(--vp-tui-c-bg);
--vp-tui-custom-block-important-fg: #4c1d95;
--vp-tui-custom-block-important-title-bg: var(--vp-tui-custom-block-important-accent);
--vp-tui-custom-block-important-title-fg: var(--vp-tui-custom-block-important-accent-fg);
--vp-tui-custom-block-warning-accent: #92400e;
--vp-tui-custom-block-warning-accent-fg: #fef3c7;
--vp-tui-custom-block-warning-border: var(--vp-tui-custom-block-warning-accent);
--vp-tui-custom-block-warning-bg: var(--vp-tui-c-bg);
--vp-tui-custom-block-warning-fg: #78350f;
--vp-tui-custom-block-warning-title-bg: var(--vp-tui-custom-block-warning-accent);
--vp-tui-custom-block-warning-title-fg: var(--vp-tui-custom-block-warning-accent-fg);
--vp-tui-custom-block-danger-accent: #991b1b;
--vp-tui-custom-block-danger-accent-fg: #fee2e2;
--vp-tui-custom-block-danger-border: var(--vp-tui-custom-block-danger-accent);
--vp-tui-custom-block-danger-bg: var(--vp-tui-c-bg);
--vp-tui-custom-block-danger-fg: #7f1d1d;
--vp-tui-custom-block-danger-title-bg: var(--vp-tui-custom-block-danger-accent);
--vp-tui-custom-block-danger-title-fg: var(--vp-tui-custom-block-danger-accent-fg);
--vp-tui-custom-block-caution-accent: #9d174d;
--vp-tui-custom-block-caution-accent-fg: #fce7f3;
--vp-tui-custom-block-caution-border: var(--vp-tui-custom-block-caution-accent);
--vp-tui-custom-block-caution-bg: var(--vp-tui-c-bg);
--vp-tui-custom-block-caution-fg: #831843;
--vp-tui-custom-block-caution-title-bg: var(--vp-tui-custom-block-caution-accent);
--vp-tui-custom-block-caution-title-fg: var(--vp-tui-custom-block-caution-accent-fg);
--vp-tui-custom-block-details-accent: #27272a;
--vp-tui-custom-block-details-accent-fg: #ffffff;
--vp-tui-custom-block-details-border: var(--vp-tui-custom-block-details-accent);
--vp-tui-custom-block-details-bg: var(--vp-tui-custom-block-details-accent-fg);
--vp-tui-custom-block-details-fg: #18181b;
--vp-tui-custom-block-details-summary-bg: var(--vp-tui-custom-block-details-accent-fg);
--vp-tui-timeline-primary-axis-color: #047857;
--vp-tui-timeline-primary-marker-color: #047857;
--vp-tui-timeline-primary-content-bg: var(--vp-tui-c-bg);
--vp-tui-timeline-primary-content-fg: inherit;
--vp-tui-timeline-primary-content-border-color: #047857;
--vp-tui-timeline-info-axis-color: var(--vp-tui-custom-block-info-border);
--vp-tui-timeline-info-marker-color: var(--vp-tui-custom-block-info-border);
--vp-tui-timeline-info-content-bg: var(--vp-tui-c-bg);
--vp-tui-timeline-info-content-fg: var(--vp-tui-custom-block-info-fg);
--vp-tui-timeline-info-content-border-color: var(--vp-tui-custom-block-info-border);
--vp-tui-timeline-warning-axis-color: var(--vp-tui-custom-block-warning-border);
--vp-tui-timeline-warning-marker-color: var(--vp-tui-custom-block-warning-border);
--vp-tui-timeline-warning-content-bg: var(--vp-tui-c-bg);
--vp-tui-timeline-warning-content-fg: var(--vp-tui-custom-block-warning-fg);
--vp-tui-timeline-warning-content-border-color: var(--vp-tui-custom-block-warning-border);
--vp-tui-timeline-danger-axis-color: var(--vp-tui-custom-block-danger-border);
--vp-tui-timeline-danger-marker-color: var(--vp-tui-custom-block-danger-border);
--vp-tui-timeline-danger-content-bg: var(--vp-tui-c-bg);
--vp-tui-timeline-danger-content-fg: var(--vp-tui-custom-block-danger-fg);
--vp-tui-timeline-danger-content-border-color: var(--vp-tui-custom-block-danger-border);
}
.dark.tui-theme-default {
--vp-tui-font-family: 'IBM Plex Mono', monospace;
--vp-tui-c-bg: var(--vp-c-bg);
--vp-tui-border-color: #e4e4e7;
--vp-tui-border-radius: 0;
--vp-tui-border-width: 2px;
--vp-tui-shadow: none;
--vp-tui-table-bg: #000000;
--vp-tui-table-border-color: #e4e4e7;
--vp-tui-table-row-alt-bg: #27272a;
--vp-tui-table-header-bg: #e4e4e7;
--vp-tui-table-header-fg: #18181b;
--vp-tui-table-header-border-color: #27272a;
--vp-tui-sidebar-item-active-indicator-bg: #e4e4e7;
--vp-tui-sidebar-item-hover-bg: #e4e4e7;
--vp-tui-sidebar-item-hover-fg: #18181b;
--vp-tui-link-fg: #a1a1aa;
--vp-tui-link-active-fg: #e4e4e7;
--vp-tui-link-visited-fg: #c084fc;
--vp-tui-link-border-color: #a1a1aa;
--vp-tui-link-hover-fg: #27272a;
--vp-tui-link-hover-bg: #f4f4f5;
--vp-tui-link-hover-border-color: #52525b;
--vp-tui-inline-code-bg: #27272a;
--vp-tui-inline-code-fg: #f4f4f5;
--vp-tui-inline-code-border-color: #52525b;
--vp-tui-blockquote-border-color: var(--vp-tui-border-color);
--vp-tui-blockquote-border-style: dashed;
--vp-tui-blockquote-bg: var(--vp-tui-c-bg);
--vp-tui-blockquote-fg: inherit;
--vp-tui-aside-border-color: var(--vp-tui-border-color);
--vp-tui-aside-border-width: 1px;
--vp-tui-aside-border-style: dashed;
--vp-tui-aside-item-active-bg: color-mix(in srgb, var(--vp-c-brand-1) 20%, transparent);
--vp-tui-aside-item-hover-bg: #e4e4e7;
--vp-tui-aside-item-hover-fg: #18181b;
--vp-tui-code-group-border-color: #d4d4d8;
--vp-tui-code-group-border-radius: var(--vp-tui-border-radius);
--vp-tui-code-group-standalone-border-radius: var(--vp-tui-border-radius);
--vp-tui-code-group-tabs-bg: #27272a;
--vp-tui-code-group-tabs-border-color: var(--vp-tui-border-color);
--vp-tui-code-group-tabs-label-active-bg: #e4e4e7;
--vp-tui-code-group-tabs-label-active-fg: #09090b;
--vp-tui-code-group-tabs-label-active-border-radius: var(--vp-tui-border-radius);
--vp-tui-code-copy-bg: #27272a;
--vp-tui-code-copy-bg-hover: #3f3f46;
--vp-tui-code-copy-border-color: #71717a;
--vp-tui-code-copy-border-color-hover: #a1a1aa;
--vp-tui-hero-feature-fg: #e4e4e7;
--vp-tui-custom-block-info-accent: #60a5fa;
--vp-tui-custom-block-info-accent-fg: #1e3a8a;
--vp-tui-custom-block-info-border: var(--vp-tui-custom-block-info-accent);
--vp-tui-custom-block-info-bg: var(--vp-tui-c-bg);
--vp-tui-custom-block-info-fg: #dbeafe;
--vp-tui-custom-block-info-title-bg: var(--vp-tui-custom-block-info-accent);
--vp-tui-custom-block-info-title-fg: var(--vp-tui-custom-block-info-accent-fg);
--vp-tui-custom-block-note-accent: #38bdf8;
--vp-tui-custom-block-note-accent-fg: #0c4a6e;
--vp-tui-custom-block-note-border: var(--vp-tui-custom-block-note-accent);
--vp-tui-custom-block-note-bg: var(--vp-tui-c-bg);
--vp-tui-custom-block-note-fg: #e0f2fe;
--vp-tui-custom-block-note-title-bg: var(--vp-tui-custom-block-note-accent);
--vp-tui-custom-block-note-title-fg: var(--vp-tui-custom-block-note-accent-fg);
--vp-tui-custom-block-tip-accent: #34d399;
--vp-tui-custom-block-tip-accent-fg: #064e3b;
--vp-tui-custom-block-tip-border: var(--vp-tui-custom-block-tip-accent);
--vp-tui-custom-block-tip-bg: var(--vp-tui-c-bg);
--vp-tui-custom-block-tip-fg: #d1fae5;
--vp-tui-custom-block-tip-title-bg: var(--vp-tui-custom-block-tip-accent);
--vp-tui-custom-block-tip-title-fg: var(--vp-tui-custom-block-tip-accent-fg);
--vp-tui-custom-block-important-accent: #a78bfa;
--vp-tui-custom-block-important-accent-fg: #4c1d95;
--vp-tui-custom-block-important-border: var(--vp-tui-custom-block-important-accent);
--vp-tui-custom-block-important-bg: var(--vp-tui-c-bg);
--vp-tui-custom-block-important-fg: #ede9fe;
--vp-tui-custom-block-important-title-bg: var(--vp-tui-custom-block-important-accent);
--vp-tui-custom-block-important-title-fg: var(--vp-tui-custom-block-important-accent-fg);
--vp-tui-custom-block-warning-accent: #fbbf24;
--vp-tui-custom-block-warning-accent-fg: #78350f;
--vp-tui-custom-block-warning-border: var(--vp-tui-custom-block-warning-accent);
--vp-tui-custom-block-warning-bg: var(--vp-tui-c-bg);
--vp-tui-custom-block-warning-fg: #fef3c7;
--vp-tui-custom-block-warning-title-bg: var(--vp-tui-custom-block-warning-accent);
--vp-tui-custom-block-warning-title-fg: var(--vp-tui-custom-block-warning-accent-fg);
--vp-tui-custom-block-danger-accent: #f87171;
--vp-tui-custom-block-danger-accent-fg: #7f1d1d;
--vp-tui-custom-block-danger-border: var(--vp-tui-custom-block-danger-accent);
--vp-tui-custom-block-danger-bg: var(--vp-tui-c-bg);
--vp-tui-custom-block-danger-fg: #fee2e2;
--vp-tui-custom-block-danger-title-bg: var(--vp-tui-custom-block-danger-accent);
--vp-tui-custom-block-danger-title-fg: var(--vp-tui-custom-block-danger-accent-fg);
--vp-tui-custom-block-caution-accent: #f472b6;
--vp-tui-custom-block-caution-accent-fg: #831843;
--vp-tui-custom-block-caution-border: var(--vp-tui-custom-block-caution-accent);
--vp-tui-custom-block-caution-bg: var(--vp-tui-c-bg);
--vp-tui-custom-block-caution-fg: #fce7f3;
--vp-tui-custom-block-caution-title-bg: var(--vp-tui-custom-block-caution-accent);
--vp-tui-custom-block-caution-title-fg: var(--vp-tui-custom-block-caution-accent-fg);
--vp-tui-custom-block-details-accent: #d4d4d8;
--vp-tui-custom-block-details-accent-fg: #18181b;
--vp-tui-custom-block-details-border: var(--vp-tui-custom-block-details-accent);
--vp-tui-custom-block-details-bg: var(--vp-tui-custom-block-details-accent-fg);
--vp-tui-custom-block-details-fg: #f4f4f5;
--vp-tui-custom-block-details-summary-bg: var(--vp-tui-custom-block-details-accent-fg);
--vp-tui-timeline-primary-axis-color: var(--vp-c-brand-1);
--vp-tui-timeline-primary-marker-color: var(--vp-c-brand-1);
--vp-tui-timeline-primary-content-bg: var(--vp-tui-c-bg);
--vp-tui-timeline-primary-content-fg: inherit;
--vp-tui-timeline-primary-content-border-color: var(--vp-c-brand-1);
--vp-tui-timeline-info-axis-color: var(--vp-tui-custom-block-info-border);
--vp-tui-timeline-info-marker-color: var(--vp-tui-custom-block-info-border);
--vp-tui-timeline-info-content-bg: var(--vp-tui-c-bg);
--vp-tui-timeline-info-content-fg: var(--vp-tui-custom-block-info-fg);
--vp-tui-timeline-info-content-border-color: var(--vp-tui-custom-block-info-border);
--vp-tui-timeline-warning-axis-color: var(--vp-tui-custom-block-warning-border);
--vp-tui-timeline-warning-marker-color: var(--vp-tui-custom-block-warning-border);
--vp-tui-timeline-warning-content-bg: var(--vp-tui-c-bg);
--vp-tui-timeline-warning-content-fg: var(--vp-tui-custom-block-warning-fg);
--vp-tui-timeline-warning-content-border-color: var(--vp-tui-custom-block-warning-border);
--vp-tui-timeline-danger-axis-color: var(--vp-tui-custom-block-danger-border);
--vp-tui-timeline-danger-marker-color: var(--vp-tui-custom-block-danger-border);
--vp-tui-timeline-danger-content-bg: var(--vp-tui-c-bg);
--vp-tui-timeline-danger-content-fg: var(--vp-tui-custom-block-danger-fg);
--vp-tui-timeline-danger-content-border-color: var(--vp-tui-custom-block-danger-border);
}
}