style : UI Header, 관리자 컷

donsonioc2010 · Sep 24, 2023 · 1c13a53 · 1c13a53
1 parent 0348871
commit 1c13a53
Show file tree

Hide file tree

Showing 5 changed files with 41 additions and 23 deletions.
diff --git a/Api/src/main/resources/static/css/adminlist.css b/Api/src/main/resources/static/css/adminlist.css
@@ -6,7 +6,7 @@
 /*    justify-content: center;*/
 /*    min-height: 20px;*/
 /*}*/
-
+/*
 h1 {
     font-size: 40px;
     margin-bottom: 20px;
@@ -53,11 +53,11 @@ button:hover {
     display: flex;
     justify-content: center;
 }
-
-.image-container img {
-    display: block; /* 이미지를 블록 요소로 설정하여 가운데 정렬 적용 */
-    margin: 0 auto; /* 가운데 정렬을 위한 마진 설정 */
-}
+*/
+/*.image-container img {*/
+/*    display: block; !* 이미지를 블록 요소로 설정하여 가운데 정렬 적용 *!*/
+/*    margin: 0 auto; !* 가운데 정렬을 위한 마진 설정 *!*/
+/*}*/
 
 div.admin-title-row{
     display: flex;

diff --git a/Api/src/main/resources/static/css/index.css b/Api/src/main/resources/static/css/index.css
@@ -36,6 +36,10 @@ div.title-sector {
     justify-content: space-between;
 }
 
+div.title-sector>div>h1.title {
+    color: #90debe;
+}
+
 div.title-sector>button.more {
     border-radius: 100px;
     background: #18ACDB;

diff --git a/Api/src/main/resources/templates/admin/list.html b/Api/src/main/resources/templates/admin/list.html
@@ -9,11 +9,15 @@
 <main layout:fragment="content">
     <div class="container">
         <link rel="stylesheet" type="text/css" href="/static/css/adminlist.css">
-        <div class="admin-title-row">
-            <h1>관리자 대쉬보드</h1>
-            <input type="button" value="계정 생성" class="btn btn-primary" style="height: 50%;" th:if="${session.loginUser.userRole.name().equals('ADMIN')}" />
+        <div class="row">
+            <div class="col">
+                <div class="admin-title-row">
+                    <h1>관리자 대쉬보드</h1>
+                    <input type="button" value="계정 생성" class="btn btn-primary" style="height: 50%;" th:if="${session.loginUser.userRole.name().equals('ADMIN')}" />
+                </div>
+            </div>
         </div>
-        <table border="1">
+        <table class="table">
             <thead>
             <tr>
                 <th>ID</th>
@@ -24,7 +28,7 @@ <h1>관리자 대쉬보드</h1>
                 <th>승인 버튼</th>
             </tr>
             </thead>
-            <tbody>
+            <tbody class="table-group-divider">
             <tr th:each="picture : ${pictures}" th:if="${#strings.equals(picture.pictureStatus,'BEFORE_APPROVE')}">
                 <td>
                     <a th:href="@{'/admin/detail/' + ${picture.pictureId}}"><span th:text="${picture.pictureId}"></span></a>

diff --git a/Api/src/main/resources/templates/admin/memberList.html b/Api/src/main/resources/templates/admin/memberList.html
@@ -9,14 +9,18 @@
 <main layout:fragment="content">
     <div class="container">
         <link rel="stylesheet" type="text/css" href="/static/css/adminlist.css">
-        <div class="admin-title-row">
-            <h1>관리자 계정 대쉬보드</h1>
-            <input type="button" value="계정 생성" class="btn btn-primary" style="height: 50%;"
-                   onClick="moveForm();"
-                   th:if="${session.loginUser.userRole.name().equals('ADMIN')}" />
+        <div class="row">
+            <div class="col">
+                <div class="admin-title-row">
+                    <h1>관리자 계정 대쉬보드</h1>
+                    <input type="button" value="계정 생성" class="btn btn-primary" style="height: 50%;"
+                           onClick="moveForm();"
+                           th:if="${session.loginUser.userRole.name().equals('ADMIN')}"/>
+                </div>
+            </div>
         </div>
 
-        <table border="1">
+        <table  class="table">
             <thead>
             <tr>
                 <th>ID 번호</th>
@@ -27,7 +31,7 @@ <h1>관리자 계정 대쉬보드</h1>
                 <th>프로필 링크</th>
             </tr>
             </thead>
-            <tbody>
+            <tbody class="table-group-divider">
             <tr th:each="user : ${users}">
                 <td th:text="${user.id}"></td>
                 <td th:text="${user.email}"></td>
@@ -42,8 +46,8 @@ <h1>관리자 계정 대쉬보드</h1>
 </main>
 <th:block layout:fragment="script">
     <script type="application/javascript" th:inline="javascript">
-        function moveForm(){
-            location.href=window.location.origin+"/admin/form"
+        function moveForm() {
+            location.href = window.location.origin + "/admin/form"
         }
     </script>
     <script type="text/javascript">

diff --git a/Api/src/main/resources/templates/index.html b/Api/src/main/resources/templates/index.html
@@ -11,7 +11,10 @@
     <div class="container body">
         <div class="auction-container">
             <div class="title-sector">
-                <h1 class="title">경매 예정작</h1>
+                <div style="display: flex; align-items: center;">
+                    <h1 class="title" style="margin-right: 10px;">경매 예정작</h1>
+                    <h3><span class="badge rounded-pill text-bg-primary">NEW</span></h3>
+                </div>
                 <button type="button" class="btn btn-primary more" onclick="">more</button>
             </div>
             <swiper-container
@@ -59,8 +62,11 @@ <h1 class="title">경매 예정작</h1>
 
         <div class="auction-container" style="margin-bottom: 100px;">
             <div class="title-sector">
-                <h1 class="title">경매 진행중</h1>
-                <button type="button" class="btn btn-primary more" onclick="">more</button>
+                <div style="display: flex; align-items: center;">
+                    <h1 class="title" style="margin-right: 10px;">경매 진행중</h1>
+                    <h3><span class="badge rounded-pill text-bg-info">ING</span></h3>
+                </div>
+                <button type="button" class="btn btn-info more" onclick="">more</button>
             </div>
             <swiper-container
                     class="swiper"