Add Discord server link. Add hover effect to the sponsor icons.

Author: nikoscham

assets/DiscordIconFEAScript.png

@@ -98,8 +98,8 @@ <h1>A JavaScript Finite Element Simulation Library</h1>
       <li><a href="#tutorials">Tutorials</a></li>
       <li><a href="#documentation">Documentation</a></li>
       <li><a href="#licensing">Licensing</a></li>
-      <li class="external-link-start">
-        <a href="https://platform.feascript.com/"> FEAScript Platform</a>
+      <li class="external-link-start" style="border: 2px solid #e0e0e0; padding: 5px; border-radius: 4px">
+        <a href="https://platform.feascript.com/" style="color: #555"> FEAScript Platform</a>
       </li>
       <li class="icon-link-start">
         <a href="https://blog.feascript.com/" title="FEAScript blog">
@@ -128,10 +128,19 @@ <h1>A JavaScript Finite Element Simulation Library</h1>
           />
         </a>
       </li>
+      <li>
+        <a href="https://discord.gg/3DVjNcuW4f" title="FEAScript Discord">
+          <img
+            src="./assets/DiscordIconFEAScript.png"
+            alt="Discord icon"
+            style="height: 18px; vertical-align: middle"
+          />
+        </a>
+      </li>
       <li>
         <a href="https://github.com/FEAScript/FEAScript-core" title="FEAScript GitHub">
           <img
-            src="./assets/GitHubIconFEAScript.svg"
+            src="./assets/GitHubIconFEAScript.png"
             alt="GitHub icon"
             style="height: 20px; vertical-align: middle"
           />
@@ -237,14 +246,24 @@ <h2 id="gettingstarted"><a name="Getting Started"></a>Getting Started</h2>
           >💖 If you find FEAScript useful, please consider supporting its development through a
           donation:</strong
         >
-        <a href="https://github.com/sponsors/FEAScript">
+        <a
+          href="https://github.com/sponsors/FEAScript"
+          style="display: inline-block; transition: transform 0.2s"
+          onmouseover="this.style.transform='translateY(-2px)'"
+          onmouseout="this.style.transform='translateY(0)'"
+        >
           <img
             alt="GitHub Sponsors"
             src="https://img.shields.io/static/v1?label=Sponsor&message=%E2%9D%A4&logo=GitHub&color=%23fe8e86)](https://github.com/sponsors/feascript"
             style="vertical-align: middle"
           />
         </a>
-        <a href="https://liberapay.com/FEAScript/donate">
+        <a
+          href="https://liberapay.com/FEAScript/donate"
+          style="display: inline-block; transition: transform 0.2s"
+          onmouseover="this.style.transform='translateY(-2px)'"
+          onmouseout="this.style.transform='translateY(0)'"
+        >
           <img
             alt="Donate using Liberapay"
             src="https://img.shields.io/badge/Liberapay-F6C915?logo=liberapay&logoColor=black"