coffey-labs/ihasmail
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases 2 Wiki Activity

Merge pull request #42 from LINUXexpert-org/folder-colours-filled

Browse Source 
Fill a coloured folder in, rather than outlining it
This commit is contained in:
LINUXexpert.org
2026-08-25 13:07:23 -07:00
committed by GitHub
parent aad599d802 a5c971ace4
commit ca2c4544dc
1 changed files with 4 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/styles/app.css
+4 -2
View File
@@ -327,8 +327,10 @@ img { max-width: 100%; }
/* A folder colour tints its icon; the label keeps the sidebar's contrast. */ /* A folder colour tints its icon; the label keeps the sidebar's contrast. */
.folder-row .folder-icon { display: inline-flex; align-items: center; } .folder-row .folder-icon { display: inline-flex; align-items: center; }
/* .nav-item svg sets colour on the svg itself, so inheriting from the span is /* .nav-item svg sets colour on the svg itself, so inheriting from the span is
not enough -- the icon has to be targeted directly to win the cascade. */ not enough -- the icon has to be targeted directly to win the cascade.
.folder-row .folder-icon[style*="--folder-color"] svg { color: var(--folder-color); } The fill overrides lucide's own fill="none": a CSS rule beats a presentation
attribute, and a solid folder reads at a glance where an outline does not. */
.folder-row .folder-icon[style*="--folder-color"] svg { color: var(--bg); fill: var(--folder-color); }
/* The Folders heading doubles as the way back to the top level while dragging. */ /* The Folders heading doubles as the way back to the top level while dragging. */
.nav-section.drop-target { background: var(--accent-soft); outline: 2px dashed var(--accent); outline-offset: -2px; border-radius: var(--radius-sm); color: var(--accent-soft-fg); } .nav-section.drop-target { background: var(--accent-soft); outline: 2px dashed var(--accent); outline-offset: -2px; border-radius: var(--radius-sm); color: var(--accent-soft-fg); }
.nav-item svg { flex: 0 0 auto; color: var(--fg-muted); } .nav-item svg { flex: 0 0 auto; color: var(--fg-muted); }