feat: style portfolio metadata as list with icon start adornments

alexanderdavide

04.31.2022 2b05b8608380133f5fc65e0aba2dba274eefc1a3

feat: style portfolio metadata as list with icon start adornments

 assets/scss/partials/components/_portfolio.scss

@@ -130,6 +130,19 @@
    }
  }

  &__meta {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;

    &-item {
      &:not(:last-child) {
        margin-right: 1.25rem;
      }
    }
  }

  &__button {
    font-weight: 400;
    display: inline-block;

 layouts/portfolio/list.html

@@ -38,37 +38,47 @@
            {{ end }}"
          >
            <h2>{{ .name | markdownify }}</h2>
            <div class="info">
            <ul class="portfolio__meta">
              {{ if .status }}
                <em class="fas fa-flag-checkered"></em>
                <span>{{ .status }}</span>
                <li class="portfolio__meta-item">
                  <em class="fas fa-flag-checkered"></em>
                  <span>{{ .status }}</span>
                </li>

              {{ end }}
              {{ if .venue }}
                <em class="fas fa-map-marker-alt"></em>
                <span>{{ .venue }}</span>
                <li class="portfolio__meta-item">
                  <em class="fas fa-map-marker-alt"></em>
                  <span>{{ .venue }}</span>
                </li>

              {{ end }}
              {{ if .start }}
                <span>Start:</span>
                <span>{{ .start }}</span>
                <li class="portfolio__meta-item">
                  <em class="fas fa-arrow-up"></em>
                  <span>{{ .start }}</span>
                </li>

              {{ end }}
              {{ if .end }}
                <span>End:</span>
                <span>{{ .end }}</span>
                <li class="portfolio__meta-item">
                  <em class="fas fa-arrow-down"></em>
                  <span>{{ .end }}</span>
                </li>

              {{ end }}
            </div>
            {{ if .authors }}
              <div class="info">
              {{ if .authors }}
                {{ range .authors }}
                  <span>{{ . }}</span>
                  <li class="portfolio__meta-item">
                    <em class="fas fa-at"></em>
                    <span>{{ . }}</span>
                  </li>

                {{ end }}
              </div>

            {{ end }}

              {{ end }}
            </ul>
            <p>{{ .description | markdownify }}</p>
            {{ if .link }}
              <div class="portfolio__button-wrapper">