dvorakmortonxd/dvorakmortonxd.dev
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fixed the mobile UI bugs

Browse source
This commit is contained in:
Martin Dvořák 2026-09-22 23:16:08 +02:00
commit 6ac8159ce2
3 changed files with 40 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/app/components/ServiceButton.tsx
View file

@ -3,14 +3,11 @@
import React, { useEffect, useState, ReactNode } from 'react';
export default function ServiceButton({ url, checkUrl, className, icon, name, desc, access, disabled }: { url: string, checkUrl?: string, className: string, icon: ReactNode, name: string, desc: string, access?: 'public' | 'private' | 'on_request', disabled?: boolean }) {
const [status, setStatus] = useState<'pending' | 'up' | 'down'>(disabled ? 'up' : 'pending');
const [status, setStatus] = useState<'pending' | 'up' | 'down'>('pending');
useEffect(() => {
// Disabled buttons are decorative: skip the health check and stay green.
if (disabled) {
setStatus('up');
return;
}
// Disabled buttons are decorative: skip the health check.
if (disabled) return;
const checkStatus = async () => {
try {
@ -25,9 +22,11 @@ export default function ServiceButton({ url, checkUrl, className, icon, name, de
checkStatus();
}, [url, checkUrl, disabled]);
const statusColor = status === 'up' ? '#4ade80' : status === 'down' ? '#ef4444' : '#9ca3af';
const statusGlow = status === 'up' ? 'rgba(74, 222, 128, 0.9)' : status === 'down' ? 'rgba(239, 68, 68, 0.9)' : 'transparent';
const statusLabel = status === 'up' ? 'Active' : status === 'down' ? 'Dead' : 'Checking...';
// Disabled buttons always read as green without a state update in the effect.
const effectiveStatus = disabled ? 'up' : status;
const statusColor = effectiveStatus === 'up' ? '#4ade80' : effectiveStatus === 'down' ? '#ef4444' : '#9ca3af';
const statusGlow = effectiveStatus === 'up' ? 'rgba(74, 222, 128, 0.9)' : effectiveStatus === 'down' ? 'rgba(239, 68, 68, 0.9)' : 'transparent';
const statusLabel = effectiveStatus === 'up' ? 'Active' : effectiveStatus === 'down' ? 'Dead' : 'Checking...';
const isFriend = className === 'friend';
const content = (