Added support for images on project and author pages.

_includes/author.njk

@@ -19,6 +19,7 @@
                 <p id="projectSubtitle">{{ subtitle }}</p>
             </div>
         </div>
+        {% include "project_image.njk" %}
         <main id="projectDescription">
             {{ content | safe }}
         </main>

_includes/project.njk

@@ -11,8 +11,8 @@
     <div id="everythingHelper">
         {% include "header.njk" %}
         <div id="projectHeader">
-            {% if logoName and logoExtension %}
+            {% if logo %}
-            <img src="{{ page.dir }}{{ logoName }}.{{ logoExtension }}">
+            <img src="{{ page.dir }}{{ logo }}">
             {% endif %}
             <div id="projectTitleSubtitle">
                 <div id="projectTitleAuthor">
@@ -23,6 +23,7 @@
             </div>
             <a id="downloadLink" href="{{ downloadLink }}"><button id="downloadButton">Download</button></a>
         </div>
+        {% include "project_image.njk" %}
         <main id="projectDescription">
             {{ content | safe }}
         </main>

_includes/project_image.njk

@@ -0,0 +1,10 @@
+{% if images %}
+<div id="projectImageCarrousel">
+    <p>Images</p>
+    <div id="projectCarrouselImageHolder">
+        {% for image in images %}
+        <a href="{{ page.dir }}{{ image }}"><img class="projectImage" src="{{ page.dir }}{{ image }}" alt=""></a>
+        {% endfor %}
+    </div>
+</div>
+{% endif %}

assets/styles.css

@@ -1,3 +1,8 @@
+:root {
+    --accent-color: greenyellow;
+    --accent-secondary: green;
+}
+
 * {
     margin: 0;
     padding: 0;
@@ -22,7 +27,7 @@ header {
 
 a {
     text-decoration: none;
-    color:greenyellow;
+    color: var(--accent-color);
 }
 
 main {
@@ -130,7 +135,7 @@ img {
 
 .featuredProject img {
     width: 100%;
-    border: medium solid yellowgreen;
+    border: medium solid var(--accent-color);
 }
 
 .featuredProject p {
@@ -159,12 +164,14 @@ img {
     padding-top: 20px;
     gap: 20px;
     display: flex;
+    margin-bottom: 1em;
 }
 
 #downloadButton {
     border: none;
-    background: linear-gradient(yellowgreen, green);
+    background: linear-gradient(var(--accent-color), var(--accent-secondary));
     border-radius: 2px;
+    color: white;
 }
 
 #downloadLink {
@@ -179,7 +186,6 @@ img {
 
 #downloadButton:hover {
     cursor: pointer;
-    border-color: white;
 }
 
 #projectHeader img {
@@ -207,6 +213,38 @@ img {
     margin-bottom: 6px;
 }
 
+#projectImageCarrousel {
+    outline: 2px solid gray;
+    padding: 1rem;
+    height: 12em;
+    display: flex;
+    flex-direction: column;
+}
+
+#projectCarrouselImageHolder {
+    height: 100%;
+    gap: 1em;
+    overflow: auto;
+    scroll-margin-left: 10px;
+    overflow-x: scroll;
+    white-space: nowrap;
+}
+
+.projectImage {
+    transition: .4s;
+    height: 95%;
+    max-width: 10em;
+    object-fit: cover;
+    /* filter: grayscale(); */
+}
+
+.projectImage:hover {
+    filter: none;
+    opacity: .8;
+    max-width: 100%;
+    /* object-fit: unset; */
+}
+
 #credits {
     margin-left: auto;
 }

authors/tenkuma/index.md

@@ -4,6 +4,9 @@ subtitle: "A bear doing things on the internet."
 downloadLink: "https://modrinth.com/plugin/tenkumalib/versions"
 logoName: "logo"
 logoExtension: "png"
+images: ["tenkuma-silverfish.jpg", "tenkuma-mrnando-enderdragon.jpg"]
 ---
 
-I'm tenkuma.
+I'm tenkuma. A bear, dreamer and sometimes developer.
+
+You can found more about me on [my website](https://adrianvictor.rf.gd).

projects/aboukkit/index.md

@@ -3,9 +3,7 @@ name: "Aboukkit"
 subtitle: "A simple way to add custom commands with custom responses to your server."
 author: "tenkuma"
 downloadLink: "https://modrinth.com/plugin/aboukkit/versions"
-backgroundImageSize: "cover"
+logo: "logo.png"
-logoName: "logo"
-logoExtension: "png"
 tags: plugin
 ---
 

projects/devilwithin/index.md

@@ -3,8 +3,7 @@ name: "The Devil Within"
 subtitle: "Adds enchanting to Minecraft Beta. Supports balancing through curses."
 author: "tenkuma"
 downloadLink: "https://modrinth.com/plugin/devilwithin/versions"
-logoName: "logo"
+logo: "logo.png"
-logoExtension: "png"
 tags: plugin
 ---
 This plugin is a remake of [GoldEnchant](https://dev.bukkit.org/projects/goldenchant/).

projects/ghostsandstuff/index.md

@@ -3,15 +3,14 @@ name: "Ghosts 'n Stuff"
 subtitle: "Miscellaneous additions to your Minecraft server."
 author: "tenkuma"
 downloadLink: "https://modrinth.com/plugin/ghosts/versions"
-backgroundImageSize: "cover"
+images: ["anti-spam.png", "rainbow-chat.png", "skibidi-blocker.png"]
-logoName: "logo"
+logo: "logo.png"
-logoExtension: "png"
 tags: "plugin"
 ---
 
 This plugins was made to use stuff from my library that would not fit into any plugin (or not in the way presented here) that has ~~a lot~~ (WIP) of random stuff. Everything should be togglable in the config.
 
 ## Features
-- **RainbowChat:** Rainbow color code.
+- **RainbowChat:** Rainbow color code (&z by default).
 - **SkibidiBlocker:** Strike a lightning on players that say a word.
 - **AntiSpam:** Blocks repeated words in the chat. Optionally can strike a lightning to the player who is spamming.

projects/tefreezer/index.md

@@ -3,8 +3,7 @@ name: "teFreezer"
 subtitle: "Force your players to refrigerate their food by rotting food in unrefrigerated chests!"
 author: "tenkuma"
 downloadLink: "https://modrinth.com/plugin/freezer/versions"
-logoName: "logo"
+logo: "logo.png"
-logoExtension: "png"
 tags: plugin
 ---
 ![Tefreezer written in Minecraft-like font in purple.](https://cdn.modrinth.com/data/cached_images/0aaabfb51609876ece6de83e62b9641a4635fad9_0.webp)

projects/timekeeper/index.md

@@ -3,8 +3,7 @@ name: "TimeKeeper"
 subtitle: "Syncs real world time with your Minecraft server time."
 author: "tenkuma"
 downloadLink: "https://modrinth.com/plugin/timekeeper/versions"
-logoName: "logo"
+logo: "logo.png"
-logoExtension: "png"
 tags: plugin
 ---
 This is a plugin for Minecraft beta that syncs the real world time with your in-game time. Logo by [malcolmriley](https://github.com/malcolmriley/unused-textures/blob/master/items/).