From: Michael Tremer <michael.tremer@ipfire.org>
Date: Sun, 15 Jul 2018 12:59:25 +0000 (+0100)
Subject: Make links active
X-Git-Url: http://git.ipfire.org/?a=commitdiff_plain;h=dce6f9057a9e1a95d240023d48942d51eb1b1b2f;p=ipfire.org.git

Make links active

Signed-off-by: Michael Tremer <michael.tremer@ipfire.org>
---

diff --git a/src/scss/style.scss b/src/scss/style.scss
index 3d482c6e..07d4fb2f 100644
--- a/src/scss/style.scss
+++ b/src/scss/style.scss
@@ -97,6 +97,16 @@ h6 {
 
 		transition: background-color 200ms linear;
 	}
+
+	.navbar-nav {
+		.nav-link {
+			color: $blue-grey-900;
+
+			&.active {
+				border-bottom: 2px solid $link-color;
+			}
+		}
+	}
 }
 
 footer {
diff --git a/src/templates/modules/menu.html b/src/templates/modules/menu.html
index dd08bf83..582fbaec 100644
--- a/src/templates/modules/menu.html
+++ b/src/templates/modules/menu.html
@@ -1,22 +1,22 @@
 <ul class="navbar-nav ml-auto">
 	{% if hostname in ("www.ipfire.org", "dev.ipfire.org") %}
 		<li class="nav-item d-sm-block d-md-block d-lg-none">
-			<a class="nav-link" href="/">{{ _("Home") }}</a>
+			<a class="nav-link {% if request.path == "/" %}active{% end %}" href="/">{{ _("Home") }}</a>
 		</li>
 		<li class="nav-item">
-			<a class="nav-link about" href="/features">{{ _("Features") }}</a>
+			<a class="nav-link {% if request.path == "/features" %}active{% end %}" href="/features">{{ _("Features") }}</a>
 		</li>
 
 		<li class="nav-item">
-			<a class="nav-link download" href="/download">{{ _("Download") }}</a>
+			<a class="nav-link {% if request.path.startswith("/download") %}active{% end %}" href="/download">{{ _("Download") }}</a>
 		</li>
 
 		<li class="nav-item">
-			<a class="nav-link support" href="/get-support">{{ _("Support") }}</a>
+			<a class="nav-link {% if request.path == "/get-support" %}active{% end %}" href="/get-support">{{ _("Support") }}</a>
 		</li>
 
 		<li class="nav-item">
-			<a class="nav-link community" href="/get-involved">{{ _("Community") }}</a>
+			<a class="nav-link {% if request.path == "/get-involved" %}active{% end %}" href="/get-involved">{{ _("Community") }}</a>
 		</li>
 		
 	{% elif hostname == "admin.ipfire.org" %}