Client/ppanel-web
5
0
Fork 0
mirror of https://github.com/perfect-panel/ppanel-web.git synced 2026-02-15 12:51:11 -05:00
Code Issues Packages Projects Releases Wiki Activity

💄 style(ui): Update mobile style

Browse Source
This commit is contained in:
web@ppanel 2024-11-15 14:30:52 +07:00
parent b023d0feff
commit eda18bc551
3 changed files with 9 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
apps/admin/app/dashboard/layout.tsx
View File

@ -1,6 +1,5 @@
import { Header } from '@/components/header'; import { Header } from '@/components/header';
import { SidebarLeft } from '@/components/sidebar-left'; import { SidebarLeft } from '@/components/sidebar-left';
import { ScrollArea } from '@shadcn/ui/scroll-area';
import { SidebarInset, SidebarProvider } from '@shadcn/ui/sidebar'; import { SidebarInset, SidebarProvider } from '@shadcn/ui/sidebar';
import { cookies } from 'next/headers'; import { cookies } from 'next/headers';
@ -10,11 +9,9 @@ export default async function DashboardLayout({ children }: { children: React.Re
return ( return (
<SidebarProvider defaultOpen={defaultOpen}> <SidebarProvider defaultOpen={defaultOpen}>
<SidebarLeft /> <SidebarLeft />
<SidebarInset className='flex-grow overflow-hidden'> <SidebarInset className='relative flex-grow overflow-hidden'>
<Header /> <Header />
<div className='flex h-[calc(100vh-56px)] flex-1 flex-col gap-4 p-4'> <div className='h-[calc(100vh-56px)] gap-4 overflow-auto p-4'>{children}</div>
<ScrollArea className='h-full flex-grow overflow-hidden'>{children}</ScrollArea>
</div>
</SidebarInset> </SidebarInset>
</SidebarProvider> </SidebarProvider>
); );

10
apps/user/app/(main)/(user)/order/purchase.tsx
View File

@ -76,11 +76,11 @@ export default function Purchase({
if (!open) setSubscribe(undefined); if (!open) setSubscribe(undefined);
}} }}
> >
<DialogContent className='flex h-full max-w-screen-lg flex-col overflow-hidden border-none md:h-auto'> <DialogContent className='flex h-full max-w-screen-lg flex-col overflow-hidden border-none p-0 md:h-auto'>
<DialogHeader> <DialogHeader className='p-6 pb-0'>
<DialogTitle>{t('buySubscription')}</DialogTitle> <DialogTitle>{t('buySubscription')}</DialogTitle>
</DialogHeader> </DialogHeader>
<div className='grid w-full gap-3 lg:grid-cols-2'> <div className='grid w-full flex-grow gap-3 overflow-auto p-6 pt-0 lg:grid-cols-2'>
<Card className='border-transparent shadow-none md:border-inherit md:shadow'> <Card className='border-transparent shadow-none md:border-inherit md:shadow'>
<CardContent className='grid gap-3 p-0 text-sm md:p-6'> <CardContent className='grid gap-3 p-0 text-sm md:p-6'>
<SubscribeDetail <SubscribeDetail
@ -110,7 +110,7 @@ export default function Purchase({
quantity: Number(value), quantity: Number(value),
}); });
}} }}
className='flex flex-wrap gap-2' className='flex flex-wrap gap-0.5 *:w-20 md:gap-2'
> >
<div className='relative'> <div className='relative'>
<RadioGroupItem value='1' id='1' className='peer sr-only' /> <RadioGroupItem value='1' id='1' className='peer sr-only' />
@ -154,7 +154,7 @@ export default function Purchase({
</div> </div>
<div className='font-semibold'>{t('paymentMethod')}</div> <div className='font-semibold'>{t('paymentMethod')}</div>
<RadioGroup <RadioGroup
className='grid grid-cols-5 gap-2' className='mb-6 grid grid-cols-5 gap-2'
value={params.payment} value={params.payment}
onValueChange={(value) => { onValueChange={(value) => {
setParams({ setParams({

4
packages/ui/src/pro-table/pagination.tsx
View File

@ -21,11 +21,11 @@ interface PaginationProps<TData> {
export function Pagination<TData>({ table, text }: PaginationProps<TData>) { export function Pagination<TData>({ table, text }: PaginationProps<TData>) {
return ( return (
<div className='flex flex-wrap items-center justify-between gap-2'> <div className='flex flex-wrap items-center justify-between gap-2'>
<div className='text-muted-foreground flex-1 whitespace-nowrap'> <div className='text-muted-foreground flex-1 whitespace-nowrap text-center sm:text-left'>
{text?.textPageOf?.(table.getState().pagination.pageIndex + 1, table.getPageCount()) || {text?.textPageOf?.(table.getState().pagination.pageIndex + 1, table.getPageCount()) ||
`Page ${table.getState().pagination.pageIndex + 1} of ${table.getPageCount()}`} `Page ${table.getState().pagination.pageIndex + 1} of ${table.getPageCount()}`}
</div> </div>
<div className='flex items-center gap-2'> <div className='flex flex-grow items-center justify-center gap-2 sm:justify-end'>
<div className='flex items-center space-x-2'> <div className='flex items-center space-x-2'>
<p className='font-medium'>{text?.textRowsPerPage || 'Rows per page'}</p> <p className='font-medium'>{text?.textRowsPerPage || 'Rows per page'}</p>
<Select <Select