From 5a8e5d093ac6ee65069e519a1550d8b1a2154452 Mon Sep 17 00:00:00 2001
From: ZhuangYumin <zhuangyumin@sjtu.edu.cn>
Date: Mon, 18 Dec 2023 06:31:59 +0000
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E4=BA=86=E6=A0=B7=E5=BC=8F?=
 =?UTF-8?q?=E5=92=8C=E5=9B=BE=E6=A0=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/Web/basic.css |  26 ++++++++++++++------------
 frontend/Web/book.ico  | Bin 0 -> 3085 bytes
 frontend/Web/index.js  |   3 +++
 3 files changed, 17 insertions(+), 12 deletions(-)
 create mode 100644 frontend/Web/book.ico

diff --git a/frontend/Web/basic.css b/frontend/Web/basic.css
index cfc1b08..1fed3a5 100644
--- a/frontend/Web/basic.css
+++ b/frontend/Web/basic.css
@@ -1,6 +1,9 @@
 body {
   margin: 0;
   font-family: Arial, sans-serif;
+  min-height: 100vh; /* 设置 body 的最小高度为视口的高度 */
+  display: flex;
+  flex-direction: column;
 }
 
 header {
@@ -22,7 +25,7 @@ header {
 }
 
 .user-bar span {
-  margin-right: 20px; /* Add spacing between "Welcome, Guest" and "Actions" */
+  margin-right: 20px;
 }
 
 .user-bar a {
@@ -43,15 +46,15 @@ header {
   padding: 10px 15px;
   background-color: #007bff;
   color: #fff;
-  border: 2px solid #0056b3; /* Dark blue border */
-  border-radius: 5px; /* Rounded corners */
+  border: 2px solid #0056b3;
+  border-radius: 5px;
   cursor: pointer;
   display: inline-block;
 }
 
 .action-button:hover,
 .dropdown-content:hover {
-  background-color: #87CEFA; /* Light blue background on hover */
+  background-color: #87CEFA;
 }
 
 .dropdown {
@@ -62,12 +65,12 @@ header {
 .dropdown-content {
   display: none;
   position: absolute;
-  background-color: #87CEFA; /* Light blue background */
+  background-color: #87CEFA;
   box-shadow: 0 8px 16px rgba(0,0,0,0.1);
   z-index: 1;
   max-width: 150px;
   right: 0;
-  top: 100%; /* Position below the action button */
+  top: 100%;
 }
 
 .dropdown-content a {
@@ -75,9 +78,9 @@ header {
   padding: 10px;
   text-decoration: none;
   color: #333;
-  text-align: center; /* Horizontally center the text */
-  width: 100%; /* Make the width 100% */
-  box-sizing: border-box; /* Include padding in the width */
+  text-align: center;
+  width: 100%;
+  box-sizing: border-box;
 }
 
 .dropdown-content a:hover {
@@ -89,8 +92,7 @@ header {
 }
 
 .main-content {
-  /*margin-top: 40px; /* Adjust margin to account for the fixed user-bar */
-  height: 80vh;
+  flex: 1;
   display: flex;
 }
 
@@ -98,7 +100,7 @@ nav {
   width: 200px;
   background-color: #f4f4f4;
   padding: 20px;
-  height: 80vh;
+  min-height: calc(100vh - 70px); /* 70px 是 header 的高度，设置 nav 的最小高度 */
 }
 
 nav a {
diff --git a/frontend/Web/book.ico b/frontend/Web/book.ico
new file mode 100644
index 0000000000000000000000000000000000000000..8815c92d396dfad977bf95634b95ced0b8f825b4
GIT binary patch
literal 3085
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

literal 0
HcmV?d00001

diff --git a/frontend/Web/index.js b/frontend/Web/index.js
index 1e5dbe8..4415771 100644
--- a/frontend/Web/index.js
+++ b/frontend/Web/index.js
@@ -111,6 +111,9 @@ backend.stdout.on('data', (data) => {
 app.get('/', (req, res) => {
   res.sendFile(join(__dirname, 'index.html'));
 });
+app.get('/favicon.ico', (req, res) => {
+  res.sendFile(join(__dirname, 'book.ico'));
+});
 app.get('/communication.js', (req, res) => {
   res.sendFile(join(__dirname, 'communication.js'));
 });