Fix SVG sizing across the site and enhance footer logo display

Author: mstrhakr

_includes/footer_custom.html

@@ -1,12 +1,14 @@
-<div style="margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--border-color); display: flex; align-items: center; justify-content: center; gap: 1rem; flex-wrap: wrap;">  <a href="https://unraid.net/" style="display: inline-flex; align-items: center; opacity: 0.7; transition: opacity 0.2s;" title="Unraid OS">
-    <img src="{{ '/assets/images/logos/Unraid%20Logos/UN-logotype-gradient.svg' | relative_url }}" alt="Unraid" height="24">
+<div style="margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--border-color); display: flex; align-items: center; justify-content: center; gap: 1rem; flex-wrap: wrap;">
+  <a href="https://unraid.net/" style="display: inline-flex; align-items: center; opacity: 0.7; transition: opacity 0.2s;" title="Unraid OS">
+    <img src="{{ '/assets/images/logos/Unraid%20Logos/UN-logotype-gradient.svg' | relative_url }}" alt="Unraid" style="height: 24px; width: auto; max-height: 24px;">
   </a>
-  <span style="opacity: 0.5;">|</span>  <a href="https://github.com/mstrhakr/unraid-plugin-docs" style="display: inline-flex; align-items: center; opacity: 0.7; transition: opacity 0.2s;">
-    <img src="{{ '/assets/images/logos/GitHub%20Logos/GitHub_Lockup_White.svg' | relative_url }}" alt="GitHub" height="24">
+  <span style="opacity: 0.5;">|</span>
+  <a href="https://github.com/mstrhakr/unraid-plugin-docs" style="display: inline-flex; align-items: center; opacity: 0.7; transition: opacity 0.2s;">
+    <img src="{{ '/assets/images/logos/GitHub%20Logos/GitHub_Lockup_White.svg' | relative_url }}" alt="GitHub" style="height: 24px; width: auto; max-height: 24px;">
   </a>
   <span style="opacity: 0.5;">|</span>
   <a href="https://github.com/features/copilot" style="display: inline-flex; align-items: center; opacity: 0.7; transition: opacity 0.2s;" title="Created with assistance from GitHub Copilot">
-    <img src="{{ '/assets/images/logos/GitHub%20Logos/Copilot_Lockup_White.svg' | relative_url }}" alt="GitHub Copilot" height="20">
+    <img src="{{ '/assets/images/logos/GitHub%20Logos/Copilot_Lockup_White.svg' | relative_url }}" alt="GitHub Copilot" style="height: 20px; width: auto; max-height: 20px;">
   </a>
   <span style="opacity: 0.5;">|</span>
   <a href="{{ '/docs/attributions' | relative_url }}" style="opacity: 0.5; font-size: 0.75rem; transition: opacity 0.2s;">Attributions</a>

_includes/head_custom.html

@@ -0,0 +1,36 @@
+<style>
+/* Fix SVG sizing - SVGs need explicit dimensions via inline styles */
+/* Footer logo sizing */
+.site-footer img,
+div[style*="border-top"] img {
+  height: 24px !important;
+  width: auto !important;
+  max-height: 24px !important;
+  display: inline-block;
+}
+
+/* Smaller for Copilot logo */
+div[style*="border-top"] img[alt="GitHub Copilot"] {
+  height: 20px !important;
+  max-height: 20px !important;
+}
+
+/* Add GitHub icon to View on GitHub aux link */
+.aux-nav .aux-nav-list-item:first-child a {
+  display: inline-flex;
+  align-items: center;
+}
+
+.aux-nav .aux-nav-list-item:first-child a::before {
+  content: '';
+  display: inline-block;
+  width: 20px;
+  height: 20px;
+  margin-right: 6px;
+  vertical-align: middle;
+  background-image: url('{{ "/assets/images/logos/GitHub%20Logos/GitHub_Invertocat_White.svg" | relative_url }}');
+  background-size: contain;
+  background-repeat: no-repeat;
+  background-position: center;
+}
+</style>

_sass/custom/custom.scss

@@ -155,6 +155,38 @@ $unraid-orange-dark: #ac0800;
 // GitHub Branding Styles
 // ============================================
 
+// Fix SVG sizing globally - SVGs need explicit dimensions
+img[src*=".svg"] {
+  max-width: 100%;
+  height: auto;
+}
+
+// GitHub icon in aux nav "View on GitHub" link
+.aux-nav .aux-nav-list-item:first-child a {
+  display: inline-flex;
+  align-items: center;
+  
+  &::before {
+    content: '';
+    display: inline-block;
+    width: 20px;
+    height: 20px;
+    margin-right: 6px;
+    background-image: url('/unraid-plugin-docs/assets/images/logos/GitHub%20Logos/GitHub_Invertocat_White.svg');
+    background-size: contain;
+    background-repeat: no-repeat;
+    background-position: center;
+  }
+}
+
+// Footer SVG sizing
+.site-footer img[src*=".svg"],
+.footer-custom img[src*=".svg"] {
+  height: 24px;
+  width: auto;
+  max-height: 24px;
+}
+
 // GitHub logo in headers - auto invert for light mode
 .github-logo {
   height: 32px;