fix(dashboard): css issues with large modals on overview
This commit is contained in:
@@ -45,7 +45,7 @@ export function LayoutSidebar({
|
||||
type="button"
|
||||
onClick={() => setActive(false)}
|
||||
className={cn(
|
||||
'fixed bottom-0 left-0 right-0 top-0 z-50 backdrop-blur-sm transition-opacity',
|
||||
'fixed bottom-0 left-0 right-0 top-0 z-40 backdrop-blur-sm transition-opacity',
|
||||
active
|
||||
? 'pointer-events-auto opacity-100'
|
||||
: 'pointer-events-none opacity-0',
|
||||
@@ -53,7 +53,7 @@ export function LayoutSidebar({
|
||||
/>
|
||||
<div
|
||||
className={cn(
|
||||
'fixed left-0 top-0 z-50 flex h-screen w-72 flex-col border-r border-border bg-card transition-transform',
|
||||
'fixed left-0 top-0 z-40 flex h-screen w-72 flex-col border-r border-border bg-card transition-transform',
|
||||
'-translate-x-72 lg:-translate-x-0', // responsive
|
||||
active && 'translate-x-0', // force active on mobile
|
||||
)}
|
||||
|
||||
@@ -132,7 +132,7 @@ export default function Billing({ organization }: Props) {
|
||||
|
||||
return (
|
||||
<div className="row gap-2 whitespace-nowrap">
|
||||
<div className="items-center text-right justify-end gap-4 flex-1 row">
|
||||
<div className="items-center text-right justify-end gap-4 flex-1 col md:row">
|
||||
<span>
|
||||
{new Intl.NumberFormat('en-US', {
|
||||
style: 'currency',
|
||||
|
||||
@@ -57,7 +57,9 @@ export default function SideEffects({ organization }: SideEffectsProps) {
|
||||
</>
|
||||
}
|
||||
/>
|
||||
<Billing organization={organization} />
|
||||
<div className="-mx-4 mt-4">
|
||||
<Billing organization={organization} />
|
||||
</div>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
</>
|
||||
|
||||
Reference in New Issue
Block a user