photo-gallery-styles

Design documents for photos.pablopie.xyz 📸️

git clone: git://git.pablopie.xyz/photo-gallery-styles
Log
Files
Refs
README
LICENSE

Commit: 483a62948f2135bc6d1350e5ac18287ffd9c41e8
Parent: 13fe1c959e7a4b1192d2608644252417f150ed21
Author: Pablo <pablo-escobar@riseup.net>
Date: Sun, 26 Nov 2023 20:56:36 +0000

Made the images in the main image gallery clickable links

Diffstat

2 files changed, 30 insertions, 3 deletions

Status	File Name	N° Changes	Insertions	Deletions
Modified	index.haml	7	4	3
Modified	index.html	26	26	0

diff --git a/index.haml b/index.haml
@@ -21,9 +21,10 @@
       %ul#gallery
         - for img in Dir["photos/*.*"].sort
           %li
-            -# TODO: Render WEBP preview images instead
-            -# TODO: Add alt text
-            %img{ :src => "./" + img }
+            %a{ :href => "./pictures/" + img + ".html" }
+              -# TODO: Render WEBP preview images instead
+              -# TODO: Add alt text
+              %img{ :src => "./" + img }
     %footer
       made with 💛 by
       %a(role="author" href="https://pablopie.xyz") @pablo

diff --git a/index.html b/index.html
@@ -29,43 +29,69 @@
 </nav>
 <ul id='gallery'>
 <li>
+<a href='./pictures/photos/1.png.html'>
 <img src='./photos/1.png'>
+</a>
 </li>
 <li>
+<a href='./pictures/photos/10.jpg.html'>
 <img src='./photos/10.jpg'>
+</a>
 </li>
 <li>
+<a href='./pictures/photos/11.jpg.html'>
 <img src='./photos/11.jpg'>
+</a>
 </li>
 <li>
+<a href='./pictures/photos/12.jpg.html'>
 <img src='./photos/12.jpg'>
+</a>
 </li>
 <li>
+<a href='./pictures/photos/13.jpg.html'>
 <img src='./photos/13.jpg'>
+</a>
 </li>
 <li>
+<a href='./pictures/photos/2.jpg.html'>
 <img src='./photos/2.jpg'>
+</a>
 </li>
 <li>
+<a href='./pictures/photos/3.jpg.html'>
 <img src='./photos/3.jpg'>
+</a>
 </li>
 <li>
+<a href='./pictures/photos/4.jpg.html'>
 <img src='./photos/4.jpg'>
+</a>
 </li>
 <li>
+<a href='./pictures/photos/5.jpg.html'>
 <img src='./photos/5.jpg'>
+</a>
 </li>
 <li>
+<a href='./pictures/photos/6.jpg.html'>
 <img src='./photos/6.jpg'>
+</a>
 </li>
 <li>
+<a href='./pictures/photos/7.jpg.html'>
 <img src='./photos/7.jpg'>
+</a>
 </li>
 <li>
+<a href='./pictures/photos/8.jpg.html'>
 <img src='./photos/8.jpg'>
+</a>
 </li>
 <li>
+<a href='./pictures/photos/9.png.html'>
 <img src='./photos/9.png'>
+</a>
 </li>
 </ul>
 </main>