first commit

resources/sass/components/email/_inbox.scss

@@ -0,0 +1,118 @@
+.email-aside-nav {
+  &.collapse {
+    display: block;
+    @media(max-width: 991px) {
+      display: none;
+    }
+    &.show {
+      @media(max-width: 991px) {
+        display: block;
+      }
+    }
+  }
+  .nav-item {
+    border-radius: .2rem;
+    .nav-link {
+      color: $body-color;
+      svg {
+        color: $text-muted;
+      }
+    }
+    &.active, &:hover {
+      background: rgba($primary, .1);
+      .nav-link {
+        &, svg {
+          color: $primary;
+        }
+      }
+    }
+  }
+}
+
+.email-list-item {
+  display: flex;
+  align-items: center;
+  border-bottom: 1px solid $border-color;
+  padding: 10px 20px;
+  cursor: pointer;
+  &:hover {
+    background: rgba($primary, .08);
+  }
+  &:last-child {
+    margin-bottom: 5px;
+  }
+  .email-list-actions {
+    width: 40px;
+    vertical-align: top;
+    display: table-cell;
+    .form-check {
+      margin-bottom: 0;
+    }
+    .favorite {
+      display: block;
+      padding-left: 1px;
+      line-height: 15px;
+      span {
+        svg {
+          width: 14px;
+          color: $text-muted;
+        }
+      }
+      &:hover span {
+        color: #8d8d8d;
+      }
+      &.active {
+        span {
+          svg {
+            color: $warning;
+          }
+        }
+      }
+    }
+  }
+  .email-list-detail {
+    width: calc(100% - 40px);
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    flex-grow: 1;
+    .content {
+      overflow: hidden;
+      .from {
+        display: block;
+        margin: 0 0 1px 0;
+        color: $body-color;
+      }
+      .msg {
+        width: 97%;
+        color: $secondary;
+        font-size: .8rem;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+    }
+    .date {
+      color: $body-color;
+      white-space: nowrap;
+      .icon {
+        svg {
+          width: 14px;
+          margin-right: 7px;
+          color: #3d405c;
+        }
+      }
+    }
+  }
+  &.email-list-item--unread {
+    background-color: rgba($primary, .09);
+    .content {
+      .from {
+        font-weight: 500;
+      }
+      .msg {
+        font-weight: 700;
+      }
+    }
+  }
+}