diff --git a/static/scss/main.scss b/static/scss/main.scss index 32ce10a..8946bad 100644 --- a/static/scss/main.scss +++ b/static/scss/main.scss @@ -1,13 +1,33 @@ +$base: #1e1e2e; +$text: #cdd6f4; + +$mantle: #181825; +$crust: #11111b; + +$overlay0: #6c7086; +$overlay1: #7f849c; +$overlay2: #9399b2; + +$surface0: #313244; +$surface1: #45475a; +$surface2: #585b70; + +$subtext0: #a6adc8; +$subtext1: #bac2de; + +$blue: #89b4fa; + + body { - background-color: #1e1e2e; + background-color: $base; font-family: Pixeloid; - color: #cdd6f4; + color: $text; } a { color: unset; text-decoration: underline; - text-decoration-color: #89b4fa; + text-decoration-color: $blue; text-underline-offset: 1px; transition: text-underline-offset 0.3s ease; @@ -23,7 +43,22 @@ a { .mono { font-family: "Monocraft", monospace; - color: #9399b2; + background-color: $mantle; + color: $subtext0; + + &:hover { + background-color: $crust; + } +} + +.services { + background-color: $surface0; + border-radius: 8px; + padding: 8px; + + & + & { + margin-top: 16px; + } } @font-face { diff --git a/static/sript/copy-mono.js b/static/sript/copy-mono.js new file mode 100644 index 0000000..37e4692 --- /dev/null +++ b/static/sript/copy-mono.js @@ -0,0 +1,7 @@ +document.addEventListener('DOMContentLoaded', () => { + document.querySelectorAll('.mono').forEach(element => { + element.addEventListener('click', async () => { + await navigator.clipboard.writeText(element.textContent); + }); + }); +}); \ No newline at end of file diff --git a/templates/index.html b/templates/index.html index 0c9eb87..166afdb 100644 --- a/templates/index.html +++ b/templates/index.html @@ -3,7 +3,7 @@