greatbody
/
logseq
mirror of https://github.com/logseq/logseq
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

enhance(ui): polish colors list for the non-accent colors

pull/10897/head
charlie 2024-01-25 14:46:42 +08:00
parent 42ba2d76ae
commit 1bfa802a56
3 changed files with 15 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
resources/css/shui.css
View File

@ -119,6 +119,10 @@ html[data-theme=dark] {
@apply border-accent-01;
}
.tippy-tooltip {
@apply border-accent-02;
}
.references-blocks-item {
background-color: var(--lx-gray-03, var(--ls-secondary-background-color));
}

15
src/main/frontend/components/settings.cljs
View File

@ -337,7 +337,8 @@
pick-theme [:div.cp__accent-colors-list-wrap
{:class (if _in-modal? "as-modal-picker" "")}
(for [color (concat [:none :logseq] colors/color-list)
:let [active? (= color color-accent)]]
:let [active? (= color color-accent)
none? (= color :none)]]
[:div.flex.items-center {:style {:height 28}}
(shui-ui/button
{:class "w-5 h-5 px-1 rounded-full flex justify-center items-center transition ease-in duration-100 hover:cursor-pointer hover:opacity-100"
@ -350,14 +351,16 @@
:opacity (if active? 1 0.5)}
:variant :text
:on-click (fn [_e] (state/set-color-accent! color))}
[:span {:class "w-2 h-2 rounded-full transition ease-in duration-100"
:style {:background-color (str "var(--rx-" (name color) "-07)")
:opacity (if active? 1 0)}}])])]]
[:strong
{:class (if none? "h-0.5 w-full bg-red-700"
"w-2 h-2 rounded-full transition ease-in duration-100")
:style {:background-color (if-not none? (str "var(--rx-" (name color) "-07)") "")
:opacity (if (or none? active?) 1 0)}}])])]]
[:<>
(row-with-button-action {:left-label "Accent color"
(row-with-button-action {:left-label "Accent color"
:description "Choosing an accent color may override any theme you have selected."
:-for "toggle_radix_theme"
:-for "toggle_radix_theme"
:stretch true
:action pick-theme})]))

6
src/main/frontend/tippy-tooltip.css
View File

@ -61,10 +61,9 @@
.tippy-tooltip {
@apply shadow border border-gray-07 dark:border-gray-05 px-2 py-1;
color: var(--ls-primary-text-color);
font-size: inherit;
will-change: auto;
background-color: var(--ls-tertiary-background-color);
color: var(--ls-primary-text-color, hsl(var(--foreground)));
background-color: var(--lx-gray-03, var(--ls-tertiary-background-color, var(--rx-gray-03)));
}
.tippy-tooltip [x-circle] {
@ -76,7 +75,6 @@
}
.tippy-wrapper {
background-color: var(--ls-tertiary-background-color);
border-radius: 8px;
margin: 0 -6px;
}