photo-gallery-styles

Design documents for photos.pablopie.xyz 📸️

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

Commit: 960711b6af780f596a76433054ddf5922d36ea86
Parent: 3738aef5180280b416a7b3bad3561640eaafd016
Author: Pablo <pablo-escobar@riseup.net>
Date: Mon, 27 Nov 2023 13:00:43 +0000

Made the pages more accessible

Moved the main navigation bar to inside a header element

Diffstat

5 files changed, 12 insertions, 3 deletions

Status	File Name	N° Changes	Insertions	Deletions
Modified	1.png.html	2	2	0
Modified	2.jpg.html	2	2	0
Modified	404.html	2	2	0
Modified	index.haml	7	4	3
Modified	index.html	2	2	0

diff --git a/1.png.html b/1.png.html
@@ -12,10 +12,12 @@
 </head>
 <body>
 <main>
+<header>
 <nav>
 <img aria-hidden='true' height='24' src='./icons/icon.svg' width='24'>
 <a href='./index.html'>photos.pablopie.xyz</a>
 </nav>
+</header>
 <figure>
 <div id='picture-container'>
 <img src='./photos/1.png'>

diff --git a/2.jpg.html b/2.jpg.html
@@ -12,10 +12,12 @@
 </head>
 <body>
 <main>
+<header>
 <nav>
 <img aria-hidden='true' height='24' src='./icons/icon.svg' width='24'>
 <a href='./index.html'>photos.pablopie.xyz</a>
 </nav>
+</header>
 <figure>
 <div id='picture-container'>
 <img src='./photos/2.jpg'>

diff --git a/404.html b/404.html
@@ -12,10 +12,12 @@
 </head>
 <body>
 <main>
+<header>
 <nav>
 <img aria-hidden='true' height='24' src='./icons/icon.svg' width='24'>
 <a href='./index.html'>photos.pablopie.xyz</a>
 </nav>
+</header>
 <figure>
 <div id='picture-container'>
 <img src='https://picsum.photos/500/500' alt='A random picture from the internet'>

diff --git a/index.haml b/index.haml
@@ -17,9 +17,10 @@
 
   %body
     %main
-      %nav
-        %img(width="24" height="24" aria-hidden="true" src="./icons/icon.svg")
-        %a(href="./index.html") photos.pablopie.xyz
+      %header
+        %nav
+          %img(width="24" height="24" aria-hidden="true" src="./icons/icon.svg")
+          %a(href="./index.html") photos.pablopie.xyz
 
       %ul#gallery
         - for img in Dir["photos/*.*"].sort

diff --git a/index.html b/index.html
@@ -24,10 +24,12 @@
 </head>
 <body>
 <main>
+<header>
 <nav>
 <img aria-hidden='true' height='24' src='./icons/icon.svg' width='24'>
 <a href='./index.html'>photos.pablopie.xyz</a>
 </nav>
+</header>
 <ul id='gallery'>
 <li>
 <a aria-label='1.png' href='./1.png.html'>