animation for active nav link

demo/navbar.css

+.navbar {
+  background-color: rgba(130, 130, 130, 0.153) !important;
+}
+
 .nav-link {
   font-size: 18px;
 }
@@ -14,4 +18,25 @@
 
 .icons img:hover {
   transform: scale(1.03);
+}
+
+.nav-link.active {
+  border-bottom: 1px solid rgba(0, 0, 0, 0.179);
+  transition: border-bottom-width 0.1s ease-in-out, border-color 0.1s ease-in-out;
+}
+
+.nav-link.active {
+  border-bottom: 1px solid rgba(0, 0, 0, 0.179);
+  animation: slide-in 0.3s ease-in-out forwards;
+}
+
+@keyframes slide-in {
+  from {
+    width: 0;
+    border-bottom-width: 0;
+  }
+  to {
+    width: 100%;
+    border-bottom-width: 1px;
+  }
 }/*# sourceMappingURL=navbar.css.map */
\ No newline at end of file

demo/navbar.css.map

-{"version":3,"sources":["navbar.scss","navbar.css"],"names":[],"mappings":"AAAA;EACI,eAAA;ACCJ;;ADEA;EACI,mBAAA;ACCJ;ADAI;EACI,sBAAA;ACER;ADAI;EACI,oBAAA;ACER;;ADAC;EACG,sBAAA;ACGJ","file":"navbar.css"}
+{"version":3,"sources":["navbar.scss","navbar.css"],"names":[],"mappings":"AAAA;EACI,uDAAA;ACCJ;;ADEA;EACI,eAAA;ACCJ;;ADEA;EACI,mBAAA;ACCJ;ADAI;EACI,sBAAA;ACER;ADAI;EACI,oBAAA;ACER;;ADAC;EACG,sBAAA;ACGJ;;ADAA;EACI,6CAAA;EACA,+EAAA;ACGJ;;ADAA;EACI,6CAAA;EACA,6CAAA;ACGJ;;ADDI;EACA;IACA,QAAA;IACA,sBAAA;ECIF;EDFE;IACA,WAAA;IACA,wBAAA;ECIF;AACF","file":"navbar.css"}
\ No newline at end of file

demo/navbar.scss

+.navbar{
+    background-color: rgba(130, 130, 130, 0.153) !important;
+}
+
 .nav-link{
     font-size: 18px;
 }
@@ -12,4 +16,24 @@
     }
 }.icons img:hover{
     transform: scale(1.03);
-}
+}
\ No newline at end of file
+
+.nav-link.active{
+    border-bottom: 1px solid rgba(0, 0, 0, 0.179);
+    transition: border-bottom-width 0.1s ease-in-out, border-color 0.1s ease-in-out;
+}
+
+.nav-link.active{
+    border-bottom: 1px solid rgba(0, 0, 0, 0.179);
+    animation: slide-in 0.3s ease-in-out forwards;
+    }
+    @keyframes slide-in {
+    from {
+    width: 0;
+    border-bottom-width: 0;
+    }
+    to {
+    width: 100%;
+    border-bottom-width: 1px;
+    }
+    }
\ No newline at end of file