diff options
| author | mspnr <mspnr@mail.ru> | 2021-01-31 03:20:41 +0300 |
|---|---|---|
| committer | mspnr <mspnr@mail.ru> | 2021-01-31 18:26:30 +0300 |
| commit | 51e38e582cc05d7055423e73f7f951427aa62f55 (patch) | |
| tree | ec3cf4e84a4f5e4cd3406e4357c35122002c3fe2 | |
| parent | 60f3a622d756edd5e70996a8a43d6567ffcef198 (diff) | |
switching banner to data concept
| -rw-r--r-- | exampleSite/data/banner.yml | 12 | ||||
| -rw-r--r-- | layouts/index.html | 2 | ||||
| -rw-r--r-- | layouts/partials/banner.html | 28 |
3 files changed, 27 insertions, 15 deletions
diff --git a/exampleSite/data/banner.yml b/exampleSite/data/banner.yml new file mode 100644 index 0000000..517f0ab --- /dev/null +++ b/exampleSite/data/banner.yml @@ -0,0 +1,12 @@ +####################### Banner ######################### +style: "style1 orient-left content-align-left image-position-right fullscreen onload-image-fade-in onload-content-fade-right" +title : "Hugo Story" +subtitle: | + Hugo Story released for free under the <a target="_blank" href="https://creativecommons.org/licenses/by/3.0/">Creative Commons</a>. +content : | + This is a <strong>Banner</strong> element, and it's generally used as an introduction or opening statement. You can customize its <span class="demo-controls">appearance with a number of modifiers</span>, as well as assign it an optional <code>onload</code> or <code>onscroll</code> transition modifier (<a href="#reference-banner">details</a>). +button: + label : "Get Started" + link : "#first" +image : "images/banner.jpg" + diff --git a/layouts/index.html b/layouts/index.html index b78f436..278846d 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -15,7 +15,7 @@ <div id="wrapper" class="divided"> <!-- Main --> - {{ partial "banner" . }} + {{ partial "banner" site.Data.banner }} {{ partial "spotlight-01-left" . }} {{ partial "spotlight-02-right" . }} {{ partial "spotlight-03-left" . }} diff --git a/layouts/partials/banner.html b/layouts/partials/banner.html index edd0fa7..29acf12 100644 --- a/layouts/partials/banner.html +++ b/layouts/partials/banner.html @@ -1,14 +1,14 @@ - <!-- Banner --> - <section class="banner style1 orient-left content-align-left image-position-right fullscreen onload-image-fade-in onload-content-fade-right"> - <div class="content"> - {{ with .Site.Title }}<h1>{{.}}</h1>{{end}} - {{ with .Site.Params.subtitle }}<p class="major">{{.}} released for free under the <a target="_blank" href="https://creativecommons.org/licenses/by/3.0/">Creative Commons</a>.</p>{{end}} - <p>This is a <strong>Banner</strong> element, and it's generally used as an introduction or opening statement. You can customize its <span class="demo-controls">appearance with a number of modifiers</span>, as well as assign it an optional <code>onload</code> or <code>onscroll</code> transition modifier (<a href="#reference-banner">details</a>).</p> - <ul class="actions stacked"> - <li><a href="#first" class="button large wide smooth-scroll-middle">Get Started</a></li> - </ul> - </div> - <div class="image"> - {{ with .Site.Params.logo }}<img src="{{.}}" alt="Hugo Story" />{{end}} - </div> - </section>
\ No newline at end of file +<!-- Banner --> +<section class="banner {{ .style }}"> + <div class="content"> + {{ with .title }}<h1>{{ . }}</h1>{{ end }} + {{ with .subtitle }}<p class="major">{{ . | safeHTML }}</p>{{ end }} + {{ with .content }}<p>{{ . | safeHTML }}</p>{{ end }} + {{ with .button }}<ul class="actions stacked"> + <li><a href="{{ .link }}" class="button primary large wide smooth-scroll-middle">{{ .label }}</a></li> + </ul>{{ end }} + </div> + {{ with .image }}<div class="image"> + <img src="{{.}}" alt="Hugo Story" /> + </div>{{end}} +</section>
\ No newline at end of file |