clone/logseq
1
0
Fork 0
mirror of https://github.com/logseq/logseq.git synced 2026-05-28 14:39:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(icon): theme search empty-state via --ls-primary-text-color

Browse Source 
The "No results found" empty state rendered neutral grays in OG
(container/icon at rx-gray-08, title at rx-gray-10, subtitle at
rx-gray-08) on top of a teal picker background — out of theme.

Inject `--ls-primary-text-color` (#a4b5b6 muted teal-gray in OG) as
the themed middle step across all three rules. Layer visual hierarchy
via per-child opacity (cannot set on the container — would multiply
into children and flatten the contrast):
- icon: opacity 0.5 (decorative aid, most muted)
- title: opacity 1 (most prominent line)
- subtitle: opacity 0.7 (themed but slightly muted)

Radix themes unaffected (--lx-gray-N still wins step 1).

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
scheinriese
2026-05-21 14:07:31 +02:00
parent ace3317721
commit cfeb8a3638
1 changed files with 15 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/main/frontend/components/icon.css
View File

@@ -89,16 +89,28 @@
.search-empty-state {
@apply flex-1 flex flex-col items-center justify-center gap-1.5 select-none;
min-height: 160px;
color: var(--lx-gray-08, var(--rx-gray-08));
/* Container `color` propagates via `currentColor` into the SVG
search-off icon. Themed via `--ls-primary-text-color` middle
step (#a4b5b6 muted teal-gray in OG). Opacity is applied per
child below for visual hierarchy. */
color: var(--lx-gray-08, var(--ls-primary-text-color, var(--rx-gray-08)));
/* Icon: most muted (decorative aid). */
.ui__icon {
opacity: 0.5;
}
.title {
@apply text-sm font-medium;
color: var(--lx-gray-10, var(--rx-gray-10));
/* Title: themed and at full opacity — the prominent line. */
color: var(--lx-gray-10, var(--ls-primary-text-color, var(--rx-gray-10)));
}
.subtitle {
@apply text-xs;
color: var(--lx-gray-08, var(--rx-gray-08));
/* Subtitle: themed but muted slightly. */
color: var(--lx-gray-08, var(--ls-primary-text-color, var(--rx-gray-08)));
opacity: 0.7;
}
}