Merge branch 'branch1' into 'main'

itemDetail See merge request !3

Merge branch 'branch1' into 'main'
c63d334f · Haoyu Sun · 6862d5b3 · 96eb2d2e · c63d334f · c63d334f
Commit c63d334f authored 9 months ago by Haoyu Sun
--- a/src/main/resources/static/css/ItemDetail.css
+++ b/src/main/resources/static/css/ItemDetail.css
+.logo-section img {
+    height: 50px;
+    width: 50px;
+}
+/*.nav{*/
+/*    ul {*/
+/*        list-style: none;*/
+/*        padding: 0;*/
+/*        margin: 0;*/
+/*        li {*/
+/*            display: inline;*/
+/*            margin: 0 15px;*/
+/*            a {*/
+/*                text-decoration: none;*/
+/*                color: #333;*/
+/*            }*/
+/*        }*/
+/*    }*/
+/*}*/
+.logo-section img {
+    height: 50px; /* Logo height */
+}
+.nav ul {
+    list-style: none; /* cancel default list style */
+    padding: 0; /* cancel default padding */
+    margin: 0; /* cancel default margin */
+}
+.nav li {
+    display: inline; /* make list arranged in horizontal pattern */
+    margin: 0 15px; /* add left and right spacing */
+}
+.nav a {
+    text-decoration: none; /* remove underline */
+    color: #333; /* link color */
+}
\ No newline at end of file
--- a/src/main/resources/templates/page/itemDetail.html
+++ b/src/main/resources/templates/page/itemDetail.html
@@ -4,6 +4,7 @@
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
+        <link rel="stylesheet" href="../../css/ItemDetail.css">
        <script>
            function sendRequest() {
                alert("exchange message send successful");
@@ -12,6 +13,18 @@
    </head>
    <body>
 <!--        <div>itemDetail</div>-->
+        <div class="logo-section">
+            <img th:src="@{/images/logo.jpg}" alt="Logo">
+        </div>
+        <nav class="nav">
+            <ul>
+                <li><a th:href="@{/index}">Index</a></li>
+                <li><a th:href="@{/groupList}">GroupList</a></li>
+                <li><a th:href="@{/itemList}">Shelf Item</a></li>
+                <li><a th:href="@{/personalInformation}">Personal Information</a></li>
+            </ul>
+        </nav>
        <table>
            <!--    thead-->
            <thead>