Improve GNU image links layout

5 files changed, 32 insertions, 4 deletions

diff --git a/content/links/_index.md b/content/links/_index.md
index 5397bbb..5405ec4 100644
--- a/content/links/_index.md
+++ b/content/links/_index.md
@@ -10,12 +10,13 @@ license: CC-BY-SA-4.0
 
 [Free Software Foundation](https://www.fsf.org/) promotes computer user freedom and supports the worldwide free software movement.
 
-[![GNU](gnu-head-sm.png)](https://www.gnu.org/ "The GNU Project")
+<div class="gnu-links">
+  <a href="https://www.gnu.org/" title="The GNU Project"><img src="gnu-head-sm.png" alt="GNU" width="129" height="122"></a>
+  <a href="https://www.gnu.org/philosophy/" title="GNU philosophy"><img src="philosophical-gnu-sm.png" alt="Philosophical GNU" width="160" height="200"></a>
+</div>
 
 [GNU Project](https://www.gnu.org/) develops the GNU operating system and publishes resources about free software.
 
-GNU head © 1992 Etienne Suvasa, [CC BY-SA 2.0](https://creativecommons.org/licenses/by-sa/2.0/). [Image source](https://www.gnu.org/graphics/agnuhead.html).
-
 [Richard Stallman's personal site](https://stallman.org/) collects his writing, talks, and current notes.
 
 ## Friends
diff --git a/content/links/philosophical-gnu-sm.png b/content/links/philosophical-gnu-sm.png
new file mode 100644
index 0000000..ee4047e
--- /dev/null
+++ b/content/links/philosophical-gnu-sm.png
diff --git a/hugo.toml b/hugo.toml
index e6a87b8..47a28b0 100644
--- a/hugo.toml
+++ b/hugo.toml
@@ -44,6 +44,8 @@ enableRobotsTXT = false
         [markup.goldmark.extensions.passthrough.delimiters]
           block = [['$$', '$$']]
           inline = [['$', '$']]
+    [markup.goldmark.renderer]
+      unsafe = true
   [markup.highlight]
     codeFences = false
     guessSyntax = false
diff --git a/layouts/links/list.html b/layouts/links/list.html
index 752538b..70166a3 100644
--- a/layouts/links/list.html
+++ b/layouts/links/list.html
@@ -1,5 +1,5 @@
 {{ define "main" }}
-  <article lang="{{ default "en" .Params.lang }}">
+  <article class="links-page" lang="{{ default "en" .Params.lang }}">
     <header class="document-header">
       <h1>{{ .Title }}</h1>
       {{ partial "document-view.html" . }}
diff --git a/static/style.css b/static/style.css
index 30bc5d8..74b2927 100644
--- a/static/style.css
+++ b/static/style.css
@@ -473,6 +473,31 @@ img {
   margin-block: 1.5rem 0.5rem;
 }
 
+.gnu-links {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: flex-start;
+  gap: 1.5rem;
+  margin-block: 1.5rem;
+}
+
+.gnu-links a {
+  display: block;
+}
+
+.gnu-links img {
+  width: auto;
+  max-width: 100%;
+  max-height: 200px;
+  margin: 0;
+}
+
+@media (max-width: 520px) {
+  .gnu-links {
+    gap: 1rem;
+  }
+}
+
 /* Footer */
 .site-footer {
   padding-block: 1.5rem 2.5rem;