About page, most of frontpage, news

Frontpage:
- Implement initial pass of swipers, might look for something that doesn't require JS.
- Implemented transitions
- Added transitions / company logos to assets
About page:
- Basically duplicated layout from existing website
News:
- Renamed /blog -> /news, not too much in this section left to do, relatively straightforward for that
This commit is contained in:
2024-10-13 13:13:30 -07:00
parent f39aeab4a4
commit 05e9f8882a
42 changed files with 908 additions and 88 deletions

View File

@@ -75,59 +75,151 @@
{{ end }}
<!-- /Banner -->
<!-- Features -->
{{ $tick := 0 }}
{{ range $i, $e:= .Params.features }}
<section class="section-sm {{ if and (modBool $i 3) (not (.center_layout)) }}bg-gradient{{ end }}">
<div class="container">
<section class="section-sm nim-h-screen relative pb-0" style="background-color: {{ .bg_color }}">
{{ with .transition }}
{{ if .start }}
<div class="relative bg-center bg-top bg-cover bg-no-repeat dark:hidden block xl:-mt-20 -mt-16 {{ .start_class }}"
style="height: 100px;z-index:2;mask-image: url('{{ .start }}');background-color: {{ .start_color }};"></div>
{{ end }}
{{ if .start_dark }}
<div class="relative bg-center bg-top bg-cover bg-no-repeat dark:block hidden xl:-mt-20 -mt-16 {{ .start_class }}"
style="height: 100px;z-index:2;mask-image: url('{{ .start_dark }}');background-color: {{ .start_dark_color }};"></div>
{{ end }}
{{ end }}
{{ with .bg_img }}
{{ $res := resources.Get .img }}
<div class="absolute inset-0 bg-cover bg-center bg-no-repeat {{ if .parallax }} bg-fixed parallax-bg {{ end }}"
style="background-image: url('{{ $res.RelPermalink }}')"></div>
{{ end }}
<div class="container relative mx-auto" style="z-index: 2;">
<div class="row items-center justify-between">
{{ if eq .side "center" }}
DEVON RETURN HERE:
TODO:
- USE LOCAL VARIABLE TO TRACK INDEX WHEN NOT SET LAYOUT PATTERN,
- USE IS_LEFT / IS_RIGHT TO SET MOD SIDE????
{{ end }}
{{ if eq .side "left" }}
{{ end }}
{{ if eq .side "right" }}
{{ end }}
{{ if not .side }}
<div
class="mb:md-0 {{ if and (not (modBool $i 2)) (not (.center_layout)) }}
class="mx-auto md:col-8 lg:col-8 {{ .content_class }}">
<h2 class="mb-4 {{ .title_class }}">
{{ .title | markdownify }}
</h2>
{{ with .swiper }}
<div class="swiper swiper-slider">
<div class="swiper-wrapper">
{{ range .slides }}
<div class="swiper-slide">
<div class="col-md-12">
<a href="{{ .link }}">
{{ $res := resources.Get .icon }}
<img src="{{ $res.RelPermalink }}" />
<span>{{ .name }}</span>
</a>
</div>
</div>
{{ end }}
</div>
<div class="swiper-slider-pagination mt-9 flex items-center justify-center text-center"></div>
{{ if .show_buttons }}
<div class="swiper-button-next ml-16" style="{{ .button_style }}"></div>
<div class="swiper-button-prev mr-16" style="{{ .button_style }}"></div>
{{ end }}
</div>
{{ end }}
<p class="mb-8 text-lg">
{{ .content | markdownify }}
</p>
<ul>
{{ range .bulletpoints }}
<li class="relative mb-4 pl-6">
<i class="fa fa-check absolute left-0 top-1.5"></i>
{{ . | markdownify }}
</li>
{{ end }}
</ul>
{{ with .button }}
{{ if .enable }}
<a class="btn mt-6 {{ .class }}" href="{{ .link | absURL }}">
{{ .label }}
<i class="fa fa-arrow-right pl-2"></i>
</a>
{{ end }}
{{ end }}
</div>
{{ else }}
{{ if eq .side "left" }}
{{ $tick = 0 }}
{{ else if eq .side "right" }}
{{ $tick = 1 }}
{{ end }}
{{ with .bg_img }}
{{ if .parallax }}
<div class="relative h-screen overflow-hidden">
<div class="absolute inset-0 bg-no-repeat bg-cover
bg-fixed parallax-bg"
style="background-image: url('{{ .img }}');">
</div>
</div>
{{ end }}
{{ end }}
<div class="mb:md-0 md:col-5 mb-6
{{ if eq $tick 1 }}
md:order-2
{{ end }} md:col-5 mb-6">
{{ if .image }}
{{ partial "image" (dict "Src" .image "Alt" "feature image" "DisplayXL" "520x" "DisplayLG" "425x" "DisplayMD" "360x") }}
{{ end }}
</div>
<div
class="{{ if not (modBool $i 2) }}
md:order-1
{{ end }} md:col-7 lg:col-6">
<h2 class="mb-4">
{{ .title | markdownify }}
</h2>
<p class="mb-8 text-lg">
{{ .content | markdownify }}
</p>
<ul>
{{ range .bulletpoints }}
<li class="relative mb-4 pl-6">
<i class="fa fa-check absolute left-0 top-1.5"></i>
{{ . | markdownify }}
</li>
{{ end }}">
{{ if .image }}
{{ partial "image" (dict "Src" .image "Alt" "feature image" "DisplayXL" "520x" "DisplayLG" "425x" "DisplayMD" "360x") }}
{{ end }}
</ul>
{{ with .button }}
{{ if .enable }}
<a class="btn btn-primary mt-6" href="{{ .link | absURL }}">
{{ .label }}
<i class="fa fa-arrow-right pl-2"></i>
</a>
</div>
<div
class="{{ if eq $tick 0 }}
md:order-1
{{ end }} md:col-7 lg:col-6">
<h2 class="mb-4">
{{ .title | markdownify }}
</h2>
<p class="mb-8 text-lg">
{{ .content | markdownify }}
</p>
<ul>
{{ range .bulletpoints }}
<li class="relative mb-4 pl-6">
<i class="fa fa-check absolute left-0 top-1.5"></i>
{{ . | markdownify }}
</li>
{{ end }}
</ul>
{{ with .button }}
{{ if .enable }}
<a class="btn btn-primary mt-6" href="{{ .link | absURL }}">
{{ .label }}
<i class="fa fa-arrow-right pl-2"></i>
</a>
{{ end }}
{{ end }}
</div>
{{ if eq $tick 0 }}
{{ $tick = 1}}
{{ else }}
{{ $tick = 0 }}
{{ end }}
</div>
{{ end }}
</div>
</div>
{{ with .transition }}
{{ if .end }}
<div class="relative bg-center bg-top bg-cover bg-no-repeat dark:hidden block xl:-mb-20 -mb-16 {{ .end_class }}"
style="height: 100px;z-index:2;mask-image: url('{{ .end }}');background-color: {{ .end_color }};"></div>
{{ end }}
{{ if .end_dark }}
<div class="relative bg-center bg-top bg-cover bg-no-repeat dark:block hidden xl:-mb-20 -mb-16 {{ .end_class }}"
style="height: 100px;z-index:2;mask-image: url('{{ .end_dark }}');background-color: {{ .end_dark_color }};"></div>
{{ end }}
{{ end}}
</section>
{{ end }}
<!-- /Features -->
@@ -187,8 +279,7 @@
</div>
{{ end }}
</div>
<div
class="testimonial-slider-pagination mt-9 flex items-center justify-center text-center"></div>
<div class="testimonial-slider-pagination mt-9 flex items-center justify-center text-center"></div>
</div>
</div>
</div>