Top-align all targets page table cell contents, other styling

Signed-off-by: Julius Volz <julius.volz@gmail.com>
This commit is contained in:
Julius Volz 2024-09-03 16:09:50 +02:00
parent eb175c88f6
commit d0ccbd2eb5
2 changed files with 14 additions and 7 deletions

View file

@ -325,7 +325,7 @@ const ScrapePoolList: FC<ScrapePoolListProp> = ({
: undefined,
}}
>
<Table.Td>
<Table.Td valign="top">
{/* TODO: Process target URL like in old UI */}
<EndpointLink
endpoint={target.scrapeUrl}
@ -333,19 +333,24 @@ const ScrapePoolList: FC<ScrapePoolListProp> = ({
/>
</Table.Td>
<Table.Td>
<Table.Td valign="top">
<TargetLabels
labels={target.labels}
discoveredLabels={target.discoveredLabels}
/>
</Table.Td>
<Table.Td>
<Group gap="xs" wrap="wrap">
<Table.Td valign="top">
<Group
gap="xs"
wrap="wrap"
justify="space-between"
>
<Tooltip
label="Last target scrape"
withArrow
>
<Badge
w="max-content"
variant="light"
className={badgeClasses.statsBadge}
styles={{
@ -365,6 +370,7 @@ const ScrapePoolList: FC<ScrapePoolListProp> = ({
withArrow
>
<Badge
w="max-content"
variant="light"
className={badgeClasses.statsBadge}
styles={{
@ -381,8 +387,9 @@ const ScrapePoolList: FC<ScrapePoolListProp> = ({
</Tooltip>
</Group>
</Table.Td>
<Table.Td>
<Table.Td valign="top">
<Badge
w="max-content"
className={healthBadgeClass(target.health)}
>
{target.health}
@ -391,7 +398,7 @@ const ScrapePoolList: FC<ScrapePoolListProp> = ({
</Table.Tr>
{target.lastError && (
<Table.Tr>
<Table.Td colSpan={5}>
<Table.Td colSpan={5} valign="top">
<Alert
color="red"
mb="sm"

View file

@ -14,7 +14,7 @@ const TargetLabels: FC<TargetLabelsProps> = ({ discoveredLabels, labels }) => {
const [showDiscovered, { toggle: toggleDiscovered }] = useDisclosure(false);
return (
<Stack my={showDiscovered ? "sm" : undefined}>
<Stack>
<Group wrap="nowrap" align="flex-start">
<LabelBadges labels={labels} />