chore: layout

web/app/(commonLayout)/apps/check-legacy/components/header.tsx

@@ -2,21 +2,24 @@
 import type { FC } from 'react'
 import React from 'react'
 import { useTranslation } from 'react-i18next'
+import cn from '@/utils/classnames'
 
 const i18nPrefix = 'app.checkLegacy'
 
 type Props = {
+  className?: string,
   appNum: number,
   publishedNum: number,
 }
 
 const Header: FC<Props> = ({
+  className,
   appNum,
   publishedNum,
 }) => {
   const { t } = useTranslation()
   return (
-    <div>
+    <div className={cn(className)}>
       <div className='title-2xl-semi-bold text-text-primary'>{t(`${i18nPrefix}.title`)}</div>
       <div className='system-md-regular mt-1 text-text-tertiary'>{t(`${i18nPrefix}.description`, { num: appNum, publishedNum })}</div>
     </div>

web/app/(commonLayout)/apps/check-legacy/page.tsx

@@ -11,6 +11,7 @@ import Button from '@/app/components/base/button'
 import Pagination from '@/app/components/base/pagination'
 import { APP_PAGE_LIMIT } from '@/config'
 import { noop } from 'lodash'
+import Tip from './components/tip'
 
 const i18nPrefix = 'app.checkLegacy'
 const Page = () => {
@@ -41,12 +42,11 @@ const Page = () => {
   }, [published, t])
 
   return (
-    <div className='flex grow flex-col rounded-t-2xl border-t border-effects-highlight bg-background-default-subtle px-6 pt-4'>
+    <div className='flex grow rounded-t-2xl border-t border-effects-highlight bg-background-default-subtle px-6 pt-4'>
-      <Header appNum={5} publishedNum={3}/>
+      <div className='flex h-full grow flex-col pr-6'>
-      <div className='flex grow'>
+        <Header className='shrink-0' appNum={5} publishedNum={3}/>
-        <div className='flex flex-col'>
         {/* Filter */}
-          <div className='mb-2 mt-4 flex items-center justify-between'>
+        <div className='mb-2 mt-4 flex shrink-0 items-center justify-between'>
           <div className='flex items-center gap-2'>
             <Chip
               className='min-w-[150px]'
@@ -80,16 +80,18 @@ const Page = () => {
         </div>
         <List list={list} />
         {(total && total > APP_PAGE_LIMIT)
-            ? <Pagination
+          ? <div className='flex justify-end'><Pagination
             className='shrink-0'
             current={1}
             onChange={noop}
             total={total}
             limit={10}
             onLimitChange={noop}
-            />
+          /></div>
           : null}
       </div>
+      <div className='ml-3 shrink-0 pr-8 pt-[108px]'>
+        <Tip />
       </div>
     </div>
   )