danvics/Pulse
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Refine grouped guest indentation

Browse source
This commit is contained in:
rcourtman 2025-10-29 08:43:02 +00:00
parent b3285c05c8
commit 7ee417a629
2 changed files with 8 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
frontend-modern/src/components/Dashboard/GuestRow.tsx
View file

@ -19,6 +19,9 @@ const editingValues = new Map<string, string>();
// Signal to trigger reactivity when editing values change // Signal to trigger reactivity when editing values change
const [editingValuesVersion, setEditingValuesVersion] = createSignal(0); const [editingValuesVersion, setEditingValuesVersion] = createSignal(0);
const GROUPED_FIRST_CELL_INDENT = 'pl-5 sm:pl-6 lg:pl-8';
const DEFAULT_FIRST_CELL_INDENT = 'pl-4';
const buildGuestId = (guest: Guest) => { const buildGuestId = (guest: Guest) => {
if (guest.id) return guest.id; if (guest.id) return guest.id;
if (guest.instance === guest.node) { if (guest.instance === guest.node) {
@ -411,9 +414,7 @@ export function GuestRow(props: GuestRowProps) {
const firstCellClass = createMemo(() => { const firstCellClass = createMemo(() => {
const base = const base =
'py-0.5 pr-2 whitespace-nowrap relative w-[160px] sm:w-[200px] lg:w-[240px] xl:w-[280px] 2xl:w-[340px]'; 'py-0.5 pr-2 whitespace-nowrap relative w-[160px] sm:w-[200px] lg:w-[240px] xl:w-[280px] 2xl:w-[340px]';
const indent = props.isGroupedView const indent = props.isGroupedView ? GROUPED_FIRST_CELL_INDENT : DEFAULT_FIRST_CELL_INDENT;
? 'pl-5 sm:pl-6 lg:pl-8'
: 'pl-4';
return `${base} ${indent}`; return `${base} ${indent}`;
}); });

6
frontend-modern/src/components/Docker/DockerUnifiedTable.tsx
View file

@ -308,6 +308,8 @@ const buildRowId = (host: DockerHost, row: DockerRow) => {
return `service:${host.id}:${row.service.id ?? row.service.name}`; return `service:${host.id}:${row.service.id ?? row.service.name}`;
}; };
const GROUPED_RESOURCE_INDENT = 'pl-5 sm:pl-6 lg:pl-8';
const DockerHostGroupHeader: Component<{ host: DockerHost; colspan: number }> = (props) => { const DockerHostGroupHeader: Component<{ host: DockerHost; colspan: number }> = (props) => {
const displayName = props.host.displayName || props.host.hostname || props.host.id; const displayName = props.host.displayName || props.host.hostname || props.host.id;
@ -580,7 +582,7 @@ const DockerContainerRow: Component<{
onClick={toggle} onClick={toggle}
aria-expanded={expanded()} aria-expanded={expanded()}
> >
<td class="pl-5 sm:pl-6 lg:pl-8 pr-2 py-0.5"> <td class={`${GROUPED_RESOURCE_INDENT} pr-2 py-0.5`}>
<div class="flex items-center gap-1.5 min-w-0"> <div class="flex items-center gap-1.5 min-w-0">
{/* Name - show input when editing, otherwise show name with optional link */} {/* Name - show input when editing, otherwise show name with optional link */}
<Show <Show
@ -1016,7 +1018,7 @@ const DockerServiceRow: Component<{
onClick={toggle} onClick={toggle}
aria-expanded={expanded()} aria-expanded={expanded()}
> >
<td class="pl-5 sm:pl-6 lg:pl-8 pr-2 py-0.5"> <td class={`${GROUPED_RESOURCE_INDENT} pr-2 py-0.5`}>
<div class="flex items-center gap-1.5 min-w-0"> <div class="flex items-center gap-1.5 min-w-0">
{/* Name - show input when editing, otherwise show name with optional link */} {/* Name - show input when editing, otherwise show name with optional link */}
<Show <Show