Merge branch 'main' of github.com:kangaroooh/keepandroidopen.github.io

Author: namdokmai

src/components/ThemeToggle.astro

@@ -22,10 +22,6 @@
     border: none;
     cursor: pointer;
     padding: 0.5rem;
-    position: absolute;
-    /* top: 1rem; */
-    right: 1rem;
-    z-index: 1000;
     transition: all 0.3s ease;
   }
   #theme-toggle:hover {

src/layouts/Base.astro

@@ -172,6 +172,27 @@ const {
       margin-right: 0.5em;
     }
 
+    .header-icons {
+      position: absolute;
+      right: 1rem;
+      z-index: 1000;
+      display: inline-flex;
+      align-items: center;
+      gap: 0.25rem;
+    }
+
+    .header-icon-link {
+      color: var(--pico-text);
+      padding: 0.5rem;
+      transition: all 0.3s ease;
+      display: inline-flex;
+      align-items: center;
+    }
+
+    .header-icon-link:hover {
+      opacity: 0.8;
+    }
+
     .alarming-banner {
       /* Layout and Background */
       font-variant-numeric: tabular-nums;

src/layouts/Default.astro

@@ -42,7 +42,7 @@ const languageEntries = Object.entries(languages);
   {lockdown_banner ?? "LOCKDOWN"}<br/><span id="countdown">&nbsp;</span>
   </div>
   <header>
-    <h1>{title}<ThemeToggle /></h1>    
+    <h1>{title}<span class="header-icons"><a href="https://techhub.social/@keepandroidopen" class="header-icon-link" aria-label="Mastodon" title="Mastodon" rel="me" target="_blank"><svg width="20" height="20" viewBox="0 0 24 24" fill="currentColor"><path d="M16.45 17.77c2.77-.33 5.18-2.03 5.49-3.58.47-2.45.44-5.97.44-5.97 0-4.77-3.15-6.17-3.15-6.17-1.58-.72-4.3-1.03-7.13-1.05h-.07c-2.83.02-5.55.33-7.13 1.05 0 0-3.14 1.4-3.14 6.17v.91c-.01.88-.02 1.86 0 2.88.12 4.67.87 9.27 5.2 10.4 2 .53 3.72.64 5.1.57 2.51-.14 3.92-.9 3.92-.9l-.08-1.8s-1.8.56-3.8.5c-2-.08-4.1-.22-4.43-2.66a4.97 4.97 0 0 1-.04-.68s1.96.48 4.44.59c1.51.07 2.94-.09 4.38-.26Zm2.22-3.4h-2.3v-5.6c0-1.19-.5-1.79-1.5-1.79-1.1 0-1.66.71-1.66 2.12v3.07h-2.3V9.1c0-1.4-.55-2.12-1.65-2.12-1 0-1.5.6-1.5 1.78v5.61h-2.3V8.6c0-1.18.3-2.12.9-2.81a3.17 3.17 0 0 1 2.47-1.05c1.18 0 2.07.45 2.66 1.35l.57.96.58-.96a2.97 2.97 0 0 1 2.66-1.35c1.01 0 1.83.36 2.46 1.05.6.7.9 1.63.9 2.81v5.78Z"></path></svg></a><ThemeToggle /></span></h1>
     <div class="lang-menu">
       {languageEntries.map(([_code, { label, path }], i) => (
         <>
@@ -57,13 +57,14 @@ const languageEntries = Object.entries(languages);
   </main>
   <footer>
     <div style="display: flex; flex-wrap: wrap; justify-content: space-between; padding-top: 2em; margin-left: auto; margin-right: auto;">
-      <div style="flex: 1; min-width: 200px; margin: 20px;">
+      <div style="flex: 1; min-width: 22em; margin: 5px;">
         <h4 style="margin-top: 0; margin-bottom: 10px; font-size: 16px;">
           {contact_header}
         </h4>
         <ul style="padding: 0; margin: 0;">
           <li style="list-style: none; margin-bottom: 5px;">{contact_email}: <a href="mailto:info@keepandroidopen.org" style="text-decoration: none;">info@keepandroidopen.org</a></li>
-          <li style="list-style: none; margin-bottom: 5px;">{site_problems_header}: <a href="https://github.com/keepandroidopen/keepandroidopen.github.io/issues" style="text-decoration: none;">{site_report_issues}</a></li>
+          <li style="list-style: none; margin-bottom: 5px;">Mastodon: <a target="_blank" href="https://techhub.social/@keepandroidopen" style="text-decoration: none;">@keepandroidopen@techhub.social</a></li>
+          <li style="list-style: none; margin-bottom: 5px;">{site_problems_header}: <a target="_blank" href="https://github.com/keepandroidopen/keepandroidopen.github.io/issues" style="text-decoration: none;">{site_report_issues}</a></li>
         </ul>
       </div>
       <div style="flex: 3; min-width: 300px; margin: 20px;">