From 848d2b02064e2454edb85cd016e7b6840ab77e36 Mon Sep 17 00:00:00 2001 From: Silas Bartha Date: Sun, 9 Feb 2025 14:18:24 -0500 Subject: react three fiber, drei, sass --- src/style.scss | 95 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 95 insertions(+) create mode 100644 src/style.scss (limited to 'src/style.scss') diff --git a/src/style.scss b/src/style.scss new file mode 100644 index 0000000..1bc4d97 --- /dev/null +++ b/src/style.scss @@ -0,0 +1,95 @@ +@use "everforest.module"; + +/// Stole this from Stack Overflow (https://stackoverflow.com/a/54702294) {{{ + +.rainbow_text_animated { + background: linear-gradient(to right, everforest.$red, everforest.$orange, everforest.$yellow, everforest.$green, everforest.$blue, everforest.$purple); + -webkit-background-clip: text; + background-clip: text; + color: transparent; + animation: rainbow_animation 1s ease-in-out infinite; + background-size: 600% 100%; +} + +@keyframes rainbow_animation { + 0%,100% { + background-position: 0 0; + } + + 50% { + background-position: 100% 0; + } +} + +/// }}} + +html, +body, +#root { + height: 100%; + margin: unset; +} + +h1 { + margin: 0; +} + +html { + background-color: everforest.$bg0; + height: 100%; +} + +/* body { */ +/* color: everforest.$fg; */ +/* background-color: everforest.$bg1; */ +/* margin: 0 auto; */ +/* max-width: 800px; */ +/* padding: 10px; */ +/* min-height: 100%; */ +/* } */ + +a { + color: everforest.$blue; +} + +img { + max-width: 100%; + max-height: 720px; +} + +pre { + padding: 1rem; + overflow: auto; +} +/* The line numbers already provide some kind of left/right padding */ +pre[data-linenos] { + padding: 1rem 0; +} +pre table td { + padding: 0; +} +/* The line number cells */ +pre table td:nth-of-type(1) { + text-align: center; + user-select: none; +} +pre mark { + /* If you want your highlights to take the full width */ + display: block; + /* The default background colour of a mark is bright yellow */ + background-color: rgba(254, 252, 232, 0.9); +} +pre table { + width: 100%; + border-collapse: collapse; +} + +.wip-indicator { + color: everforest.$yellow; +} + +.langcolor { + &-rust { + color: everforest.$orange; + } +} -- cgit v1.2.3