(incubator-answer) branch dev updated: refactor(ui): Refactor flex layout

[sh...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

shuai pushed a commit to branch dev
in repository https://gitbox.apache.org/repos/asf/incubator-answer.git


The following commit(s) were added to refs/heads/dev by this push:
     new 9853a60c refactor(ui): Refactor flex layout
9853a60c is described below

commit 9853a60c6aa7221497798c67fc7d95bf354861f3
Author: robin <ro...@rnode.me>
AuthorDate: Sun Apr 7 18:01:13 2024 +0800

    refactor(ui): Refactor flex layout
---
 ui/src/components/SideNav/index.scss | 1 -
 ui/src/pages/Layout/index.tsx        | 2 +-
 ui/src/pages/SideNavLayout/index.tsx | 4 ++--
 3 files changed, 3 insertions(+), 4 deletions(-)

diff --git a/ui/src/components/SideNav/index.scss b/ui/src/components/SideNav/index.scss
index d8bcc8f1..0cf6201b 100644
--- a/ui/src/components/SideNav/index.scss
+++ b/ui/src/components/SideNav/index.scss
@@ -48,7 +48,6 @@
     width: 1px;
     height: 100%;
     background-color: var(--bs-border-color);
-    min-height: calc(100vh - 62px - 74px);
   }
 }
 
diff --git a/ui/src/pages/Layout/index.tsx b/ui/src/pages/Layout/index.tsx
index f0a061bd..cf7a2f1b 100644
--- a/ui/src/pages/Layout/index.tsx
+++ b/ui/src/pages/Layout/index.tsx
@@ -75,7 +75,7 @@ const Layout: FC = () => {
         }}>
         <Header />
         {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events */}
-        <div className="position-relative page-wrap">
+        <div className="position-relative page-wrap d-flex flex-column flex-fill">
           {httpStatusCode ? (
             <HttpErrorContent httpCode={httpStatusCode} />
           ) : (
diff --git a/ui/src/pages/SideNavLayout/index.tsx b/ui/src/pages/SideNavLayout/index.tsx
index 26840158..773d572c 100644
--- a/ui/src/pages/SideNavLayout/index.tsx
+++ b/ui/src/pages/SideNavLayout/index.tsx
@@ -27,8 +27,8 @@ import '@/common/sideNavLayout.scss';
 
 const Index: FC = () => {
   return (
-    <Container>
-      <Row>
+    <Container className="d-flex flex-column flex-fill">
+      <Row className="flex-fill">
         <SideNav />
         <Col xl={10} lg={9} md={12}>
           <Outlet />