feat: support disabling animations (#90)

If `usesAnimation` is not set, or is `true` animations are included. If it's set to false support for animations is disabled and no longer included in output CSS.
1bl4z3r · Oct 9, 2024 · abe0e86 · abe0e86
2 parents 51beaa3 + 9b2c3e8
commit abe0e86
Show file tree

Hide file tree

Showing 10 changed files with 12 additions and 9 deletions.
diff --git a/assets/scss/style.scss b/assets/scss/style.scss
@@ -1,7 +1,9 @@
 @import "predefined.scss";
 @import "normalize.scss";
 @import "syntax.scss";
+{{ if ne false .Site.Params.usesAnimation }}
 @import "animate.scss";
+{{ end }}
 @import "scroll.scss";
 @import "socialshare.scss";
 {{ if (fileExists "assets/scss/userstyles.scss") }}

diff --git a/hugo.toml.example b/hugo.toml.example
@@ -119,6 +119,7 @@ expiryDate = ["expiryDate"]
   # allowRobots = "index, follow"
   # siteNoIndex = false
   # noIndexPages = ["404 Page not found"]
+  # usesAnimation = true # Defaults to true
 
 
   [[params.socialLinks]]

diff --git a/layouts/404.html b/layouts/404.html
@@ -1,5 +1,5 @@
 {{ define "main" }}
-	<div id="spotlight" class="error-404 animated fadeIn">
+	<div id="spotlight" class="error-404 {{- if ne false .Site.Params.usesAnimation }} animated fadeIn {{- end -}}">
 		<p class="img-404">{{- partial "svg.html" (dict "context" . "name" "404-lighthouse") -}}</p>
 		<div class="banner-404">
 			<h1>404</h1>

diff --git a/layouts/_default/list.html b/layouts/_default/list.html
@@ -3,7 +3,7 @@
 {{ end }}
 
 {{ define "main" }}
-	<main class="site-main section-inner thin animated fadeIn faster">
+	<main class="site-main section-inner thin {{- if ne false .Site.Params.usesAnimation }} animated fadeIn faster{{- end -}}">
 		<h1>{{ .Title }}</h1>
 		{{- if .Content }}
 		<div class="content">

diff --git a/layouts/_default/single.html b/layouts/_default/single.html
@@ -16,7 +16,7 @@
 	{{- if (or .Params.images .Params.featuredImg) }}
 	<div class="bg-img"></div>
 	{{- end }}
-	<main class="site-main section-inner thin animated fadeIn faster">
+	<main class="site-main section-inner thin {{- if ne false .Site.Params.usesAnimation }} animated fadeIn faster {{- end -}}">
 		<h1>{{ .Title }}</h1>
 		<div class="content">
 			{{ .Content | replaceRE "(<h[1-6] id=\"([^\"]+)\".+)(</h[1-6]+>)" `${1}<a href="#${2}" class="anchor" aria-hidden="true"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 7h3a5 5 0 0 1 5 5 5 5 0 0 1-5 5h-3m-6 0H6a5 5 0 0 1-5-5 5 5 0 0 1 5-5h3"></path><line x1="8" y1="12" x2="16" y2="12"></line></svg></a>${3}` | safeHTML }}

diff --git a/layouts/index.html b/layouts/index.html
@@ -12,7 +12,7 @@
 	{{- if (or .Site.Params.images .Site.Params.bgImg) }}
 	<div class="bg-img"></div>
 	{{- end }}
-	<div id="spotlight" class="animated fadeIn">
+	<div id="spotlight" {{- if ne false .Site.Params.usesAnimation }} class="animated fadeIn" {{- end -}}>
 		<div id="home-center">
 			<h1 id="home-title">{{ .Site.Title }}</h1>
 			{{- with .Site.Params.homeSubtitle }}

diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
@@ -1,4 +1,4 @@
-<footer id="site-footer" class="section-inner thin animated fadeIn faster">
+<footer id="site-footer" class="section-inner thin {{- if ne false .Site.Params.usesAnimation }} animated fadeIn faster {{- end -}}">
 	<p>
 		&copy; {{ now.Format "2006" }} <a href="{{ .Site.BaseURL }}">{{ .Site.Params.author.name }}</a>
 		&#183; {{ .Site.Params.footerCopyright | safeHTML }}

diff --git a/layouts/partials/header.html b/layouts/partials/header.html
@@ -1,4 +1,4 @@
-	<header id="site-header" class="animated slideInUp">
+	<header id="site-header" {{- if .Site.Params.usesAnimation }} class="animated slideInUp" {{- end -}}>
 		<div class="hdr-wrapper section-inner">
 			<div class="hdr-left">
 				<div class="site-branding">
@@ -21,7 +21,7 @@
 			</div>
 		</div>
 	</header>
-	<div id="mobile-menu" class="animated fast">
+	<div id="mobile-menu" {{- if ne false .Site.Params.usesAnimation }} class="animated fast" {{- end -}}>
 		<ul>
 			{{- range .Site.Menus.main }}
 			<li><a href="{{ .URL | absLangURL }}">{{ .Name }}</a></li>

diff --git a/layouts/partials/social-share.html b/layouts/partials/social-share.html
@@ -1,6 +1,6 @@
 <button id="share-btn" class="hdr-btn" title="{{i18n "share"}}">{{- partial "svg.html" (dict "context" . "name" "share") -}}</button>
 
-<div id="share-links" class="animated fast">
+<div id="share-links" {{- if ne false .Site.Params.usesAnimation }} class="animated fast" {{- end -}}>
     {{ $title := .Title }}
     {{ $url := printf "%s" .Permalink }}
     {{ $author := (.Params.author | default .Site.Params.author.name) }}

diff --git a/layouts/posts/single.html b/layouts/posts/single.html
@@ -16,7 +16,7 @@
 	{{- if (or .Params.images .Params.featuredImg) }}
 	<div class="bg-img"></div>
 	{{- end }}
-	<main class="site-main section-inner animated fadeIn faster">
+	<main class="site-main section-inner {{- if ne false .Site.Params.usesAnimation }} animated fadeIn faster {{- end -}}">
 		{{- if and (not (eq .Site.Params.legacyLayout nil)) (.Site.Params.legacyLayout) -}}
 		<article class="thin">
 			<header class="post-header">