diff --git a/content/features/upcoming features.md b/content/features/upcoming features.md index dab75c6a..6d36de85 100644 --- a/content/features/upcoming features.md +++ b/content/features/upcoming features.md @@ -6,7 +6,6 @@ draft: true - images in same folder are broken on shortest path mode - watch mode for config/source code -- https://help.obsidian.md/Editing+and+formatting/Basic+formatting+syntax#Task+lists task list styling - publish metadata https://help.obsidian.md/Editing+and+formatting/Metadata#Metadata+for+Obsidian+Publish - metadata aliases: https://help.obsidian.md/Editing+and+formatting/Metadata#Predefined+metadata - block links: https://help.obsidian.md/Linking+notes+and+files/Internal+links#Link+to+a+block+in+a+note diff --git a/quartz/styles/base.scss b/quartz/styles/base.scss index fd94a1a1..ebdc2faf 100644 --- a/quartz/styles/base.scss +++ b/quartz/styles/base.scss @@ -92,11 +92,17 @@ a { & li:has(> input[type="checkbox"]) { list-style-type: none; padding-left: 0; - margin-left: -1.4rem; + } + + & li:has(> input[type="checkbox"]:checked) { + text-decoration: line-through; + text-decoration-color: var(--gray); + color: var(--gray); } & li > * { - margin: 0; + margin-top: 0; + margin-bottom: 0; } } @@ -175,8 +181,35 @@ a { input[type="checkbox"] { transform: translateY(2px); color: var(--secondary); - border-color: var(--lightgray); + border: 1px solid var(--lightgray); + border-radius: 3px; background-color: var(--light); + position: relative; + margin-inline-end: 0.2rem; + margin-inline-start: -1.4rem; + appearance: none; + width: 16px; + height: 16px; + + &:checked { + border-color: var(--secondary); + background-color: var(--secondary); + + &::after { + content: ""; + top: -1px; + left: -1px; + position: absolute; + left: 4px; + top: 1px; + width: 4px; + height: 8px; + display: block; + border: solid 1px var(--light); + border-width: 0 2px 2px 0; + transform: rotate(45deg); + } + } } blockquote {