improved visuals of the support section

main/_data/support.json

@@ -2,49 +2,21 @@
     {
         "name": "🪙 Buy Stuff I Made",
         "text": "Some of the stuff I make is directly for sale, and buying it is an easy way to support me! For example, some of my games on itch are in \"name your own price\" mode, so you can choose the amount you want to give me.",
-        "links": [
+        "link": "#projects"
-            {
-                "name": "Buy Tiny Life",
-                "link": "https://tinylifegame.com"
-            },
-            {
-                "name": "Buy other games",
-                "link": "https://ellpeck.itch.io/"
-            }
-        ]
     },
     {
         "name": "☕ Buy me a Coffee",
         "text": "Ko-fi is a great site that allows you to send me just enough money to buy a coffee. And I love those. You can also use it to send monthly payments, but the other sites in this list are usually better for that.",
-        "links": [
+        "link": "https://ko-fi.com/ellpeck"
-            {
-                "name": "Go to Ko-fi",
-                "link": "https://ko-fi.com/ellpeck"
-            }
-        ]
     },
     {
         "name": "⭐ Become a Patron",
         "text": "Patreon allows you to support me on a monthly basis with an amount of money of your choosing. You can also get fun rewards, like player accessories to impress your friends when using my Minecraft mods!",
-        "links": [
+        "link": "https://patreon.com/Ellpeck"
-            {
-                "name": "Go to Patreon",
-                "link": "https://patreon.com/Ellpeck"
-            }
-        ]
     },
     {
         "name": "💻 Sponsor on GitHub",
         "text": "GitHub Sponsors is basically Patreon for programmers, and it provides a monthly support option, but it also allows you to make one-time payments. Here, you can get the same rewards as you get on Patreon.",
-        "links": [
+        "link": "https://github.com/sponsors/Ellpeck"
-            {
-                "name": "Sponsor monthly",
-                "link": "https://github.com/sponsors/Ellpeck?frequency=recurring"
-            },
-            {
-                "name": "Sponsor once",
-                "link": "https://github.com/sponsors/Ellpeck?frequency=one-time"
-            }
-        ]
     }
 ]

main/_includes/post.html

@@ -1,6 +1,6 @@
 <div class="card bg-light blog-entry rounded-0 {% for tag in include.post.tags %} blog-tag-{{ tag | slugify}} {% endfor %}">
     <div class="card-body">
-        <h4 class="card-title blog-title"><a class="blog-button" href="{{ include.post.url }}">{{ include.post.title }}</a></h4>
+        <h4 class="card-title blog-title"><a class="title-button" href="{{ include.post.url }}">{{ include.post.title }}</a></h4>
         <div class="card-text blog-summary">{{ include.post.description }}</div>
         <span class="text-muted project-status">{{ include.post.date | date_to_string }}</span>
         <span class="text-muted blog-cat">{{ include.post.tags | join: ", " }}</span>

main/_includes/support.html

@@ -8,12 +8,8 @@
         {% for item in site.data.support %}
         <div class="card bg-light support-entry rounded-0">
             <div class="card-body">
-                <h4 class="card-title">{{ item.name }}</h4>
+                <h4 class="card-title"><a class="title-button" href="{{ item.link }}">{{ item.name }}</a></h4>
                 <p class="card-text">{{ item.text }}</p>
-
-                {%- for link in item.links -%}
-                <a href="{{ link.link }}" class="card-link btn rounded-0 btn-outline-dark">{{ link.name }}</a>
-                {%- endfor -%}
             </div>
         </div>
         {% endfor %}

main/style/dark.css

@@ -23,12 +23,12 @@ body {
     background-color: #343a40;
 }
 
-.blog-button:link,
+.title-button:link,
-.blog-button:visited {
+.title-button:visited {
     color: white !important;
 }
 
-.blog-button:hover,
+.title-button:hover,
-.blog-button:active {
+.title-button:active {
     color: rgb(182, 182, 182) !important;
 }

main/style/style.css

@@ -114,14 +114,14 @@ sup {
     display: none;
 }
 
-.blog-button:link,
+.title-button:link,
-.blog-button:visited {
+.title-button:visited {
     color: black;
     text-decoration: none;
 }
 
-.blog-button:hover,
+.title-button:hover,
-.blog-button:active {
+.title-button:active {
     color: rgb(73, 73, 73);
     text-decoration: none;
 }