Something went wrong. Try again.
Training wheels for the terminal
Something went wrong. Try again.
5.1 kB · 176 lines
CSS
at main
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177@import "./fonts.css";@import "tailwindcss";@plugin "tailwindcss-react-aria-components";@plugin "@tailwindcss/typography";@config "./tailwind.config.js";
@import "@catppuccin/tailwindcss/mocha.css";@import "@catppuccin/highlightjs/css/catppuccin-mocha.css";
#root { height: 100vh; width: 100vw; overflow: hidden; display: flex; flex-direction: column;}
/* Themed scrollbars (Firefox) */* { scrollbar-color: var(--color-ctp-surface1) var(--color-ctp-mantle); scrollbar-width: thin;}
/* Themed scrollbars (Chromium/WebKit) */*::-webkit-scrollbar { width: 12px; height: 12px;}
*::-webkit-scrollbar-track { background-color: var(--color-ctp-mantle);}
*::-webkit-scrollbar-thumb { background-color: var(--color-ctp-surface1); border: 3px solid var(--color-ctp-mantle); border-radius: 9999px;}
*::-webkit-scrollbar-thumb:hover { background-color: var(--color-ctp-overlay0);}
@theme { --color-terminal-background: #281f2b; --default-font-family: "JetBrains Mono", monospace; --font-serif: "Playfair Display", serif;}
@theme inline { --color-hue-100: var(--hue-100); --color-hue-300: var(--hue-300); --color-hue: var(--hue-base); --color-hue-700: var(--hue-700);}
@layer base { .hue-rosewater { --hue-100: var(--catppuccin-color-rosewater-100); --hue-base: var(--catppuccin-color-rosewater); --hue-300: var(--catppuccin-color-rosewater-300); --hue-700: var(--catppuccin-color-rosewater-700); } .hue-flamingo { --hue-100: var(--catppuccin-color-flamingo-100); --hue-base: var(--catppuccin-color-flamingo); --hue-300: var(--catppuccin-color-flamingo-300); --hue-700: var(--catppuccin-color-flamingo-700); } .hue-pink { --hue-100: var(--catppuccin-color-pink-100); --hue-base: var(--catppuccin-color-pink); --hue-300: var(--catppuccin-color-pink-300); --hue-700: var(--catppuccin-color-pink-700); } .hue-mauve { --hue-100: var(--catppuccin-color-mauve-100); --hue-base: var(--catppuccin-color-mauve); --hue-300: var(--catppuccin-color-mauve-300); --hue-700: var(--catppuccin-color-mauve-700); } .hue-red { --hue-100: var(--catppuccin-color-red-100); --hue-base: var(--catppuccin-color-red); --hue-300: var(--catppuccin-color-red-300); --hue-700: var(--catppuccin-color-red-700); } .hue-maroon { --hue-100: var(--catppuccin-color-maroon-100); --hue-base: var(--catppuccin-color-maroon); --hue-300: var(--catppuccin-color-maroon-300); --hue-700: var(--catppuccin-color-maroon-700); } .hue-peach { --hue-100: var(--catppuccin-color-peach-100); --hue-base: var(--catppuccin-color-peach); --hue-300: var(--catppuccin-color-peach-300); --hue-700: var(--catppuccin-color-peach-700); } .hue-yellow { --hue-100: var(--catppuccin-color-yellow-100); --hue-base: var(--catppuccin-color-yellow); --hue-300: var(--catppuccin-color-yellow-300); --hue-700: var(--catppuccin-color-yellow-700); } .hue-green { --hue-100: var(--catppuccin-color-green-100); --hue-base: var(--catppuccin-color-green); --hue-300: var(--catppuccin-color-green-300); --hue-700: var(--catppuccin-color-green-700); } .hue-teal { --hue-100: var(--catppuccin-color-teal-100); --hue-base: var(--catppuccin-color-teal); --hue-300: var(--catppuccin-color-teal-300); --hue-700: var(--catppuccin-color-teal-700); } .hue-sky { --hue-100: var(--catppuccin-color-sky-100); --hue-base: var(--catppuccin-color-sky); --hue-300: var(--catppuccin-color-sky-300); --hue-700: var(--catppuccin-color-sky-700); } .hue-sapphire { --hue-100: var(--catppuccin-color-sapphire-100); --hue-base: var(--catppuccin-color-sapphire); --hue-300: var(--catppuccin-color-sapphire-300); --hue-700: var(--catppuccin-color-sapphire-700); } .hue-blue { --hue-100: var(--catppuccin-color-blue-100); --hue-base: var(--catppuccin-color-blue); --hue-300: var(--catppuccin-color-blue-300); --hue-700: var(--catppuccin-color-blue-700); } .hue-lavender { --hue-100: var(--catppuccin-color-lavender-100); --hue-base: var(--catppuccin-color-lavender); --hue-300: var(--catppuccin-color-lavender-300); --hue-700: var(--catppuccin-color-lavender-700); }}
@layer components { /* Use the theme serif font as the copy font for all prose content */ .prose { font-family: var(--font-serif); }
.prose p { font-size: 18px; }
/* Remove default open/close quote pseudo-elements added by @tailwindcss/typography */ .prose blockquote { quotes: none; } .prose blockquote p:first-of-type::before, .prose :where(blockquote p:first-of-type)::before { content: none !important; } .prose blockquote p:last-of-type::after, .prose :where(blockquote p:last-of-type)::after { content: none !important; }
.prose code::after, .prose code::before { display: none !important; }
.prose code:not(.not-prose) { @apply px-2 py-1 rounded border border-ctp-mauve-900/50 bg-ctp-surface0/70 text-nowrap; font-weight: normal !important; }}