From 27db479c55a5cd10042f4854d33412efe57cf682 Mon Sep 17 00:00:00 2001
From: Mauro Morales <contact@mauromorales.com>
Date: Sun, 30 May 2021 22:27:37 +0200
Subject: [PATCH] Add pic archetypes

---
 archetypes/pic/index.md         |  2 ++
 layouts/partials/nav.html       |  5 +++-
 layouts/pics/list.html          | 26 ++++++++++++++++++++
 layouts/pics/single.html        | 31 ++++++++++++++++++++++++
 layouts/shortcodes/gallery.html |  3 +++
 layouts/shortcodes/img.html     |  1 +
 static/css/style.css            | 42 +++++++++++++++++++++++++++++++++
 7 files changed, 109 insertions(+), 1 deletion(-)
 create mode 100644 archetypes/pic/index.md
 create mode 100644 layouts/pics/list.html
 create mode 100644 layouts/pics/single.html
 create mode 100644 layouts/shortcodes/gallery.html
 create mode 100644 layouts/shortcodes/img.html

diff --git a/archetypes/pic/index.md b/archetypes/pic/index.md
new file mode 100644
index 0000000..a845151
--- /dev/null
+++ b/archetypes/pic/index.md
@@ -0,0 +1,2 @@
+---
+---
diff --git a/layouts/partials/nav.html b/layouts/partials/nav.html
index d441dfd..6ac5227 100644
--- a/layouts/partials/nav.html
+++ b/layouts/partials/nav.html
@@ -3,7 +3,10 @@
   <ul class="nav navbar-nav">
     {{ range .Site.Menus.main }}
     <li>
-      <a class="{{- if eq $currentPage.RelPermalink .URL -}}open{{- end -}}"
+      {{ $active := or ($currentPage.IsMenuCurrent "main" .) ($currentPage.HasMenuCurrent "main" .) }}
+      {{ $active = or $active (eq .Name $currentPage.Title) }}
+      {{ $active = or $active (eq .Name $currentPage.Section) }}
+      <a class="{{- if $active -}}open{{- end -}}"
          href="{{ .URL }}">
         <span>{{ .Name }}</span>
       </a>
diff --git a/layouts/pics/list.html b/layouts/pics/list.html
new file mode 100644
index 0000000..066631b
--- /dev/null
+++ b/layouts/pics/list.html
@@ -0,0 +1,26 @@
+{{ define "main" }}
+<div>
+  {{- partial "language.html" . -}}
+  {{ with .Title }}<h1>{{ . | humanize }}</h1>{{ end }}
+  <hr>
+  {{ with .Content }}<div>{{ . }}</div>{{ end }}
+</div>
+
+{{ $totalPages := len .Pages }}
+{{ if eq $totalPages 0 }}
+{{ i18n "noRecordsFound" }}
+{{ end }}
+{{ range $index, $page := .Pages }}
+  {{ if eq (mod $index 3) 0 }}
+  <div class="gallery--3">
+  {{ end }}
+    <a href="{{ .RelPermalink }}">
+      {{ with index (.Resources) 0 }}
+        <img src="{{ .RelPermalink }}">
+      {{ end }}
+    </a>
+  {{ if or (and (eq (mod $index 4) 0) (ne $index 0)) (eq (sub $totalPages 1) $index) }}
+  </div>
+  {{ end }}
+{{ end }}
+{{ end }}
diff --git a/layouts/pics/single.html b/layouts/pics/single.html
new file mode 100644
index 0000000..fedef62
--- /dev/null
+++ b/layouts/pics/single.html
@@ -0,0 +1,31 @@
+{{ define "main" }}
+<article>
+  {{- partial "language.html" . -}}
+  <h1>{{ .Title }}</h1>
+  <h6>
+    {{ .Params.Subtitle }}
+  </h6>
+  {{- partial "meta.html" . -}}
+  <hr>
+  
+  <div>
+    {{ with index (.Resources) 0 }}
+      <img src="{{ .RelPermalink }}"></br>
+    {{ end }}
+    {{ .Description }}
+    {{ .Content }}
+  </div>
+  <hr>
+  {{- partial "hashtags.html" . -}}
+</article>
+
+{{ $related := .Site.RegularPages.Related . | first 5 }}
+{{ with $related }}
+<h3>{{ i18n "related" }}</h3>
+<ul class="small">
+  {{- range . }}
+  <li><a href="{{ .RelPermalink }}">{{ .Title }}</a></li>
+  {{ end }}
+</ul>
+{{ end }}
+{{ end }}
diff --git a/layouts/shortcodes/gallery.html b/layouts/shortcodes/gallery.html
new file mode 100644
index 0000000..b4c577d
--- /dev/null
+++ b/layouts/shortcodes/gallery.html
@@ -0,0 +1,3 @@
+<div class="gallery--3">
+  {{- .Inner -}}
+</div>
diff --git a/layouts/shortcodes/img.html b/layouts/shortcodes/img.html
new file mode 100644
index 0000000..ef38365
--- /dev/null
+++ b/layouts/shortcodes/img.html
@@ -0,0 +1 @@
+<img src="/img/{{ .Page.Slug }}{{.Get "src" }}" alt="">
diff --git a/static/css/style.css b/static/css/style.css
index 7807c39..239acea 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -18,6 +18,10 @@ body {
   line-height: 1.4em;
 }
 
+p {
+  text-align: justify;
+}
+
 li {
   padding-bottom: 0.2em;
 }
@@ -275,6 +279,36 @@ img {
   font-family: Apple Color Emoji, Segoe UI Emoji, NotoColorEmoji, Segoe UI Symbol, Android Emoji, EmojiSymbols;
 }
 
+.gallery--3 img {
+  width: 32%;
+}
+
+.gallery--2 img {
+  width: 49%;
+  padding-right: 0.2em;
+}
+
+.xps {
+  display: flex;
+  flex-direction: column;
+}
+
+.xp {
+  margin-top: 1em;
+  width: 100%;
+}
+
+.xp-title {
+  background-color: lightgray;
+  font-weight: bold;
+}
+
+.xp-org {
+}
+
+.xp-location {
+}
+
 @media only screen and (max-width:632px) {
     #content {
         flex-direction: column-reverse;
@@ -296,6 +330,10 @@ img {
       list-style: none;
     }
 
+    ul {
+      padding-left: 1em;
+    }
+
     #footer {
       position: inherit;
     }
@@ -315,4 +353,8 @@ img {
     .mermaid-container {
       overflow-x: auto;
     }
+
+  .gallery--2 img {
+    width: 48%;
+  }
 }
-- 
2.45.2