Begin templatizing configuration
This commit is contained in:
lucperkins
@@ -1,8 +1,8 @@
|
||||
# The Fresh theme for Hugo
|
||||
|
||||
**Fresh** is a theme for the [Hugo](https://gohugo.io) static site generator adapted from the gorgeous, [Bulma](https://bulma.io)-based theme of the same name from [CSS Ninja](https://cssninja.io).
|
||||
**Fresh** is a theme for the [Hugo](https://gohugo.io) static site generator adapted from the gorgeous, [Bulma](https://bulma.io)-based theme of the same name from [CSS Ninja](https://cssninja.io/themes/fresh). You can find a live demo of the original theme [here](https://cssninjastudio.github.io).
|
||||
|
||||
|
||||
|
||||
|
||||
> This theme is for landing pages only. If you'd like to extend the theme to include other types of pages—blog posts, documentation pages, etc.—feel free to submit a pull request.
|
||||
|
||||
@@ -32,4 +32,4 @@ open http://localhost:1313
|
||||
|
||||
## Customizing your page
|
||||
|
||||
There's a wide variety of customizations that you can make to your Hugo Fresh landing page by modifying the `config.yaml` file that you downloaded. That file provides documentation for what the various config values represent.
|
||||
There's a wide variety of customizations that you can make to your Hugo Fresh landing page by modifying the `config.yaml` file that you downloaded. That file provides documentation for what the various config values represent.
|
||||
|
||||
@@ -1,4 +1,38 @@
|
||||
baseURL: http://something-fresh.org/
|
||||
languageCode: en-us
|
||||
title: Hugo Fresh Theme
|
||||
theme: hugo-fresh
|
||||
theme: hugo-fresh
|
||||
|
||||
params:
|
||||
hero:
|
||||
# Main hero title
|
||||
title: Manage. Deploy.
|
||||
# Hero subtitle (optional)
|
||||
subtitle: Lorem ipsum sit dolor amet is dummy text used by the typography industry
|
||||
buttonText: Get started
|
||||
buttonLink: "#"
|
||||
# Hero image (from /images/___)
|
||||
image: illustrations/worker.svg
|
||||
# Footer logos (from /images/logos/clients/___.svg)
|
||||
clientLogos:
|
||||
- systek
|
||||
- tribe
|
||||
- kromo
|
||||
- infinite
|
||||
- gutwork
|
||||
section1:
|
||||
title: Great power comes
|
||||
subtitle: with great responsibility
|
||||
tiles:
|
||||
- title: App builder
|
||||
icon: mouse-globe
|
||||
text: This is some explanatory text that is on two rows
|
||||
buttonText: Free trial
|
||||
- title: Cloud integration
|
||||
icon: laptop-cloud
|
||||
text: This is some explanatory text that is on two rows
|
||||
buttonText: Get started
|
||||
- title: Add-ons & plugins
|
||||
icon: plug-cloud
|
||||
text: This is some explanatory text that is on two rows
|
||||
buttonText: Get started
|
||||
|
Before Width: | Height: | Size: 84 KiB After Width: | Height: | Size: 84 KiB |
@@ -1,20 +1,30 @@
|
||||
{{- $hero := .Site.Params.hero }}
|
||||
{{- $title := index $hero "title" }}
|
||||
{{- $subtitle := index $hero "subtitle" }}
|
||||
{{- $buttonText := index $hero "buttonText" }}
|
||||
{{- $buttonLink := index $hero "buttonLink" }}
|
||||
{{- $image := index $hero "image" }}
|
||||
<div class="hero-body">
|
||||
<div class="container">
|
||||
<div class="columns is-vcentered">
|
||||
<div class="column is-5 is-offset-1 landing-caption">
|
||||
<h1 class="title is-1 is-bold is-spaced">
|
||||
Manage, Deploy.
|
||||
{{ $title }}
|
||||
</h1>
|
||||
<h2 class="subtitle is-5 is-muted">Lorem ipsum sit dolor amet is a dummy text used by typography industry </h2>
|
||||
{{ with $subtitle }}
|
||||
<h2 class="subtitle is-5 is-muted">
|
||||
{{ . }}
|
||||
</h2>
|
||||
{{ end }}
|
||||
<p>
|
||||
<a class="button cta rounded primary-btn raised">
|
||||
Get Started
|
||||
<a class="button cta rounded primary-btn raised" href="{{ $buttonLink }}">
|
||||
{{ $buttonText }}
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="column is-5 is-offset-1">
|
||||
<figure class="image is-4by3">
|
||||
<img src="{{ "/images/illustrations/worker.svg" | relURL }}" alt="Description">
|
||||
<img src="{{ printf "/images/%s" $image | relURL }}" alt="Description">
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,12 +1,16 @@
|
||||
{{- $hero := .Site.Params.hero }}
|
||||
{{- $clientLogos := index $hero "clientLogos" }}
|
||||
<div class="hero-foot mb-20">
|
||||
<div class="container">
|
||||
<div class="tabs is-centered">
|
||||
<ul>
|
||||
<li><a><img class="partner-logo" src="{{ "/images/logos/clients/systek.svg" | relURL }}"></a></li>
|
||||
<li><a><img class="partner-logo" src="{{ "/images/logos/clients/tribe.svg" | relURL }}"></a></li>
|
||||
<li><a><img class="partner-logo" src="{{ "/images/logos/clients/kromo.svg" | relURL }}"></a></li>
|
||||
<li><a><img class="partner-logo" src="{{ "/images/logos/clients/infinite.svg" | relURL }}"></a></li>
|
||||
<li><a><img class="partner-logo" src="{{ "/images/logos/clients/gutwork.svg" | relURL }}"></a></li>
|
||||
{{- range $clientLogos }}
|
||||
<li>
|
||||
<a>
|
||||
<img class="partner-logo" src="{{ printf "/images/logos/clients/%s.svg" . | relURL }}">
|
||||
</a>
|
||||
</li>
|
||||
{{- end }}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,62 +1,36 @@
|
||||
{{- $section1 := .Site.Params.section1 }}
|
||||
{{- $title := index $section1 "title" }}
|
||||
{{- $subtitle := index $section1 "subtitle" }}
|
||||
{{- $tiles := index $section1 "tiles" }}
|
||||
<section class="section section-feature-grey is-medium">
|
||||
<div class="container">
|
||||
<div class="title-wrapper has-text-centered">
|
||||
<h2 class="title is-2">Great Power Comes </h2>
|
||||
<h3 class="subtitle is-5 is-muted">With great Responsability</h3>
|
||||
<div class="divider is-centered"></div>
|
||||
</div>
|
||||
|
||||
<div class="content-wrapper">
|
||||
<div class="columns">
|
||||
<div class="column is-one-third">
|
||||
<div class="feature-card is-bordered has-text-centered revealOnScroll delay-1" data-animation="fadeInLeft">
|
||||
<div class="card-title">
|
||||
<h4>App builder</h4>
|
||||
</div>
|
||||
<div class="card-icon">
|
||||
<img src="{{ "/images/illustrations/icons/mouse-globe.svg" | relURL }}">
|
||||
</div>
|
||||
<div class="card-text">
|
||||
<p>This is some explanatory text that is on two rows</p>
|
||||
</div>
|
||||
<div class="card-action">
|
||||
<a href="#" class="button btn-align-md accent-btn raised">Free Trial</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<div class="feature-card is-bordered has-text-centered revealOnScroll delay-2" data-animation="fadeInLeft">
|
||||
<div class="card-title">
|
||||
<h4>Cloud integration</h4>
|
||||
</div>
|
||||
<div class="card-icon">
|
||||
<img src="{{ "/images/illustrations/icons/laptop-cloud.svg" | relURL }}">
|
||||
</div>
|
||||
<div class="card-text">
|
||||
<p>This is some explanatory text that is on two rows</p>
|
||||
</div>
|
||||
<div class="card-action">
|
||||
<a href="#" class="button btn-align-md secondary-btn raised">Get Started</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<div class="feature-card is-bordered has-text-centered revealOnScroll delay-3" data-animation="fadeInLeft">
|
||||
<div class="card-title">
|
||||
<h4>Addons & Plugins</h4>
|
||||
</div>
|
||||
<div class="card-icon">
|
||||
<img src="{{ "/images/illustrations/icons/laptop-cloud.svg" | relURL }}">
|
||||
</div>
|
||||
<div class="card-text">
|
||||
<p>This is some explanatory text that is on two rows</p>
|
||||
</div>
|
||||
<div class="card-action">
|
||||
<a href="#" class="button btn-align-md primary-btn raised">Get Started</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="title-wrapper has-text-centered">
|
||||
<h2 class="title is-2">{{ $title }}</h2>
|
||||
<h3 class="subtitle is-5 is-muted">{{ $subtitle }}</h3>
|
||||
<div class="divider is-centered"></div>
|
||||
</div>
|
||||
|
||||
<div class="content-wrapper">
|
||||
<div class="columns">
|
||||
{{- range $tiles }}
|
||||
<div class="column is-one-third">
|
||||
<div class="feature-card is-bordered has-text-centered revealOnScroll delay-1" data-animation="fadeInLeft">
|
||||
<div class="card-title">
|
||||
<h4>{{ .title }}</h4>
|
||||
</div>
|
||||
<div class="card-icon">
|
||||
<img src="{{ printf "/images/illustrations/icons/%s.svg" .icon | relURL }}">
|
||||
</div>
|
||||
<div class="card-text">
|
||||
<p>{{ .text }}</p>
|
||||
</div>
|
||||
<div class="card-action">
|
||||
<a href="#" class="button btn-align-md accent-btn raised">{{ .buttonText }}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{- end }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
Reference in New Issue
Block a user