small collapsing improvments

This commit is contained in:
zmeyer44 2023-11-02 16:03:21 -04:00
parent 9b0de0d129
commit 70b10bbd56
4 changed files with 6 additions and 6 deletions

View File

@ -218,13 +218,13 @@ export default function Header({ event }: { event: NDKEvent }) {
{!!location && (
<div className="flex flex-1 items-center gap-3">
<LocationIcon />
<div className="">
<div className="overflow-hidden">
{location.length > 2 ? (
<>
<p className="text-bold text-sm @xl:text-base">
<p className="text-bold line-clamp-2 text-sm @xl:text-base">
{location[1]}
</p>
<p className="text-xs text-muted-foreground @xl:text-sm">
<p className="line-clamp-2 text-xs text-muted-foreground @xl:text-sm">
{location[2]}
</p>
</>

View File

@ -5,7 +5,7 @@ type SmallCalendarIconProps = {
};
export default function SmallCalendarIcon({ date }: SmallCalendarIconProps) {
return (
<div className="center h-10 w-10 overflow-hidden rounded-sm border bg-background text-muted-foreground">
<div className="center h-10 w-10 shrink-0 overflow-hidden rounded-sm border bg-background text-muted-foreground">
<div className="w-full text-center">
<div className="bg-muted p-[2px] text-[10px] font-semibold uppercase">
{formatDate(date, "MMM")}

View File

@ -2,7 +2,7 @@ import { HiOutlineMapPin } from "react-icons/hi2";
export default function LocationIcon() {
return (
<div className="center h-10 w-10 overflow-hidden rounded-sm border bg-muted text-muted-foreground">
<div className="center h-10 w-10 shrink-0 overflow-hidden rounded-sm border bg-muted text-muted-foreground">
<div className="center w-full text-center">
<div className="text-center text-[14px] font-medium">
<HiOutlineMapPin className="h-5 w-5" />

View File

@ -232,7 +232,7 @@ export default function CreateCalendarEventModal({
<div className="shrink-0">
<SmallCalendarIcon date={startDate ?? new Date()} />
</div>
<div className="flex-1 shrink-0 divide-y overflow-hidden rounded-md bg-muted sm:max-w-[300px]">
<div className="flex-1 shrink-0 divide-y overflow-hidden rounded-md bg-muted sm:min-w-[300px] sm:max-w-[300px]">
<div className="flex justify-between p-0.5 px-2 pl-3">
<div className="flex w-[50px] items-center">Start</div>
<div className="flex-1 shrink-0">