refactor: archive page

Alexander Bilz

06.06.2022 93df16f27381138ca06785c7d3013f52c5232a5d

refactor: archive page

 assets/scss/main.scss

@@ -22,6 +22,7 @@
@import './partials/components/alert';
@import './partials/components/portfolio';
@import './partials/components/page404';
@import './partials/components/archive';
@import './partials/vendors/mediumzoom';
@import './partials/vendors/contactform';
@import './partials/vendors/tableofcontents';

 assets/scss/partials/components/_archive.scss

New file
@@ -0,0 +1,40 @@
.archive {
    width: 100%;

    &__list {
        font-size: 1.4rem;
        margin: 30px;
        padding: 0;
        &-item{
            padding-bottom: 5px;
            list-style-type: none;

            .post-time {
                float: right;
                display: inline-block;
                max-width: 10%;
                text-align: right;
                color: $primary-light;
            }
            a {
                color: $primary;
                width: 90%;
                display: inline-block;
              }
              
              a:hover {
                color: $info;
              }
        }
        &-title{
            font-size: 2.4rem;
            color: $primary;
            font-weight: 600;
            line-height: 2.2em;
        }
    }

}




 layouts/_default/list.html

@@ -8,13 +8,12 @@

    {{ end }}"
  >
    <ul class="list-with-title">
    <ul class="archive__list">
      {{ range .Data.Pages.GroupByDate "2006" }}
        <div class="listing-title">{{ .Key }}</div>
        <div class="archive__list-title">{{ .Key }}</div>
        {{ range .Pages }}
          <ul class="listing">
            <div class="listing-item">
              <div class="listing-post">
          <ul>
            <li class="archive__list-item">
                <a href="{{ .RelPermalink }}" title="{{ .Title }}">{{ .Title }}</a>
                <div class="post-time">
                  <span class="date"
@@ -29,8 +28,7 @@
                    {{ end }}</span
                  >
                </div>
              </div>
            </div>
            </li>
          </ul>

        {{ end }}