From d3befe37238a49bc1119b1ce5d66f25c071a3d87 Mon Sep 17 00:00:00 2001
From: Aaron Yu <yityu@microsoft.com>
Date: Mon, 27 Dec 2021 23:30:34 +0800
Subject: [PATCH] bug fix

---
 src/Components/pane/index.css          | 6 ++++++
 src/Components/pane/index.js           | 4 ++--
 src/Components/settingsFrame/index.css | 7 +++++++
 src/Components/settingsFrame/index.js  | 5 +----
 4 files changed, 16 insertions(+), 6 deletions(-)

diff --git a/src/Components/pane/index.css b/src/Components/pane/index.css
index b670ee9..236b58c 100644
--- a/src/Components/pane/index.css
+++ b/src/Components/pane/index.css
@@ -2,6 +2,8 @@
     width: 350px;
     background-color: rgb(52, 90, 176);
     min-height: 100vh;
+    display: flex;
+    flex-direction: column;
 }
 
 .modeSelect {
@@ -34,4 +36,8 @@
 .selectPager {
     left: 0 !important;
     width: 350px;
+}
+
+.bottomLogo {
+    margin-top: auto;
 }
\ No newline at end of file
diff --git a/src/Components/pane/index.js b/src/Components/pane/index.js
index 5a5f7c0..3212323 100644
--- a/src/Components/pane/index.js
+++ b/src/Components/pane/index.js
@@ -58,7 +58,7 @@ function Pane(props) {
   }
 
   useEffect(() => {
-    props.projects.length && setProject(props.projects[0].Name);
+    props.projects.length && !project && setProject(props.projects[0].Name);
   }, [props.projects])
 
   return (
@@ -136,7 +136,7 @@ function Pane(props) {
             </Select>
           }
         </div>
-        <img src={logoPanePng} alt='logo' width={'100%'}/>
+        <img src={logoPanePng} alt='logo' width={'100%'} className='bottomLogo'/>
     </div>
   );
 }
diff --git a/src/Components/settingsFrame/index.css b/src/Components/settingsFrame/index.css
index e69de29..aee3e09 100644
--- a/src/Components/settingsFrame/index.css
+++ b/src/Components/settingsFrame/index.css
@@ -0,0 +1,7 @@
+.setting-card {
+    background: #F5F4F2;
+    border: 1px solid #B1B1B1;
+    box-sizing: border-box;
+    box-shadow: 0px 5px 0px #B1B1B1;
+    border-radius: 8px;
+}
\ No newline at end of file
diff --git a/src/Components/settingsFrame/index.js b/src/Components/settingsFrame/index.js
index c8db369..20fef44 100644
--- a/src/Components/settingsFrame/index.js
+++ b/src/Components/settingsFrame/index.js
@@ -37,11 +37,8 @@ function SettingFrame(props) {
                       : ['无', '无', '无'])
                       .map((text, index) => (
                         <Grid item xs={2} sm={4} md={4} key={index}>
-                            <div style={{
-                              backgroundImage: `url('${settingCardPng}')`,
+                            <div className='setting-card' style={{
                               position: 'relative',
-                              backgroundRepeat: 'no-repeat',
-                              backgroundSize: '100% 100%',
                               height: '120px',
                               textAlign: 'center',
                               justifyContent: 'center',