From eac6234a73885c65b2445c4c17b5412b79628b51 Mon Sep 17 00:00:00 2001
From: Fred Boniface <fred@fjla.uk>
Date: Thu, 13 Oct 2022 21:48:53 +0100
Subject: [PATCH] Add a tags to images

---
 contact.php    | 44 +++++++++++++++++++++++---------------------
 css/styles.css |  5 ++++-
 2 files changed, 27 insertions(+), 22 deletions(-)

diff --git a/contact.php b/contact.php
index 1a11652..65dd1d1 100644
--- a/contact.php
+++ b/contact.php
@@ -14,27 +14,29 @@
       <div class="page-main-content">
         <a href="/downloads/vcard.vcf" class="download-link">Add me to your contacts</a>
         <h2>Find me elsewhere</h2>
-        <a href="https://fb.me/fred.boniface" target="_blank" rel="noreferrer noopener">Facebook</a>
-        <a href="https://github.com/frdbonif" target="_blank" rel="noreferrer noopener">GitHub</a>
-        <a href="https://500px.com/p/fredboniface" target="_blank" rel="noreferrer noopener">500px</a>
-
-        <div class="social-links">
-          <picture>
-            <source media="(max-width: 400px)" srcset="/images/social-icons/fb_blue_58.png" type="image/png">
-            <source media="(max-width: 600px)" srcset="/images/social-icons/fb_blue_144.png" type="image/png">
-            <img src="/images/social-icons/fb_blue_250.png" alt="Facebook Logo">
-          </picture>
-          <picture>
-            <source media="(max-width: 400px)" srcset="/images/social-icons/gh_white_64.png" type="image/png">
-            <img src="/images/social-icons/gh_white_120.png" alt="GitHub Logo">
-          </picture>
-          <picture>
-            <source media="(max-width: 600px)" srcset="/images/social-icons/500px_114.jxl" type="image/jxl">
-            <source media="(max-width: 600px)" srcset="/images/social-icons/500px_114.png" type="image/png">
-            <source srcset="/images/social-icons/500px_250.jxl" type="image/jxl">
-            <img src="/images/social-icons/500px_250.png" alt="500px Logo">
-          </picture>
-        </div>
+          <div class="social-links">
+            <a href="https://fb.me/fred.boniface" target="_blank" rel="noreferrer noopener">
+              <picture>
+                <source media="(max-width: 400px)" srcset="/images/social-icons/fb_blue_58.png" type="image/png">
+                <source media="(max-width: 600px)" srcset="/images/social-icons/fb_blue_144.png" type="image/png">
+                <img src="/images/social-icons/fb_blue_250.png" alt="Facebook Logo">
+              </picture>
+            </a>
+            <a href="https://github.com/frdbonif" target="_blank" rel="noreferrer noopener">
+              <picture>
+                <source media="(max-width: 400px)" srcset="/images/social-icons/gh_white_64.png" type="image/png">
+                <img src="/images/social-icons/gh_white_120.png" alt="GitHub Logo">
+              </picture>
+            </a>
+            <a href="https://500px.com/p/fredboniface" target="_blank" rel="noreferrer noopener">
+              <picture>
+                <source media="(max-width: 600px)" srcset="/images/social-icons/500px_114.jxl" type="image/jxl">
+                <source media="(max-width: 600px)" srcset="/images/social-icons/500px_114.png" type="image/png">
+                <source srcset="/images/social-icons/500px_250.jxl" type="image/jxl">
+                <img src="/images/social-icons/500px_250.png" alt="500px Logo">
+              </picture>
+            </a>
+          </div>
 
       </div>
 
diff --git a/css/styles.css b/css/styles.css
index d3417e3..96eae9f 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -40,7 +40,7 @@ body {
 }
 
 .social-links img {
-  max-width: 100px;
+  max-width: 50px;
 }
 
 .download-link {
@@ -150,4 +150,7 @@ footer {
   /*Provice space for top menu*/
   .page-title {padding-top: 100px}
 
+  /*Increase social link image size*/
+  .social-links img {max-width: 75px;}
+
 }
\ No newline at end of file