mirror of
https://github.com/rustmailer/bichon.git
synced 2026-08-03 07:48:34 +02:00
fix: Large empty space at the bottom of the screen #98
This commit is contained in:
@@ -358,7 +358,7 @@ export function AccountActionDialog({ currentRow, open, onOpenChange }: Props) {
|
|||||||
onOpenChange(state);
|
onOpenChange(state);
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<DialogContent className="max-w-[95vw] md:max-w-5xl w-full p-0 overflow-hidden flex flex-col h-[90vh]">
|
<DialogContent className="max-w-[95vw] md:max-w-5xl w-full p-0 overflow-hidden flex flex-col h-[50rem]">
|
||||||
<div className="p-6 pb-2 flex-shrink-0">
|
<div className="p-6 pb-2 flex-shrink-0">
|
||||||
<DialogHeader className="text-left">
|
<DialogHeader className="text-left">
|
||||||
<DialogTitle>{isEdit ? t('accounts.updateAccount') : t('accounts.addAccount')}</DialogTitle>
|
<DialogTitle>{isEdit ? t('accounts.updateAccount') : t('accounts.addAccount')}</DialogTitle>
|
||||||
|
|||||||
@@ -85,7 +85,7 @@ export function RunningStateDialog({ currentRow, open, onOpenChange }: Props) {
|
|||||||
<span className="text-blue-500 font-medium truncate">{currentRow.email}</span>
|
<span className="text-blue-500 font-medium truncate">{currentRow.email}</span>
|
||||||
</DialogTitle>
|
</DialogTitle>
|
||||||
</DialogHeader>
|
</DialogHeader>
|
||||||
<ScrollArea className="max-h-[85vh] px-4 sm:px-6 pb-6">
|
<ScrollArea className="max-h-[55rem] px-4 sm:px-6 pb-6">
|
||||||
{isLoading && (
|
{isLoading && (
|
||||||
<div className="space-y-4 py-6">
|
<div className="space-y-4 py-6">
|
||||||
<Skeleton className="h-6 w-1/2" />
|
<Skeleton className="h-6 w-1/2" />
|
||||||
|
|||||||
@@ -111,7 +111,7 @@ export function MailList({
|
|||||||
/>
|
/>
|
||||||
<span className="text-xs text-muted-foreground">
|
<span className="text-xs text-muted-foreground">
|
||||||
{selected.size > 0
|
{selected.size > 0
|
||||||
? `${selected.size} ${t('common.selected')}`
|
? `${t('search.bulkActions.selected', { count: selected.size })}`
|
||||||
: t('common.selectAll')}
|
: t('common.selectAll')}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -340,7 +340,7 @@ export function Mail({
|
|||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
<Separator className="mb-2" />
|
<Separator className="mb-2" />
|
||||||
<ScrollArea className='h-[50rem] w-full pr-4 -mr-4 py-1'>
|
<ScrollArea className='h-[calc(100vh-8rem)] w-full pr-4 -mr-4 py-1'>
|
||||||
<div>
|
<div>
|
||||||
<AccountSwitcher onAccountSelect={(accountId) => {
|
<AccountSwitcher onAccountSelect={(accountId) => {
|
||||||
localStorage.setItem('mailbox:selectedAccountId', `${accountId}`);
|
localStorage.setItem('mailbox:selectedAccountId', `${accountId}`);
|
||||||
@@ -389,7 +389,7 @@ export function Mail({
|
|||||||
</div>
|
</div>
|
||||||
<Separator />
|
<Separator />
|
||||||
<div className="mt-2">
|
<div className="mt-2">
|
||||||
<ScrollArea className='h-[40rem] w-full pr-4 -mr-4 py-1'>
|
<ScrollArea className='h-[calc(100vh-14rem)] w-full pr-4 -mr-4 py-1'>
|
||||||
<MailList
|
<MailList
|
||||||
isLoading={isMessagesLoading}
|
isLoading={isMessagesLoading}
|
||||||
items={(envelopes?.items ?? []).sort((a, b) => {
|
items={(envelopes?.items ?? []).sort((a, b) => {
|
||||||
|
|||||||
@@ -32,7 +32,6 @@ export default function Mailboxes() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
{/* ===== Top Heading ===== */}
|
|
||||||
<FixedHeader />
|
<FixedHeader />
|
||||||
<Main>
|
<Main>
|
||||||
<Mail
|
<Mail
|
||||||
|
|||||||
@@ -151,7 +151,7 @@ export default function Search() {
|
|||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>}
|
</div>}
|
||||||
{total > 0 && <ScrollArea className='h-[40rem] w-full pr-4 -mr-4 py-1'>
|
{total > 0 && <ScrollArea className='h-[calc(100vh-14rem)] w-full pr-4 -mr-4 py-1'>
|
||||||
<MailList
|
<MailList
|
||||||
isLoading={isLoading}
|
isLoading={isLoading}
|
||||||
items={emails}
|
items={emails}
|
||||||
|
|||||||
@@ -147,7 +147,7 @@ export function MailList({
|
|||||||
/>
|
/>
|
||||||
<span className="text-xs text-muted-foreground">
|
<span className="text-xs text-muted-foreground">
|
||||||
{totalSelected > 0
|
{totalSelected > 0
|
||||||
? `${totalSelected} ${t('common.selected')}`
|
? `${t('search.bulkActions.selected', { count: totalSelected })}`
|
||||||
: t('common.selectAll')}
|
: t('common.selectAll')}
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -83,7 +83,7 @@ export function EnvelopeTags({ selectedTags, onTagToggle }: EnvelopeTagsProps) {
|
|||||||
{sortedTags.length === 0 ? (
|
{sortedTags.length === 0 ? (
|
||||||
<p className="py-2 pl-2 text-sm text-muted-foreground">{t('mail.noTagsYet')}</p>
|
<p className="py-2 pl-2 text-sm text-muted-foreground">{t('mail.noTagsYet')}</p>
|
||||||
) : (
|
) : (
|
||||||
<ScrollArea className="h-[45rem] w-full pr-4 -mr-4">
|
<ScrollArea className="h-[calc(100vh-12rem)] w-full pr-4 -mr-4">
|
||||||
{sortedTags.map(({ tag: facet, count }) => {
|
{sortedTags.map(({ tag: facet, count }) => {
|
||||||
const checked = selectedTags.includes(facet);
|
const checked = selectedTags.includes(facet);
|
||||||
const id = `tag-${facet}`;
|
const id = `tag-${facet}`;
|
||||||
|
|||||||
@@ -91,7 +91,7 @@ export function APITokens() {
|
|||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<ScrollArea className="h-[40rem] w-full pr-4 -mr-4 py-1">
|
<ScrollArea className="h-[calc(100vh-16rem)] w-full pr-4 -mr-4 py-1">
|
||||||
<TokenCardList tokens={tokens} userId={user.id} />
|
<TokenCardList tokens={tokens} userId={user.id} />
|
||||||
</ScrollArea>
|
</ScrollArea>
|
||||||
</>
|
</>
|
||||||
|
|||||||
@@ -44,7 +44,7 @@ export function Profile() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="w-full max-w-6xl ml-0 px-4">
|
<div className="w-full max-w-7xl ml-0 px-4">
|
||||||
<UserProfileForm user={user!} />
|
<UserProfileForm user={user!} />
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
|
|||||||
@@ -132,7 +132,7 @@ export function PermissionsDialog({
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<Dialog open={open} onOpenChange={onOpenChange}>
|
<Dialog open={open} onOpenChange={onOpenChange}>
|
||||||
<DialogContent className="max-w-3xl w-[90vw] overflow-hidden flex flex-col max-h-[90vh]">
|
<DialogContent className="max-w-4xl w-[90vw] overflow-hidden flex flex-col max-h-[90vh]">
|
||||||
<DialogHeader className="pb-4 border-b">
|
<DialogHeader className="pb-4 border-b">
|
||||||
<div className="flex items-center gap-3">
|
<div className="flex items-center gap-3">
|
||||||
<DialogTitle>{title}</DialogTitle>
|
<DialogTitle>{title}</DialogTitle>
|
||||||
|
|||||||
@@ -273,7 +273,7 @@ export function UserProfileForm({ user }: UserProfileFormProps) {
|
|||||||
})}
|
})}
|
||||||
</h2>
|
</h2>
|
||||||
|
|
||||||
<ScrollArea className="h-[32rem] pr-4">
|
<ScrollArea className="h-[calc(100vh-16rem)] pr-4">
|
||||||
<div className="grid grid-cols-1 gap-3">
|
<div className="grid grid-cols-1 gap-3">
|
||||||
{accessibleAccountIds.map((accountId) => {
|
{accessibleAccountIds.map((accountId) => {
|
||||||
const email = getEmailById(accountId)
|
const email = getEmailById(accountId)
|
||||||
|
|||||||
Reference in New Issue
Block a user