cfel-base-components 1.0.1 → 1.0.3

package/demo/src/index.jsx

@@ -11,9 +11,13 @@ import PageContainer from '../../src/components/base-component/PageContainer';
 // import RoleInfo from '../../src/components/universal-pages/roleInfo';
 
 const App = () => {
-    return <PageContainer className={"aaa"}>
-        123
-    </PageContainer>
+    return <div className={"a"}>
+        <PageContainer >
+        123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123123
+        </PageContainer>
+    </div>
+
+
 }
 const container = document.getElementById('root');
 const root = createRoot(container);

package/demo/src/index.scss

@@ -1,3 +1,4 @@
-.bbb {
-    background: cyan;
+.a {
+    background: red;
+    height: calc(100vh - 48px);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cfel-base-components",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "description": "cfel-base-components",
   "main": "/src/index.tsx",
   "types": "src/index.d.ts",
@@ -22,6 +22,7 @@
     "@babel/preset-react": "^7.22.5",
     "@babel/preset-typescript": "^7.22.5",
     "@types/lodash": "^4.14.195",
+    "@types/node": "^20.5.3",
     "@types/react": "^18.2.14",
     "@types/react-dom": "^18.2.6",
     "axios": "^1.4.0",

package/src/components/base-component/PageContainer/index.module.less

@@ -1,13 +1,21 @@
+.wrap {
+  height: 100%;
+  overflow-y: auto;
+  padding: 12px 12px 0;
+  display: flex;
+  flex-direction: column;
+}
+
 .page-container {
   position: relative;
   background: white;
   border-radius: 8px;
   flex: 1;
+}
 
-  .foot-empower {
-    text-align: center;
-    color: #ccc;
-    font-size: 12px;
-    padding: 4px;
-  }
+.foot-empower {
+  text-align: center;
+  color: #ccc;
+  font-size: 12px;
+  padding: 4px;
 }

package/src/components/base-component/PageContainer/index.tsx

@@ -9,20 +9,20 @@ export default function PageContainer({
   ...restFileds
 }: any) {
   return (
-    <div
-      className={cx({
-        "page-container": true,
-        [className]: true,
-      })}
-      {...restFileds}
-    >
-      <div>
+    <div className={cx("wrap")}>
+      <div
+        className={cx({
+          "page-container": true,
+          [className]: true,
+        })}
+        {...restFileds}
+      >
         {children}
       </div>
 
       <div className={cx("foot-empower")}>
         ©{new Date().getFullYear() || ''} 橙蜂而来{' '}
       </div>
-    </div>
+    </div >
   )
 }

package/src/components/layout/index.scss

@@ -159,12 +159,9 @@ body {
 }
 
 .lios-content {
+    flex: 1;
     width: 100%;
     height: calc(100vh - 48px);
-    overflow-y: auto;
-    padding: 16px 16px 0;
-    display: flex;
-    flex-direction: column;
 }
 
 //用户卡片
@@ -174,7 +171,6 @@ body {
 
     .user-info {
         display: flex;
-        // justify-content: flex-start;
         margin-bottom: 12px;
 
         .author {

package/src/index.d.ts

@@ -10,4 +10,4 @@ declare module '*.module.less' {
 
 declare module '*.less'
 
-// export * from './index';
+export * from './index';