header nav-unread

src/_includes/header.html

@@ -9,13 +9,9 @@
 				<div class="nav-item">
 					<a href="{{ site.github_url }}" class="btn btn-sm btn-outline-primary" target="_blank">Source code</a>
 				</div>
-				<a class="nav-link d-none d-md-flex icon">
-					<i class="fe fe-maximize"></i>
-				</a>
 				<div class="dropdown d-none d-md-flex">
 					<a class="nav-link icon" data-toggle="dropdown">
 						<i class="fe fe-message-square"></i>
-						<span class="badge badge-pill badge-danger">1</span>
 					</a>
 					<div class="dropdown-menu dropdown-menu-right">
 						Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
@@ -25,14 +21,14 @@
 				<div class="dropdown d-none d-md-flex">
 					<a class="nav-link icon" data-toggle="dropdown">
 						<i class="fe fe-bell"></i>
-						<span class="badge badge-pill badge-danger">10</span>
+						<span class="nav-unread"></span>
 					</a>
 					<div class="dropdown-menu dropdown-menu-right">
 						Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium architecto asperiores dolorem, est fugiat in maxime natus officia velit voluptas! Ab asperiores
 						delectus dolore dolores maxime nesciunt qui quia totam.
 					</div>
 				</div>
-				<div class="dropdown">
+				<div class="dropdown ml-3">
 					<a href="#" class="nav-link" data-toggle="dropdown">
 						<span class="avatar" style="background-image: url({{ site.base }}/{{ user.photo }})"></span>
 						<span class="ml-2 d-none d-lg-block">

src/assets/scss/dashboard/_header.scss

@@ -42,8 +42,14 @@
 	}
 }
 
-.bg-header {
-	background: $header-bg !important;
+.nav-unread {
+	position: absolute;
+	top: .25rem;
+	right: .25rem;
+	background: $red;
+	width: .5rem;
+	height: .5rem;
+	border-radius: 50%;
 }
 
 .navbar-brand {

src/assets/scss/dashboard/_nav.scss

@@ -46,7 +46,6 @@
 		}
 
 		&:hover {
-
 			.nav-submenu {
 				display: block;
 			}
@@ -88,4 +87,4 @@
 .nav-link {
 	display: block;
 	padding: 0.25rem 0.75rem;
-}
+}

src/maps.html

@@ -24,7 +24,7 @@ layout: default
 				<div class="col-6">
 					{% include cards/map-metro.html %}
 				</div>
-				<div class="col-6">2</div>
+				<div class="col-6"></div>
 			</div>
 		</div>
 	</div>