slice things up in partials for modularity
This commit is contained in:
sakrecoer
parent
c9a800d5fa
commit
b702ce6cda
6 changed files with 135 additions and 127 deletions
|
|
@ -23,140 +23,17 @@
|
||||||
{{ partial "header.html" . }}
|
{{ partial "header.html" . }}
|
||||||
|
|
||||||
<main>
|
<main>
|
||||||
<!-- BLOG SECTION - Longform -->
|
|
||||||
<section id="blog" class="section">
|
|
||||||
<h2>Now Log</h2>
|
|
||||||
<div class="blog-grid">
|
|
||||||
{{ $blogPosts := slice }}
|
|
||||||
{{ range $path, $entries := hugo.Data.longform }}
|
|
||||||
{{ range $entries }}
|
|
||||||
{{ $blogPosts = $blogPosts | append . }}
|
|
||||||
{{ end }}
|
|
||||||
{{ end }}
|
|
||||||
|
|
||||||
{{ $sortedPosts := sort $blogPosts "created_at" "desc" }}
|
|
||||||
{{ range first 2 $sortedPosts }}
|
|
||||||
{{ $title := "" }}
|
|
||||||
{{ $summary := "" }}
|
|
||||||
{{ $image := "" }}
|
|
||||||
{{ $tags := slice }}
|
|
||||||
{{ $d := "" }}
|
|
||||||
{{ $createdAt := int .created_at }}
|
|
||||||
|
|
||||||
{{ range .tags }}
|
|
||||||
{{ if eq (index . 0) "title" }}
|
|
||||||
{{ $title = index . 1 }}
|
|
||||||
{{ else if eq (index . 0) "summary" }}
|
|
||||||
{{ $summary = index . 1 }}
|
|
||||||
{{ else if eq (index . 0) "image" }}
|
|
||||||
{{ $image = index . 1 }}
|
|
||||||
{{ else if eq (index . 0) "t" }}
|
|
||||||
{{ $tags = $tags | append (index . 1) }}
|
|
||||||
{{ else if eq (index . 0) "d" }}
|
|
||||||
{{ $d = index . 1 }}
|
|
||||||
{{ end }}
|
|
||||||
{{ end }}
|
|
||||||
|
|
||||||
<div class="blog-card">
|
|
||||||
{{ if $image }}
|
|
||||||
<img src="{{ $image }}" alt="{{ $title }}" class="blog-header-image" loading="lazy">
|
|
||||||
{{ end }}
|
|
||||||
<div class="blog-content">
|
|
||||||
<h3>{{ $title }}</h3>
|
|
||||||
<p class="blog-meta">
|
|
||||||
{{ dateFormat "January 2, 2006" (time (int .created_at)) }}
|
|
||||||
</p>
|
|
||||||
{{ if $summary }}
|
|
||||||
<p class="blog-description">{{ $summary }}</p>
|
|
||||||
{{ end }}
|
|
||||||
<div class="blog-tags">
|
|
||||||
{{ range $tags }}
|
|
||||||
<span class="tag"><span>{{ . }}</span></span>
|
|
||||||
{{ end }}
|
|
||||||
</div>
|
|
||||||
<button class="read-more-toggle">Read More</button>
|
|
||||||
<div class="blog-full-content" style="display: none;">
|
|
||||||
{{ .content | markdownify }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{{ end }}
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- MUSIC SECTION -->
|
{{ partial "blog.html" . }}
|
||||||
<section id="music" class="section">
|
|
||||||
<h2>Music Traxxx</h2>
|
|
||||||
<div style="text-align: right; margin-bottom: 1rem;">
|
|
||||||
<button onclick="refreshMusic()" class="refresh-button">
|
|
||||||
<span>🎲 Randomize</span>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div class="music-grid" id="musicGrid">
|
|
||||||
{{ $allMusic := slice }}
|
|
||||||
{{ range $path, $entries := hugo.Data.music }}
|
|
||||||
{{ range $entries }}
|
|
||||||
{{ $allMusic = $allMusic | append . }}
|
|
||||||
{{ end }}
|
|
||||||
{{ end }}
|
|
||||||
|
|
||||||
{{ $musicData := jsonify $allMusic }}
|
{{ partial "music.html" . }}
|
||||||
<script>
|
|
||||||
window.allMusicData = {{ $musicData | safeJS }};
|
|
||||||
</script>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- PICTURES SECTION -->
|
{{ partial "pictures.html" . }}
|
||||||
<section id="pictures" class="section">
|
|
||||||
<h2>Pix & Doodles</h2>
|
|
||||||
<div style="text-align: right; margin-bottom: 1rem;">
|
|
||||||
<button onclick="refreshPictures()" class="refresh-button">
|
|
||||||
<span>🎲 Randomize</span>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div class="photo-grid" id="photoGrid">
|
|
||||||
{{ $allPictures := slice }}
|
|
||||||
{{ range $path, $entries := hugo.Data.pictures }}
|
|
||||||
{{ range $entries }}
|
|
||||||
{{ $allPictures = $allPictures | append . }}
|
|
||||||
{{ end }}
|
|
||||||
{{ end }}
|
|
||||||
|
|
||||||
<!-- Store all pictures data in a JSON array -->
|
{{ partial "videos.html" . }}
|
||||||
{{ $picturesData := jsonify $allPictures }}
|
|
||||||
<script>
|
|
||||||
window.allPicturesData = {{ $picturesData | safeJS }};
|
|
||||||
</script>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- VIDEO SECTION -->
|
|
||||||
<section id="videos" class="section">
|
|
||||||
<h2>Vidz</h2>
|
|
||||||
<div style="text-align: right; margin-bottom: 1rem;">
|
|
||||||
<button onclick="refreshVideos()" class="refresh-button">
|
|
||||||
<span>🎲 Randomize</span>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
<div class="video-grid" id="videoGrid">
|
|
||||||
{{ $allVideos := slice }}
|
|
||||||
{{ range $path, $entries := hugo.Data.videos }}
|
|
||||||
{{ range $entries }}
|
|
||||||
{{ $allVideos = $allVideos | append . }}
|
|
||||||
{{ end }}
|
|
||||||
{{ end }}
|
|
||||||
|
|
||||||
<!-- Store all videos data in a JSON array -->
|
|
||||||
{{ $videosData := jsonify $allVideos }}
|
|
||||||
<script>
|
|
||||||
window.allVideosData = {{ $videosData | safeJS }};
|
|
||||||
</script>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</main>
|
</main>
|
||||||
|
|
||||||
<!-- Footer -->
|
|
||||||
{{ partial "footer.html" . }}
|
{{ partial "footer.html" . }}
|
||||||
|
|
||||||
<!-- Custom Lightbox -->
|
<!-- Custom Lightbox -->
|
||||||
|
|
|
||||||
60
themes/one-pager/layouts/partials/blog.html
Normal file
60
themes/one-pager/layouts/partials/blog.html
Normal file
|
|
@ -0,0 +1,60 @@
|
||||||
|
<!-- BLOG SECTION - Longform -->
|
||||||
|
<section id="blog" class="section">
|
||||||
|
<h2>Now Log</h2>
|
||||||
|
<div class="blog-grid">
|
||||||
|
{{ $blogPosts := slice }}
|
||||||
|
{{ range $path, $entries := hugo.Data.longform }}
|
||||||
|
{{ range $entries }}
|
||||||
|
{{ $blogPosts = $blogPosts | append . }}
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
{{ $sortedPosts := sort $blogPosts "created_at" "desc" }}
|
||||||
|
{{ range first 2 $sortedPosts }}
|
||||||
|
{{ $title := "" }}
|
||||||
|
{{ $summary := "" }}
|
||||||
|
{{ $image := "" }}
|
||||||
|
{{ $tags := slice }}
|
||||||
|
{{ $d := "" }}
|
||||||
|
{{ $createdAt := int .created_at }}
|
||||||
|
|
||||||
|
{{ range .tags }}
|
||||||
|
{{ if eq (index . 0) "title" }}
|
||||||
|
{{ $title = index . 1 }}
|
||||||
|
{{ else if eq (index . 0) "summary" }}
|
||||||
|
{{ $summary = index . 1 }}
|
||||||
|
{{ else if eq (index . 0) "image" }}
|
||||||
|
{{ $image = index . 1 }}
|
||||||
|
{{ else if eq (index . 0) "t" }}
|
||||||
|
{{ $tags = $tags | append (index . 1) }}
|
||||||
|
{{ else if eq (index . 0) "d" }}
|
||||||
|
{{ $d = index . 1 }}
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
<div class="blog-card">
|
||||||
|
{{ if $image }}
|
||||||
|
<img src="{{ $image }}" alt="{{ $title }}" class="blog-header-image" loading="lazy">
|
||||||
|
{{ end }}
|
||||||
|
<div class="blog-content">
|
||||||
|
<h3>{{ $title }}</h3>
|
||||||
|
<p class="blog-meta">
|
||||||
|
{{ dateFormat "January 2, 2006" (time (int .created_at)) }}
|
||||||
|
</p>
|
||||||
|
{{ if $summary }}
|
||||||
|
<p class="blog-description">{{ $summary }}</p>
|
||||||
|
{{ end }}
|
||||||
|
<div class="blog-tags">
|
||||||
|
{{ range $tags }}
|
||||||
|
<span class="tag"><span>{{ . }}</span></span>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
<button class="read-more-toggle">Read More</button>
|
||||||
|
<div class="blog-full-content" style="display: none;">
|
||||||
|
{{ .content | markdownify }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
@ -1,3 +1,5 @@
|
||||||
|
<!-- Footer -->
|
||||||
|
|
||||||
<footer class="site-footer">
|
<footer class="site-footer">
|
||||||
<!-- Glow effect -->
|
<!-- Glow effect -->
|
||||||
<div class="footer-glow"></div>
|
<div class="footer-glow"></div>
|
||||||
|
|
|
||||||
22
themes/one-pager/layouts/partials/music.html
Normal file
22
themes/one-pager/layouts/partials/music.html
Normal file
|
|
@ -0,0 +1,22 @@
|
||||||
|
<!-- MUSIC SECTION -->
|
||||||
|
<section id="music" class="section">
|
||||||
|
<h2>Music Traxxx</h2>
|
||||||
|
<div style="text-align: right; margin-bottom: 1rem;">
|
||||||
|
<button onclick="refreshMusic()" class="refresh-button">
|
||||||
|
<span>🎲 Randomize</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="music-grid" id="musicGrid">
|
||||||
|
{{ $allMusic := slice }}
|
||||||
|
{{ range $path, $entries := hugo.Data.music }}
|
||||||
|
{{ range $entries }}
|
||||||
|
{{ $allMusic = $allMusic | append . }}
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
{{ $musicData := jsonify $allMusic }}
|
||||||
|
<script>
|
||||||
|
window.allMusicData = {{ $musicData | safeJS }};
|
||||||
|
</script>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
23
themes/one-pager/layouts/partials/pictures.html
Normal file
23
themes/one-pager/layouts/partials/pictures.html
Normal file
|
|
@ -0,0 +1,23 @@
|
||||||
|
<!-- PICTURES SECTION -->
|
||||||
|
<section id="pictures" class="section">
|
||||||
|
<h2>Pix & Doodles</h2>
|
||||||
|
<div style="text-align: right; margin-bottom: 1rem;">
|
||||||
|
<button onclick="refreshPictures()" class="refresh-button">
|
||||||
|
<span>🎲 Randomize</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="photo-grid" id="photoGrid">
|
||||||
|
{{ $allPictures := slice }}
|
||||||
|
{{ range $path, $entries := hugo.Data.pictures }}
|
||||||
|
{{ range $entries }}
|
||||||
|
{{ $allPictures = $allPictures | append . }}
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
<!-- Store all pictures data in a JSON array -->
|
||||||
|
{{ $picturesData := jsonify $allPictures }}
|
||||||
|
<script>
|
||||||
|
window.allPicturesData = {{ $picturesData | safeJS }};
|
||||||
|
</script>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
24
themes/one-pager/layouts/partials/videos.html
Normal file
24
themes/one-pager/layouts/partials/videos.html
Normal file
|
|
@ -0,0 +1,24 @@
|
||||||
|
<!-- VIDEO SECTION -->
|
||||||
|
<section id="videos" class="section">
|
||||||
|
<h2>Vidz</h2>
|
||||||
|
<div style="text-align: right; margin-bottom: 1rem;">
|
||||||
|
<button onclick="refreshVideos()" class="refresh-button">
|
||||||
|
<span>🎲 Randomize</span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div class="video-grid" id="videoGrid">
|
||||||
|
{{ $allVideos := slice }}
|
||||||
|
{{ range $path, $entries := hugo.Data.videos }}
|
||||||
|
{{ range $entries }}
|
||||||
|
{{ $allVideos = $allVideos | append . }}
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
|
||||||
|
<!-- Store all videos data in a JSON array -->
|
||||||
|
{{ $videosData := jsonify $allVideos }}
|
||||||
|
<script>
|
||||||
|
window.allVideosData = {{ $videosData | safeJS }};
|
||||||
|
</script>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
Loading…
Add table
Add a link
Reference in a new issue