GitHub/quartz
1
0
Fork 2
mirror of https://github.com/jackyzha0/quartz.git synced 2025-12-19 10:54:06 -06:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat(callout) Theme matching callouts

Browse Source
This commit is contained in:
Vineeth Voruganti 2024-08-23 12:01:27 -04:00
parent 04eddbf85a
commit ab1b46877c
4 changed files with 39 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
content/_index.md
View File

@ -2,7 +2,7 @@
title: Home title: Home
enableToc: false enableToc: false
--- ---
> [!important] PLASTIC IS HIRING! > [!custom] PLASTIC IS HIRING!
> Check out our [[Work at Plastic|open positions here]]. > Check out our [[Work at Plastic|open positions here]].
Welcome to our collaborative second brain. Welcome to our collaborative second brain.

2
quartz.config.ts
View File

@ -34,6 +34,7 @@ const config: QuartzConfig = {
dark: "#2b2b2b", dark: "#2b2b2b",
secondary: "#4e4e4e", secondary: "#4e4e4e",
tertiary: "#FF5A7E", tertiary: "#FF5A7E",
customCallout: "#db424210",
highlight: "rgba(128, 128, 128, 0.15)", highlight: "rgba(128, 128, 128, 0.15)",
}, },
darkMode: { darkMode: {
@ -45,6 +46,7 @@ const config: QuartzConfig = {
secondary: "#7C7C7C", secondary: "#7C7C7C",
tertiary: "#09FEF8", tertiary: "#09FEF8",
highlight: "rgba(125, 125, 125, 0.15)", highlight: "rgba(125, 125, 125, 0.15)",
customCallout: "#00b8d410",
}, },
}, },
}, },

33
quartz/styles/custom.scss
View File

@ -32,3 +32,36 @@ iframe {
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
} }
// Callouts
.callout {
&[data-callout="custom"] {
--color: var(--tertiary);
--border:var(--tertiary);
--bg: var(--customCallout);
--callout-icon: var(--callout-icon-tip);
}
}
/* @media (prefers-color-scheme: dark) { */
/* .callout { */
/* &[data-callout="custom"] { */
/* --color: #09FEF8; */
/* --border:#09FEF8; */
/* --bg: #00b0ff10; */
/* --callout-icon: var(--callout-icon-tip); */
/* } */
/* } */
/* } */
/* @media (prefers-color-scheme: light) { */
/* .callout { */
/* &[data-callout="custom"] { */
/**/
/* --color: #FF5A7E; */
/* --border:#FF5A7E; */
/* --bg: #db424210; */
/* --callout-icon: var(--callout-icon-tip); */
/* } */
/* } */
/* } */

3
quartz/util/theme.ts
View File

@ -7,6 +7,7 @@ export interface ColorScheme {
secondary: string secondary: string
tertiary: string tertiary: string
highlight: string highlight: string
customCallout: string
} }
interface Colors { interface Colors {
@ -48,6 +49,7 @@ ${stylesheet.join("\n\n")}
--secondary: ${theme.colors.lightMode.secondary}; --secondary: ${theme.colors.lightMode.secondary};
--tertiary: ${theme.colors.lightMode.tertiary}; --tertiary: ${theme.colors.lightMode.tertiary};
--highlight: ${theme.colors.lightMode.highlight}; --highlight: ${theme.colors.lightMode.highlight};
--customCallout: ${theme.colors.lightMode.customCallout};
--headerFont: "${theme.typography.header}", ${DEFAULT_SANS_SERIF}; --headerFont: "${theme.typography.header}", ${DEFAULT_SANS_SERIF};
--bodyFont: "${theme.typography.body}", ${DEFAULT_SANS_SERIF}; --bodyFont: "${theme.typography.body}", ${DEFAULT_SANS_SERIF};
@ -63,6 +65,7 @@ ${stylesheet.join("\n\n")}
--secondary: ${theme.colors.darkMode.secondary}; --secondary: ${theme.colors.darkMode.secondary};
--tertiary: ${theme.colors.darkMode.tertiary}; --tertiary: ${theme.colors.darkMode.tertiary};
--highlight: ${theme.colors.darkMode.highlight}; --highlight: ${theme.colors.darkMode.highlight};
--customCallout: ${theme.colors.darkMode.customCallout};
} }
` `
} }