{{ define "main" }}

{{ with .Params.section1 }}
<section class="section-1 bg-cover" style='background-image: url("/images/case/case-detail-bg.png");'>
    <div class="common-layout">
        <h1 class="title-h1">{{ .title }}</h1>
        <p class="common-p">{{ .content }}</p>
    </div>
</section>
{{ end }}

<section class='section-2'>
  {{ with .Params.section2 }}
  <div class="common-layout">
    <div>
      {{ with .rightPart}}
      <img src="{{ .icon }}" alt="">
      <ul class='ul-right'>
        {{ range .list }}
        <li>
          <p class='p1'>{{ .title }}</p>
          <p class='p2'>{{ .content }}</p>
        </li>
        {{ end }}
      </ul>
      {{ end }}
    </div>
    <ul class='ul-left'>
      {{ range .listLeft}}
      <li>
        {{ if eq .type 1}}
        <ul>
          {{ range .contentList }}
          <li>
            <p>{{ .content }}</p>
          </li>
          {{ end }}
        </ul>
        {{ else if eq .type 2}}
        <div>
          <p class='p1'>{{ .content }}</p>
          <p class='p2'>{{ .author }}</p>
          <img src="/images/case/ic-quote-right.svg" alt="">
        </div>
        {{ else }}
          <h2>{{ .title }}</h2>
          {{ range .contentList }}
          <p>{{ .content }}</p>
          {{ end }}
          {{ if .image }}
          <img src="{{ .image }}" alt="">
          {{ end }}
        {{ end }}
      </li>
      {{ end }}
    </ul>
  </div>
  <img src="/images/common/hexagon.svg" alt="">
  {{ end }}
</section>
{{ end }}