Modify category css

Suyeon Jung
Commit 2b32bbef0111c9dc1e1f97d446fe73541d297df1 2b32bbef 1 parent 050f4ed5
Showing 4 changed files with 35 additions and 22 deletions
public/css/category.css
public/css/result.css
routes/category.js
views/components/category.ejs
--- a/public/css/category.css
View file @2b32bbe
+++ b/public/css/category.css
View file @2b32bbe
-
 .card-body {
     text-align: center;
 }
-body{
+
+body {
     font-family: 'Noto Sans KR', sans-serif;
 }
-.category{
+
+.category {
     text-align: center;
     margin-left: auto;
     margin-right: auto;
     width: 70%;
 }
-.card{
+.card-title {
+    font-size: medium;
+    font-weight: bold;
+}
+
+.card-text {
+    font-size: small;
+}
+
+.btn {
+    font-weight: bold;
+    font-size: x-small;
 }
\ No newline at end of file
--- a/public/css/result.css
View file @2b32bbe
+++ b/public/css/result.css
View file @2b32bbe
@@ -31,6 +31,7 @@ body {
     border: dotted 1px gray;
     width: 75%;
 }
-body{
+
+body {
     font-family: 'Noto Sans KR', sans-serif;
 }
\ No newline at end of file
--- a/routes/category.js
View file @2b32bbe
+++ b/routes/category.js
View file @2b32bbe
@@ -414,7 +414,7 @@ router.get('/transport', function(req, res) {
                     }
                     console.log(busStations);
                     console.log('subwayStaions', subwayStations);
-                    res.render('result', { category: 'transport', busStations: busStations, subwayStations: subwayStations, userLocation: userLocation, grade: grade })
+                    res.render('result', { category: 'transport', busStations: busStations, subwayStations: subwayStations, userLocation: userLocation, grade: 'A' })
                 }
             })
--- a/views/components/category.ejs
View file @2b32bbe
+++ b/views/components/category.ejs
View file @2b32bbe
 <div class="category">
-    <div class="card mx-auto mb-2" style ="margin-left: 30%;">
+    <div class="card mx-auto mb-2" style="margin-left: 30%;">
         <div class="d-flex align-items-center">
             <div class="card" style="width: 18rem;">
                 <img src="/img/restaurant.jpg" class="card-img-top" alt="...">
                 <div class="card-body">
                     <h5 class="card-title">음식</h5>
-                    <p class="card-text">주변 음식점의 수</p>
+                    <p class="card-text">주변 맛집 및 패스트푸드점</p>
-                    <a href="/category/food" class="btn btn-primary">검사!</a>
+                    <a href="/category/food" class="btn btn-warning">검사 ✍️</a>
                 </div>
             </div>
             <div class="card" style="width: 18rem;">
                 <img src="/img/school.jpg" class="card-img-top" alt="...">
                 <div class="card-body">
                     <h5 class="card-title">학군</h5>
-                    <p class="card-text">주변 학원 및 도서관 현황</p>
+                    <p class="card-text">주변 도서관 및 학원</p>
-                    <a href="/category/school" class="btn btn-primary">검사!</a>
+                    <a href="/category/school" class="btn btn-warning">검사 ✍️</a>
                 </div>
             </div>
             <div class="card" style="width: 18rem;">
@@ -22,44 +22,44 @@
                 <div class="card-body">
                     <h5 class="card-title">공원</h5>
                     <p class="card-text">주변 공원</p>
-                    <a href="/category/park" class="btn btn-primary">검사!</a>
+                    <a href="/category/park" class="btn btn-warning">검사 ✍️</a>
                 </div>
             </div>
             <div class="card" style="width: 18rem;">
                 <img src="/img/transport.jpg" class="card-img-top" alt="...">
                 <div class="card-body">
                     <h5 class="card-title">대중교통</h5>
-                    <p class="card-text">대중교통 편리도</p>
+                    <p class="card-text">주변 버스, 지하철역</p>
-                    <a href="/category/transport" class="btn btn-primary">검사!</a>
+                    <a href="/category/transport" class="btn btn-warning">검사 ✍️</a>
                 </div>
             </div>
         </div>
     </div>
-    <div class="card mx-auto mb-2"style ="margin-left: 30%;">
+    <div class="card mx-auto mb-2" style="margin-left: 30%;">
         <div class="d-flex align-items-center">
             <div class="card" style="width: 18rem;">
                 <img src="/img/safe.jpg" class="card-img-top img-f" alt="...">
                 <div class="card-body">
                     <h5 class="card-title">안전</h5>
-                    <p class="card-text">주변 경찰서, 범죄자 인근~</p>
+                    <p class="card-text">주변 CCTV, 보안등 현황</p>
-                    <a href="/category/safe" class="btn btn-primary">검사!</a>
+                    <a href="/category/safe" class="btn btn-warning">검사 ✍️</a>
                 </div>
             </div>
             <div class="card" style="width: 18rem;">
                 <img src="/img/cultural_life.jpg" class="card-img-top" alt="...">
                 <div class="card-body">
                     <h5 class="card-title">여가</h5>
-                    <p class="card-text">주변 문화시설</p>
+                    <p class="card-text">주변 영화관</p>
-                    <a href="/category/culture" class="btn btn-primary">검사!</a>
+                    <a href="/category/culture" class="btn btn-warning">검사 ✍️</a>
                 </div>
             </div>
             <div class="card" style="width: 18rem;">
                 <img src="/img/shopping.jpg" class="card-img-top" alt="...">
                 <div class="card-body">
                     <h5 class="card-title">쇼핑</h5>
-                    <p class="card-text">주변 백화점, 마트, 재래시장</p>
+                    <p class="card-text">주변 마트 및 재래시장</p>
-                    <a href="/category/shop" class="btn btn-primary">검사!</a>
+                    <a href="/category/shop" class="btn btn-warning">검사 ✍️</a>
                 </div>
             </div>
             <div class="card" style="width: 18rem;">
@@ -67,7 +67,7 @@
                 <div class="card-body">
                     <h5 class="card-title">운동</h5>
                     <p class="card-text">주변 운동시설</p>
-                    <a href="/category/gym" class="btn btn-primary">검사!</a>
+                    <a href="/category/gym" class="btn btn-warning">검사 ✍️</a>
                 </div>
             </div>
         </div>