gsadmin/pulse
1
0
Fork 0
mirror of https://github.com/rcourtman/Pulse.git synced 2026-09-23 11:46:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: use inset box-shadow for storage table alert borders to match NodeSummaryTable

Browse Source
This commit is contained in:
Pulse Monitor
2025-09-03 12:08:36 +00:00
parent 132f52d10b
commit 7595fbd644
1 changed files with 11 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend-modern/src/components/Storage/Storage.tsx
+11 -7
View File
@@ -292,15 +292,19 @@ const Storage: Component = () => {
: '';
const rowClass = `${isDisabled ? 'opacity-60' : ''} ${alertBg} hover:shadow-sm transition-all duration-200`;
const firstCellClass = alertStyles.hasAlert
? (alertStyles.severity === 'critical'
? 'p-0.5 pr-1.5 pl-2 border-l-4 border-l-red-500 dark:border-l-red-400'
: 'p-0.5 pr-1.5 pl-2 border-l-4 border-l-yellow-500 dark:border-l-yellow-400')
: 'p-0.5 px-1.5';
// Create row style with inset box-shadow for alert border
const rowStyle = createMemo(() => {
const styles: any = {};
if (alertStyles.hasAlert) {
const color = alertStyles.severity === 'critical' ? '#ef4444' : '#eab308';
styles['box-shadow'] = `inset 4px 0 0 0 ${color}`;
}
return styles;
});
return (
<tr class={`${rowClass} hover:bg-gray-50 dark:hover:bg-gray-700/30 transition-colors`}>
<td class={firstCellClass}>
<tr class={`${rowClass} hover:bg-gray-50 dark:hover:bg-gray-700/30 transition-colors`} style={rowStyle()}>
<td class={`p-0.5 ${alertStyles.hasAlert ? 'pl-3 pr-1.5' : 'px-1.5'}`}>
<div class="flex items-center gap-2">
<span class="text-sm font-medium text-gray-900 dark:text-gray-100">
{storage.name}