Fix accessibility

3 files changed, 16 insertions, 11 deletions

diff --git a/content.org b/content.org
index 4c2ba15..23b9dc4 100644
--- a/content.org
+++ b/content.org
@@ -10,7 +10,8 @@
 :EXPORT_FILE_NAME: _index
 :END:
 
-#+html: <img src="/images/portrait.jpg" alt="Profile picture" class="profile-picture" />
+#+attr_html: :alt Profile picture :width 200 :height 200 :class profile-picture
+[[./static/images/portrait.jpg]]
 
 Hi! I'm currently a PhD student in the Circuits and Systems group at Imperial College London,
 supervised by [[https://johnwickerson.github.io][John Wickerson]].
@@ -732,7 +733,7 @@ We then have the following Nix derivation which should download =Vellvm= and bui
     src = ./.;
 
     buildInputs = [ git coq ocamlPackages.menhir dune coqPackages.flocq
-                    coqPackages.coq-ext-lib coqPackages.paco 
+                    coqPackages.coq-ext-lib coqPackages.paco
                     coqPackages.ceres ocaml ];
 
     buildPhase = ''
diff --git a/themes/ymherklotz/layouts/partials/footer.html b/themes/ymherklotz/layouts/partials/footer.html
index 8fef1a9..25120d0 100644
--- a/themes/ymherklotz/layouts/partials/footer.html
+++ b/themes/ymherklotz/layouts/partials/footer.html
@@ -1,14 +1,15 @@
 <footer>
   <p class="social">
-    <a href="/docs/ymherklotz.asc.txt" aria-label="View public GPG key"><img class="icon" alt="Key Icon" src="{{ .Site.BaseURL }}/assets/fontawesome/key-solid.svg" /></a>
-    <a href="https://github.com/ymherklotz" aria-label="View Github profile"><img class="icon" alt="Github Icon" src="{{ .Site.BaseURL }}/assets/fontawesome/github-brands.svg" /></a>
-    <a href="https://sr.ht/~ymherklotz" aria-label="View Sourcehut profile"><img class="icon" alt="Sourcehut Icon" src="{{ .Site.BaseURL }}/assets/fontawesome/circle-regular.svg" /></a>
-    <a href="https://twitter.com/@ymherklotz" aria-label="View Twitter profile"><img class="icon" alt="Twitter Icon" src="{{ .Site.BaseURL
+    <a href="/docs/ymherklotz.asc.txt" aria-label="View public GPG
+    key"><img class="icon" alt="Key Icon" width="16" height="16" src="{{ .Site.BaseURL }}/assets/fontawesome/key-solid.svg" /></a>
+    <a href="https://github.com/ymherklotz" aria-label="View Github profile"><img class="icon" alt="Github Icon" width="16" height="16" src="{{ .Site.BaseURL }}/assets/fontawesome/github-brands.svg" /></a>
+    <a href="https://sr.ht/~ymherklotz" aria-label="View Sourcehut profile"><img class="icon" alt="Sourcehut Icon" width="16" height="16" src="{{ .Site.BaseURL }}/assets/fontawesome/circle-regular.svg" /></a>
+    <a href="https://twitter.com/@ymherklotz" aria-label="View Twitter profile"><img class="icon" alt="Twitter Icon" width="16" height="16" src="{{ .Site.BaseURL
     }}/assets/fontawesome/twitter-brands.svg" /></a>
     <a rel="me" href="https://types.pl/@ymherklotz" aria-label="View Mastodon profile"><img class="icon"
-    alt="Mastodon Icon" src="{{ .Site.BaseURL }}/assets/fontawesome/mastodon-brands.svg" /></a>
-    <a href="mailto:yann@yannherklotz.com" aria-label="Send me an email"><img class="icon" alt="Mail Icon" src="{{ .Site.BaseURL }}/assets/fontawesome/envelope-solid.svg" /></a>
-    <a href="/index.xml" aria-label="Subscribe to RSS feed"><img class="icon" alt="RSS Icon" src="{{ .Site.BaseURL }}/assets/fontawesome/rss-solid.svg" /></a>
+    alt="Mastodon Icon" width="16" height="16" src="{{ .Site.BaseURL }}/assets/fontawesome/mastodon-brands.svg" /></a>
+    <a href="mailto:yann@yannherklotz.com" aria-label="Send me an email"><img class="icon" alt="Mail Icon" width="16" height="16" src="{{ .Site.BaseURL }}/assets/fontawesome/envelope-solid.svg" /></a>
+    <a href="/index.xml" aria-label="Subscribe to RSS feed"><img class="icon" alt="RSS Icon" width="16" height="16" src="{{ .Site.BaseURL }}/assets/fontawesome/rss-solid.svg" /></a>
   </p>
   <div class="generated-by">
     <p>&#169; 2016-2023 Yann Herklotz</p>
diff --git a/themes/ymherklotz/static/css/default.css b/themes/ymherklotz/static/css/default.css
index 8e98ae4..affffbb 100644
--- a/themes/ymherklotz/static/css/default.css
+++ b/themes/ymherklotz/static/css/default.css
@@ -435,10 +435,13 @@ dl {
 }
 
 .profile-picture {
-  border-radius: 50%;
+  margin: 0px 30px 30px 0px;
   float: left;
   max-width: 200px;
-  margin: 0px 30px 30px 0px;
+}
+
+.profile-picture > img {
+  border-radius: 50%;
 }
 
 .personal-info {