feat: support both 1 and 2 column variations for most widgets

- support both 1 and 2 column variations for following widgets: "pages" "featured" "experience" "accomplishments" "contact" "blank" "tag_cloud"
- fix parallax conflict with new CSS page grid causing 100% entire page height for a section
   - add dedicated child div for bg prevents parallax 100% height issue within new CSS grid page wrapper
- fix `.page-wrapper` min-height when no-navbar
- fix `.home-section.fullscreen` min-height when no-navbar
- refactor `contact-widget` styles to use existing `wg-contact` class

wowchemy/assets/scss/wowchemy/_root.scss

@@ -48,6 +48,9 @@ body.no-navbar {
     min-height: calc(100vh - 50px);
   }
 }
+.page-wrapper.no-navbar {
+  min-height: 100vh;
+}
 
 .page-header,
 .page-footer {

wowchemy/assets/scss/wowchemy/_widgets.scss

@@ -28,6 +28,9 @@
     min-height: calc(100vh - 50px);
   }
 }
+.no-navbar .home-section.fullscreen {
+  min-height: 100vh;
+}
 
 /* Override dark colors that may be inherited from body.dark */
 .home-section.dark,
@@ -66,8 +69,19 @@
   top: 100%;
 }*/
 
+// Fill padding of `.home-section` parent
+.home-section-bg {
+  position: absolute;
+  top: 0;
+  left: 0;
+  height: fill-available;
+  height: -webkit-fill-available;
+  width: fill-available;
+  width: -webkit-fill-available;
+}
+
 /* Default background image properties for home sections. */
-.home-section.bg-image {
+.home-section-bg .bg-image {
   background-position: center;
   background-repeat: no-repeat;
   background-size: cover;
@@ -557,24 +571,24 @@ ul.ul-edu li .description p.institution {
  *  Contact
  **************************************************/
 
-.contact-widget .fa-ul {
+.wg-contact .fa-ul {
   margin-left: 3.14285714rem; /* Must be > `fa-2x` icon size. */
 }
 
-.contact-widget .fa-li {
+.wg-contact .fa-li {
   position: absolute;
-  left: -3.14285714rem; /* Negative of `.contact-widget .fa-ul` margin. */
+  left: -3.14285714rem; /* Negative of `.wg-contact .fa-ul` margin. */
   width: 2rem; /* Match `fa-2x` icon size. */
   top: 0.14285714em; /* Default FA value. */
   text-align: center;
 }
 
-.contact-widget li {
+.wg-contact li {
   padding-top: 0.8rem; /* Align text with bottom of `fa-2x` icon. */
   margin-bottom: 0.3rem;
 }
 
-.contact-widget li:last-of-type {
+.wg-contact li:last-of-type {
   margin-bottom: 0;
 }
 

wowchemy/layouts/partials/widget_page.html

@@ -28,13 +28,14 @@
   {{/* Begin widget styling */}}
   {{ $bg := $st.Params.design.background }}
   {{ $style := "" }}
+  {{ $style_bg := "" }}
 
   {{ if $bg.color }}
-    {{ $style = printf "background-color: %s;" ($bg.color | default "transparent") }}
+    {{ $style_bg = printf "background-color: %s;" ($bg.color | default "transparent") }}
   {{ end }}
 
   {{ if and $bg.gradient_start $bg.gradient_end }}
-    {{ $style = printf "%sbackground-image: linear-gradient(%s, %s);" $style $bg.gradient_start $bg.gradient_end }}
+    {{ $style_bg = printf "%sbackground-image: linear-gradient(%s, %s);" $style_bg $bg.gradient_start $bg.gradient_end }}
   {{ end }}
 
   {{ if $bg.image }}
@@ -44,14 +45,14 @@
     {{ end }}
     {{/* See Hugo note on linking assets in styles: https://github.com/gohugoio/hugoThemes#common-permalink-issues */}}
     {{ $media_dir := $.Scratch.Get "media_dir" }}
-    {{ $style = printf "%sbackground-image: %s url('%s');" $style $darken (printf "%s/%s" $media_dir $bg.image | absURL) }}
+    {{ $style_bg = printf "%sbackground-image: %s url('%s');" $style_bg $darken (printf "%s/%s" $media_dir $bg.image | absURL) }}
     {{ with $bg.image_size }}
       {{/* Allow sizes: actual, cover, and contain. */}}
-      {{ $style = printf "%sbackground-size: %s;" $style (replace . "actual" "auto") }}
+      {{ $style_bg = printf "%sbackground-size: %s;" $style_bg (replace . "actual" "auto") }}
     {{ end }}
     {{ with $bg.image_position }}
       {{/* Allow valid CSS positions including left, center, and right. */}}
-      {{ $style = printf "%sbackground-position: %s;" $style . }}
+      {{ $style_bg = printf "%sbackground-position: %s;" $style_bg . }}
     {{ end }}
   {{ end }}
 
@@ -98,9 +99,37 @@
     {{ $use_container = $cfg.use_container }}
   {{end}}
 
-  <section id="{{$hash_id}}" class="home-section {{$widget_class}} {{if $bg.text_color_light}}dark{{end}} {{if $bg.image}} bg-image{{if ($bg.image_parallax | default true) }} parallax{{end}}{{end}} {{with $css_classes}}{{.}}{{end}}" {{with $style}}style="{{. | safeCSS}}"{{end}} {{print $extra_attributes | safeHTMLAttr}}>
+  {{ $columns := $st.Params.design.columns | default "2" }}
+  {{ $use_cols := in (slice "pages" "featured" "experience" "accomplishments" "contact" "blank" "tag_cloud") $widget }}
+
+  {{/* Dedicated child div for bg prevents parallax 100% height issue within new CSS grid page wrapper. */}}
+  <section id="{{$hash_id}}" class="home-section {{$widget_class}} {{if $bg.text_color_light}}dark{{end}} {{with $css_classes}}{{.}}{{end}}" {{with $style}}style="{{. | safeCSS}}"{{end}} {{print $extra_attributes | safeHTMLAttr}}>
+   <div class="home-section-bg {{if $bg.image}} bg-image{{if ($bg.image_parallax | default true) }} parallax{{end}}{{end}}" {{with $style_bg}}style="{{. | safeCSS}}"{{end}}></div>
     {{if $use_container}}<div class="container">{{end}}
+
+    {{if $use_cols}}
+      <div class="row  {{if not $st.Title | or (eq $columns "1") }}justify-content-center{{end}}">
+      {{ if $st.Title }}
+        {{ if eq $columns "1" }}
+          <div class="col-12 section-heading text-center">
+            {{ with $st.Title }}<h1>{{.}}</h1>{{ end }}
+            {{ with $st.Params.subtitle }}<p>{{ . | markdownify | emojify }}</p>{{ end }}
+          </div>
+        {{else}}
+          <div class="col-12 col-lg-4 section-heading">
+            {{ with $st.Title }}<h1>{{.}}</h1>{{ end }}
+            {{ with $st.Params.subtitle }}<p>{{ . | markdownify | emojify }}</p>{{ end }}
+          </div>
+        {{end}}
+      {{end}}
+    {{end}}
+
       {{ partial $widget_path $widget_args }}
+
+    {{if $use_cols}}
+      </div>
+    {{end}}
+
     {{if $use_container}}</div>{{end}}
   </section>
 {{ end }}

wowchemy/layouts/partials/widgets/accomplishments.html

@@ -1,48 +1,43 @@
 {{ $ := .root }}
 {{ $page := .page }}
+{{ $columns := $page.Params.design.columns | default "2" }}
 
 <!-- Accomplishments widget -->
-<div class="row">
-  <div class="col-12 col-lg-4 section-heading">
-    <h1>{{ with $page.Title }}{{ . | markdownify }}{{ end }}</h1>
-    {{ with $page.Params.subtitle }}<p>{{ . | markdownify }}</p>{{ end }}
-  </div>
-  <div class="col-12 col-lg-8">
-    {{ with $page.Content }}{{ . }}{{ end }}
+<div class="col-12 {{if eq $columns "2"}}col-lg-8{{end}}">
+  {{ with $page.Content }}{{ . }}{{ end }}
 
-    {{ if $page.Params.item }}
-    {{ range $idx, $key := sort $page.Params.item ".date_start" "desc" }}
-      <div class="card experience course">
-        <div class="card-body">
-          {{- with .url -}}<a href="{{.}}" target="_blank" rel="noopener">{{- end -}}
-          <h4 class="card-title exp-title text-muted my-0">{{.title | markdownify | emojify}}</h4>
-          {{- with .url -}}</a>{{- end -}}
+  {{ if $page.Params.item }}
+  {{ range $idx, $key := sort $page.Params.item ".date_start" "desc" }}
+    <div class="card experience course">
+      <div class="card-body">
+        {{- with .url -}}<a href="{{.}}" target="_blank" rel="noopener">{{- end -}}
+        <h4 class="card-title exp-title text-muted my-0">{{.title | markdownify | emojify}}</h4>
+        {{- with .url -}}</a>{{- end -}}
 
-          <div class="card-subtitle my-0 article-metadata">
-            {{- with .organization_url}}<a href="{{.}}" target="_blank" rel="noopener">{{end -}}
-            {{- .organization | markdownify | emojify -}}
-            {{- with .organization_url}}</a>{{end -}}
+        <div class="card-subtitle my-0 article-metadata">
+          {{- with .organization_url}}<a href="{{.}}" target="_blank" rel="noopener">{{end -}}
+          {{- .organization | markdownify | emojify -}}
+          {{- with .organization_url}}</a>{{end -}}
 
-            <span class="middot-divider"></span>
+          <span class="middot-divider"></span>
 
-            {{ (time .date_start).Format ($page.Params.date_format | default "Jan 2006") }}
-            {{ if .date_end}}
-            – {{ (time .date_end).Format ($page.Params.date_format | default "Jan 2006") }}
-            {{end}}
-          </div>
-
-          {{with .description}}
-            <div class="card-text">{{. | markdownify | emojify}}</div>
+          {{ (time .date_start).Format ($page.Params.date_format | default "Jan 2006") }}
+          {{ if .date_end}}
+          – {{ (time .date_end).Format ($page.Params.date_format | default "Jan 2006") }}
           {{end}}
-
-          {{ with .certificate_url }}
-            <a class="card-link" href="{{.}}" target="_blank" rel="noopener">
-              {{ i18n "see_certificate" | default "See certificate" }}
-            </a>
-          {{ end }}
         </div>
+
+        {{with .description}}
+          <div class="card-text">{{. | markdownify | emojify}}</div>
+        {{end}}
+
+        {{ with .certificate_url }}
+          <a class="card-link" href="{{.}}" target="_blank" rel="noopener">
+            {{ i18n "see_certificate" | default "See certificate" }}
+          </a>
+        {{ end }}
       </div>
-    {{end}}
-    {{end}}
-  </div>
+    </div>
+  {{end}}
+  {{end}}
 </div>

wowchemy/layouts/partials/widgets/blank.html

@@ -1,20 +1,12 @@
 {{ $st := .page }}
 {{ $columns := $st.Params.design.columns | default "2" }}
 
-<div class="row">
-  {{ if ne $columns "1" }}
-    <div class="col-12 col-lg-4 section-heading">
-      {{ with $st.Title }}<h1>{{ . | markdownify | emojify }}</h1>{{ end }}
-      {{ with $st.Params.subtitle }}<p>{{ . | markdownify | emojify }}</p>{{ end }}
-    </div>
-    <div class="col-12 col-lg-8">
-      {{ $st.Content }}
-    </div>
-  {{ else }}
-    <div class="col-lg-12">
-      {{ with $st.Title }}<h1>{{ . | markdownify | emojify }}</h1>{{ end }}
-      {{ with $st.Params.subtitle }}<p>{{ . | markdownify | emojify }}</p>{{ end }}
-      {{ $st.Content }}
-    </div>
-  {{ end }}
-</div>
+{{ if ne $columns "1" }}
+  <div class="col-12 col-lg-8">
+    {{ $st.Content }}
+  </div>
+{{ else }}
+  <div class="col-12">
+    {{ $st.Content }}
+  </div>
+{{ end }}

wowchemy/layouts/partials/widgets/contact.html

@@ -5,152 +5,137 @@
 
 {{ $columns := $st.Params.design.columns | default "2" }}
 
-<div class="row contact-widget {{if not $st.Title | or (eq $columns "1") }}justify-content-center{{end}}">
-  {{ if $st.Title }}
-    {{ if eq $columns "1" }}
-      <div class="col-12 col-lg-8 section-heading text-center">
-        {{ with $st.Title }}<h1>{{.}}</h1>{{ end }}
-        {{ with $st.Params.subtitle }}<p>{{ . | markdownify | emojify }}</p>{{ end }}
-      </div>
-    {{else}}
-      <div class="col-12 col-lg-4 section-heading">
-        {{ with $st.Title }}<h1>{{.}}</h1>{{ end }}
-        {{ with $st.Params.subtitle }}<p>{{ . | markdownify | emojify }}</p>{{ end }}
-      </div>
-    {{end}}
-  {{ end }}
-  <div class="col-12 col-lg-8">
-    {{ with $st.Content }}{{ . }}{{ end }}
+<div class="col-12 {{if eq $columns "2"}}col-lg-8{{end}}">
+  {{ with $st.Content }}{{ . }}{{ end }}
 
-    {{ if $st.Params.email_form }}
+  {{ if $st.Params.email_form }}
 
-    {{ $post_action := "" }}
-    {{ if eq $st.Params.email_form 1 }}
-      {{ $post_action = "netlify" }}
-    {{ else }}
-      {{ if not $data.email }}
-        {{ errorf "Please set an email address for the contact form using the `email` parameter in `params.toml`. Otherwise, set `email_form = 0` to disable the contact form." }}
+  {{ $post_action := "" }}
+  {{ if eq $st.Params.email_form 1 }}
+    {{ $post_action = "netlify" }}
+  {{ else }}
+    {{ if not $data.email }}
+      {{ errorf "Please set an email address for the contact form using the `email` parameter in `params.toml`. Otherwise, set `email_form = 0` to disable the contact form." }}
+    {{ end }}
+    {{ $post_action = printf "action=\"https://formspree.io/%s\"" $data.email }}
+  {{end}}
+
+  <div class="mb-3">
+    <form name="contact" method="POST" {{ $post_action | safeHTMLAttr }} {{ if eq $st.Params.email_form 1 }}netlify-honeypot="welcome-bot"{{end}} {{ if $st.Params.netlify.captcha }}data-netlify-recaptcha="true"{{end}}>
+      <div class="form-group form-inline">
+        <label class="sr-only" for="inputName">{{ i18n "contact_name" }}</label>
+        <input type="text" name="name" class="form-control w-100" id="inputName" placeholder="{{ i18n "contact_name" | default "Name" }}" required>
+      </div>
+      <div class="form-group form-inline">
+        <label class="sr-only" for="inputEmail">{{ i18n "contact_email" }}</label>
+        <input type="email" name="email" class="form-control w-100" id="inputEmail" placeholder="{{ i18n "contact_email" | default "Email" }}" required>
+      </div>
+      <div class="form-group">
+        <label class="sr-only" for="inputMessage">{{ i18n "contact_message" }}</label>
+        <textarea name="message" class="form-control" id="inputMessage" rows="5" placeholder="{{ i18n "contact_message" | default "Message" }}" required></textarea>
+      </div>
+      {{ if eq $st.Params.email_form 1 }}
+      <div class="d-none">
+        <label>Do not fill this field unless you are a bot: <input name="welcome-bot"></label>
+      </div>
       {{ end }}
-      {{ $post_action = printf "action=\"https://formspree.io/%s\"" $data.email }}
-    {{end}}
-
-    <div class="mb-3">
-      <form name="contact" method="POST" {{ $post_action | safeHTMLAttr }} {{ if eq $st.Params.email_form 1 }}netlify-honeypot="welcome-bot"{{end}} {{ if $st.Params.netlify.captcha }}data-netlify-recaptcha="true"{{end}}>
-        <div class="form-group form-inline">
-          <label class="sr-only" for="inputName">{{ i18n "contact_name" }}</label>
-          <input type="text" name="name" class="form-control w-100" id="inputName" placeholder="{{ i18n "contact_name" | default "Name" }}" required>
-        </div>
-        <div class="form-group form-inline">
-          <label class="sr-only" for="inputEmail">{{ i18n "contact_email" }}</label>
-          <input type="email" name="email" class="form-control w-100" id="inputEmail" placeholder="{{ i18n "contact_email" | default "Email" }}" required>
-        </div>
-        <div class="form-group">
-          <label class="sr-only" for="inputMessage">{{ i18n "contact_message" }}</label>
-          <textarea name="message" class="form-control" id="inputMessage" rows="5" placeholder="{{ i18n "contact_message" | default "Message" }}" required></textarea>
-        </div>
-        {{ if eq $st.Params.email_form 1 }}
-        <div class="d-none">
-          <label>Do not fill this field unless you are a bot: <input name="welcome-bot"></label>
-        </div>
-        {{ end }}
-        {{ if $st.Params.netlify.captcha }}
-        <div class="form-group" data-netlify-recaptcha="true"></div>
-        {{ end }}
-        <button type="submit" class="btn btn-outline-primary px-3 py-2">{{ i18n "contact_send" | default "Send" }}</button>
-      </form>
-    </div>
-    {{end}}
-
-    <ul class="fa-ul">
-
-      {{ if and $data.email (not $st.Params.email_form) }}
-      <li>
-        <i class="fa-li fas fa-envelope fa-2x" aria-hidden="true"></i>
-        <span id="person-email">
-        {{- if $autolink }}<a href="mailto:{{ $data.email }}">{{ $data.email }}</a>{{ else }}{{ $data.email }}{{ end -}}
-        </span>
-      </li>
+      {{ if $st.Params.netlify.captcha }}
+      <div class="form-group" data-netlify-recaptcha="true"></div>
       {{ end }}
+      <button type="submit" class="btn btn-outline-primary px-3 py-2">{{ i18n "contact_send" | default "Send" }}</button>
+    </form>
+  </div>
+  {{end}}
 
-      {{ with $data.phone }}
-      <li>
-        <i class="fa-li fas fa-phone fa-2x" aria-hidden="true"></i>
-        <span id="person-telephone">
-        {{- if $autolink }}<a href="tel:{{ . }}">{{ . }}</a>{{ else }}{{ . }}{{ end -}}
-        </span>
-      </li>
-      {{ end }}
+  <ul class="fa-ul">
 
-      {{ $addr_formatted := "" }}{{/* Scoping for maps. */}}
-      {{ if $data.address.street | or $data.address.city | or $data.address.region | or $data.address.postcode | or $data.address.country }}
-        {{ $addr_formatted = partial "functions/get_address" (dict "root" . "address" $data.address) }}
-        <li>
-          <i class="fa-li fas fa-map-marker fa-2x" aria-hidden="true"></i>
-          <span id="person-address">{{$addr_formatted}}</span>
-        </li>
-      {{ end }}
+    {{ if and $data.email (not $st.Params.email_form) }}
+    <li>
+      <i class="fa-li fas fa-envelope fa-2x" aria-hidden="true"></i>
+      <span id="person-email">
+      {{- if $autolink }}<a href="mailto:{{ $data.email }}">{{ $data.email }}</a>{{ else }}{{ $data.email }}{{ end -}}
+      </span>
+    </li>
+    {{ end }}
 
-      {{ with $data.directions }}
-      <li>
-        <i class="fa-li fas fa-compass fa-2x" aria-hidden="true"></i>
-        <span>{{ . | markdownify | emojify }}</span>
-      </li>
-      {{ end }}
+    {{ with $data.phone }}
+    <li>
+      <i class="fa-li fas fa-phone fa-2x" aria-hidden="true"></i>
+      <span id="person-telephone">
+      {{- if $autolink }}<a href="tel:{{ . }}">{{ . }}</a>{{ else }}{{ . }}{{ end -}}
+      </span>
+    </li>
+    {{ end }}
 
-      {{ with $data.office_hours }}
+    {{ $addr_formatted := "" }}{{/* Scoping for maps. */}}
+    {{ if $data.address.street | or $data.address.city | or $data.address.region | or $data.address.postcode | or $data.address.country }}
+      {{ $addr_formatted = partial "functions/get_address" (dict "root" . "address" $data.address) }}
       <li>
-        <i class="fa-li fas fa-clock fa-2x" aria-hidden="true"></i>
-        <span>
-          {{- if not (reflect.IsSlice .)}}{{/* Support legacy string format. */}}
-            {{- . | markdownify | emojify -}}
-          {{else}}
-            {{- delimit . "<br>" | markdownify | emojify -}}
-          {{end -}}
-        </span>
+        <i class="fa-li fas fa-map-marker fa-2x" aria-hidden="true"></i>
+        <span id="person-address">{{$addr_formatted}}</span>
       </li>
-      {{ end }}
+    {{ end }}
 
-      {{ with $data.appointment_url }}
-      <li>
-        <i class="fa-li fas fa-calendar-check fa-2x" aria-hidden="true"></i>
-        <a href="{{ . }}" target="_blank" rel="noopener">{{ i18n "book_appointment" | default "Book an appointment" }}</a>
-      </li>
-      {{ end }}
+    {{ with $data.directions }}
+    <li>
+      <i class="fa-li fas fa-compass fa-2x" aria-hidden="true"></i>
+      <span>{{ . | markdownify | emojify }}</span>
+    </li>
+    {{ end }}
 
-      {{/* Contact links. */}}
-      {{ range $data.contact_links }}
-      {{ $pack := or .icon_pack "fas" }}
-      {{ $pack_prefix := $pack }}
-      {{ if in (slice "fab" "fas" "far" "fal") $pack }}
-        {{ $pack_prefix = "fa" }}
-      {{ end }}
-      {{ $link := .link }}
-      {{ $scheme := (urls.Parse $link).Scheme }}
-      {{ $target := "" }}
-      {{ if not $scheme }}
-        {{ $link = .link | relLangURL }}
-      {{ else if in (slice "http" "https") $scheme }}
-        {{ $target = "target=\"_blank\" rel=\"noopener\"" }}
-      {{ end }}
-      <li>
-        <i class="fa-li {{ $pack }} {{ $pack_prefix }}-{{ .icon }} fa-2x" aria-hidden="true"></i>
-        <a href="{{ $link | safeURL }}" {{ $target | safeHTMLAttr }}>{{.name|markdownify|emojify|safeHTML}}</a>
-      </li>
-      {{ end }}
+    {{ with $data.office_hours }}
+    <li>
+      <i class="fa-li fas fa-clock fa-2x" aria-hidden="true"></i>
+      <span>
+        {{- if not (reflect.IsSlice .)}}{{/* Support legacy string format. */}}
+          {{- . | markdownify | emojify -}}
+        {{else}}
+          {{- delimit . "<br>" | markdownify | emojify -}}
+        {{end -}}
+      </span>
+    </li>
+    {{ end }}
 
-    </ul>
-
-    {{ if and site.Params.map.engine $data.coordinates.latitude }}
-    <div class="d-none">
-      <input id="map-provider" value="{{ site.Params.map.engine }}">
-      <input id="map-lat" value="{{ $data.coordinates.latitude }}">
-      <input id="map-lng" value="{{ $data.coordinates.longitude }}">
-      <input id="map-dir" value="{{ $addr_formatted }}">
-      <input id="map-zoom" value="{{ site.Params.map.zoom | default "15" }}">
-      <input id="map-api-key" value="{{ site.Params.map.api_key }}">
-    </div>
-    <div id="map"></div>
+    {{ with $data.appointment_url }}
+    <li>
+      <i class="fa-li fas fa-calendar-check fa-2x" aria-hidden="true"></i>
+      <a href="{{ . }}" target="_blank" rel="noopener">{{ i18n "book_appointment" | default "Book an appointment" }}</a>
+    </li>
     {{ end }}
 
+    {{/* Contact links. */}}
+    {{ range $data.contact_links }}
+    {{ $pack := or .icon_pack "fas" }}
+    {{ $pack_prefix := $pack }}
+    {{ if in (slice "fab" "fas" "far" "fal") $pack }}
+      {{ $pack_prefix = "fa" }}
+    {{ end }}
+    {{ $link := .link }}
+    {{ $scheme := (urls.Parse $link).Scheme }}
+    {{ $target := "" }}
+    {{ if not $scheme }}
+      {{ $link = .link | relLangURL }}
+    {{ else if in (slice "http" "https") $scheme }}
+      {{ $target = "target=\"_blank\" rel=\"noopener\"" }}
+    {{ end }}
+    <li>
+      <i class="fa-li {{ $pack }} {{ $pack_prefix }}-{{ .icon }} fa-2x" aria-hidden="true"></i>
+      <a href="{{ $link | safeURL }}" {{ $target | safeHTMLAttr }}>{{.name|markdownify|emojify|safeHTML}}</a>
+    </li>
+    {{ end }}
+
+  </ul>
+
+  {{ if and site.Params.map.engine $data.coordinates.latitude }}
+  <div class="d-none">
+    <input id="map-provider" value="{{ site.Params.map.engine }}">
+    <input id="map-lat" value="{{ $data.coordinates.latitude }}">
+    <input id="map-lng" value="{{ $data.coordinates.longitude }}">
+    <input id="map-dir" value="{{ $addr_formatted }}">
+    <input id="map-zoom" value="{{ site.Params.map.zoom | default "15" }}">
+    <input id="map-api-key" value="{{ site.Params.map.api_key }}">
   </div>
+  <div id="map"></div>
+  {{ end }}
+
 </div>

wowchemy/layouts/partials/widgets/experience.html

@@ -1,59 +1,54 @@
 {{ $ := .root }}
 {{ $page := .page }}
+{{ $columns := $page.Params.design.columns | default "2" }}
 
 <!-- Experience widget -->
-<div class="row">
-  <div class="col-12 col-lg-4 section-heading">
-    <h1>{{ with $page.Title }}{{ . | markdownify }}{{ end }}</h1>
-    {{ with $page.Params.subtitle }}<p>{{ . | markdownify }}</p>{{ end }}
-  </div>
-  <div class="col-12 col-lg-8">
-    {{ with $page.Content }}{{ . }}{{ end }}
+<div class="col-12 {{if eq $columns "2"}}col-lg-8{{end}}">
+  {{ with $page.Content }}{{ . }}{{ end }}
 
-    {{ if $page.Params.experience }}
-    {{ $exp_len := len $page.Params.experience }}
-    {{ range $idx, $key := sort $page.Params.experience ".date_start" "desc" }}
-    <div class="row experience">
-      <!-- Timeline -->
-      <div class="col-auto text-center flex-column d-none d-sm-flex">
-        <div class="row h-50">
-          <div class="col {{if gt $idx 0}}border-right{{end}}">&nbsp;</div>
-          <div class="col">&nbsp;</div>
-        </div>
-        <div class="m-2">
-          <span class="badge badge-pill border {{if not .date_end}}exp-fill{{end}}">&nbsp;</span>
-        </div>
-        <div class="row h-50">
-          <div class="col {{if lt $idx (sub $exp_len 1)}}border-right{{end}}">&nbsp;</div>
-          <div class="col">&nbsp;</div>
-        </div>
+  {{ if $page.Params.experience }}
+  {{ $exp_len := len $page.Params.experience }}
+  {{ range $idx, $key := sort $page.Params.experience ".date_start" "desc" }}
+  <div class="row experience">
+    <!-- Timeline -->
+    <div class="col-auto text-center flex-column d-none d-sm-flex">
+      <div class="row h-50">
+        <div class="col {{if gt $idx 0}}border-right{{end}}">&nbsp;</div>
+        <div class="col">&nbsp;</div>
       </div>
-      <!-- Content -->
-      <div class="col py-2">
-        <div class="card">
-          <div class="card-body">
-            <h4 class="card-title exp-title text-muted mt-0 mb-1">{{.title | markdownify | emojify}}</h4>
-            <h4 class="card-title exp-company text-muted my-0">
-              {{- with .company_url}}<a href="{{.}}" target="_blank" rel="noopener">{{end}}{{.company | markdownify | emojify}}{{with .company_url}}</a>{{end -}}
-            </h4>
-            <div class="text-muted exp-meta">
-              {{ (time .date_start).Format ($page.Params.date_format | default "January 2006") }} –
-              {{ if .date_end}}
-                {{ (time .date_end).Format ($page.Params.date_format | default "January 2006") }}
-              {{else}}
-                {{ i18n "present" | default "Present" }}
-              {{end}}
-              {{with .location}}
-                <span class="middot-divider"></span>
-                <span>{{.}}</span>
-              {{end}}
-            </div>
-            {{with .description}}<div class="card-text">{{. | markdownify | emojify}}</div>{{end}}
+      <div class="m-2">
+        <span class="badge badge-pill border {{if not .date_end}}exp-fill{{end}}">&nbsp;</span>
+      </div>
+      <div class="row h-50">
+        <div class="col {{if lt $idx (sub $exp_len 1)}}border-right{{end}}">&nbsp;</div>
+        <div class="col">&nbsp;</div>
+      </div>
+    </div>
+    <!-- Content -->
+    <div class="col py-2">
+      <div class="card">
+        <div class="card-body">
+          <h4 class="card-title exp-title text-muted mt-0 mb-1">{{.title | markdownify | emojify}}</h4>
+          <h4 class="card-title exp-company text-muted my-0">
+            {{- with .company_url}}<a href="{{.}}" target="_blank" rel="noopener">{{end}}{{.company | markdownify | emojify}}{{with .company_url}}</a>{{end -}}
+          </h4>
+          <div class="text-muted exp-meta">
+            {{ (time .date_start).Format ($page.Params.date_format | default "January 2006") }} –
+            {{ if .date_end}}
+              {{ (time .date_end).Format ($page.Params.date_format | default "January 2006") }}
+            {{else}}
+              {{ i18n "present" | default "Present" }}
+            {{end}}
+            {{with .location}}
+              <span class="middot-divider"></span>
+              <span>{{.}}</span>
+            {{end}}
           </div>
+          {{with .description}}<div class="card-text">{{. | markdownify | emojify}}</div>{{end}}
         </div>
       </div>
     </div>
-    {{end}}
-    {{end}}
   </div>
+  {{end}}
+  {{end}}
 </div>

wowchemy/layouts/partials/widgets/featured.html

@@ -48,26 +48,23 @@
   {{ $i18n = "more_pages" }}
 {{ end }}
 
-<div class="row">
-  <div class="col-12 col-lg-4 section-heading">
-    <h1>{{ with $st.Title }}{{ . | markdownify | emojify }}{{ end }}</h1>
-    {{ with $st.Params.subtitle }}<p>{{ . | markdownify | emojify }}</p>{{ end }}
-  </div>
-  <div class="col-12 col-lg-8">
+{{ $columns := $st.Params.design.columns | default "2" }}
 
-    {{ with $st.Content }}{{ . }}{{ end }}
+<div class="col-12 {{if eq $columns "2"}}col-lg-8{{end}}">
 
-    {{ range $post := $query }}
-      {{ if eq $st.Params.design.view 1 }}
-        {{ partial "li_list" . }}
-      {{ else if eq $st.Params.design.view 3 }}
-        {{ partial "li_card" . }}
-      {{ else if eq $st.Params.design.view 4 | and (eq $items_type "publication") }}
-        {{ partial "li_citation" . }}
-      {{ else }}
-        {{ partial "li_compact" . }}
-      {{ end }}
-    {{end}}
+  {{ with $st.Content }}{{ . }}{{ end }}
+
+  {{ range $post := $query }}
+    {{ if eq $st.Params.design.view 1 }}
+      {{ partial "li_list" . }}
+    {{ else if eq $st.Params.design.view 3 }}
+      {{ partial "li_card" . }}
+    {{ else if eq $st.Params.design.view 4 | and (eq $items_type "publication") }}
+      {{ partial "li_citation" . }}
+    {{ else }}
+      {{ partial "li_compact" . }}
+    {{ end }}
+  {{end}}
 
   {{ if $st.Params.content.link_to_archive }}
     <div class="see-all">
@@ -78,5 +75,4 @@
     </div>
   {{ end }}
 
-  </div>
 </div>

wowchemy/layouts/partials/widgets/pages.html

@@ -71,56 +71,41 @@
 
 {{ $columns := $st.Params.design.columns | default "2" }}
 
-<div class="row {{if not $st.Title | or (eq $columns "1") }}justify-content-center{{end}}">
-  {{ if $st.Title }}
-    {{ if eq $columns "1" }}
-      <div class="col-12 col-lg-8 section-heading text-center">
-        {{ with $st.Title }}<h1>{{.}}</h1>{{ end }}
-        {{ with $st.Params.subtitle }}<p>{{ . | markdownify | emojify }}</p>{{ end }}
-      </div>
-    {{else}}
-      <div class="col-12 col-lg-4 section-heading">
-        {{ with $st.Title }}<h1>{{.}}</h1>{{ end }}
-        {{ with $st.Params.subtitle }}<p>{{ . | markdownify | emojify }}</p>{{ end }}
-      </div>
-    {{end}}
-  {{ end }}
-  <div class="col-12 col-lg-8">
-
-    {{ with $st.Content }}{{ . }}{{ end }}
-
-    {{ range $post := $query }}
-      {{ if eq $st.Params.design.view 1 }}
-        {{ partial "li_list" . }}
-      {{ else if eq $st.Params.design.view 3 }}
-        {{ partial "li_card" . }}
-      {{ else if eq $st.Params.design.view 4 | and (eq $items_type "publication") }}
-        {{ partial "li_citation" . }}
-      {{ else }}
-        {{ partial "li_compact" . }}
-      {{ end }}
-    {{end}}
-
-    {{/* Archive link */}}
-    {{ $show_archive_link := $st.Params.content.archive.enable | default (gt $count $items_count) }}
-    {{ if $show_archive_link }}
-
-      {{ $archive_link := "" }}
-      {{ if $st.Params.content.archive.link }}
-        {{ $archive_link = $st.Params.content.archive.link | relLangURL }}
-      {{ else }}
-        {{ $archive_link = $archive_page.RelPermalink }}
-      {{ end }}
-
-      {{ $archive_text := $st.Params.content.archive.text | default (i18n $i18n) | default "See all" }}
-
-      <div class="see-all">
-        <a href="{{ $archive_link }}">
-          {{ $archive_text | emojify }}
-          <i class="fas fa-angle-right"></i>
-        </a>
-      </div>
+<div class="col-12 {{if eq $columns "2"}}col-lg-8{{end}}">
+
+  {{ with $st.Content }}{{ . }}{{ end }}
+
+  {{ range $post := $query }}
+    {{ if eq $st.Params.design.view 1 }}
+      {{ partial "li_list" . }}
+    {{ else if eq $st.Params.design.view 3 }}
+      {{ partial "li_card" . }}
+    {{ else if eq $st.Params.design.view 4 | and (eq $items_type "publication") }}
+      {{ partial "li_citation" . }}
+    {{ else }}
+      {{ partial "li_compact" . }}
+    {{ end }}
+  {{end}}
+
+  {{/* Archive link */}}
+  {{ $show_archive_link := $st.Params.content.archive.enable | default (gt $count $items_count) }}
+  {{ if $show_archive_link }}
+
+    {{ $archive_link := "" }}
+    {{ if $st.Params.content.archive.link }}
+      {{ $archive_link = $st.Params.content.archive.link | relLangURL }}
+    {{ else }}
+      {{ $archive_link = $archive_page.RelPermalink }}
     {{ end }}
 
-  </div>
+    {{ $archive_text := $st.Params.content.archive.text | default (i18n $i18n) | default "See all" }}
+
+    <div class="see-all">
+      <a href="{{ $archive_link }}">
+        {{ $archive_text | emojify }}
+        <i class="fas fa-angle-right"></i>
+      </a>
+    </div>
+  {{ end }}
+
 </div>

wowchemy/layouts/partials/widgets/tag_cloud.html

@@ -1,5 +1,3 @@
-{{/* Pages Widget */}}
-
 {{/* Initialise */}}
 {{ $ := .root }}
 {{ $st := .page }}
@@ -18,32 +16,28 @@
 {{ $tags := first $items_count (index site.Taxonomies $taxonomy).ByCount }}
 {{ $count := len $tags }}
 
-<div class="row">
-  <div class="col-12 col-lg-4 section-heading">
-    <h1>{{ with $st.Title }}{{ . | markdownify | emojify }}{{ end }}</h1>
-    {{ with $st.Params.subtitle }}<p>{{ . | markdownify | emojify }}</p>{{ end }}
-  </div>
-  <div class="col-12 col-lg-8">
-    {{ with $st.Content }}{{ . }}{{ end }}
-
-    {{ if ne $count 0 }}
-
-      {{ $fontDelta := sub $fontBig $fontSmall }}
-      {{/* Warning: Hugo's `Reverse` function appears to operate in-place, hence the order of performing $max/$min matters. */}}
-      {{ $max := add (len (index $tags 0).Pages) 1 }}
-      {{ $min := len (index ($tags).Reverse 0).Pages }}
-      {{ $delta := sub $max $min }}
-      {{ $fontStep := div $fontDelta $delta }}
-
-      <div class="tag-cloud">
-        {{ range $name, $term := (sort $tags ".Page.Title" "asc") }}
-          {{ $tagCount := len $term.Pages }}
-          {{ $weight := div (sub (math.Log $tagCount) (math.Log $min)) (sub (math.Log $max) (math.Log $min)) }}
-          {{ $fontSize := add $fontSmall (mul (sub $fontBig $fontSmall) $weight) }}
-          <a href="{{ .Page.RelPermalink }}" style="font-size:{{ $fontSize }}rem">{{ .Page.Title }}</a>
-        {{ end }}
-      </div>
-    {{ end }}
-
-  </div>
+{{ $columns := $st.Params.design.columns | default "2" }}
+
+<div class="col-12 {{if eq $columns "2"}}col-lg-8{{end}}">
+  {{ with $st.Content }}{{ . }}{{ end }}
+
+  {{ if ne $count 0 }}
+
+    {{ $fontDelta := sub $fontBig $fontSmall }}
+    {{/* Warning: Hugo's `Reverse` function appears to operate in-place, hence the order of performing $max/$min matters. */}}
+    {{ $max := add (len (index $tags 0).Pages) 1 }}
+    {{ $min := len (index ($tags).Reverse 0).Pages }}
+    {{ $delta := sub $max $min }}
+    {{ $fontStep := div $fontDelta $delta }}
+
+    <div class="tag-cloud">
+      {{ range $name, $term := (sort $tags ".Page.Title" "asc") }}
+        {{ $tagCount := len $term.Pages }}
+        {{ $weight := div (sub (math.Log $tagCount) (math.Log $min)) (sub (math.Log $max) (math.Log $min)) }}
+        {{ $fontSize := add $fontSmall (mul (sub $fontBig $fontSmall) $weight) }}
+        <a href="{{ .Page.RelPermalink }}" style="font-size:{{ $fontSize }}rem">{{ .Page.Title }}</a>
+      {{ end }}
+    </div>
+  {{ end }}
+
 </div>