improved css and added some content

src/pages/docs.astro

@@ -16,7 +16,16 @@ const docs = unsortedDocs.sort(
       <h1 style="text-align: center;">Docs</h1>
       {
         docs.map((doc) => (
-          <div class="second-content">
+          <div
+            class="second-content"
+            style={
+              doc.frontmatter.has_thumbnail
+                ? 'background-image: url("/img/docs/thumbnails/' +
+                  doc.frontmatter.repo +
+                  '.webp")'
+                : ""
+            }
+          >
             <div style="text-align: left;" />
             <a href={doc.url}>
               <h2>
@@ -24,13 +33,12 @@ const docs = unsortedDocs.sort(
               </h2>
             </a>
             <p>{doc.frontmatter.subtitle}</p>
-            {doc.frontmatter.has_thumbnail ? (
-              <img
-                width="100%"
-                style="border-radius: 5px;"
-                src={"/img/docs/thumbnails/" + doc.frontmatter.repo + ".webp"}
-              />
-            ) : null}
+            <h3 style="text-align: left;">Features:</h3>
+            <ul style="text-align: left;">
+              {doc.frontmatter.features.map((feature) => (
+                <li>{feature}</li>
+              ))}
+            </ul>
           </div>
         ))
       }

src/pages/docs/discord-sdk-godot/index.mdx

@@ -4,14 +4,15 @@ repo: discord-sdk-godot
 has_thumbnail: true
 title: Home
 subtitle: Discord Game SDK support for GDScript in Godot Engine 4.2. with the easiest code pattern!
-features: |
- - Activities (Make people see what you are playing)
- - Invites
- - Steam and launch command registering
- - User information
- - Relationship Manager (Get friendlist and its updates)
- - Overlay management
- - Editor Presence (optional)
+features: [
+ "Activities (Make people see what you are playing)",
+ "Invites",
+ "Steam and launch command registering",
+ "User information",
+ "Relationship Manager (Get friendlist and its updates)",
+ "Overlay management",
+ Editor Presence (optional)
+ ]
 ---
 
 :::note{title="Important Discord Game SDK information"}
@@ -24,7 +25,7 @@ The GameSDK's Achievements, Applications, Voice, Images, Lobbies, Networking, St
 The plugin only works with 4.2 and above for the current version
 :::
 <br/>
-:::deter{title="Important info"}
+:::assert{title="Important info"}
 To make anything work in the plugin make sure to run
 
  ```gdscript
@@ -44,7 +45,7 @@ To make anything work in the plugin make sure to run
 
 | Recommended                                                                                                                                                                                                                                            | Manual                                                                                                                                                                                            |
 | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| 1. Open the AssetLib tab in your Godot Editor. <br /> 2. Search for "discord" and install all the files from this plugin <img width="30px" src="https://raw.githubusercontent.com/vaporvee/discord-sdk-godot/main/project/assets/Logo_V2_Clyde.png" /> | 1. [Download the addon](https://github.com/vaporvee/discord-sdk-godot/releases/latest/download/ADDON-Discord-SDK-Godot.zip/) <br /> 2. Put the `addons/` folder in the root of your Godot project |
+| 1. Open the AssetLib tab in your Godot Editor. <br />2. Search for "discord" and install all the files from this plugin <img width="30px" style="margin-top:-30px;" src="https://raw.githubusercontent.com/vaporvee/discord-sdk-godot/main/project/assets/Logo_V2_Clyde.png" /> | 1. [Download the addon](https://github.com/vaporvee/discord-sdk-godot/releases/latest/download/ADDON-Discord-SDK-Godot.zip/) <br />2. Put the `addons/` folder in the root of your Godot project |
 
 3. Enable the addon in your Project Settings under "Plugins" and "DiscordSDK". <br /><sub>(Also adds DiscordSDKLoader autoload wich should be ignored. It needs to run in the background to comunicate with the Discord client)</sub>
 4. Restart your project with the window that should now appear. <br /><img src="https://github.com/vaporvee/discord-sdk-godot/assets/80621863/620d90aa-6e76-4a80-980e-c8c57d8cfa58" width="200px" /><br />

src/pages/index.astro

@@ -26,6 +26,7 @@ const yannikAge = new Date().getFullYear() - 2004; // 31/12/2003
         />
       </div>
       <div class="content">
+        <div class="avatar portrait"><div class="avatar"></div></div>
         <p>
           Hello my name is <b>Yannik</b>!<br />
           I’m a {yannikAge} year old <b>Game Developer</b> living <b