Implemented flexible card box sizes depending on card box amount

app/config.sample.yaml

@@ -1,11 +1,11 @@
 ---
 accounts:
-  name: Online Accounts
+  name: Online Presence
   description: Discover my online presence.
   icon:
       class: fa-solid fa-users
   children:
-  - name: Channels
+  - name: Publishing Channels
     description: Platforms where I share content.
     icon:
       class: fas fa-newspaper
@@ -29,14 +29,14 @@ accounts:
         identifier: kevinbirkenbach
         warning: I rarely use X/Twitter and recommend alternative platforms like Mastodon.
         alternatives:
-        - link: accounts.channels.microblogs.mastodon
+        - link: accounts.publishingchannels.microblogs.mastodon
       - name: Bluesky
         description: Follow me on Bluesky (coming soon).
         icon:
           class: fa-brands fa-bluesky
         info: Bluesky is coming soon.
         alternatives:
-        - link: accounts.channels.microblogs.mastodon
+        - link: accounts.publishingchannels.microblogs.mastodon
 
     - name: Pictures
       description: View my photography.
@@ -56,7 +56,7 @@ accounts:
         identifier: kevinveenbirkenbach
         warning: Platforms by Meta (e.g., Instagram, Facebook) may compromise your data privacy. Consider using decentralized alternatives.
         alternatives:
-        - link: accounts.channels.pictures.pixelfed
+        - link: accounts.publishingchannels.pictures.pixelfed
 
     - name: Videos
       description: Watch my video content.
@@ -75,7 +75,7 @@ accounts:
         url: https://s.veen.world/youtube
         warning: I no longer publish videos on YouTube. Please visit my Peertube channel instead.
         alternatives:
-        - link: accounts.channels.videos.peertube
+        - link: accounts.publishingchannels.videos.peertube
 
     - name: Blog
       description: Read my articles and stories.
@@ -99,17 +99,25 @@ accounts:
           class: fa-solid fa-code
         url: https://git.veen.world/kevinveenbirkenbach
 
-  - name: Social Media
+  - name: Social Networks
     description: Social and developer platforms.
     icon:
-      class: fa-brands fa-meta
+      class: fa fa-users
     children:
     - name: Facebook
+      warning: I recommend to don't use Facebook and connect instead with me via the Fediverse. Check out the listed alternatives.
       description: Visit my Facebook page.
       icon:
         class: fa-brands fa-facebook
       url: https://www.facebook.com/kevinveenbirkenbach
-
+      alternatives:
+      - link: accounts.socialnetworks.friendica
+    - name: Friendica
+      description: Visit my friendica profile
+      icon:
+        class: fas fa-network-wired
+      url: https://s.veen.world/friendica
+      identifier: "kevinveenbirkenbach@friendica.veen.world"
   - link: navigation.header.contact.messenger
 
   - name: Career Profiles
@@ -121,13 +129,27 @@ accounts:
       description: View my XING profile.
       icon:
         class: bi bi-building
-      url: https://www.xing.com/profile/Kevin_VeenBirkenbach
+      url: https://s.veen.world/xing
     - name: LinkedIn
       description: Connect with me on LinkedIn.
       icon:
         class: bi bi-linkedin
-      url: https://www.linkedin.com/in/kevinveenbirkenbach
+      url: https://s.veen.world/linkedin
-
+    - name: upwork.com
+      description: Check out my profile on upwork
+      icon:
+        class: fas fa-users
+      url: https://s.veen.world/upwork
+    - name: freelancermap.de
+      description: Check out my profile on freelancermap.de
+      icon:
+        class: fas fa-people-arrows
+      url: https://s.veen.world/freelancermap
+    - name: malt
+      description: Check out my profile on malt
+      icon:
+        class: fas fa-sun
+      url: https://s.veen.world/malt
   - name: Sports
     description: My sports activities and logs.
     icon:
@@ -168,6 +190,12 @@ accounts:
       class: fa-brands fa-discourse
     url: https://forum.veen.world/u/kevinveenbirkenbach
 
+  - name: Nextcloud
+    description: Share data with me via nextcloud
+    icon:
+      class: fa fa-cloud
+    url: https://s.veen.world/cloud
+
 cards:
 - icon: 
     source: https://cloud.veen.world/s/logo_agile_coach_512x512/download
@@ -236,59 +264,66 @@ cards:
     and embrace positive life changes.
   url: https://www.hypno.veen.world
   link_text: www.hypno.veen.world
-- icon: 
+#- icon: 
-    source: https://cloud.veen.world/s/logo_skydiver_512x512/download
+#    source: https://cloud.veen.world/s/logo_skydiver_512x512/download
-  title: Aerospace Consultant
+#  title: Aerospace Consultant
-  text: As an Aerospace Consultant with aviation credentials, including a Sport Pilot
+#  text: As an Aerospace Consultant with aviation credentials, including a Sport Pilot
-    License for Parachutes, and a Restricted Radiotelephony and Operator's Certificate
+#    License for Parachutes, and a Restricted Radiotelephony and Operator's Certificate
-    I deliver expert consulting services. Currently training for my Private Pilot
+#    I deliver expert consulting services. Currently training for my Private Pilot
-    License, I specialize in guiding clients through aviation regulations, safety
+#    License, I specialize in guiding clients through aviation regulations, safety
-    standards, and operational efficiency.
+#    standards, and operational efficiency.
-  url: 
+#  url: 
-  link_text: Website under construction
+#  link_text: Website under construction
-- icon: 
+#- icon: 
-    source: https://cloud.veen.world/s/logo_hunter_512x512/download
+#    source: https://cloud.veen.world/s/logo_hunter_512x512/download
-  title: Wildlife Expert
+#  title: Wildlife Expert
-  text: As a certified hunter and wildlife coach, I offer educational programs, nature
+#  text: As a certified hunter and wildlife coach, I offer educational programs, nature
-    walks, survival trainings, and photo expeditions, merging ecological knowledge
+#    walks, survival trainings, and photo expeditions, merging ecological knowledge
-    with nature respect. My goal is to foster sustainable conservation and enhance
+#    with nature respect. My goal is to foster sustainable conservation and enhance
-    appreciation for the natural world through responsible practices.
+#    appreciation for the natural world through responsible practices.
-  url: 
+#  url: 
-  link_text: Website under construction
+#  link_text: Website under construction
-- icon: 
+#- icon: 
-    source: https://cloud.veen.world/s/logo_diver_512x512/download
+#    source: https://cloud.veen.world/s/logo_diver_512x512/download
-  title: Master Diver
+#  title: Master Diver
-  text: As a certified master diver with trainings in various specialties, I offer
+#  text: As a certified master diver with trainings in various specialties, I offer
-    diving instruction, underwater photography, and guided dive tours. My experience
+#    diving instruction, underwater photography, and guided dive tours. My experience
-    ensures safe and enriching underwater adventures, highlighting marine conservation
+#    ensures safe and enriching underwater adventures, highlighting marine conservation
-    and the wonders of aquatic ecosystems.
+#    and the wonders of aquatic ecosystems.
-  url: 
+#  url: 
-  link_text: Website under construction
+#  link_text: Website under construction
-- icon: 
+#- icon: 
-    source: https://cloud.veen.world/s/logo_massage_therapist_512x512/download
+#    source: https://cloud.veen.world/s/logo_massage_therapist_512x512/download
-  title: Massage Therapist
+#  title: Massage Therapist
-  text: Certified in Tantra Massage, I offer unique full-body rituals to awaken senses
+#  text: Certified in Tantra Massage, I offer unique full-body rituals to awaken senses
-    and harmonize body and mind. My sessions, a blend of ancient Tantra and modern
+#    and harmonize body and mind. My sessions, a blend of ancient Tantra and modern
-    relaxation, focus on energy flow, personal growth, and spiritual awakening.
+#    relaxation, focus on energy flow, personal growth, and spiritual awakening.
-  url: 
+#  url: 
-  link_text: Website under construction
+#  link_text: Website under construction
-company:
+platform:
-  titel: Kevin Veen-Birkenbach
+  titel:    Kevin Veen-Birkenbach
   subtitel: Consulting and Coaching Solutions
   logo:
     source: https://cloud.veen.world/s/logo_face_512x512/download
   favicon:
     source: https://cloud.veen.world/s/veen_world_favicon/download
+company:
+  titel:    Kevin Veen-Birkenbach
+  subtitel: Consulting and Coaching Solutions
+  logo:
+    source: https://cloud.veen.world/s/logo_cymais_512x512/download
   address:
-    street: Afrikanische Straße 43
+      street:       Afrikanische Straße 43
-    postal_code: DE-13351
+      postal_code:  DE-13351
-    city: Berlin
+      city:         Berlin
-    country: Germany
+      country:      Germany
-  imprint_url: https://s.veen.world/imprint
+  imprint: https://veen.world/
+
 navigation:
   header:
     children:
-    - link: accounts.channels.children
+    - link: accounts.publishingchannels.children
+    - link: accounts.socialnetworks
     - name: Contact
       description: Get in touch
       icon:
@@ -429,6 +464,12 @@ navigation:
             class: bi bi-clipboard2-check-fill
           url: https://kanban.veen.world/
         
+        - name: Snipe IT
+          description: Manage my inventory
+          icon:
+            class: fas fa-box-open
+          url: https://inventory.veen.world/
+          
       - name: Communication
         icon:
           class: fa-solid fa-comments
@@ -450,16 +491,34 @@ navigation:
           icon:
             class: fa-solid fa-envelope
           url: https://mail.veen.world/
-      - name: Tools
+      - name: Administration
         icon:
-          class: fas fa-tools
+          class: fas fa-building
         children:
         - name: Matomo
           description: Analyze with Matomo
           icon:
             class: fa-solid fa-chart-simple
           url: https://matomo.veen.world/
-          
+        - name: phpMyAdmin
+          description: Administrate MySQL and MariaDB databases
+          icon:
+            class: fas fa-database
+          url: https://phpmyadmin.veen.world/
+        - name: Keycloak
+          description: Manage User via Keycloak
+          icon:
+            class: fas fa-user-shield
+          url: https://auth.veen.world/admin
+        - name: LDAP
+          description: Manage LDAP
+          icon:
+            class: fas fa-key
+          url: https://ldap.veen.world/
+      - name: Tools
+        icon:
+          class: fas fa-tools
+        children:
         - name: Baserow
           description: Organize with Baserow
           icon:
@@ -476,7 +535,6 @@ navigation:
           icon:
             class: fa-solid fa-cloud
           url: https://cloud.veen.world/
-          
     - name: About Me
       description: All information about me
       icon:
@@ -557,6 +615,31 @@ navigation:
           class: fa-solid fa-layer-group
         url: https://s.veen.world/skillmatrix
       - link: accounts 
+    - name: Support Me
+      description: "Discover all the ways you can support my work."
+      icon:
+        class: fa-solid fa-hands-helping
+      children:
+        - name: Buy me a Coffee
+          description: "Support my work with a coffee – every cup helps!"
+          icon:
+            class: fa-solid fa-mug-hot
+          url: https://s.veen.world/buymeacoffee
+        - name: Patreon
+          description: "Become a member and support me monthly with exclusive content."
+          icon:
+            class: fa-brands fa-patreon
+          url: https://s.veen.world/patreon
+        - name: PayPal
+          description: "Donate to my open source projects with a one-time or monthly PayPal contribution."
+          icon:
+            class: fa-brands fa-paypal
+          url: https://s.veen.world/paypaldonate
+        - name: GitHub Sponsors
+          description: "Directly support my projects through GitHub Sponsors."
+          icon:
+            class: fa-brands fa-github
+          url: https://s.veen.world/githubsponsors
     - name: Imprint
       description: Check out the imprint information
       icon:

app/templates/moduls/card.html.j2

@@ -1,4 +1,4 @@
-<div class="card-column col-lg-3 col-md-6 col-12">
+<div class="card-column {{ lg_class }} {{ md_class }} col-12">
     <div class="card h-100 d-flex flex-column">
         <div class="card-body d-flex flex-column">
             <div class="card-img-top">
@@ -12,7 +12,9 @@
             <h3 class="card-title">{{ card.title }}</h3>
             <p class="card-text">{{ card.text }}</p>
             {% if card.url %}
-                <a  href="{{ card.url }}" class="mt-auto btn btn-light stretched-link" ><i class="fa-solid fa-globe"></i> {{ card.link_text }}</a>
+                <a href="{{ card.url }}" class="mt-auto btn btn-light stretched-link">
+                    <i class="fa-solid fa-globe"></i> {{ card.link_text }}
+                </a>
             {% else %}
                 <i class="fa-solid fa-hourglass"></i> {{ card.link_text }}
             {% endif %}

app/templates/pages/index.html.j2

@@ -2,7 +2,53 @@
 
 {% block content %}
 <div class="row">
+    {% set num_cards = cards | length %}
+    {% set lg_classes = [] %}
+    
+    {# Compute `lg` column widths: Ensure at least 3 per row unless fewer than 3 exist #}
+    {% if num_cards < 3 %}
+        {% if num_cards == 2 %}
+            {% set lg_classes = ["col-lg-6", "col-lg-6"] %}
+        {% else %}
+            {% set lg_classes = ["col-lg-12"] %}
+        {% endif %}
+    {% elif num_cards % 4 == 0 %}
+        {% set lg_classes = ["col-lg-3"] * num_cards %}
+    {% elif num_cards % 3 == 0 %}
+        {% set lg_classes = ["col-lg-4"] * num_cards %}
+    {% elif num_cards % 2 == 0 %}
+        {% set lg_classes = ["col-lg-6"] * num_cards %}
+    {% else %}
+        {# Distribute for complex cases (e.g., 5, 7, 11) while ensuring at least 3 per row #}
+        {% for i in range(num_cards) %}
+            {% if num_cards % 4 == 3 %}
+                {% if i < 3 %}
+                    {% set _ = lg_classes.append("col-lg-4") %}
+                {% else %}
+                    {% set _ = lg_classes.append("col-lg-3") %}
+                {% endif %}
+            {% elif num_cards % 4 == 1 %}
+                {% if i < 2 %}
+                    {% set _ = lg_classes.append("col-lg-6") %}
+                {% elif i < 5 %}
+                    {% set _ = lg_classes.append("col-lg-4") %}
+                {% else %}
+                    {% set _ = lg_classes.append("col-lg-3") %}
+                {% endif %}
+            {% elif num_cards % 3 == 2 %}
+                {% if i < 2 %}
+                    {% set _ = lg_classes.append("col-lg-6") %}
+                {% else %}
+                    {% set _ = lg_classes.append("col-lg-4") %}
+                {% endif %}
+            {% endif %}
+        {% endfor %}
+    {% endif %}
+
     {% for card in cards %}
+        {% set index = loop.index0 %}  {# Index starts at 0 #}
+        {% set lg_class = lg_classes[index] %}
+        {% set md_class = "col-md-6" if num_cards % 2 == 0 or index < num_cards - 1 else "col-md-12" %}
         {% include "moduls/card.html.j2" %}
     {% endfor %}
 </div>