Compare commits

..

5 Commits

Author SHA1 Message Date
Kaloyan Danchev
14cb71a36c Fix dashboard card layout, icons, alignment, and memory card visibility
- Docker/VM tiles: wrap containers into columns instead of horizontal scroll
- Add 6 missing ICON_MAP entries + fireflyiii/minecraft icon assets
- Card title icons: align-items flex-start so icons sit beside h3, not below
- Scope .head_bar hide rule to Processor card to stop hiding Memory card header

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-27 17:18:37 +02:00
Kaloyan Danchev
7bacf965cc Fix 4 HIGH overflow bugs: scrollable Docker tiles, tables, tabs, app rows
- Dashboard: overflow-x auto on card td cells for Docker container grid
- Dashboard: text-overflow ellipsis on span.outer for long container names
- Main: overflow-x auto on tabpanels (ZFS Master, Boot Device, etc.)
- Docker/VM: overflow-x auto on .TableContainer wrapper
- Apps: overflow-x auto on .ca_homeTemplates card rows
- Apps: box-sizing border-box on .ca_appPopup to prevent card overflow
- Consistent glass scrollbar styling (thin, translucent) on all

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-27 15:21:27 +02:00
Kaloyan Danchev
e0f8d5da4b Fix remaining review pass 2 bugs: spacing, toggles, share settings, ribbons, tooltips
- Bug #8: Fix Main page tab row spacing by positioning .status icon absolutely
- Bug #9: Brighten toggle icons (fa-toggle-off/on) from 0.35 to 0.55 opacity
- Bug #11: Merge Share Settings clone-settings and form into single glass card
- Bugs #16/#17/#19: Clip Apps ribbon badges within rounded card corners
- Bug #20: Add glass styling for ZFS Master tooltipster tooltips

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-25 22:27:49 +02:00
Kaloyan Danchev
db5bd8c3b2 Phase 2 bug fixes: header, bars, checkboxes, icons, filter, cards
- Fix header double-offset (margin-left + padding-left) — use padding-left only
- Header text white with shadow for readability on light backgrounds
- Usage bars: 24px height, value text inside, left-aligned, color variants
- Dashboard bars: hide external span.load, use built-in span:last-child
- Dashboard CPU rows: 32px height, 36px line-height for alignment
- Glass checkbox/radio styling (appearance:none, custom check/dot)
- PanelIcon white for Settings/Tools/Plugins pages
- Plugin list FA icons white, tablesorter header transparent
- Shares Browse: lighter lock icon, glass tooltip, filter input refined
- File manager filter: reduced height, centered icon, toggle styling
- App cards: overflow:hidden for ribbon corner clipping
- Alternating table row backgrounds

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-25 20:57:21 +02:00
Kaloyan Danchev
55ad7c66bc Fix 23 theme bugs across all pages: toggles, text visibility, icons, bars, shadows, layout
Phase 1: Fix toggle switch knob positioning (absolute + translateY centering)
Phase 2: Fix text visibility on Main/Shares thead td, Plugins descriptions, Settings/Tools PanelText labels
Phase 3: Fix icon coloring - JS replacement for Tailscale/ZFS Master with selfh.st light SVGs, CSS invert for remaining plugin imgs
Phase 4: Softer box-shadow on inner tables, stacked Panel rounding for Array Op
Phase 5: Browse table styling, form glass containers, Apps detail panel transparency
Phase 6: Main page usage bars (8px thin + gradient), plugin/VM button visibility
Phase 7: Header overflow fix, Docker folder-preview softening, Apps ribbon clipping, ZFS Master toggle spacing

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-24 22:07:24 +02:00
7 changed files with 955 additions and 62 deletions

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 512 512"><path d="M197 351.3c4.1 0 7.5 3.4 7.5 7.5s-3.4 7.5-7.5 7.5-7.5-3.4-7.5-7.5 3.4-7.5 7.5-7.5m230.8.8c-5.1-38.5-23.3-37.5-31.4-66.9s17.6-22.2-4.1-72.7c0 0-9.6-24-46.2-41.4-23.5-11.1-7.5-61.5-49.1-112.2S215.6 0 215.6 0s19.5 66.2-18 104.7-33.5 81.1-18.3 101.4 14.2 35.5 2 46.7-22.3 19.3-29.4 1-15.2-18.3-18.3-27.4-9.1-25.4-9.1-25.4-19.3 30.4-31.4 48.7-12.2 46.7-4.1 61.9 5.1 33.5-1 58.8c-6.1 25.4 2 63.9 30.4 79.1s62.9 27.4 78.1 41.6 50.7 27.4 96.4 17.2c45.6-10.1 103.5-56.8 113.6-88.2 0 0 26.4-29.4 21.3-68m-80.1 86.3v19.8c-3.6 7.1-9.6 9.5-29.7 9.5s-22.9-5.5-22.9-5.5v-4c-30.9 4-47.7 0-47.7 0 0 3.5 0 4.1-3 7.1s-21.4 3.2-35.2 1.2c-13.9-2-12.3-8.7-12.3-8.7v-20.2c-22.6-15.9-28.9-40-28.9-40l-13 .3c-7.1 0-10.1-9.1-10.1-9.1v-29.4c0-9.2 9.1-11.2 9.1-11.2l12.7-1c4.3-30.4 36-53.8 36-53.8l-1.8-41.9c34.2-6.2 53.4 28.6 53.5 28.6 38-4.6 75.4 3.3 93.3 20.1 15.7 14.7 27.4 27.8 28.3 65.6 1 43.9-28.3 72.6-28.3 72.6m28.9-89.1-1.9-9.3s-14.4-6.9-32.2 3.2c0 0-21.1-7.1-32.4 2.1-11.7 9.5-12.9 20.7-12.3 33.8 0 0 10.2-34.7 35.8-25.8 0 0-18.2 32 10.1 37.6 0 0 6.7 0 12.2-3.4 5.3-3.2 9.4-9 7.7-19.6 0 0-3.4-10.6-12.3-16.9 0 0 8.7-6.2 25.3-1.7m-25.2 18.5c5.5 9-3.9 13.5-3.9 13.5-17.6 1.4-4.4-23.5-4.4-23.5s2.7.6 8.3 10" style="fill:#fff"/></svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
assets/icons/fireflyiii.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 512 512"><path d="M474.3 129.5c0-.2-.1-.3-.2-.5-.1-.3-.2-.7-.4-1-.1-.2-.3-.4-.4-.6-.2-.2-.3-.5-.6-.7-.2-.2-.4-.4-.7-.5-.2-.2-.4-.3-.6-.5h-.1L259.2.9c-2-1.2-4.4-1.2-6.3 0L40.6 125.7h-.1c-.2.1-.4.3-.6.5s-.5.3-.7.5-.4.5-.6.7c-.1.2-.3.4-.4.6-.2.3-.3.7-.4 1-.1.2-.2.3-.2.5-.1.5-.2 1.1-.2 1.6v249.8c0 2.2 1.2 4.3 3.1 5.4l212.3 124.9c.3.2.6.3 1 .4.2.1.4.2.5.2.5.1 1.1.2 1.6.2s1.1-.1 1.6-.2c.2 0 .4-.2.5-.2.3-.1.6-.2 1-.4l212.3-124.9c1.9-1.1 3.1-3.2 3.1-5.4V131.1c.1-.5.1-1.1-.1-1.6M50 197.3l20 11.9.6-31.2 26.2 15.6v31.2l26.8 15.6 26.2 15.6v31.2l26.5 15.6v-31.2l26.5 15.6V256l26.5 15.6V334l20.3 11.9v148.9L50 377.3zm212.2 297.5v-180l20.3-11.9v-31.2l26.5-15.6v31.2l53.1-31.2v31.2l26.5-15.6v-31.2l26.5-15.6v-31.2l26.5-15.6v62.4l20.3-11.9v148.9z" style="fill:#fff"/></svg>

After

Width:  |  Height:  |  Size: 836 B

BIN
assets/icons/minecraft.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 43 KiB

View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 512 512"><path d="M-135.2 330c-5.4 5.4-14 5.4-19.4 0s-5.4-14.1 0-19.4c5.4-5.4 14-5.4 19.4 0 5.3 5.3 5.3 14 0 19.4m-3 383.6c-9.4 9.4-24.5 9.4-33.8 0-9.4-9.4-9.4-24.5 0-33.8 9.4-9.4 24.6-9.4 33.8 0 9.3 9.3 9.3 24.5 0 33.8m-80.1-46.2c-9.4-9.4-9.4-24.6 0-33.8 9.4-9.4 24.6-9.4 33.8 0 9.4 9.4 9.4 24.6 0 33.8-9.3 9.4-24.5 9.4-33.8 0m-12.2 46.2c-9.4 9.4-24.6 9.4-33.8 0-9.4-9.4-9.4-24.5 0-33.8 9.4-9.4 24.5-9.4 33.8 0 9.3 9.3 9.3 24.5 0 33.8m-80-46.2c-9.4-9.4-9.4-24.6 0-33.8 9.4-9.4 24.6-9.4 33.8 0 9.4 9.4 9.4 24.6 0 33.8-9.4 9.4-24.6 9.4-33.8 0m-12.3 46.2c-9.4 9.4-24.6 9.4-33.8 0-9.4-9.4-9.4-24.5 0-33.8 9.4-9.4 24.6-9.4 33.8 0 9.3 9.3 9.4 24.5 0 33.8m-80-46.2c-9.4-9.4-9.4-24.5 0-33.8 9.4-9.4 24.6-9.4 33.8 0 9.4 9.4 9.4 24.6 0 33.8-9.4 9.3-24.6 9.4-33.8 0m-12.3 46.2c-9.4 9.4-24.6 9.4-33.8 0-9.4-9.4-9.4-24.6 0-33.8 9.4-9.4 24.5-9.4 33.8 0 9.3 9.3 9.3 24.5 0 33.8M-452 312.3c5.4-5.4 14-5.4 19.4 0s5.4 14.1 0 19.4c-5.4 5.4-14.1 5.4-19.4 0s-5.4-14.1 0-19.4m29.8 29.8c5.4-5.4 14-5.4 19.4 0s5.4 14.1 0 19.4c-5.4 5.4-14.1 5.4-19.4 0-5.4-5.4-5.4-14.1 0-19.4m29.8 29.8c5.4-5.4 14.1-5.4 19.4 0 5.4 5.4 5.4 14.1 0 19.4-5.4 5.4-14 5.4-19.4 0s-5.4-14.1 0-19.4m0-59.6c5.4-5.4 14-5.4 19.4 0s5.4 14.1 0 19.4c-5.4 5.4-14 5.4-19.4 0-5.4-5.3-5.4-14.1 0-19.4m29.8 89.3c5.4-5.4 14.1-5.4 19.4 0 5.4 5.4 5.4 14.1 0 19.4-5.4 5.4-14 5.4-19.4 0-5.4-5.3-5.4-14 0-19.4m0-59.5c5.4-5.4 14-5.4 19.4 0s5.4 14.1 0 19.4c-5.4 5.4-14 5.4-19.4 0s-5.4-14.1 0-19.4m29.8-29.8c5.4-5.4 14-5.4 19.4 0s5.4 14.1 0 19.4c-5.4 5.4-14.1 5.4-19.4 0-5.4-5.3-5.4-14 0-19.4m29.7 89.3c5.4-5.4 14-5.4 19.4 0s5.4 14.1 0 19.4c-5.4 5.4-14 5.4-19.4 0-5.3-5.3-5.3-14 0-19.4m0-59.5c5.4-5.4 14-5.4 19.4 0s5.4 14.1 0 19.4c-5.4 5.4-14.1 5.4-19.4 0s-5.3-14.1 0-19.4m29.8-29.8c5.4-5.4 14.1-5.4 19.4 0 5.4 5.4 5.4 14.1 0 19.4-5.4 5.4-14 5.4-19.4 0-5.3-5.3-5.3-14 0-19.4m9.2 275.1c9.4-9.4 24.6-9.4 33.8 0 9.4 9.4 9.4 24.6 0 33.8-9.4 9.4-24.6 9.4-33.8 0-9.4-9.4-9.4-24.5 0-33.8m10.2-137.3c-5.4 5.4-14 5.4-19.4 0s-5.4-14.1 0-19.4c5.4-5.4 14.1-5.4 19.4 0 5.4 5.3 5.4 14 0 19.4m0-59.6c-5.4 5.4-14 5.4-19.4 0s-5.4-14.1 0-19.4c5.4-5.4 14.1-5.4 19.4 0 5.4 5.4 5.4 14.1 0 19.4m-49.2 70c5.4-5.4 14-5.4 19.4 0s5.4 14.1 0 19.4c-5.4 5.4-14 5.4-19.4 0-5.3-5.4-5.3-14.1 0-19.4m-7.2 80.7c9.4-9.4 24.6-9.4 33.8 0 9.4 9.4 9.4 24.5 0 33.8-9.4 9.4-24.6 9.4-33.8 0-9.4-9.3-9.4-24.5 0-33.8m-12.3 46.2c9.4 9.4 9.4 24.6 0 33.8-9.4 9.4-24.6 9.4-33.8 0-9.4-9.4-9.4-24.5 0-33.8 9.3-9.4 24.5-9.4 33.8 0m-10.2-216.3c5.4-5.4 14-5.4 19.4 0s5.4 14.1 0 19.4c-5.4 5.4-14 5.4-19.4 0-5.4-5.3-5.4-14 0-19.4m0 59.6c5.4-5.4 14-5.4 19.4 0s5.4 14.1 0 19.5-14.1 5.4-19.4 0c-5.4-5.5-5.4-14.2 0-19.5m89.3-29.8c5.4-5.4 14-5.4 19.4 0s5.4 14.1 0 19.4c-5.4 5.4-14 5.4-19.4 0-5.4-5.3-5.4-14 0-19.4m0-59.5c5.4-5.4 14-5.4 19.4 0s5.4 14.1 0 19.4c-5.4 5.4-14 5.4-19.4 0s-5.4-14.1 0-19.4m29.8 29.7c5.4-5.4 14.1-5.4 19.4 0 5.4 5.4 5.4 14.1 0 19.4-5.4 5.4-14 5.4-19.4 0-5.4-5.3-5.4-14 0-19.4m0-59.5c5.4-5.4 14.1-5.4 19.4 0 5.4 5.4 5.4 14 0 19.4s-14 5.4-19.4 0-5.4-14.1 0-19.4m29.8 29.7c5.4-5.4 14.1-5.4 19.4 0 5.4 5.4 5.4 14.1 0 19.4-5.4 5.4-14.1 5.4-19.4 0-5.4-5.3-5.4-14 0-19.4m148.4-45.1c0-21.7-17.6-39.4-39.4-39.4h-436.6c-21.7 0-39.4 17.6-39.4 39.4v149.9h58.6l-58.6 137V733c0 21.7 17.6 39.4 39.4 39.4h436.6c21.7 0 39.4-17.6 39.4-39.4V583.1h-58.6l58.6-137z" style="fill:#fff" transform="matrix(.989 0 0 .993 546 -255)"/></svg>

After

Width:  |  Height:  |  Size: 3.3 KiB

View File

@@ -219,7 +219,13 @@
'urbackup': 'networking-toolbox',
'seekandwatch': 'databasement',
'unmarr': 'homarr',
'dockhand': 'docker'
'dockhand': 'docker',
'firefly-data-importer': 'fireflyiii',
'fireflyiii': 'fireflyiii',
'home-assistant-container': 'home-assistant',
'home-assistant-time-machine': 'apple',
'termix': 'networking-toolbox',
'tuyagateway': 'home-assistant'
};
// Resolve container name to selfh.st CDN URL
@@ -324,7 +330,10 @@
var replaceTimer = null;
function debouncedReplace() {
if (replaceTimer) clearTimeout(replaceTimer);
replaceTimer = setTimeout(replaceIcons, 200);
replaceTimer = setTimeout(function() {
replaceIcons();
replacePluginIcons();
}, 200);
}
// Watch for DOM changes (AJAX loads, FolderView manipulation)
@@ -343,14 +352,48 @@
observer.observe(target, { childList: true, subtree: true });
}
// Replace Tailscale sidebar icon with light SVG
function replaceTailscaleIcon() {
var imgs = document.querySelectorAll('img[alt="Tailscale"]');
// Plugin icon source → selfh.st light SVG replacement
// Maps partial src paths to icon names in /custom/assets/icons/
var PLUGIN_ICON_MAP = {
'/plugins/tailscale/': 'tailscale',
'/plugins/zfs.master/': 'openzfs',
// SNMP has no selfh.st icon — leave for CSS invert filter
};
// Replace plugin icons on Settings/Plugins/Tools pages with selfh.st light SVGs.
// Also replaces Tailscale sidebar icon (img[alt="Tailscale"]).
function replacePluginIcons() {
// Settings/Tools/Plugins grid icons
var imgs = document.querySelectorAll('#displaybox img, img[alt="Tailscale"]');
imgs.forEach(function(img) {
var url = CDN_SVG + '/tailscale-light.svg';
if (img.getAttribute('src') !== url) {
img.src = url;
img.removeAttribute('onerror');
// Skip container icons (handled by replaceIcons)
if (img.classList.contains('img')) return;
// Skip sidebar logo
if (img.id === 'sidebar-logo') return;
// Skip already replaced
if (img.getAttribute('data-glass-icon')) return;
var src = img.getAttribute('src') || '';
var keys = Object.keys(PLUGIN_ICON_MAP);
for (var i = 0; i < keys.length; i++) {
if (src.indexOf(keys[i]) !== -1) {
var iconName = PLUGIN_ICON_MAP[keys[i]];
var url = CDN_SVG + '/' + iconName + '-light.svg';
img.src = url;
img.setAttribute('data-glass-icon', iconName);
img.removeAttribute('onerror');
return;
}
}
// Also handle Tailscale by alt attribute (sidebar)
if (img.alt === 'Tailscale') {
var tsUrl = CDN_SVG + '/tailscale-light.svg';
if (src !== tsUrl) {
img.src = tsUrl;
img.setAttribute('data-glass-icon', 'tailscale');
img.removeAttribute('onerror');
}
}
});
}
@@ -359,10 +402,10 @@
function initIcons() {
// Initial replacement
setTimeout(replaceIcons, 500);
setTimeout(replaceTailscaleIcon, 500);
setTimeout(replacePluginIcons, 500);
// Second pass after FolderView finishes its DOM work
setTimeout(replaceIcons, 2000);
setTimeout(replaceTailscaleIcon, 2000);
setTimeout(replacePluginIcons, 2000);
// Start watching for future changes
startObserver();
}

949
style.css

File diff suppressed because it is too large Load Diff