Active element in the top menu is marked

static/js/extra.js

@@ -0,0 +1,9 @@
+$(document).ready(function () {
+        var url = window.location;
+        $('.navbar-top').find('.active').removeClass('active');
+        $('.navbar-top li a').each(function () {
+            if (this.href == url) {
+                $(this).parent().addClass('active');
+            }
+        });
+   });

templates/default-layout-wrapper.hamlet

@@ -23,6 +23,7 @@ $newline never
     <script type="text/javascript" src="/static/js/dataTables.buttons.min.js">
     <script type="text/javascript" src="/static/js/buttons.html5.min.js">
     <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js">
+    <script type="text/javascript" src="/static/js/extra.js">
 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"
           integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

templates/default-layout.hamlet

@@ -16,7 +16,7 @@
                    $if location /= ""
                       \@#{location}
         $maybe user <- maybeUser
-          <ul class="nav navbar-nav navbar-collapse collapse">
+          <ul class="nav navbar-nav navbar-top navbar-collapse collapse">
                 <li class="dropdown">
                    <a id="about" href="#" class="dropdown-toggle" data-toggle="dropdown">_{MsgAbout}<span class="caret"></span>
                    <ul class="dropdown-menu">