add more socialsHEADmain

4 files changed, 42 insertions, 8 deletions

diff --git a/src/assets/img/social/Git-Icon-1788C.png b/src/assets/img/social/Git-Icon-1788C.png
index 51f4ae5..45ba239 100644
--- a/src/assets/img/social/Git-Icon-1788C.png
+++ b/src/assets/img/social/Git-Icon-1788C.png
diff --git a/src/assets/img/social/Steam_Logo.png b/src/assets/img/social/Steam_Logo.png
new file mode 100644
index 0000000..cd24395
--- /dev/null
+++ b/src/assets/img/social/Steam_Logo.png
diff --git a/src/assets/img/social/itchio-textless.png b/src/assets/img/social/itchio-textless.png
new file mode 100644
index 0000000..1426d73
--- /dev/null
+++ b/src/assets/img/social/itchio-textless.png
diff --git a/src/pages/index.php b/src/pages/index.php
index 7733bf2..0fe3862 100644
--- a/src/pages/index.php
+++ b/src/pages/index.php
@@ -75,6 +75,16 @@ $media = [
     'icon' => '/assets/img/social/Git-Icon-1788C.png',
   ],
   [
+    'link' => 'https://dweipert.itch.io',
+    'title' => 'itch.io',
+    'icon' => '/assets/img/social/itchio-textless.png',
+  ],
+  [
+    'link' => 'https://steamcommunity.com/id/dweipert',
+    'title' => 'Steam',
+    'icon' => '/assets/img/social/Steam_Logo.png',
+  ],
+  [
     'link' => 'https://blog.dweipert.de',
     'title' => 'Blog',
     'icon' => '/assets/img/dweipert-x92.png',
@@ -122,13 +132,25 @@ ob_start();
   vertical-align: -6px;
 }
 
-.social__list li > a {
-  display: flex;
-  align-items: center;
-}
-.social__list li > a > img {
-  max-height: 1.5em;
-  max-width: 1.5em;
+.social__list {
+  &:nth-of-type(1) {
+    text-align: center;
+    margin-bottom: 0.75rem;
+  }
+
+  &:nth-of-type(2) {
+    columns: 2 auto;
+  }
+
+  li > a {
+    display: flex;
+    align-items: center;
+
+    > img {
+      max-height: 1.5em;
+      max-width: 1.5em;
+    }
+  }
 }
 </style>
 <?php
@@ -155,7 +177,19 @@ ob_start();
   <div class="social">
     <h2><?php echo $t('social'); ?></h2>
     <ul class="social__list">
-      <?php foreach ($media as $idx => $m): ?>
+      <?php foreach (array_slice($media, 0, 1) as $idx => $m): ?>
+      <li>
+        <a href="<?php echo $m['link']; ?>" target="_blank">
+          <?php if (! empty($m['icon'])): ?>
+            <img src="<?php echo $m['icon']; ?>" alt="<?php echo $m['title']; ?>">&nbsp;
+          <?php endif; ?>
+          <?php echo $m['title']; ?>
+        </a>
+      </li>
+      <?php endforeach; ?>
+    </ul>
+    <ul class="social__list">
+      <?php foreach (array_slice($media, 1) as $idx => $m): ?>
       <li>
         <a href="<?php echo $m['link']; ?>" target="_blank">
           <?php if (! empty($m['icon'])): ?>