🎨 style(dashboard): Optimize the layout of the Uptime card legend on the dashboard to resolve the issue where the last monitoring item is obscured

This commit is contained in:
Apple\Apple
2025-06-11 15:07:01 +08:00
parent dd21183261
commit 3123d4bb9b

View File

@@ -1279,9 +1279,8 @@ const Detail = (props) => {
} }
footer={uptimeData.length > 0 ? ( footer={uptimeData.length > 0 ? (
<Card <Card
shadows="always"
bordered={false} bordered={false}
className="!rounded-full backdrop-blur" className="!rounded-2xl backdrop-blur !shadow-none"
> >
<div className="flex flex-wrap gap-3 text-xs justify-center"> <div className="flex flex-wrap gap-3 text-xs justify-center">
{uptimeLegendData.map((legend, index) => ( {uptimeLegendData.map((legend, index) => (
@@ -1296,13 +1295,13 @@ const Detail = (props) => {
</div> </div>
</Card> </Card>
) : null} ) : null}
footerStyle={uptimeData.length > 0 ? { marginTop: '-100px' } : undefined} footerStyle={uptimeData.length > 0 ? { padding: '0px' } : undefined}
> >
<div className="card-content-container"> <div className="card-content-container">
<Spin spinning={uptimeLoading}> <Spin spinning={uptimeLoading}>
<div <div
ref={uptimeScrollRef} ref={uptimeScrollRef}
className="p-2 max-h-96 overflow-y-auto card-content-scroll" className="p-2 max-h-80 overflow-y-auto card-content-scroll"
onScroll={() => handleCardScroll(uptimeScrollRef, setShowUptimeScrollHint)} onScroll={() => handleCardScroll(uptimeScrollRef, setShowUptimeScrollHint)}
> >
{uptimeData.length > 0 ? ( {uptimeData.length > 0 ? (