Add custom logo

assets/scss/_typography.scss

@@ -6,6 +6,12 @@
     transition: all 0.3s ease;
 }
 
+.logo {
+    font-family: $logo-font-family;
+    font-weight: 900;
+    color: #282f49;
+}
+
 a.text-light,
 a.text-dark {
     // transition: all 0.3s ease;

assets/scss/_variables.scss

@@ -14,9 +14,10 @@ $body-color: #7e7e8a;
 //
 
 // Fonts
-@import url("https://fonts.googleapis.com/css?family=Poppins:400,500,600,700,800,900|Yeseva+One&display=swap");
+@import url("https://fonts.googleapis.com/css?family=Poppins:400,500,600,700,800,900|Yeseva+One|Varela+Round&display=swap");
 $font-family-base: "Poppins", sans-serif;
 $headings-font-family: "Yeseva One", cursive;
+$logo-font-family: "Varela Round", sans-serif;
 
 // Size
 $font-size-base: 1.125rem; // 18px

layouts/partials/navbar.html

@@ -1,7 +1,7 @@
 <nav class="navbar navbar-expand-lg fixed-top">
   <div class="container">
     <a href="{{ .Site.BaseURL }}" class="navbar-brand">
-      <img src="{{ .Site.Params.logo | absURL }}" alt="site-logo">
+      <div class="logo">Jonas Franz</div>
     </a>
     <button type="button" class="navbar-toggler collapsed" data-toggle="collapse" data-target="#navbarCollapse">
       <span class="navbar-toggler-icon"></span>