place github stars at top of page (#32)

src/_includes/components/header.njk

@@ -18,5 +18,6 @@
         <a id="menu-close" href="">{% include "svgs/menu-close.svg" %}</a>
       </li>
     </ul>
+    <div class="gh-btn"><a class="github-button" href="https://github.com/Start9Labs/start-os" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star Start9Labs/start-os on GitHub">Star</a></div>
   </nav>
 </header>

src/_includes/components/landing/powered-by.njk

@@ -2,8 +2,6 @@
   <img class="logo" src="/assets/images/logomark.png" alt="Logomark">
   <h1>Powered by StartOS</h1>
   <div class="ratings">
-    <span class="ratings-gh-desktop"><a class="github-button" href="https://github.com/Start9Labs/start-os" data-size="large" data-show-count="true" aria-label="Star Start9Labs/start-os on GitHub">Star</a></span>
-    <span class="ratings-gh-mobile"><a class="github-button" href="https://github.com/Start9Labs/start-os" data-show-count="true" aria-label="Star Start9Labs/start-os on GitHub">Star</a></span>
     <div id= "ap-widget-2" class="ap-widget--mini" data-options='{"prod_code": "startos", "theme":  "dark", "template_id": "mini", "text_color": "#F5F5F5" , "bg_color": "transparent" }'></div>
   </div>
   <p>Just as Windows and macOS made it possible for anyone to own a personal computer, StartOS makes it possible for anyone to own a personal server.</p>

src/assets/styles/main.scss

@@ -348,16 +348,23 @@ nav {
   font-family: var(--f-accent);
   font-weight: 300;
   line-height: 1;
-  text-transform: uppercase;
   padding: var(--padding);
   display: flex;
   justify-content: space-between;
 
+  .gh-btn {
+    position: absolute;
+    top: 5rem;
+    right: 2.5rem;
+    z-index: 100;
+  }
+
   ul {
     margin: 0;
     padding: 0;
     display: flex;
     gap: 1rem;
+    text-transform: uppercase;
     li {
       list-style: none;
       display: flex;
@@ -485,6 +492,10 @@ nav {
       font-size: 2rem;
     }
   }
+  .gh-btn {
+    top: 5.5rem !important;
+    right: 2rem !important;
+  }
 }
 
 .image-with-shadow {

src/assets/styles/powered-by.scss

@@ -99,14 +99,6 @@ svg a:visited {
       }
     }
   }
-
-  &-gh-mobile {
-    display: none;
-  }
-
-  &-gh-desktop {
-    display: block;
-  }
 }
 
 @media only screen and (max-width: 500px) {