.eleventy.js

@@ -27,6 +27,7 @@ module.exports = function (eleventyConfig) {
         "src/img": "img",
         "src/font": "font",
         "src/favicon.*": "",
+        "node_modules/flag-icons/flags": "flags",
     });
 
     return {

package.json

@@ -35,6 +35,7 @@
     "uncss": "^0.17.3"
   },
   "dependencies": {
-    "bootstrap": "^5.2.3"
+    "bootstrap": "^5.2.3",
+    "flag-icons": "^6.6.6"
   }
 }

src/index.html

@@ -57,6 +57,10 @@ title: {{site.title}}
                         <li><a href="https://github.com/samuel-p"><i class="i-github i-2x i-fw"></i></a></li>
                         <li><a href="https://stackoverflow.com/users/9662601/samuel-philipp"><i class="i-stackoverflow i-2x i-fw"></i></a></li>
                     </ul>
+                    <ul class="social-icons">
+                        <li><a href="https://samuel-philipp.de"><span class="fi fi-de i-2x mx-2"></span></a></li>
+                        <li><a href="https://samuel-philipp.com"><span class="fi fi-us i-2x mx-2"></span></a></li>
+                    </ul>
                 </div>
             </div>
         </div>

src/scss/main.scss

@@ -2,6 +2,8 @@ $primary: #490e0a;
 @import "bootstrap/scss/bootstrap";
 $icomoon-font-path: "../font";
 @import "icons/style";
+$flag-icons-path: "../flags";
+@import "flag-icons/sass/flag-icons";
 
 body {
   color: #000;