From b7793bd856979d0515a75c4c7a322912bdb72602 Mon Sep 17 00:00:00 2001
From: Peter <GitHub@Stather.me>
Date: Wed, 10 Jul 2024 00:21:00 +0000
Subject: [PATCH] feat(style): Add textHighlight theme setting (#1242)
---
quartz/util/theme.ts | 3 +++
docs/configuration.md | 1 +
quartz/styles/base.scss | 3 +--
quartz.config.ts | 2 ++
4 files changed, 7 insertions(+), 2 deletions(-)
diff --git a/docs/configuration.md b/docs/configuration.md
index e97d8df..1dc1148 100644
--- a/docs/configuration.md
+++ b/docs/configuration.md
@@ -53,6 +53,7 @@
- `secondary`: link colour, current [[graph view|graph]] node
- `tertiary`: hover states and visited [[graph view|graph]] nodes
- `highlight`: internal link background, highlighted text, [[syntax highlighting|highlighted lines of code]]
+ - `textHighlight`: markdown highlighted text background
## Plugins
diff --git a/quartz.config.ts b/quartz.config.ts
index fa08723..b6abbb2 100644
--- a/quartz.config.ts
+++ b/quartz.config.ts
@@ -36,6 +36,7 @@
secondary: "#284b63",
tertiary: "#84a59d",
highlight: "rgba(143, 159, 169, 0.15)",
+ textHighlight: "#fff23688",
},
darkMode: {
light: "#161618",
@@ -46,6 +47,7 @@
secondary: "#7b97aa",
tertiary: "#84a59d",
highlight: "rgba(143, 159, 169, 0.15)",
+ textHighlight: "#b3aa0288",
},
},
},
diff --git a/quartz/styles/base.scss b/quartz/styles/base.scss
index 37aa8ce..52cd102 100644
--- a/quartz/styles/base.scss
+++ b/quartz/styles/base.scss
@@ -20,11 +20,10 @@
}
.text-highlight {
- background-color: #fff23688;
+ background-color: var(--textHighlight);
padding: 0 0.1rem;
border-radius: 5px;
}
-
::selection {
background: color-mix(in srgb, var(--tertiary) 60%, rgba(255, 255, 255, 0));
color: var(--darkgray);
diff --git a/quartz/util/theme.ts b/quartz/util/theme.ts
index d3bfb9a..9046cec 100644
--- a/quartz/util/theme.ts
+++ b/quartz/util/theme.ts
@@ -7,6 +7,7 @@
secondary: string
tertiary: string
highlight: string
+ textHighlight: string
}
interface Colors {
@@ -49,6 +50,7 @@
--secondary: ${theme.colors.lightMode.secondary};
--tertiary: ${theme.colors.lightMode.tertiary};
--highlight: ${theme.colors.lightMode.highlight};
+ --textHighlight: ${theme.colors.lightMode.textHighlight};
--headerFont: "${theme.typography.header}", ${DEFAULT_SANS_SERIF};
--bodyFont: "${theme.typography.body}", ${DEFAULT_SANS_SERIF};
@@ -64,6 +66,7 @@
--secondary: ${theme.colors.darkMode.secondary};
--tertiary: ${theme.colors.darkMode.tertiary};
--highlight: ${theme.colors.darkMode.highlight};
+ --textHighlight: ${theme.colors.darkMode.textHighlight};
}
`
}
--
Gitblit v1.10.0