diff --git a/src/components/services/group.jsx b/src/components/services/group.jsx index f646f553..20375536 100644 --- a/src/components/services/group.jsx +++ b/src/components/services/group.jsx @@ -23,10 +23,7 @@ export default function ServicesGroup({ if (layout?.initiallyCollapsed ?? groupsInitiallyCollapsed) panel.current.style.height = `0`; }, [layout, groupsInitiallyCollapsed]); - let groupMargin = layout?.header === false ? "-my-1" : ""; - if (isSubgroup && layout?.header === false) groupMargin = "-my-3"; - - let groupPadding = layout?.header === false ? "px-1" : "p-1"; + let groupPadding = layout?.header === false ? "px-1" : "p-1 pb-0"; if (isSubgroup) groupPadding = ""; return ( @@ -36,7 +33,6 @@ export default function ServicesGroup({ "services-group flex-1", layout?.style === "row" ? "basis-full" : "basis-full md:basis-1/2 lg:basis-1/3 xl:basis-1/4", layout?.style !== "row" && fiveColumns ? "3xl:basis-1/5" : "", - groupMargin, groupPadding, isSubgroup ? "subgroup" : "", )} @@ -89,6 +85,7 @@ export default function ServicesGroup({ services={group.services} layout={layout} useEqualHeights={useEqualHeights} + header={layout?.header !== false} /> {group.groups?.length > 0 && ( <div diff --git a/src/components/services/item.jsx b/src/components/services/item.jsx index adf5fc97..4d233b44 100644 --- a/src/components/services/item.jsx +++ b/src/components/services/item.jsx @@ -86,7 +86,7 @@ export default function Item({ service, groupName, useEqualHeights }) { <div className={`absolute top-0 right-0 flex flex-row justify-end ${ statusStyle === "dot" ? "gap-0" : "gap-2 mr-2" - } z-30 service-tags`} + } z-10 service-tags`} > {service.ping && ( <div className="flex-shrink-0 flex items-center justify-center service-tag service-ping"> diff --git a/src/components/services/list.jsx b/src/components/services/list.jsx index c15d6aed..63fcea38 100644 --- a/src/components/services/list.jsx +++ b/src/components/services/list.jsx @@ -4,12 +4,13 @@ import { columnMap } from "../../utils/layout/columns"; import Item from "components/services/item"; -export default function List({ groupName, services, layout, useEqualHeights }) { +export default function List({ groupName, services, layout, useEqualHeights, header }) { return ( <ul className={classNames( layout?.style === "row" ? `grid ${columnMap[layout?.columns]} gap-x-2` : "flex flex-col", - "mt-3 services-list", + header ? "mt-3" : "", + "services-list", )} > {services.map((service) => (