Merge pull request #10 from welpo/fix/relative-paths

🐛 fix: allow for relative paths everywhere

config.toml

@@ -26,9 +26,9 @@ headerImage = ""
 
 # The icon is display besides the menu text but is not necessary. It needs to be placed under "menu_icon" in the static "folder"
 menu = [
-    { name = "home", url = "/", weight = 1},
-    { name = "tags", url = "/tags", weight = 1 },
-    { name = "projects", url = "/projects", weight = 1 },
+    { name = "home", url = "$BASE_URL/", weight = 1},
+    { name = "tags", url = "$BASE_URL/tags", weight = 1 },
+    { name = "projects", url = "$BASE_URL/projects", weight = 1 },
 ]
 #The icons available can be found in "social_icons" in the "static" folder
 socials = [

sass/main.scss

@@ -1,6 +1,6 @@
 @font-face {
   font-family: 'Inter';
-  src: url('/fonts/Inter.ttf');
+  src: url('fonts/Inter.ttf');
 }
 @import 'parts/_cards.scss';
 @import 'parts/_code.scss';

templates/partials/footer.html

@@ -4,7 +4,7 @@
         {%- if config.extra.socials %}
         {% for social in config.extra.socials %}
         <a rel="noopener noreferrer" target="_blank" class="nav-links social" href="{{ social.url }}">
-            <img alt={{ social.name }} title={{ social.name }} src="/social_icons/{{ social.icon }}.svg">
+            <img alt={{ social.name }} title={{ social.name }} src="{{config.base_url}}/social_icons/{{ social.icon }}.svg">
         </a>
         {% endfor %}
         {% endif %}

templates/partials/nav.html

@@ -8,14 +8,14 @@
 		<div class="nav-navs">
 			<div>
 				{% for menu in config.extra.menu %}
-				<a class="nav-links" href={{ menu.url }}>{{ menu.name }}</a>
+				<a class="nav-links" href={{ menu.url | safe | replace(from="$BASE_URL", to=config.base_url) }}>{{ menu.name }}</a>
 				{% endfor %}
 			</div>
 			<label class="theme-switcher" for="themeswitch">
 				<input type="checkbox" id="themeswitch">
 				<div class="switch">
-					<img alt="set dark theme" class="moon" src="/menu_icon/moon.png">
-					<img alt="set light theme" class="sun" src="/menu_icon/sun.png">
+					<img alt="set dark theme" class="moon" src="{{ config.base_url }}/menu_icon/moon.png">
+					<img alt="set light theme" class="sun" src="{{config.base_url}}/menu_icon/sun.png">
 				</div>
 			</label>
 		</div>