navbar fixes

pages/_includes/parts/navbar.html

@@ -7,7 +7,6 @@
       {% include ui/icon.html icon="menu" %}
    </a>
 
-
    <a href="{{ site.base }}" class="navbar-brand text-inherit">
       {% if include.icon %}<span class="text-green">{% include ui/icon.html icon=include.icon %}</span>{% endif %}
       {% if include.stamp %}<span class="stamp bg-primary text-white">UI</span>{% endif %}
@@ -22,7 +21,7 @@
    <div class="w-auto flex-fill max-w-md ml-0 ml-md-8 mr-auto d-none d-lg-block">
       <div class="input-icon">
          <span class="input-icon-addon">{% include ui/icon.html icon="search" %}</span>
-         <input type="text" class="form-control" placeholder="Search">
+         <input type="text" class="form-control" placeholder="Search" tabindex="-1">
       </div>
    </div>
    {% endif %}

pages/_layouts/default.html

@@ -2,15 +2,16 @@
 layout: base
 ---
 
-<div class="d-flex h-auto min-h-screen">
+<div class="d-flex h-auto min-h-screen flex-wrap">
 
    {% if page.nav-position == "left" or page.nav-position == "right" or page.nav-position == "all"  %}
    {% include layout/sidenav.html %}
    {% endif %}
 
-   <div class="main-content flex-fill d-flex flex-column mw-100">
    {% include layout/topnav.html %}
 
+   <div class="main-content flex-fill d-flex flex-column mw-100">
+
       <div class="d-flex flex-fill">
 
          <div class="flex-fill px-lg-2 mw-100{% if page.blank %} d-flex align-items-center{% endif %}">

pages/index.html

@@ -5,7 +5,7 @@ menu: level-1.level-2.level-3.level-4
 ---
 
 <div class="row row-cards">
-   <div class="col-sm-6 col-md-4 col-lg-3">
+   <div class="col-sm-6 col-lg-3">
       <div class="card">
          <div class="card-body">
             <div class="d-flex">
@@ -25,7 +25,7 @@ menu: level-1.level-2.level-3.level-4
          </div>
       </div>
    </div>
-   <div class="col-sm-6 col-md-4 col-lg-3">
+   <div class="col-sm-6 col-lg-3">
       <div class="card">
          <div class="card-body">
             <div class="d-flex">
@@ -45,7 +45,7 @@ menu: level-1.level-2.level-3.level-4
          {% include js/charts.html id="card-chart-1" chart-id="revenue-bg" %}
       </div>
    </div>
-   <div class="col-sm-6 col-md-4 col-lg-3">
+   <div class="col-sm-6 col-lg-3">
       <div class="card">
          <div class="card-body">
             <div class="d-flex">
@@ -67,7 +67,7 @@ menu: level-1.level-2.level-3.level-4
       </div>
    </div>
 
-   <div class="col-sm-6 col-md-4 col-lg-3">
+   <div class="col-sm-6 col-lg-3">
       <div class="card">
          <div class="card-body">
             <div class="d-flex">
@@ -89,22 +89,22 @@ menu: level-1.level-2.level-3.level-4
       </div>
    </div>
 
-   <div class="col-6 col-sm-4 col-xl-2">
+   <div class="col-6 col-sm-4 col-lg-2">
       {% include cards/small-stats-3.html number=43 title="New Tickets" percentage=6 %}
    </div>
-   <div class="col-6 col-sm-4 col-xl-2">
+   <div class="col-6 col-sm-4 col-lg-2">
       {% include cards/small-stats-3.html number=17 title="Closed Today" percentage=-3 %}
    </div>
-   <div class="col-6 col-sm-4 col-xl-2">
+   <div class="col-6 col-sm-4 col-lg-2">
       {% include cards/small-stats-3.html number=7 title="New Replies" percentage=9 %}
    </div>
-   <div class="col-6 col-sm-4 col-xl-2">
+   <div class="col-6 col-sm-4 col-lg-2">
       {% include cards/small-stats-3.html number="27.3K" title="Followers" percentage=3 %}
    </div>
-   <div class="col-6 col-sm-4 col-xl-2">
+   <div class="col-6 col-sm-4 col-lg-2">
       {% include cards/small-stats-3.html number="$95" title="Daily Earnings" percentage=-2 %}
    </div>
-   <div class="col-6 col-sm-4 col-xl-2">
+   <div class="col-6 col-sm-4 col-lg-2">
       {% include cards/small-stats-3.html number=621 title="Products" percentage=-1 %}
    </div>
 

scss/layout/_navbar.scss

 .navbar {
   background: #fff;
   border-bottom: 1px solid $border-color;
-}
-
-.navbar {
   display: flex;
   min-height: 3.75rem;
   padding: .75rem 1rem;
+  width: 100%;
 
   .nav-link {
     color: inherit;