MUD6 推广移动统一设计

client/src/pages/MobileNotificationsPage.tsx

@@ -115,7 +115,7 @@ export function MobileNotificationsPage() {
         }
       />
 
-      <section className="card-std space-y-4 p-4" data-testid="mobile-notifications-list">
+      <section className="mobile-card space-y-4" data-testid="mobile-notifications-list">
         <div className="space-y-3">
           <Tabs
             data-testid="mobile-notifications-filter-tabs"
@@ -160,7 +160,7 @@ export function MobileNotificationsPage() {
         </div>
 
         {listQuery.isLoading ? (
-          <div className="rounded-lg border border-dashed border-zinc-200 p-6 text-center text-sm text-zinc-500">加载中...</div>
+          <div className="mobile-empty-state">加载中...</div>
         ) : null}
 
         {listQuery.isError ? (
@@ -170,13 +170,13 @@ export function MobileNotificationsPage() {
         ) : null}
 
         {!listQuery.isLoading && !listQuery.isError && !notificationItems.length ? (
-          <div className="rounded-lg border border-dashed border-zinc-200 p-6 text-center text-sm text-zinc-500">暂无通知</div>
+          <div className="mobile-empty-state">暂无通知</div>
         ) : null}
 
         {notificationItems.map((item) => {
           const targetLink = resolveMobileNotificationTarget(item);
           return (
-            <article data-testid="mobile-notification-card" key={item.id} className="rounded-lg border border-zinc-200 bg-white p-4">
+            <article data-testid="mobile-notification-card" key={item.id} className="mobile-list-card">
               <div className="flex items-start justify-between gap-3">
                 <div className="min-w-0">
                   <div className="text-sm font-semibold text-zinc-900">{item.title}</div>