Openstatus www.openstatus.dev
6
fork

Configure Feed

Select the types of activity you want to include in your feed.

Fix overflow issues on mobile for Status Pages (#391)

* Try this

* chore: style

---------

Co-authored-by: mxkaske <maximilian@kaske.org>

authored by

Atridad Lahiji
mxkaske
and committed by
GitHub
f7180a36 2c7bcc91

+7 -5
+1 -1
apps/web/src/app/status-page/[domain]/page.tsx
··· 39 39 ); 40 40 41 41 return ( 42 - <div className="grid gap-6"> 42 + <div className="mx-auto flex w-full flex-col gap-6"> 43 43 <Header 44 44 title={page.title} 45 45 description={page.description}
+2 -2
apps/web/src/components/dashboard/header.tsx
··· 20 20 )} 21 21 > 22 22 <div className="flex w-full flex-col gap-1"> 23 - <h1 className="font-cal truncate text-3xl">{title}</h1> 23 + <h1 className="font-cal text-3xl">{title}</h1> 24 24 {description ? ( 25 - <p className="text-muted-foreground truncate">{description}</p> 25 + <p className="text-muted-foreground">{description}</p> 26 26 ) : null} 27 27 </div> 28 28 {actions ? (
+4 -2
apps/web/src/components/tracker.tsx
··· 65 65 <div className="flex flex-col"> 66 66 <div className="mb-2 flex justify-between text-sm"> 67 67 <div className="flex items-center gap-2"> 68 - <p className="text-foreground font-semibold">{name}</p> 68 + <p className="text-foreground line-clamp-1 font-semibold">{name}</p> 69 69 {description ? ( 70 70 <MoreInfo {...{ url, id, context, description }} /> 71 71 ) : null} 72 72 </div> 73 - <p className="text-muted-foreground font-light">{uptime}% uptime</p> 73 + <p className="text-muted-foreground shrink-0 font-light"> 74 + {uptime}% uptime 75 + </p> 74 76 </div> 75 77 <div className="relative h-full w-full"> 76 78 <div className="flex gap-0.5">