Recherche des tweets de réponse avec l'API Tweeter

resources/sass/dashmix/_nav.scss

@@ -0,0 +1,132 @@
+//
+// Nav
+// --------------------------------------------------
+
+// Nav Pills
+.nav-pills {
+  .nav-link {
+    &:hover,
+    &:focus {
+      background-color: $light;
+    }
+  }
+
+  .nav-link.active,
+  .show > .nav-link {
+    color: $nav-pills-link-active-color;
+    background-color: $nav-pills-link-active-bg;
+  }
+}
+
+// Tabs block variation
+.nav-tabs-block {
+  background-color: $body-bg-light;
+  border-bottom: none;
+
+  .nav-link {
+    padding-top: .75rem;
+    padding-bottom: .75rem;
+    border-color: transparent;
+    border-radius: 0;
+    margin-bottom: 0;
+
+    &:hover,
+    &:focus {
+      color: $primary;
+      background-color: $light;
+      border-color: transparent;
+    }
+  }
+
+  .nav-link.active,
+  .nav-item.show .nav-link {
+    color: $body-color;
+    background-color: $white;
+    border-color: transparent;
+  }
+}
+
+// Tabs block alternative variation
+.nav-tabs-alt {
+  background-color: transparent;
+  border-bottom-color: $body-bg-dark;
+
+  .nav-item {
+    margin-bottom: -2px;
+  }
+
+  .nav-link {
+    padding-top: .75rem;
+    padding-bottom: .75rem;
+    background-color: transparent;
+    border-color: transparent;
+
+    &:hover,
+    &:focus {
+      color: $primary;
+      background-color: transparent;
+      border-color: transparent;
+      box-shadow: inset 0 -3px $primary;
+    }
+  }
+
+  .nav-link.active,
+  .nav-item.show .nav-link {
+    color: $body-color;
+    background-color: transparent;
+    border-color: transparent;
+    box-shadow: inset 0 -3px $primary;
+  }
+}
+
+// Various Items Navigation
+.nav-items {
+  @include list-unstyled;
+
+  a {
+    &:hover {
+      background-color: $body-bg-light;
+    }
+
+    &:active {
+      background-color: $light;
+    }
+  }
+
+  > li:not(:last-child) > a {
+    border-bottom: 1px solid $light;
+  }
+}
+
+// Sidebar Mini Nav
+.mini-nav-item {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: $sidebar-mini-nav-width;
+  height: $sidebar-mini-nav-width;
+  color: darken($body-bg-dark, 15%);
+  font-size: 1rem;
+
+  i {
+    transition: transform 0.2s ease-out;
+  }
+
+  &.active {
+    background-color: lighten($sidebar-dark-bg, 6%);
+    color: $white;
+  }
+
+  &:hover {
+    color: $white;
+    background-color: lighten($sidebar-dark-bg, 6%);
+  }
+
+  &:active {
+    color: darken($body-bg-dark, 15%);
+
+    i {
+      transform: scale(0.9);
+    }
+  }
+}