mirror of
https://git.adityakumar.xyz/hugo-theme-introduction.git
synced 2024-09-20 03:23:05 +00:00
48159c6b4d
* Add project_timeline to the project template Project timeline is sometimes very important aspect of your project as it shows that you have been working on it for some time. This adds the feature to the template, but only uses it when it is defined. * Add description of a new feature to README * Apply suggestions from code review Co-authored-by: Victoria Drake <24644237+victoriadrake@users.noreply.github.com>
101 lines
4.4 KiB
HTML
101 lines
4.4 KiB
HTML
{{ with .Site.GetPage "/projects" }}
|
|
<div class="section" id="{{ .Title | urlize }}">
|
|
<!-- Begin Projects container -->
|
|
<div class="container">
|
|
<h2 class="title is-2 has-text-centered">
|
|
{{ .Title | markdownify }}
|
|
</h2>
|
|
<div class="section">
|
|
<div class="columns is-multiline">
|
|
{{ $totalProjects := (len .Pages) }}
|
|
{{ $numberOfProjectsToShow := .Site.Params.home.numberOfProjectsToShow | default $totalProjects }}
|
|
{{ range $index, $element := .Pages.ByWeight | first $numberOfProjectsToShow }}
|
|
{{ $width := "302x" }}
|
|
{{ $columWidth := "is-one-third" }}
|
|
{{ if .Site.Params.projects.useTwoColumns }}
|
|
{{ $columWidth = "is-half" }}
|
|
{{ $width = "490x" }}
|
|
{{ end}}
|
|
<div class="column {{ $columWidth }}">
|
|
<div class="card" data-target="#project-{{ $index }}">
|
|
<div class="card-image">
|
|
<figure class="image is-3by2">
|
|
<a {{ if .Params.external_link }} href="{{ .Params.external_link }}" {{ end }}>
|
|
{{ with .Resources.ByType "image" }}
|
|
{{ range first 1 (sort . "Params.weight") }}
|
|
{{ $image := .Resize $width }}
|
|
<img class="card-thumbnail" src="{{ $image.Permalink }}" alt ="{{ $image.Name }}">
|
|
{{ end }}
|
|
{{ end }}
|
|
</a>
|
|
</figure>
|
|
</div>
|
|
<div class="card-content has-text-centered top-pad">
|
|
<a {{ if .Params.external_link }} href="{{ .Params.external_link }}" {{ end }}>
|
|
{{ .Title | markdownify }}
|
|
</a>
|
|
{{ if .Params.project_timeframe }}
|
|
<p class="fa-xs">{{ .Params.project_timeframe }}</p>
|
|
{{ end }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
</div>
|
|
{{ if lt $numberOfProjectsToShow $totalProjects }}
|
|
<div class="container has-text-centered top-pad">
|
|
<a href="{{ .Permalink }}">{{ i18n "index_projects_allProjects" . }}</a>
|
|
</div>
|
|
{{ end }}
|
|
</div>
|
|
<!-- End Projects container -->
|
|
<!-- Projects modals -->
|
|
{{ range $index, $element := .Pages.ByWeight | first $numberOfProjectsToShow }}
|
|
{{ if not .Params.external_link }}
|
|
<div class="modal" id="project-{{ $index }}">
|
|
<div class="modal-background"></div>
|
|
<div class="modal-card">
|
|
{{ with .Title }}
|
|
<header class="modal-card-header bottom-pad">
|
|
<p class="modal-card-title has-text-centered">{{ . }}</p>
|
|
</header>
|
|
{{ end }}
|
|
{{ if .Params.project_timeframe }}
|
|
<p class="fa-xs">{{ .Params.project_timeframe }}</p>
|
|
{{ end }}
|
|
{{ with .Resources.ByType "image" }}
|
|
{{ $moreThenOneImage := gt (len .) 1 }}
|
|
{{ if $moreThenOneImage }}
|
|
<div class="owl-carousel owl-theme">
|
|
{{ end }}
|
|
{{ range sort . "Params.weight" }}
|
|
{{ $image := .Resize "640x" }}
|
|
{{ if $moreThenOneImage }}
|
|
<div class="item owl-height">
|
|
{{ end }}
|
|
<img src="{{ $image.Permalink }}" class="img-responsive" alt="{{ $image.Name }}">
|
|
{{ if $moreThenOneImage }}
|
|
</div>
|
|
{{ end }}
|
|
{{ end }}
|
|
{{ if $moreThenOneImage }}
|
|
</div>
|
|
{{ end }}
|
|
{{ end }}
|
|
|
|
{{ with .Content }}
|
|
<section class="modal-card-body markdown">
|
|
{{ . }}
|
|
</section>
|
|
{{ end }}
|
|
</div>
|
|
<button class="modal-close is-large" aria-label="close" data-target="#project-{{ $index }}"></button>
|
|
</div>
|
|
{{ end }}
|
|
{{ end }}
|
|
{{ partial "top-icon.html" . }}
|
|
</div>
|
|
<!-- End Projects section -->
|
|
<div class="container"><hr></div>
|
|
{{ end }}
|