diff --git a/custom.css b/custom.css index 1ec7167..fd053d8 100644 --- a/custom.css +++ b/custom.css @@ -345,8 +345,10 @@ strong { .embed, .embed-page, .embed-block { - box-shadow: inset 0 0 0.3em rgba(0, 0, 0, 0.6); + box-shadow: 8px 8px rgba(0, 0, 0); padding: 0.75em 0.5em 0.5em; + border: 2px solid var(--ls-quaternary-background-color); + margin: 0.2em 0; } /* page embed */ @@ -369,7 +371,6 @@ strong { .cp__right-sidebar .embed-block { background: var(--ls-secondary-background-color); border-radius: 0.25rem; - margin-top: 0.2em; } /* Markers */ @@ -583,6 +584,20 @@ samp { display: none; } +/* Tags */ +a.tag { + border: 1px solid currentColor; + background-color: var(--ct-block-reference-background); + padding: 0 4px; + border-radius: 4px; + font-weight: 600; + line-height: 1.4; +} + +a.tag:hover { + background-color: var(--ct-block-reference-background-hover); +} + /* Page preview title */ .tippy-wrapper > h2:first-of-type { display: inline-block; @@ -610,7 +625,7 @@ samp { .white-theme, html[data-theme="light"] { --ct-primary-color: #106ba3; - --ct-secondary-color: #19bcfe; + --ct-secondary-color: #0a4163; --ct-warning-color: #ff7262; --ct-success-color: #0dcf82; --ct-highlight-color: #ffc600; @@ -622,11 +637,14 @@ html[data-theme="light"] { --ls-primary-text-color: rgb(40, 40, 40); --ls-secondary-text-color: #161e2e; - + --ct-bold-color: #000; --ct-bold-color-transparent: rgba(0, 0, 0, 0.3); --ls-link-text-color: var(--ct-primary-color); + --ls-link-ref-text-color: var(--ct-primary-color); + --ls-link-ref-text-hover-color: var(--ct-secondary-color); + --ls-active-primary-color: var(--ct-primary-color); --ls-active-secondary-color: var(--ct-secondary-color); --ls-external-link-color: var(--ct-warning-color); @@ -646,6 +664,8 @@ html[data-theme="light"] { --ct-block-reference-background: rgba(16, 107, 163, 0.1); --ct-block-reference-background-hover: rgba(16, 107, 163, 0.3); + + --ls-page-properties-background-color: var(--ls-secondary-background-color); } .dark-theme, @@ -657,9 +677,9 @@ html[data-theme="dark"] { --ct-highlight-color: #ffc600; --ls-primary-background-color: #272c35; - --ls-secondary-background-color: #343b49; - --ls-tertiary-background-color: #272c35; - --ls-quaternary-background-color: #343b49; + --ls-secondary-background-color: #313942; + --ls-tertiary-background-color: #23364f; + --ls-quaternary-background-color: #395982; --ls-primary-text-color: rgb(235, 235, 235); --ls-secondary-text-color: #2b2b2b; @@ -670,6 +690,9 @@ html[data-theme="dark"] { --ct-bold-color-transparent: rgba(255, 255, 255, 0.3); --ls-link-text-color: var(--ct-primary-color); + --ls-link-ref-text-color: var(--ct-primary-color); + --ls-link-ref-text-hover-color: var(--ct-secondary-color); + --ls-active-primary-color: var(--ct-primary-color); --ls-active-secondary-color: var(--ct-secondary-color); --ls-external-link-color: var(--ct-warning-color); @@ -689,6 +712,10 @@ html[data-theme="dark"] { --ct-block-reference-background: rgba(16, 107, 163, 0.2); --ct-block-reference-background-hover: rgba(16, 107, 163, 0.3); + + --ls-page-properties-background-color: var(--ls-secondary-background-color); + + --ls-scrollbar-foreground-color: var(--ls-secondary-background-color); } .dark-theme .image-resize { diff --git a/demo.png b/demo.png deleted file mode 100644 index 1e59e6f..0000000 Binary files a/demo.png and /dev/null differ diff --git a/readme.md b/readme.md index fa2b963..25acd55 100644 --- a/readme.md +++ b/readme.md @@ -1,16 +1,12 @@ # Logseq Dev Theme -A theme imspired from Dev.to & Figma. +A theme inspired by Dev.to & Figma. ## Warnings -- This is a light only theme. Because I only use light theme. +- I only use the light theme on daily basis. - Subject to change to meet my own needs. - I only have a Mac and other systems will not be tested. -- I like Google Fonts. - -## Screenshot - -![](./demo.png) +- I like Google Fonts and Fira Code. The easiest way to adopt this theme is to use jsDelivr CDN.