Karl/homepage
1
0
Fork 0
mirror of https://github.com/karl0ss/homepage.git synced 2025-04-29 12:03:41 +01:00
Code Issues Packages Projects Releases Wiki Activity

Include tailwind bg-black/white, greedy ping regex, adjust position

Browse Source
This commit is contained in:
shamoon 2023-10-05 09:28:31 -07:00
parent b765330b4a
commit 4f41be512c
5 changed files with 12 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/services/item.jsx
View File

@ -77,7 +77,7 @@ export default function Item({ service, group }) {
</div>
)}
<div className={`absolute top-0 right-0 flex flex-row justify-end ${statusStyle === 'dot' ? 'gap-0' : 'gap-2'} mr-2 z-30 service-tags`}>
<div className={`absolute top-0 right-0 flex flex-row justify-end ${statusStyle === 'dot' ? 'gap-0' : 'gap-2 mr-2'} z-30 service-tags`}>
{service.ping && (
<div className="flex-shrink-0 flex items-center justify-center service-tag service-ping">
<Ping group={group} service={service.name} style={statusStyle} />

6
src/components/services/kubernetes-status.jsx
View File

@ -8,7 +8,7 @@ export default function KubernetesStatus({ service, style }) {
let statusLabel = t("docker.unknown");
let statusTitle = "";
let backgroundClass = "px-1.5 py-0.5 bg-theme-500/10 dark:bg-theme-900/50";
let colorClass = "text-black/20 dark:text-white/40 ";
let colorClass = "text-black/20 dark:text-white/40 opacity-20";
if (error) {
statusTitle = t("docker.error");
@ -29,8 +29,8 @@ export default function KubernetesStatus({ service, style }) {
}
if (style === 'dot') {
colorClass = colorClass.replace('text-', 'bg-').replace(/\/\d\d/, '');
backgroundClass = "p-3 hover:bg-theme-500/10 dark:hover:bg-theme-900/20";
colorClass = colorClass.replace(/text-/g, 'bg-').replace(/\/\d\d/g, '');
backgroundClass = "p-4 hover:bg-theme-500/10 dark:hover:bg-theme-900/20";
}
return (

8
src/components/services/ping.jsx
View File

@ -7,7 +7,7 @@ export default function Ping({ group, service, style }) {
refreshInterval: 30000
});
let colorClass = "text-black/20 dark:text-white/40";
let colorClass = "text-black/20 dark:text-white/40 opacity-20";
let backgroundClass = "bg-theme-500/10 dark:bg-theme-900/50 px-1.5 py-0.5";
let statusTitle = t("ping.http_status");
let statusText = "";
@ -28,7 +28,7 @@ export default function Ping({ group, service, style }) {
} else {
statusText = data.status;
}
} else {
} else if (data) {
const ping = t("common.ms", { value: data.latency, style: "unit", unit: "millisecond", maximumFractionDigits: 0 })
statusTitle += ` ${data.status} (${ping})`;
colorClass = "text-emerald-500/80";
@ -42,8 +42,8 @@ export default function Ping({ group, service, style }) {
}
if (style === "dot") {
backgroundClass = 'p-3';
colorClass = colorClass.replace('text-', 'bg-').replace(/\/\d\d/, '');
backgroundClass = 'p-4';
colorClass = colorClass.replace(/text-/g, 'bg-').replace(/\/\d\d/g, '');
}
return (

2
src/components/services/status.jsx
View File

@ -46,7 +46,7 @@ export default function Status({ service, style }) {
if (style === 'dot') {
colorClass = colorClass.replace('text-', 'bg-').replace(/\/\d\d$/, '');
backgroundClass = "p-3 hover:bg-theme-500/10 dark:hover:bg-theme-900/20";
backgroundClass = "p-4 hover:bg-theme-500/10 dark:hover:bg-theme-900/20";
}
return (

3
tailwind.config.js
View File

@ -70,5 +70,8 @@ module.exports = {
'lg:grid-cols-6',
'lg:grid-cols-7',
'lg:grid-cols-8',
'bg-white',
'bg-black',
'dark:bg-white',
],
}