比例选择样式修改

video-gen-app/src/components/Layout/AppLayout.tsx

@@ -124,11 +124,12 @@ const StorageCard: React.FC<{ data: ResourceCapacityData | null }> = ({ data })
   return (
     <div
       style={{
-        marginTop: 12,
-        padding: '10px 12px',
+        // marginTop: 12,
+        padding: '0 12px',
+        paddingTop: 6,
         borderRadius: 10,
         background: 'linear-gradient(135deg, rgba(248, 250, 252, 0.9) 0%, rgba(241, 245, 249, 0.9) 100%)',
-        border: `1px solid ${isOver ? 'rgba(239, 68, 68, 0.25)' : 'rgba(99, 102, 241, 0.15)'}`,
+        // border: `1px solid ${isOver ? 'rgba(239, 68, 68, 0.25)' : 'rgba(99, 102, 241, 0.15)'}`,
         boxShadow: '0 2px 12px rgba(0, 0, 0, 0.04)',
       }}
     >
@@ -144,7 +145,7 @@ const StorageCard: React.FC<{ data: ResourceCapacityData | null }> = ({ data })
       >
         <span style={{ display: 'flex', alignItems: 'center', gap: 4 }}>
           <DatabaseOutlined style={{ fontSize: 12, color: isOver ? '#ef4444' : '#6366f1' }} />
-          资源存储
+          {rawPercent.toFixed(1)}%
         </span>
         {data.enabled ? (
           <span style={{ fontWeight: 500, color: isOver ? '#ef4444' : '#1e293b' }}>
@@ -188,12 +189,12 @@ const StorageCard: React.FC<{ data: ResourceCapacityData | null }> = ({ data })
               color: isOver ? '#ef4444' : '#94a3b8',
             }}
           >
-            <span>
+            {/* <span>
               {isOver
                 ? `存储超额 · 超用 ${Math.abs(available).toFixed(2)} ${unit}`
                 : `剩余 ${available.toFixed(2)} ${unit}`}
-            </span>
-            <span>{rawPercent.toFixed(1)}%</span>
+            </span> */}
+            {/* <span>{rawPercent.toFixed(1)}%</span> */}
           </div>
         </>
       )}
@@ -801,14 +802,16 @@ const AppLayout: React.FC = () => {
           <PlusOutlined style={{ fontSize: 16 }} />
           <span>充值积分</span>
         </div>
+        {/* 资源存储容量展示（来自 getUser.resourceCapacity） */}
+          <StorageCard data={resourceCapacity} />
 
-        <div style={{ padding: '16px 16px', flexShrink: 0 }}>
+        <div style={{ padding: '16px 16px', flexShrink: 0 ,paddingTop: 0}}>
           <Dropdown menu={{ items: userMenuItems, onClick: handleUserMenuClick }} placement="topRight" arrow>
             <div style={{
               display: 'flex', alignItems: 'center',
               justifyContent: 'flex-start',
               gap: 12,
-              padding: '10px 14px',
+              // padding: '10px 14px',
               borderRadius: 14, cursor: 'pointer',
               transition: 'all 0.25s ease',
               background: 'linear-gradient(135deg, rgba(248, 250, 252, 0.9) 0%, rgba(241, 245, 249, 0.9) 100%)',
@@ -829,6 +832,7 @@ const AppLayout: React.FC = () => {
                   flexShrink: 0,
                   boxShadow: '0 4px 12px rgba(99, 102, 241, 0.3)',
                 }} />
+                
               <div style={{ flex: 1, minWidth: 0 }}>
                 <div style={{ color: '#1e293b', fontSize: 16, fontWeight: 600, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap', letterSpacing: -0.01 }}>
                   {user?.username}
@@ -847,8 +851,7 @@ const AppLayout: React.FC = () => {
             </div>
           </Dropdown>
 
-          {/* 资源存储容量展示（来自 getUser.resourceCapacity） */}
-          <StorageCard data={resourceCapacity} />
+          
         </div>
       </div>