New_Bhouse_Web/layouts/collection/single.html

{{ define "main" }}
<section class="bhouseweb_loc_banner d-md-none d-block">
  <div class="card bg-transparent text-white border-0 rounded-0">
    <img src="/img/bn_portfolio2x.png" class="banner-img card-img" alt="...">
  </div>
</section>
<div class="style_house_ads">
  <h2 class="style_house_title style_house_text m-0">{{ .Params.title }}</h2>
</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.room_count }}｜{{ .Params.house_size }}</p>
  </div>
</section>
<div class="style_house_content">
  <div class="style_house_sec01">
    <nav aria-label="breadcrumb">
      <ol class="breadcrumb mb-5">
        <li class="breadcrumb-item">
          <a href="/">
            <img src="/img/bt_footer_index@2x.png" style="width: 30px; margin: 0 0 5px;" alt="logo">
          </a>
        </li>
        <li class="breadcrumb-item"><a href="/collection/">室內設計作品</a></li>
        <li class="breadcrumb-item active" aria-current="page" id="category_name">{{ .Title }}</li>
      </ol>
    </nav>
    <div class="style_house_sec01_box">
      <div class="row px-0 mx-0">
        <div class="col-4 col-md-4">
          <h3 class="fw-bold">{{ .Params.house_size }}</h3>
          <p>權狀坪數</p>
        </div>
        <div class="col-4 col-md-4">
          <h3 class="fw-bold">{{ .Params.room_count }}</h3>
          <p>格局</p>
        </div>
        <div class="col-4 col-md-4">
          <h3 class="fw-bold">{{ .Params.house_cat }}</h3>
          <p>屋型</p>
        </div>
      </div>
    </div>
    <div class="style_house_sec01_box">
      <div class="row px-0 mx-0">
        <div class="col-4 col-md-4">
          <h3 class="fw-bold">{{ .Params.loc }}</h3>
          <p>地區</p>
        </div>
        <div class="col-4 col-md-4">
          <h3 class="fw-bold">{{ .Params.construction }}</h3>
          <p>建案名稱</p>
        </div>
        <div class="col-4 col-md-4">
          <h3 class="fw-bold">{{ .Params.designer }}</h3>
          <p>設計師</p>
        </div>
      </div>
    </div>
    <div class="style_house_sec01_box">
      <div class="style_house_sec01_box-1">
        <div class="row px-0 mx-0">
          <div class="col-4 ol-md-4 d-flex align-items-end justify-content-center px-0">
            <div>
              <h3 class="fw-bold">{{ .Params.space | safeHTML}}</h3>
              <!-- <h3 class="fw-bold">書房 主臥</h3> -->
              <p>設計空間</p>
            </div>
          </div>
          <div class="col-8 col-md-8 d-flex align-items-end justify-content-center px-0">
            <div>
              <h3 class="fw-bold">{{ .Params.budget}}</h3>
              <p>總預算(含設計/裝修/裝潢/系統櫃/家具)</p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<hr class="style_house_line">
<div class="style_house_content">
  <div class="style_house_sec02">
    <div class="style_house_sec02_content">
      <div class="d-flex justify-content-between align-items-center">
        <span></span>
        <div class="icon-box">
          <a href="" id="collection_icon_fb" target="_blank"><img src="/img/icon_fb@2x.png" alt=""></a>
          <a href="" id="collection_icon_line" target="_blank"><img src="/img/icon_line@2x.png" alt=""></a>
        </div>
      </div>
      <div class="row px-0 mx-0 mt-3">
        {{ if eq .Params.owner_img "" }}
        <div class="col-12 pe-0">
          <div class="sec02_content_text mt-3 mt-lg-0">
            <h2 class="style_house_subtitle"> {{ .Params.collection_name }}</h2>
            <p>
              {{.Params.collection_description | safeHTML }}
            </p>
          </div>
        </div>
        {{ else }}
        <div class="col-12 col-lg-5">
          <img class="img-fluid" src={{ .Params.owner_img }} alt="">
        </div>
        <div class="col-12 col-lg-7 pe-0">
          <div class="sec02_content_text mt-3 mt-lg-0">
            <h2 class="style_house_subtitle"> {{ .Params.collection_name }}</h2>
            <p>
              {{.Params.collection_description | safeHTML }}
            </p>
          </div>
        </div>

        {{ end }}
      </div>
    </div>
  </div>

  {{ if (len .Params.collection_slider) }}
  <hr class="style_house_line">
  <div class="style_house_sec02">
    {{ range .Params.collection_slider }}
    <div class="img-content">
      <!-- alt 若為空值則以圖說取代 -->
      <img class="img-fluid" src="./{{ .slide_img }}"
        alt="{{ with .slide_alt }}{{ . }}{{ else }}{{ .slide_text }}{{ end }}">
      <div class="slide_item_text">
        <p> {{ .slide_text }}</p>
      </div>
    </div>
    {{ end }}
    <!-- 輪播圖 -->
    <!-- <div id="slider-loading" class="d-flex justify-content-center mb-5">
      <div class="spinner-border text-success" role="status" style="color: rgba(128, 143, 76, 1) !important;">
        <span class="visually-hidden">Loading...</span>
      </div>
    </div> -->
    <!-- <div class="content" style="opacity: 0;">
      <div class="slider slider-for style_house_sec02_slide m-auto">
        {{ range .Params.collection_slider }}
        <div class="slide-box">
          <img class="img-fluid slide_single_img" src="./{{ .slide_img }}" alt="{{ .slide_alt }}">
          <div class="slide_item_text">
            <p> {{ .slide_text }}</p>
          </div>
        </div>
        {{ end }}
      </div>
      <div class="slider slider-nav">
        {{ range .Params.collection_slider }}
        <div class="sec02_slide_item">
          <img class="img-fluid slide_img" src="./{{ .slide_img }}" alt="{{.slide_alt}}">
        </div>
        {{ end }}
      </div>
    </div> -->
  </div>
  {{ end }}

  <hr class="style_house_line">
  <div class="style_house_sec03">
    {{ .Content }}
  </div>
  <hr class="style_house_line">
  <a href="/collection/">
    <p class="article__readMore text-center"> <span style="font-size: 18px;" class="fw-normal me-2">&lt;</span>回到成家故事案例
    </p>
  </a>
</div>
<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-sm-6 bg-serve ps-0">
        <a href="/room_planner/">
          <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>
{{ end }}