{{ define "head"}}
<meta name="description" content="{{ .Params.description }}" />
<title>{{ .Title }}</title>

{{ end }}


{{ define "main" }}

<section>
  <div class="container-fluid">
    <div class="row justify-content-center ">
      <div class="col-md-7 p-3">
        <div class="px-3">
          <div class="py-4 text-center">
            <!-- title and date -->
            <h1 class="blog-title">{{.Title}}</h1>
            <div class="text-muted">
              <!-- Date -->
              <span class="px-1">
                <svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-calendar" fill="currentColor"
                  xmlns="http://www.w3.org/2000/svg">
                  <path fill-rule="evenodd"
                    d="M1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4H1zm1-3a2 2 0 0 0-2 2v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2H2z" />
                  <path fill-rule="evenodd"
                    d="M3.5 0a.5.5 0 0 1 .5.5V1a.5.5 0 0 1-1 0V.5a.5.5 0 0 1 .5-.5zm9 0a.5.5 0 0 1 .5.5V1a.5.5 0 0 1-1 0V.5a.5.5 0 0 1 .5-.5z" />
                </svg>
              </span>
              {{ dateFormat "Jan 2, 2006" .Date }}

              <!-- Author -->
              {{ if .Params.author }}
              <span class="px-1">
                <svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-person-fill" fill="currentColor"
                  xmlns="http://www.w3.org/2000/svg">
                  <path fill-rule="evenodd"
                    d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z" />
                </svg>
              </span>
              {{ .Params.author }}
              {{ end }}

              <div class="pt-3">
                <a href="https://twitter.com/share?ref_src=twsrc%5Etfw" class="twitter-share-button"
                  data-show-count="false">Tweet my work</a>
                <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>
              </div>
            </div>

            {{ if .Site.Params.showdescription }}
            <div class="text-dark py-2">
              {{ .Params.description }}
            </div>
            {{ end }}
          </div>


          <!-- image -->
          <div class="py-2">
            {{ with .Params.bg_image }}
            <img class="img-fluid" src="{{ . }}">
            {{ end }}
          </div>

          <!-- content -->
          <article>
            {{.Content}}
          </article>
        </div>
        <!-- Tags -->
        <div class="mb-4 p-5">
          <div class="card">
            <h5 class="card-header text-center m-0">Tags</h5>
            <div class="card-body">
              {{ if .Params.tags }}
              {{ range .Params.tags }}
              <a href="{{ " /tags/" | relLangURL }}{{ . | urlize }}" class="btn btn-outline-danger btn-rounded mb-2">
                {{ . }}
              </a>
              {{ end }}
              {{ end }}
            </div>
            </a>
          </div>
        </div>

        {{ template "_internal/disqus.html" . }}

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