SFD 81: Add links to GitHub (#39)

* Add link to GitHub

* Add GitHub icon

* Move GitHub icon to end of header

* Add github link to footer

* Make header logo smaller

* Refactor to remove 'important' margins

* Move header link in slightly

* Fix github icon closing symbol tag

_includes/footer.html

@@ -1,11 +1,16 @@
-<div class="flex flex-col sm:flex-row justify-between items-baseline gap-4">
-  <div class="flex flex-col sm:w-1/2">
-    <span>Contact us at:</span>
-    <span>
-      <a class="text-inherit hover:text-blue-300" href="mailto:[email protected]?subject=Tech%20Carbon%20Standard%20Enquiry" target="_blank" rel="noopener">[email protected]</a>
-    </span>
+<div class="flex flex-col sm:flex-row justify-between items-baseline sm:items-center gap-4">
+  <div class="flex flex-row">
+    <a aria-label="GitHub" class="my-auto mr-4" href="https://github.com/ScottLogic/Technology-Carbon-Standard">
+      <svg aria-hidden="true" class="size-10"><use href="/assets/images/icons.svg#github"></use></svg>
+    </a>
+    <div class="flex flex-col sm:w-1/2">
+      <span>Contact us at:</span>
+      <span>
+        <a class="text-inherit hover:text-blue-300" href="mailto:[email protected]?subject=Tech%20Carbon%20Standard%20Enquiry" target="_blank" rel="noopener">[email protected]</a>
+      </span>
+    </div>
   </div>
   <div class="sm:w-1/2">
     {% include creativeCommons.html %}
   </div>
-</div>
+</div>

_includes/navigation.html

@@ -1,25 +1,31 @@
-<div class="container max-w-7xl mx-auto w-full flex px-2 pt-4 pb-4 sm:pb-0 items-center sm:items-end justify-start space-x-4">
+<div class="container max-w-7xl mx-auto w-full flex px-2 pt-4 pb-4 sm:pb-0 items-center sm:items-end">
 
-  <button id="menu-button" type="button" class="sm:hidden" aria-expanded="false" aria-label="open menu">
-    <svg id="menu-icon" aria-hidden="true" class="size-8 fill-cambridge-50 hover:fill-cambridge-400"><use href="/assets/images/icons.svg#menu"></use></svg>
-    <svg id="close-icon" aria-hidden="true" class="hidden size-8 fill-cambridge-50 hover:fill-cambridge-400"><use href="/assets/images/icons.svg#close"></use></svg>
-  </button>
+  <div class="flex items-center sm:items-end space-x-4 justify-start">
+      <button id="menu-button" type="button" class="sm:hidden" aria-expanded="false" aria-label="open menu">
+        <svg id="menu-icon" aria-hidden="true" class="size-8 fill-cambridge-50 hover:fill-cambridge-400"><use href="/assets/images/icons.svg#menu"></use></svg>
+        <svg id="close-icon" aria-hidden="true" class="hidden size-8 fill-cambridge-50 hover:fill-cambridge-400"><use href="/assets/images/icons.svg#close"></use></svg>
+      </button>
+
+      <!-- LOGO -->
+      <a class="flex items-center space-x-4 group no-underline" aria-label="Tech Carbon Standard home page" href="/">
+        <svg aria-hidden="true" class="size-12 sm:mb-4 fill-cambridge-300 hover:fill-cambridge-400"><use href="/assets/images/icons.svg#tcs-logo"></use></svg>
+        <span class="sm:hidden text-lg text-cambridge-50 dark:text-cambridge-300 hover:text-cambridge-300 focus:outline-none focus-visible:ring focus:ring-blue">Technology Carbon Standard</span>
+      </a>
+
+      <div class="hidden sm:block">
+        <div class="flex space-x-6">
+          {% for item in site.data.navigation %}
+            <a href="{{ item.link }}" class="no-underline h-12  {% if page.url == item.link %}text-cambridge-100 border-b-4 border-cambridge-400 dark:border-cambridge-600 dark:text-cambridge-100{% else %} text-cambridge-100 dark:text-cambridge-300{% endif %} hover:text-cambridge-300 focus:outline-none focus-visible:ring focus:ring-blue">
+              {{ item.name }}
+            </a>
+          {% endfor %}
+        </div>
+      </div>
+  </div>
 
-  <!-- LOGO -->
-  <a class="flex items-center space-x-4 group no-underline" aria-label="Tech Carbon Standard home page" href="/">
-    <svg aria-hidden="true" class="size-12 sm:mb-4 fill-cambridge-300 hover:fill-cambridge-400"><use href="/assets/images/icons.svg#tcs-logo"></use></svg>
-    <span class="sm:hidden text-lg text-cambridge-50 dark:text-cambridge-300 hover:text-cambridge-300 focus:outline-none focus-visible:ring focus:ring-blue">Technology Carbon Standard</span>
+  <a class="ml-auto mr-0 sm:mr-10 sm:mb-5" aria-label="GitHub" href="https://github.com/ScottLogic/Technology-Carbon-Standard">
+    <svg aria-hidden="true" class="size-8"><use href="/assets/images/icons.svg#github"></use></svg>
   </a>
-
-  <div class="hidden sm:block">
-    <div class="flex space-x-6">
-      {% for item in site.data.navigation %}
-        <a href="{{ item.link }}" class="no-underline h-12  {% if page.url == item.link %}text-cambridge-100 border-b-4 border-cambridge-400 dark:border-cambridge-600 dark:text-cambridge-100{% else %} text-cambridge-100 dark:text-cambridge-300{% endif %} hover:text-cambridge-300 focus:outline-none focus-visible:ring focus:ring-blue">
-          {{ item.name }}
-        </a>
-      {% endfor %}
-    </div>
-  </div>
 </div>
 
 <!-- MOBILE MENU -->
@@ -49,4 +55,4 @@
     menuIcon.classList.toggle('hidden');
     closeIcon.classList.toggle('hidden');
   });
-</script>
+</script>