fix: 样式修改
This commit is contained in:
parent
07557a3c88
commit
f6f5c2828b
@ -2,12 +2,19 @@ import Announcement from '@/components/announcement';
|
||||
import { SidebarInset, SidebarProvider } from '@workspace/ui/components/sidebar';
|
||||
import { cookies } from 'next/headers';
|
||||
import { SidebarLeft } from './sidebar-left';
|
||||
// import { SidebarTrigger } from '@workspace/ui/components/sidebar';
|
||||
|
||||
export default async function DashboardLayout({ children }: { children: React.ReactNode }) {
|
||||
const cookieStore = await cookies();
|
||||
const defaultOpen = cookieStore.get('sidebar:state')?.value === 'true';
|
||||
|
||||
return (
|
||||
<SidebarProvider className='container'>
|
||||
<SidebarLeft className='sticky w-[288px] border-r-0 bg-transparent lg:flex' />
|
||||
<SidebarInset className='relative p-4'>{children}</SidebarInset>
|
||||
<SidebarProvider className='' defaultOpen={defaultOpen}>
|
||||
<SidebarLeft className='w-[288px] border-r-0 bg-transparent lg:flex' />
|
||||
<SidebarInset className='relative flex-grow overflow-hidden'>
|
||||
{/*<SidebarTrigger />*/}
|
||||
<div className='h-[calc(100vh-56px)] flex-grow gap-4 overflow-auto p-4'>{children}</div>
|
||||
</SidebarInset>
|
||||
{/*<SidebarRight className='sticky top-[84px] hidden w-[288px] border-r-0 bg-transparent 2xl:flex' />*/}
|
||||
<Announcement type='popup' Authorization={(await cookies()).get('Authorization')?.value} />
|
||||
</SidebarProvider>
|
||||
|
||||
@ -18,7 +18,15 @@ export default function Header() {
|
||||
const { user } = useGlobalStore();
|
||||
const Logo = (
|
||||
<Link href='/' className='-mt-2.5 flex items-center gap-2 font-bold'>
|
||||
<Image src={'image.png'} width={102} height={49} alt='logo' unoptimized />
|
||||
<Image
|
||||
src={'image.png'}
|
||||
width={102}
|
||||
height={49}
|
||||
alt='logo'
|
||||
fill={true}
|
||||
objectFit='cover'
|
||||
unoptimized
|
||||
/>
|
||||
</Link>
|
||||
);
|
||||
|
||||
@ -28,7 +36,7 @@ export default function Header() {
|
||||
<>
|
||||
<header className='fixed top-10 z-50 w-full'>
|
||||
<div className={'container'}>
|
||||
<div className='flex h-[73px] items-center justify-between rounded-[50px] bg-white pl-4 pr-1 md:pl-7'>
|
||||
<div className='flex h-[60px] items-center justify-between rounded-[50px] bg-white pl-4 pr-1 sm:h-[73px] md:pl-7'>
|
||||
<nav className='flex-col gap-6 font-medium md:flex md:flex-row md:items-center md:gap-5 md:text-sm lg:gap-6'>
|
||||
{Logo}
|
||||
</nav>
|
||||
@ -45,7 +53,7 @@ export default function Header() {
|
||||
size: 'lg',
|
||||
variant: 'outline',
|
||||
}),
|
||||
'h-full rounded-[50px] border-0 border-[#0F2C53] bg-[#0F2C53] px-5 text-xl font-bold text-white transition hover:bg-[#225BA9] hover:text-white md:px-14 md:text-2xl',
|
||||
'h-full rounded-[50px] border-0 border-[#0F2C53] bg-[#0F2C53] px-5 text-[16px] font-bold text-white transition hover:bg-[#225BA9] hover:text-white sm:px-14 sm:text-2xl',
|
||||
)}
|
||||
>
|
||||
{t('login')}
|
||||
|
||||
@ -18,7 +18,7 @@ export default function HomeContent() {
|
||||
任何地点
|
||||
</h1>
|
||||
{/* 副标题 */}
|
||||
<div className='mb-16 text-left text-[17px] leading-normal text-white sm:text-center sm:font-bold'>
|
||||
<div className='mb-12 text-left text-[17px] leading-normal text-white sm:mb-16 sm:text-center sm:font-bold'>
|
||||
<p className={'w-[255px] sm:w-full'}>
|
||||
<span className='mr-2 text-white'>
|
||||
Airo<sup className='text-[8px]'>™</sup>Port
|
||||
@ -30,7 +30,7 @@ export default function HomeContent() {
|
||||
{/* 按钮 */}
|
||||
<Button
|
||||
onClick={() => dialogRef.current?.show()}
|
||||
className='mb-8 h-auto rounded-full border-2 border-white bg-white/10 px-8 py-2 text-lg font-bold text-white transition hover:bg-white/20 sm:py-4 sm:text-2xl'
|
||||
className='mb-8 h-auto rounded-full border-2 border-white bg-white/10 px-8 py-2 text-lg font-bold text-white transition hover:bg-white/25 sm:py-4 sm:text-2xl'
|
||||
>
|
||||
查看订阅套餐
|
||||
</Button>
|
||||
|
||||
@ -49,7 +49,7 @@ const EmptyState = ({ message }: { message: string }) => (
|
||||
|
||||
// 价格显示组件
|
||||
const PriceDisplay = ({ plan }: { plan: ProcessedPlanData }) => (
|
||||
<div className='mb-4 sm:mb-8'>
|
||||
<div className='mb-2 sm:mb-4'>
|
||||
<div className='mb-1 flex items-baseline gap-2'>
|
||||
{plan.origin_price && (
|
||||
<span className='text-lg font-bold leading-[1.125em] text-[#666666] line-through sm:text-xl md:text-[24px]'>
|
||||
@ -100,23 +100,26 @@ const FeatureList = ({ plan }: { plan: ProcessedPlanData }) => {
|
||||
];
|
||||
|
||||
return (
|
||||
<div className='mt-6 space-y-0 sm:mt-8'>
|
||||
<ul className='space-y-1'>
|
||||
<div className='mt-6 space-y-0 sm:mt-6'>
|
||||
<ul className='list-disc space-y-1'>
|
||||
{features.map((feature) => (
|
||||
<li key={feature.label} className='flex items-start justify-between py-1'>
|
||||
<span className='text-xs font-light leading-[1.8461538461538463em] text-black sm:text-[13px]'>
|
||||
{feature.label}：
|
||||
</span>
|
||||
<span className='text-right text-xs font-light leading-[1.8461538461538463em] text-black sm:text-[13px]'>
|
||||
{feature.value}
|
||||
</span>
|
||||
<li
|
||||
key={feature.label}
|
||||
className='py-1 text-xs font-light leading-[1.8461538461538463em] text-black sm:text-[13px]'
|
||||
>
|
||||
<div className={'flex items-start justify-between'}>
|
||||
<span className=''>{feature.label}：</span>
|
||||
<span>{feature.value}</span>
|
||||
</div>
|
||||
</li>
|
||||
))}
|
||||
<li className='flex items-start justify-between py-1'>
|
||||
<span className='text-xs font-light leading-[1.8461538461538463em] text-black sm:text-[13px]'>
|
||||
网络稳定指数:
|
||||
</span>
|
||||
<StarRating rating={plan.features?.stability || 4} />
|
||||
<li className='py-1'>
|
||||
<div className={'flex items-start justify-between'}>
|
||||
<span className='text-xs font-light leading-[1.8461538461538463em] text-black sm:text-[13px]'>
|
||||
网络稳定指数:
|
||||
</span>
|
||||
<StarRating rating={plan.features?.stability || 4} />
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user