From 01416bddf50b93b3fe4f3165a54500e4f59ad155 Mon Sep 17 00:00:00 2001 From: vaporvee Date: Tue, 13 Feb 2024 11:11:38 +0100 Subject: [PATCH] added accent color in more places --- src/layouts/Layout.astro | 6 ++++++ src/styles/_var.scss | 33 +++++++-------------------------- src/styles/main.scss | 32 ++++++++++++++++++++++++++++++++ 3 files changed, 45 insertions(+), 26 deletions(-) diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index 7b19d97..86b96a6 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -9,6 +9,10 @@ const { description } = Astro.props; import "../styles/main.scss"; import "../styles/callout.scss"; +import styles from "../styles/_var.scss"; +const accentColorMatch = styles.match(/accentColor: ([^;]+)/); +const accentColor = accentColorMatch ? accentColorMatch[1] : ""; + import Navbar from "../components/Navbar.astro"; import Footer from "../components/Footer.astro"; @@ -20,6 +24,7 @@ import { ViewTransitions } from "astro:transitions"; + @@ -29,6 +34,7 @@ import { ViewTransitions } from "astro:transitions"; +
diff --git a/src/styles/_var.scss b/src/styles/_var.scss index 67dc0a4..ba41ad9 100644 --- a/src/styles/_var.scss +++ b/src/styles/_var.scss @@ -1,28 +1,9 @@ -@font-face { - font-family: 'Tanker-Regular'; - src: url('/fonts/Tanker-Regular.ttf') format('truetype'); - font-weight: 400; - font-display: swap; - font-style: normal; -} +$primary: #1c1427; +$accent: #7eca9c; +$link: #ccffbd; +$highlight-primary: #40394a; -@font-face { - font-family: 'Satoshi-Regular'; - src: url('/fonts/Satoshi-Regular.ttf') format('truetype'); - font-weight: 400; - font-display: swap; - font-style: normal; +:export { + primaryColor: $primary; + accentColor: $accent; } - -@font-face { - font-family: 'Satoshi-Bold'; - src: url('/fonts/Satoshi-Bold.ttf') format('truetype'); - font-weight: 700; - font-display: swap; - font-style: normal; -} - -$primary: #1C1427; -$accent: #7ECA9C; -$link: #CCFFBD; -$highlight-primary: #40394A; \ No newline at end of file diff --git a/src/styles/main.scss b/src/styles/main.scss index 1d6674b..f2d92e2 100644 --- a/src/styles/main.scss +++ b/src/styles/main.scss @@ -2,6 +2,38 @@ :root { color-scheme: dark; + --accent-color: $accent; // conversion for theme color meta tag +} + +@font-face { + font-family: "Tanker-Regular"; + src: url("/fonts/Tanker-Regular.ttf") format("truetype"); + font-weight: 400; + font-display: swap; + font-style: normal; +} + +@font-face { + font-family: "Satoshi-Regular"; + src: url("/fonts/Satoshi-Regular.ttf") format("truetype"); + font-weight: 400; + font-display: swap; + font-style: normal; +} + +@font-face { + font-family: "Satoshi-Bold"; + src: url("/fonts/Satoshi-Bold.ttf") format("truetype"); + font-weight: 700; + font-display: swap; + font-style: normal; +} + +::selection { + background-color: $accent; +} +::marker { + color: $accent; } body {