fix: update Hacker News icon and rearrange button, styles, and function in alphabetical order

index.html

@@ -31,6 +31,7 @@
         <div class="shareon">
           <a class="facebook"></a>
           <a class="fediverse"></a>
+          <a class="hackernews"></a>
           <a class="linkedin"></a>
           <a class="mastodon"></a>
           <a class="messenger" data-fb-app-id="3619024578167617"></a>
@@ -45,7 +46,6 @@
           <a class="viber"></a>
           <a class="vkontakte"></a>
           <a class="whatsapp"></a>
-          <a class="hackernews"></a>
           <a class="copy-url"></a>
           <a class="email"></a>
           <a class="print"></a>
@@ -57,6 +57,7 @@
         <div class="shareon">
           <button class="facebook"></button>
           <button class="fediverse"></button>
+          <button class="hackernews"></button>
           <button class="linkedin"></button>
           <button class="mastodon"></button>
           <button class="messenger" data-fb-app-id="3619024578167617"></button>
@@ -71,7 +72,6 @@
           <button class="viber"></button>
           <button class="vkontakte"></button>
           <button class="whatsapp"></button>
-          <button class="hackernews"></button>
           <button class="copy-url"></button>
           <button class="email"></button>
           <button class="print"></button>
@@ -88,6 +88,7 @@
         >
           <a class="facebook"></a>
           <a class="fediverse" data-s2f-instance="share2fedi.vercel.app"></a>
+          <a class="hackernews"></a>
           <a class="linkedin"></a>
           <a class="mastodon" data-via="@NickKaramoff@fosstodon.org"></a>
           <a class="messenger" data-fb-app-id="3619024578167617"></a>
@@ -102,7 +103,6 @@
           <a class="viber"></a>
           <a class="vkontakte"></a>
           <a class="whatsapp"></a>
-          <a class="hackernews"></a>
           <a class="copy-url"></a>
           <a class="email"></a>
           <a class="web-share"></a>
@@ -113,6 +113,7 @@
         <div class="shareon specimen">
           <a class="facebook"></a>
           <a class="fediverse"></a>
+          <a class="hackernews"></a>
           <a class="linkedin"></a>
           <a class="mastodon">Toot</a>
           <a class="messenger" data-fb-app-id="3619024578167617"></a>
@@ -129,7 +130,6 @@
           <br />
           <a class="vkontakte">Поделиться</a>
           <a class="whatsapp"></a>
-          <a class="hackernews"></a>
           <a class="copy-url"></a>
           <a class="email"></a>
           <a class="web-share">Share</a>

src/icons/hackernews.svg

@@ -1 +1 @@
-<svg viewBox="0 0 24 24" aria-label="Hacker News" xmlns="http://www.w3.org/2000/svg"><rect fill="#f60" height="24" rx="3" width="24"/><path fill="#fff" d="M6 6h3l4 8 4-8h3l-6 8v4h-2v-4z"/></svg>
+<svg fill="#fff" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M0 24V0h24v24zM6.951 5.896l4.112 7.708v5.064h1.583v-4.972l4.148-7.799h-1.749l-2.457 4.875c-.372.745-.688 1.434-.688 1.434s-.297-.708-.651-1.434L8.831 5.896z"/></svg>

src/shareon.css

@@ -99,6 +99,13 @@
   background-image: url("icons/fediverse.svg");
 }
 
+.shareon > .hackernews {
+  background-color: #fb651e;
+}
+.shareon > .hackernews:before {
+  background-image: url("icons/hackernews.svg");
+}
+
 .shareon > .linkedin {
   background-color: #0a66c2;
 }
@@ -207,10 +214,3 @@
 .shareon > .whatsapp:before {
   background-image: url("icons/whatsapp.svg");
 }
-
-.shareon > .hackernews {
-  background-color: #ff6600;
-}
-.shareon > .hackernews:before {
-  background-image: url("icons/hackernews.svg");
-}

src/shareon.js

@@ -21,6 +21,7 @@ const urlBuilderMap = {
   facebook: (d) => `https://www.facebook.com/sharer/sharer.php?u=${d.url}${d.hashtags ? `&hashtag=%23${d.hashtags.split('%2C')[0]}` : ''}`,
   fediverse: (d) => `https://${d.s2fInstance}/?text=${d.title}%0D%0A${d.url}${d.text ? `%0D%0A%0D%0A${d.text}` : ''}${d.via ? `%0D%0A%0D%0A${d.via}` : ''}`,
   email: (d) => `mailto:?subject=${d.title}&body=${d.url}`,
+  hackernews: (d) => `https://news.ycombinator.com/submitlink?u=${d.url}&t=${d.title}`,
   linkedin: (d) => `https://www.linkedin.com/sharing/share-offsite/?url=${d.url}`,
   mastodon: (d) => `https://toot.kytta.dev/?text=${d.title}%0D%0A${d.url}${d.text ? `%0D%0A%0D%0A${d.text}` : ''}${d.via ? `%0D%0A%0D%0A${d.via}` : ''}`,
   messenger: (d) => `https://www.facebook.com/dialog/send?app_id=${d.fbAppId}&link=${d.url}&redirect_uri=${d.url}`,
@@ -35,7 +36,6 @@ const urlBuilderMap = {
   viber: (d) => `viber://forward?text=${d.title}%0D%0A${d.url}${d.text ? `%0D%0A%0D%0A${d.text}` : ''}`,
   vkontakte: (d) => `https://vk.com/share.php?url=${d.url}&title=${d.title}${d.media ? `&image=${d.media}` : ''}`,
   whatsapp: (d) => `https://wa.me/?text=${d.title}%0D%0A${d.url}${d.text ? `%0D%0A%0D%0A${d.text}` : ''}`,
-  hackernews: (d) => `https://news.ycombinator.com/submitlink?u=${d.url}&t=${d.title}`,
 };
 
 const openUrl = (buttonUrl) => () => {