Marks the active element in the navbar with a colored border.

1 files changed, 28 insertions, 5 deletions

diff --git a/sass/theme/_theme.scss b/sass/theme/_theme.scss
index 0522f15..d7d1217 100644
--- a/sass/theme/_theme.scss
+++ b/sass/theme/_theme.scss
@@ -99,11 +99,6 @@ h1 > a,h2 > a,h3 > a,h4 > a,h5 > a,h6 > a {
 	}
 }
 
-//li.active > .dropdown-toggle {
-#main-menu > li.active {
-	text-decoration: underline !important;
-}
-
 img.size-medium, img.attachment-medium{
 	max-width: 45%;
 	width: auto;
@@ -333,3 +328,31 @@ span.rpwwt-post-title:hover{
 	margin-left: 5px;
 	margin-right: 5px;
 }
+/**
+ * ## Bottom Border Color in Navbar
+ */
+@media (min-width: 993px) {
+	.navbar-nav > li {  
+	  position: relative;
+	}
+	.navbar-nav .active a:not(.dropdown-item)::before{
+	  border-bottom: 5px solid theme-color(primary);
+	  bottom: -10px;
+	  content: " ";
+	  left: 0;
+	  position: absolute;
+	  right: 0;
+	}
+}
+@media (max-width: 992px) {
+	#main-menu > li.active {
+		text-decoration: underline !important;
+		/*
+		text-decoration-color: theme-color(primary);
+		text-decoration: none !important;
+		border-bottom: 2px solid theme-color(primary);
+		*/
+	}
+}
+
+//li.active > .dropdown-toggle {