collection css update

content/collection/open_the_blinds_and_meet_the_simple_warmth_of_home/index.md

@@ -9,6 +9,8 @@ url: "/collection/open_the_blinds_and_meet_the_simple_warmth_of_home/"
 image: "/img/collection/4646e6a4a20b4a9488f7aa1e517031a9.webp"
 cover_img : "/img/7092849b423442c0afac90e9a06c9098.webp"
 description: "台中 吳工程師｜新成屋<br>兩房兩廳｜31.6 坪<br>總預算 111.9 萬<br>"
+banner_img_text: "「我們一家人最常在開放式的客餐廚一起活動，彼此陪伴的感覺最棒了。」"
+homeowner: "聰明可愛的小比、爸爸、媽媽"
 size: "31.6坪"
 bed_num: "兩房兩廳"
 house_type: "大樓/新成屋"

layouts/collection/list.html

@@ -78,10 +78,10 @@
       <div class="row px-0 mx-0">
         {{ $paginator := .Paginate .Data.Pages }}
         {{ range $paginator.Pages }}
-        <div class="col-6 col-md-6 p-1">
+        <div class="col-12 col-md-6 p-1">
           <div class="bhouseweb_loc_sec02_card secimg mx-0 px-0 border-0">
             <a href="{{ .RelPermalink }}">
-              <img src="{{ .Params.Image | relURL }}" alt="">
+              <img class="img-fluid" src="{{ .Params.Image | relURL }}" alt="">
               <div class="sec02-p-dec p-1 mt-1 text-center">
                 <h5 class="card-title">{{ replace .Title "｜小寶優居・成家故事" "" }}</h5>
                 <p class="card-text">{{ .Description | safeHTML }}</p>

layouts/collection/single.html

@@ -9,6 +9,10 @@
 </div>
 <section class="style_house_banner container-fluid px-0">
     <img src="./{{ .Params.cover_img}}" alt="">
+    <div class="collection_banner_text_box">
+        <p>{{ .Params.banner_img_text}}</p>
+        <p>{{ .Params.homeowner}}｜{{ .Params.bed_num}}｜{{ .Params.size}}</p>
+      </div>
 </section>
 <div class="style_house_content">
     <div class="style_house_sec01">
@@ -312,16 +316,20 @@
                 class="fw-normal me-2">&lt;</span>回到成家故事案例</p>
     </a>
 </div>
-<hr class="style_house_line d-none d-md-block">
-<div class="style_house_content d-none d-md-block">
-    <div class="style_house_sec06">
+<hr class="style_house_line ">
+<div class="style_house_content home-content">
+    <div class="style_house_sec06 container-fluid px-0">
         <div class="row px-0 mx-0">
-            <div class="col-6 col-md-6">
-                <img class="img-fluid" src="/img/service planner.png" alt="">
-            </div>
-            <div class="col-6 col-md-6">
-                <img class="img-fluid" src="/img/qa.png" alt="">
-            </div>
+            <div class="col-6 col-sm-6 bg-portfolio ps-0">
+                <a href="/collection/">
+                  <div class="bg-img"></div>
+                </a>
+              </div>
+            <div class="col-6 col-sm-6 bg-qa pe-0">
+                <a href="/frequently_asked_questions/">
+                  <div class="bg-img"></div>
+                </a>
+              </div>
         </div>
     </div>
 </div>

themes/hugo-universal-theme-master/static/css/style.bhouse.css

@@ -358,7 +358,7 @@ img {
   left: 0;
   right: 0;
   bottom: 0px;
-  background-color: rgba(128, 143, 76, 0.6);
+  background-color: rgba(128, 143, 76, 0.8);
   text-align: end;
 }
 
@@ -858,6 +858,50 @@ img {
 
 /* Banner end */
 /* 成家故事作品集-collection start */
+.collection_banner_text_box {
+  padding: 20px 20vw;
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0px;
+  background-color: rgba(128, 143, 76, 0.8);
+  text-align: end;
+}
+
+@media screen and (max-width: 767px) {
+  .collection_banner_text_box {
+    padding: 20px 2vw 20px 0;
+  }
+}
+
+.collection_banner_text_box p {
+  margin: 0;
+  color: #ffffff;
+  font-size: 22px;
+  font-family: NSJP-500;
+  letter-spacing: 2px;
+}
+
+@media screen and (max-width: 767px) {
+  .collection_banner_text_box p {
+    font-size: 17px;
+  }
+}
+
+.collection_banner_text_box p:last-child {
+  font-size: 18px;
+}
+
+@media (max-width: 575px) {
+  .collection_banner_text_box p:last-child {
+    font-size: 14px;
+  }
+}
+
+.style_house_banner {
+  position: relative;
+}
+
 .select {
   border-bottom: 1.5px solid #565656 !important;
 }
@@ -1048,7 +1092,7 @@ img {
 
 @media screen and (max-width: 767px) {
   .bhouseweb_loc_sec02_card {
-    height: 160px;
+    height: 300px;
     padding: 0;
   }
 }
@@ -1086,14 +1130,14 @@ img {
 
 .bhouseweb_loc_sec02_card img {
   width: 100%;
-  height: 300px;
+  height: 100%;
   -o-object-fit: cover;
   object-fit: cover;
 }
 
 @media screen and (max-width: 767px) {
   .bhouseweb_loc_sec02_card img {
-    height: 100%;
+    height: 300px;
     -o-object-fit: cover;
     object-fit: cover;
   }
@@ -1110,6 +1154,22 @@ img {
 
 /* 成家故事作品集-collection end */
 /* 成家故事作品集內頁-simple_korean_style_hous start */
+.bg-portfolio .bg-img {
+  background-image: url(/img/home/X-1-02.png);
+}
+
+.bg-serve .bg-img {
+  background-image: url(/img/home/X-1-03.png);
+}
+
+.bg-qa .bg-img {
+  background-image: url(/img/home/X-1-04.png);
+}
+
+.bg-store .bg-img {
+  background-image: url(/img/home/X-1-05.png);
+}
+
 .icon-box img {
   margin-top: 0px;
   width: 35px;
@@ -1151,7 +1211,7 @@ img {
 
 @media screen and (max-width: 767px) {
   .style_house_banner img {
-    height: 150px;
+    height: 200px;
   }
 }
 

themes/hugo-universal-theme-master/static/css/style.bhouse.scss

@@ -374,7 +374,7 @@ img {
   left: 0;
   right: 0;
   bottom: 0px;
-  background-color: rgba(128, 143, 76, 0.6);
+  background-color: rgba(128, 143, 76, 0.8);
   text-align: end;
 }
 
@@ -878,6 +878,38 @@ img {
 
 /* Banner end */
 /* 成家故事作品集-collection start */
+.collection_banner_text_box{
+  padding: 20px 20vw;
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0px;
+  background-color: rgba(128, 143, 76, 0.8);
+  text-align: end;
+ 
+  @media screen and (max-width: 767px) {
+    padding: 20px 2vw 20px 0;
+  }
+  p{
+    margin: 0;
+    color: #ffffff;
+    font-size: 22px;
+    font-family: NSJP-500;
+    letter-spacing: 2px;
+    @media screen and (max-width: 767px) {
+      font-size: 17px;
+    }
+  }
+  p:last-child {
+    font-size: 18px;
+    @media (max-width: 575px) {
+      font-size: 14px;
+    }
+  }
+}
+.style_house_banner{
+  position: relative;
+}
 .select {
   // text-decoration: underline !important;
   border-bottom: 1.5px solid #565656 !important;
@@ -1067,7 +1099,7 @@ img {
 
 @media screen and (max-width: 767px) {
   .bhouseweb_loc_sec02_card {
-    height: 160px;
+    height: 300px;
     padding: 0;
   }
 }
@@ -1105,14 +1137,14 @@ img {
 
 .bhouseweb_loc_sec02_card img {
   width: 100%;
-  height: 300px;
+  height: 100%;
   -o-object-fit: cover;
   object-fit: cover;
 }
 
 @media screen and (max-width: 767px) {
   .bhouseweb_loc_sec02_card img {
-    height: 100%;
+    height: 300px;
     -o-object-fit: cover;
     object-fit: cover;
   }
@@ -1129,6 +1161,26 @@ img {
 
 /* 成家故事作品集-collection end */
 /* 成家故事作品集內頁-simple_korean_style_hous start */
+.bg-portfolio {
+  .bg-img {
+    background-image: url(/img/home/X-1-02.png);
+  }
+}
+.bg-serve {
+  .bg-img {
+    background-image: url(/img/home/X-1-03.png);
+  }
+}
+.bg-qa {
+  .bg-img {
+    background-image: url(/img/home/X-1-04.png);
+  }
+}
+.bg-store {
+  .bg-img {
+    background-image: url(/img/home/X-1-05.png);
+  }
+}
 .icon-box img {
   margin-top: 0px;
   width: 35px;
@@ -1172,7 +1224,7 @@ img {
 
 @media screen and (max-width: 767px) {
   .style_house_banner img {
-    height: 150px;
+    height: 200px;
   }
 }