style: pagecontainer padding

src/pages/dashboard/components/resource-utilization.tsx

@@ -95,6 +95,7 @@ const UtilizationOvertime: React.FC = () => {
       <LineChart
         data={result}
         locale={locale}
+        height={390}
         labelFormatter={labelFormatter}
         slider={sliderConfig}
       />

src/pages/dashboard/index.tsx

@@ -1,3 +1,4 @@
+import { PageContainer } from '@ant-design/pro-components';
 import { Spin } from 'antd';
 import { useEffect, useState } from 'react';
 import { queryDashboardData } from './apis';
@@ -27,14 +28,16 @@ const Dashboard: React.FC = () => {
     getDashboardData();
   }, []);
   return (
-    <Spin spinning={loading}>
-      <DashboardContext.Provider value={{ ...data }}>
-        <Overview></Overview>
-        <SystemLoad></SystemLoad>
-        <Usage></Usage>
-        <ActiveTable></ActiveTable>
-      </DashboardContext.Provider>
-    </Spin>
+    <PageContainer ghost extra={[]}>
+      <Spin spinning={loading}>
+        <DashboardContext.Provider value={{ ...data }}>
+          <Overview></Overview>
+          <SystemLoad></SystemLoad>
+          <Usage></Usage>
+          <ActiveTable></ActiveTable>
+        </DashboardContext.Provider>
+      </Spin>
+    </PageContainer>
   );
 };
 

src/pages/playground/components/ground-left.tsx

@@ -2,7 +2,6 @@ import TransitionWrapper from '@/components/transition';
 import HotKeys from '@/config/hotkeys';
 import { fetchChunkedData, readStreamData } from '@/utils/fetch-chunk-data';
 import { EyeInvisibleOutlined } from '@ant-design/icons';
-import { PageContainer } from '@ant-design/pro-components';
 import { useIntl } from '@umijs/max';
 import { Button, Input, Spin } from 'antd';
 import _ from 'lodash';
@@ -185,7 +184,7 @@ const MessageList: React.FC<MessageProps> = (props) => {
 
   return (
     <div className="ground-left">
-      <PageContainer title={false} className="message-list-wrap">
+      <div className="message-list-wrap">
         <div style={{ marginBottom: 40 }}>
           <TransitionWrapper
             header={renderLabel()}
@@ -227,7 +226,7 @@ const MessageList: React.FC<MessageProps> = (props) => {
             </Spin>
           )}
         </div>
-      </PageContainer>
+      </div>
       <div className="ground-left-footer">
         <ChatFooter
           onClear={handleClear}

src/pages/playground/index.tsx

@@ -1,4 +1,4 @@
-import CardWrapper from '@/components/card-wrapper';
+import { PageContainer } from '@ant-design/pro-components';
 import { useSearchParams } from '@umijs/max';
 import { Divider } from 'antd';
 import { useState } from 'react';
@@ -27,8 +27,8 @@ const Playground: React.FC = () => {
   };
 
   return (
-    <div style={{ padding: '32px 40px' }}>
-      <CardWrapper>
+    <div>
+      <PageContainer ghost extra={[]}>
         <div className="play-ground">
           <div className="chat">
             <GroundLeft parameters={params}></GroundLeft>
@@ -45,7 +45,7 @@ const Playground: React.FC = () => {
             />
           </div>
         </div>
-      </CardWrapper>
+      </PageContainer>
     </div>
   );
 };

src/pages/playground/style/chat-footer.less

@@ -1,7 +1,7 @@
 .chat-footer {
   display: flex;
   align-items: center;
-  padding-inline: 26px;
+  padding-inline: 0 32px;
   height: 100px;
   // box-shadow: 0px -1px 2px 0px var(--ant-color-border);
 }

src/pages/playground/style/ground-left.less

@@ -2,14 +2,11 @@
   position: relative;
   height: calc(100vh - 84px);
   padding-bottom: 120px;
+  padding-right: 32px;
 
   .message-list-wrap {
     max-height: calc(100vh - 152px);
     overflow-y: auto;
-
-    .ant-pro-page-container-children-container {
-      padding-inline: 16px 26px;
-    }
   }
 
   .ground-left-footer {

src/pages/profile/index.tsx

@@ -44,7 +44,10 @@ const Profile: React.FC = () => {
         extra={[]}
       >
         <CardWrapper
-          style={{ padding: '32px', marginTop: '70px', width: 'max-content' }}
+          style={{
+            padding: 'var(--layout-content-inlinepadding)',
+            width: 'max-content'
+          }}
         >
           <Form
             style={{ width: '524px' }}