Add Lotusdocs theme
This commit is contained in:
Abner Coimbre
53
themes/lotusdocs/layouts/partials/landing/feature_grid.html
Normal file
53
themes/lotusdocs/layouts/partials/landing/feature_grid.html
Normal file
@@ -0,0 +1,53 @@
|
||||
{{ $sectionTitle := .Scratch.Get "sectionTitle" }}
|
||||
{{ with (index .Site.Data.landing $sectionTitle) }}
|
||||
{{ if eq .enable true }}
|
||||
<!-- Features Start -->
|
||||
<section id="{{ $sectionTitle }}">
|
||||
<div class="container mt-100 mt-60">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-12 text-center">
|
||||
<div class="section-title">
|
||||
{{ with .title }}
|
||||
<h4 class="title fw-bold mb-4">{{ . }}</h4>
|
||||
{{ end }}
|
||||
{{ with .subtitle }}
|
||||
<p class="text-muted para-desc mb-4 pb-2 mx-auto">{{ . | markdownify }}</p>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div><!--end col-->
|
||||
</div><!--end row-->
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-12">
|
||||
<div class="row">
|
||||
{{ range .items }}
|
||||
<div class="col-md-4 col-12">
|
||||
<div class="d-flex features feature-primary p-3">
|
||||
<div class="{{ if .icon }}icon{{ else }}no-icon{{ end }} text-center rounded-3 text-primary me-3">
|
||||
<i class="material-icons align-middle h4 mb-0">{{ .icon }}</i>
|
||||
</div>
|
||||
<div class="flex-1">
|
||||
<h4 class="title">{{ .title }}</h4>
|
||||
<p class="text-muted para mb-0">{{ .description | markdownify }}</p>
|
||||
{{ with .ctaLink }}
|
||||
<div class="mt-2">
|
||||
<a href="{{ .url }}" class="mt-3 h6 text-primary">{{ .text | markdownify }} <i class="material-icons align-top">chevron_right</i></a>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--end col-->
|
||||
{{ end }}
|
||||
</div>
|
||||
<!--end row-->
|
||||
</div>
|
||||
<!--end col-->
|
||||
</div>
|
||||
<!--end row-->
|
||||
</div>
|
||||
<!--end container-->
|
||||
</section>
|
||||
<!-- features End -->
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
123
themes/lotusdocs/layouts/partials/landing/hero.html
Normal file
123
themes/lotusdocs/layouts/partials/landing/hero.html
Normal file
@@ -0,0 +1,123 @@
|
||||
{{ $sectionTitle := .Scratch.Get "sectionTitle" }}
|
||||
{{ with (index .Site.Data.landing $sectionTitle) }}
|
||||
{{ if eq .enable true }}
|
||||
<!-- Hero Start -->
|
||||
{{ with .backgroundImage }}
|
||||
{{ $path := .path | default "images" }}
|
||||
{{ $filename := .filename }}
|
||||
{{ $pathDesktop := printf "%s/%s" $path $filename.desktop }}
|
||||
{{ $pathMobile := printf "%s/%s" $path $filename.mobile }}
|
||||
<style>
|
||||
.hero {
|
||||
{{ with $filename.desktop }}
|
||||
{{ with resources.Get $pathDesktop }}
|
||||
@media (min-width: 768px) {
|
||||
background-image: url("{{ .RelPermalink }}");
|
||||
}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ with $filename.mobile }}
|
||||
{{ with resources.Get $pathMobile }}
|
||||
background-image: url("{{ .RelPermalink }}");
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
}
|
||||
</style>
|
||||
{{ end }}
|
||||
<section id="{{ $sectionTitle }}" class="d-table w-100 overflow-hidden hero">
|
||||
<div class="container">
|
||||
<div class="row mt-5 align-items-center">
|
||||
|
||||
<div class="col-lg-6 col-md-6">
|
||||
<div class="title-heading">
|
||||
{{ with .badge }}
|
||||
<span class="badge {{ if eq .pill true }}rounded-pill{{ end }} bg-{{ if eq .soft true }}soft-{{ else }}hard-{{ end }}{{ .color }} mb-1">{{ .text }}</span>
|
||||
{{ end }}
|
||||
<h4 class="heading mt-0 mb-3">
|
||||
{{ with .titleLogo }}
|
||||
{{ $path := .path | default "images" }}
|
||||
{{ $filename := .filename }}
|
||||
{{ $height := .height | default "70px" }}
|
||||
{{ $alt := .alt | default "logo image" }}
|
||||
{{ $path := printf "%s/%s" $path $filename }}
|
||||
{{ with $filename }}
|
||||
<span>
|
||||
{{ with $image := resources.Get $path }}
|
||||
{{ if eq .MediaType.SubType "svg" }}
|
||||
{{ .Content | safeHTML }}
|
||||
{{ else }}
|
||||
{{ with .Resize (printf "%dx%d webp q85 drawing Lanczos" .Width .Height) }}
|
||||
<img src="{{ .RelPermalink }}" alt="{{ $alt }}" height="{{ $height }}">
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</span>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ with .title }}{{ . }}{{ end }}
|
||||
</h4>
|
||||
{{ with .subtitle }}
|
||||
<p class="para-desc text-muted mb-0">{{ . | markdownify }}</p>
|
||||
{{ end }}
|
||||
|
||||
<div class="mt-3">
|
||||
{{ with .ctaButton }}
|
||||
<a href="{{ relLangURL .url }}" class="btn btn-lg btn-primary me-2 mt-2">
|
||||
{{ with .icon }}
|
||||
<span class="material-icons align-middle">{{ . }}</span>
|
||||
{{ end }}
|
||||
{{ with .btnText }}
|
||||
{{ . }}
|
||||
{{ end }}
|
||||
</a>
|
||||
{{ end }}
|
||||
{{ with .cta2Button }}
|
||||
<a href="{{ relLangURL .url }}" class="btn btn-lg btn-outline-primary mt-2">
|
||||
{{ with .icon }}
|
||||
<span class="material-icons align-middle">{{ . }}</span>
|
||||
{{ end }}
|
||||
{{ with .btnText }}
|
||||
{{ . }}
|
||||
{{ end }}
|
||||
</a>
|
||||
{{ end }}
|
||||
</div>
|
||||
|
||||
{{ with .info }}
|
||||
<p class="text-muted mb-0 mt-3">{{ . | markdownify }}</p>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6 col-md-6 mt-4 pt-4 mt-sm-0 pt-sm-0">
|
||||
{{ with .image }}
|
||||
{{ $path := .path | default "images" }}
|
||||
{{ $filename := .filename }}
|
||||
{{ $alt := .alt | default "hero image" }}
|
||||
{{ $boxShadow := .boxShadow | default false }}
|
||||
{{ $rounded := .rounded | default false }}
|
||||
{{ $path := printf "%s/%s" $path $filename }}
|
||||
{{ with $filename }}
|
||||
<div class="ms-lg-4">
|
||||
<div class="classic-hero-image">
|
||||
{{ with $image := resources.Get $path }}
|
||||
{{ if eq .MediaType.SubType "svg" }}
|
||||
{{ .Content | safeHTML }}
|
||||
{{ else }}
|
||||
{{ with .Resize (printf "%dx%d webp q85 drawing Lanczos" .Width .Height) }}
|
||||
<img src="{{ .RelPermalink }}" class="{{ if $boxShadow }}shadow-lg{{ else }}{{ end }} mx-auto d-block {{ if $rounded }}rounded-top-4{{ else }}{{ end }}" width="{{ .Width }}" height="{{ .Height }}" alt="{{ $alt }}">
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</div><!--end col-->
|
||||
|
||||
</div><!--end row-->
|
||||
</div> <!--end container-->
|
||||
</section><!--end section-->
|
||||
<!-- Hero End -->
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
68
themes/lotusdocs/layouts/partials/landing/image_compare.html
Normal file
68
themes/lotusdocs/layouts/partials/landing/image_compare.html
Normal file
@@ -0,0 +1,68 @@
|
||||
{{ $sectionTitle := .Scratch.Get "sectionTitle" }}
|
||||
{{ with (index .Site.Data.landing $sectionTitle) }}
|
||||
{{ if eq .enable true }}
|
||||
<section id="{{ $sectionTitle }}">
|
||||
<div class="container mt-100 mt-60">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-12 text-center">
|
||||
<div class="section-title mb-4 pb-2">
|
||||
{{ with .title }}
|
||||
<h4 class="title fw-bold mb-4">{{ . }}</h4>
|
||||
{{ end }}
|
||||
{{ with .subtitle }}
|
||||
<p class="text-muted para-desc mb-0 mx-auto">{{ . | markdownify }}</p>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div><!--end col-->
|
||||
</div><!--end row-->
|
||||
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-lg-8 col-md-12 mt-3 pt-2 text-center">
|
||||
<ul class="nav nav-pills nav-justified flex-column flex-sm-row rounded bg-primary" id="pills-tab-{{ $sectionTitle }}" role="tablist">
|
||||
{{ range $index, $value := .items }}
|
||||
<li class="nav-item">
|
||||
<a class="nav-link rounded{{ if (eq $index 0) }} active{{ end }}" id="{{ anchorize .title }}-tab" data-bs-toggle="pill" href="#pills-{{ $sectionTitle }}-{{ anchorize .title }}" role="tab" aria-controls="pills-{{ anchorize .title }}" aria-selected="false">
|
||||
<div class="text-center py-2">
|
||||
<p class="mb-0 fs-6 fw-semibold">{{ .title }}</p>
|
||||
</div>
|
||||
</a><!--end nav link-->
|
||||
</li><!--end nav item-->
|
||||
{{ end }}
|
||||
</ul><!--end nav pills-->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-12 mt-4 pt-2">
|
||||
<div class="tab-content" id="pills-tab-{{ $sectionTitle }}Content">
|
||||
{{ range $index, $value := .items }}
|
||||
<div class="tab-pane fade show{{ if (eq $index 0) }} active{{ end }}" id="pills-{{ $sectionTitle }}-{{ anchorize .title }}" role="tabpanel" aria-labelledby="{{ anchorize .title }}-tab">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-md-12">
|
||||
{{ $title := .title }}
|
||||
{{ $path := .imagePath | default "images" }}
|
||||
{{ $imageBefore := .imageBefore }}
|
||||
{{ $imageAfter := .imageAfter }}
|
||||
{{ $pathBefore := printf "%s/%s" $path $imageBefore }}
|
||||
{{ $pathAfter := printf "%s/%s" $path $imageAfter }}
|
||||
{{ with and $imageBefore $imageAfter }}
|
||||
<div id="{{ anchorize $title }}-compare" class="image-compare rounded-md border">
|
||||
{{ with $imageBefore := resources.Get $pathBefore }}
|
||||
<img src="{{ .RelPermalink }}" alt="{{ $imageBefore }}" />
|
||||
{{ end }}
|
||||
{{ with $imageAfter := resources.Get $pathAfter }}
|
||||
<img src="{{ .RelPermalink }}" alt="{{ $imageAfter }}" />
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
</div><!--end col-->
|
||||
</div><!--end row-->
|
||||
</div><!--end teb pane-->
|
||||
{{ end }}
|
||||
</div><!--end tab content-->
|
||||
</div><!--end col-->
|
||||
</div><!--end row-->
|
||||
</div><!--end container-->
|
||||
</section>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
61
themes/lotusdocs/layouts/partials/landing/image_text.html
Normal file
61
themes/lotusdocs/layouts/partials/landing/image_text.html
Normal file
@@ -0,0 +1,61 @@
|
||||
{{ $sectionTitle := .Scratch.Get "sectionTitle" }}
|
||||
{{ with (index .Site.Data.landing $sectionTitle) }}
|
||||
{{ if eq .enable true }}
|
||||
<!-- Single-Right Start -->
|
||||
<section id="{{ $sectionTitle }}">
|
||||
<div class="container mt-100 mt-60">
|
||||
<div class="row align-items-center">
|
||||
|
||||
<div class="col-lg-6 col-md-5 {{ if eq .imgOrder.desktop 1 }}order-md-first{{ else }}order-md-last{{ end }} {{ if eq .imgOrder.mobile 1 }}order-first{{ else }}order-last{{ end }}">
|
||||
<div class="position-relative">
|
||||
{{ with .image }}
|
||||
{{ $path := .path | default "images" }}
|
||||
{{ $filename := .filename }}
|
||||
{{ $alt := .alt | default "feature image (right)" }}
|
||||
{{ $path := printf "%s/%s" $path $filename }}
|
||||
{{ with $filename }}
|
||||
<div class="text-center text-md-start">
|
||||
{{ with $image := resources.Get $path }}
|
||||
{{ if eq .MediaType.SubType "svg" }}
|
||||
{{ .Content | safeHTML }}
|
||||
{{ else }}
|
||||
{{ with .Resize (printf "%dx%d webp q85 drawing Lanczos" .Width .Height) }}
|
||||
<img src="{{ .RelPermalink }}" class="img-fluid" width="{{ .Width }}" height="{{ .Height }}" alt="{{ $alt }}">
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</div><!--end col-->
|
||||
|
||||
<div class="col-lg-6 col-md-7 mt-5 mt-sm-0 {{ if eq .imgOrder.desktop 1 }}order-md-last{{ else }}order-md-first{{ end }} {{ if eq .imgOrder.mobile 1 }}order-last{{ else }}order-first{{ end }}">
|
||||
<div class="section-title">
|
||||
{{ with .title }}
|
||||
<h1 class="title mb-3">{{ . }}</h1>
|
||||
{{ end }}
|
||||
{{ with .subtitle }}
|
||||
<p class="para-desc text-muted">{{ . | markdownify }}</p>
|
||||
{{ end }}
|
||||
{{ if .list }}
|
||||
<ul class="list-unstyled text-muted">
|
||||
{{ range .list }}
|
||||
<li class="mb-1"><span class="text-primary h5 me-2"><i class="material-icons align-middle size-20">{{ .icon }}</i></span>{{ .text | markdownify }}</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
{{ end }}
|
||||
{{ with .ctaButton }}
|
||||
<div class="mt-4">
|
||||
<a href="{{ .url }}" class="mt-3 h6 text-primary">{{ .text | markdownify }} <i class="material-icons align-middle mb-1">chevron_right</i></a>
|
||||
</div>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- Single-Right End -->
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
Reference in New Issue
Block a user