fixing modal and buttons textwrap

This commit is contained in:
zmeyer44 2023-10-25 08:43:29 -04:00
parent ff491e6ed2
commit fa56d2717b
5 changed files with 6 additions and 8 deletions

View File

@ -93,7 +93,7 @@ export default function ProfilePage({
</div>
)}
</div>
<div className="flex items-center gap-3">
<div className="flex flex-wrap items-center justify-end gap-3">
{currentUser?.pubkey === pubkey && !mySubscription && (
<Button
onClick={() => modal?.show(<CreateSubecriptionTierModal />)}

View File

@ -81,9 +81,7 @@ export default function Modal({
}
}}
>
<div className="center max-h-[90vh] grow overflow-hidden">
{children}
</div>
<div className="center grow overflow-hidden">{children}</div>
</motion.div>
</FocusTrap>
<motion.div

View File

@ -64,13 +64,13 @@ export default function Leaflet({
<div className="-mr-1 h-1 w-6 rounded-full bg-muted transition-all group-active:rotate-12" />
<div className="h-1 w-6 rounded-full bg-muted transition-all group-active:-rotate-12" />
</div>
<div className="bottom-tabs scrollbar-muted-foreground max-h-[calc(95vh_-_28px)] w-full overflow-y-auto scrollbar-track-background">
<div className="bottom-tabs scrollbar-muted-foreground max-h-[calc(95vh_-_28px)] w-full overflow-y-auto pb-5 scrollbar-track-background">
{children}
</div>
</motion.div>
<motion.div
key="leaflet-backdrop"
className="z-overlay fixed inset-0 bg-background/40 backdrop-blur"
className="fixed inset-0 z-overlay bg-background/40 backdrop-blur"
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
exit={{ opacity: 0 }}

View File

@ -18,7 +18,7 @@ export default function Template({ title, children, className }: ModalProps) {
return (
<div
className={cn(
"relative w-full grow bg-background p-4 shadow md:rounded-lg md:border md:p-6",
"relative max-h-full w-full grow bg-background p-4 shadow sm:max-h-[85vh] sm:overflow-y-auto md:rounded-lg md:border md:p-6",
className,
)}
>

View File

@ -5,7 +5,7 @@ import Spinner from "../spinner";
import { cn } from "@/lib/utils";
const buttonVariants = cva(
"relative inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
"relative whitespace-nowrap inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
{
variants: {
variant: {