fix(index.html): fix doctype declaration to use lowercase 'doctype' for HTML5 compliance

fix(index.html): fix meta tag indentation for better readability
fix(index.html): fix indentation of head and body tags for better readability
fix(index.html): fix indentation of header, main, and footer sections for better readability
fix(index.html): fix indentation of script tag for better readability
fix(index.html): fix indentation of closing div tag for better readability
fix(index.html): fix indentation of closing body and html tags for better readability
feat(index.html): add partial for navigation bar to improve website navigation
fix(head.html): fix indentation of esBuildOpts variable for better readability
fix(head.html): fix indentation of script tag for better readability
feat(nav.html): add navigation bar partial to improve website navigation
This commit is contained in:
Sped0n
2023-10-29 00:59:26 +08:00
parent d32d5b5e4f
commit a07b7bc1a0
3 changed files with 68 additions and 42 deletions

View File

@@ -1,43 +1,42 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
{{ partial "head.html" . }}
<title>{{ .Title }}</title>
</head>
<body>
<header>
{{ partial "header.html" . }}
</header>
<div id="main">
{{ $sourcePath := "images" }}
{{ $gallery := site.GetPage $sourcePath }}
{{ with $gallery.Resources.ByType "image" }}
{{ $index := len . }}
{{ $.Scratch.Add "img" slice }}
{{ range . }}
{{ $index = sub $index 1}}
{{ $colors := .Colors }}
{{ $pColor := index $colors 0 }}
{{ $sColor := "#ccc" }}
{{ if gt (len $colors) 1 }}
{{ $sColor = index $colors 1 }}
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
{{ partial "head.html" . }}
<title>{{ .Title }}</title>
</head>
<body>
<header>
{{ partial "header.html" . }}
</header>
<div id="main">
{{ $sourcePath := "images" }}
{{ $gallery := site.GetPage $sourcePath }}
{{ with $gallery.Resources.ByType "image" }}
{{ $index := len . }}
{{ $.Scratch.Add "img" slice }}
{{ range . }}
{{ $index = sub $index 1 }}
{{ $colors := .Colors }}
{{ $pColor := index $colors 0 }}
{{ $sColor := "#ccc" }}
{{ if gt (len $colors) 1 }}
{{ $sColor = index $colors 1 }}
{{ end }}
{{ $resize := .Resize "x2000 webp Lanczos q70" }}
{{ $.Scratch.Add "img" (dict
"index" (int $index)
"url" (string .RelPermalink)
"imgH" (int .Height)
"imgW" (int .Width)
"pColor" (string $pColor)
"sColor" (string $sColor))
}}
{{ end }}
<script id="imagesSource" type="application/json">{{ $.Scratch.Get "img" | jsonify | safeJS }}</script>
{{ end }}
{{ $resize := .Resize "x2000 webp Lanczos q70" }}
{{ $.Scratch.Add "img" (dict
"index" (string $index)
"url" (string .RelPermalink)
"imgH" (string .Height)
"imgW" (string .Width)
"pColor" (string $pColor)
"sColor" (string $sColor)) }}
{{ end }}
<script id="images_info" type="application/json">{{ $.Scratch.Get "img" | jsonify | safeJS }}</script>
{{ end }}
</div>
<footer>
{{ partial "footer.html" . }}
</footer>
</body>
</div>
{{ partial "nav.html" . }}
</body>
</html>

View File

@@ -3,7 +3,7 @@
{{- $options := dict "targetPath" "css/style.min.css" "enableSourceMap" true -}}
{{- $style = dict "Context" . "ToCSS" $options | merge $style -}}
{{- partial "plugin/style.html" $style -}}
{{- $esBuildOpts := dict "minify" hugo.IsProduction -}}
{{ $script := resources.Get "ts/main.ts" | js.Build }}
{{- $script := resources.Get "ts/main.ts" | js.Build $esBuildOpts -}}
<script type="text/javascript" src="{{ $script.RelPermalink }}" defer></script>
<script src="https://cdn.jsdelivr.net/npm/gsap@3.12/dist/gsap.min.js"></script>

27
layouts/partials/nav.html Normal file
View File

@@ -0,0 +1,27 @@
<nav>
<div class="navArtist">
<a href="/">Bridget Baker</a>
</div>
<div class="links">
<span class="link">Featured</span>
<span class="link">iPhone</span>
<span class="link">Film</span>
<span class="link">Info</span>
</div>
<div class="threshold">
<span>Threshold:</span>
<span>
<button class="dec"></button>
<span class="num"></span><span class="num"></span><span class="num"></span
><span class="num"></span>
<button class="inc"></button>
</span>
</div>
<div class="index">
<span class="num"></span><span class="num"></span><span class="num"></span
><span class="num"></span>
<span>/</span>
<span class="num"></span><span class="num"></span><span class="num"></span
><span class="num"></span>
</div>
</nav>