Update dark mode

resources/assets/sass/appdark.scss

@@ -19,18 +19,66 @@
     background: #ADAFAE !important;
 }
 
+.border-top {
+	border-top: 1px solid #282828 !important;
+}
+
+.border-bottom {
+	border-bottom: 1px solid #282828 !important;
+}
+
 .btn-outline-light {
 	border-color: #E2E8F0 !important;
 	color: #E2E8F0 !important;
 }
 
+.modal-content,
+.card,
+.dropdown-menu,
 .bg-white,
+.list-group-item,
+.autocomplete-result-list,
 .postPresenterContainer,
 .postComponent .card-body.flex-grow-0.py-1,
 .postComponent .reactions,
 .postComponent .status-comments,
 .navbar-laravel {
-	background: #2D3748 !important;
+	background: #000 !important;
+}
+
+.autocomplete-result-list {
+	z-index: 99999;
+}
+
+.pill-to {
+	background: #282828 !important;
+}
+
+.dropdown-item:hover, 
+.tt-suggestion:hover, 
+.dropdown-item:focus, 
+.tt-suggestion:focus,
+.chat-msg:hover,
+.result-card .media:hover {
+	background: #181818 !important;
+}
+
+.notification-card .contents {
+	scrollbar-color: dark;
+}
+
+body, html {
+	scrollbar-color: dark;
+}
+
+.modal-content,
+.form-control,
+.img-thumbnail {
+	border: 1px solid #282828 !important;
+}
+
+.navbar.border-bottom {
+	border-color: #282828 !important; 
 }
 
 .postComponent .border-left {
@@ -44,7 +92,7 @@
 input,
 textarea {
 	color: #E2E8F0 !important;
-	background: #4A5568 !important;
+	background: #000 !important;
 }
 
 .far, .fas,
@@ -55,15 +103,42 @@ textarea {
 	color: #ADAFAE !important;
 }
 
-.form-control.search-form-input {
-	color: #E2E8F0 !important;
-	background: #4A5568 !important;
-}
-
 .btn-outline-primary {
 	border-color: #4A5568 !important;
 }
 
+.postComponent .status-comments {
+	border-top: 1px solid #282828 !important;
+	border-bottom: 1px solid #282828 !important;
+}
+
+.messages-page .card-header {
+	border-bottom: 1px solid #282828;
+}
+
+hr {
+	border-color: #282828 !important;
+}
+
+::-webkit-scrollbar {
+  width: 15px;
+}
+
+::-webkit-scrollbar-track {
+  background: #202020;
+  border-left: 1px solid #2c2c2c;
+}
+
+::-webkit-scrollbar-thumb {
+  background: #3e3e3e;
+  border: solid 3px #202020;
+  border-radius: 7px;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background: white;
+}
+
 @import "components/filters";
 
 @import "components/typeahead";
@@ -74,6 +149,8 @@ textarea {
 
 @import "moment";
 
+@import '~animate.css/animate.min.css';
+
 .border {
-    border: 1px solid #4A5568 !important;
-}
+	border-color: #282828 !important;
+}

resources/assets/sass/dark.scss

@@ -1,4 +1,4 @@
-// Cyborg 4.2.1
+// Cyborg 4.5.3
 // Bootswatch
 
 //
@@ -9,24 +9,24 @@ $white:    #fff !default;
 $gray-100: #f8f9fa !default;
 $gray-200: #e9ecef !default;
 $gray-300: #dee2e6 !default;
-$gray-400: #ADAFAE !default;
+$gray-400: #adafae !default;
 $gray-500: #888 !default;
 $gray-600: #555 !default;
-$gray-700: #2D3748 !default;
+$gray-700: #282828 !default;
 $gray-800: #222 !default;
 $gray-900: #212529 !default;
 $black:    #000 !default;
 
-$blue:    #2A9FD6 !default;
+$blue:    #2a9fd6 !default;
 $indigo:  #6610f2 !default;
 $purple:  #6f42c1 !default;
 $pink:    #e83e8c !default;
-$red:     #CC0000 !default;
+$red:     #c00 !default;
 $orange:  #fd7e14 !default;
-$yellow:  #FF8800 !default;
-$green:   #77B300 !default;
+$yellow:  #f80 !default;
+$green:   #77b300 !default;
 $teal:    #20c997 !default;
-$cyan:    #9933CC !default;
+$cyan:    #93c !default;
 
 $primary:       $blue !default;
 $secondary:     $gray-600 !default;
@@ -42,27 +42,28 @@ $yiq-contrasted-threshold:  175 !default;
 
 // Body
 
-$body-bg:       #1A202C !default;
-$body-color:    $gray-500 !default;
+$body-bg:       #060606 !default;
+$body-color:    $gray-400 !default;
 
 // Fonts
 
 $font-family-sans-serif:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
 $font-size-base: 0.9rem;
+$font-weight-lighter: 300;
+$line-height-base: 1.6;
 
-
-$headings-color:         $white !default;
+$font-size-lg: ($font-size-base * 1.25);
+$font-size-sm: ($font-size-base * .875);
+$headings-color:          $white !default;
 
 // Tables
 
-$table-accent-bg:               rgba($white,.05) !default;
-$table-hover-bg:                rgba($white,.075) !default;
-
+$table-color:                   $white !default;
+$table-accent-bg:               rgba($white, .05) !default;
+$table-hover-bg:                rgba($white, .075) !default;
 $table-border-color:            $gray-700 !default;
-
-$table-dark-bg:               $gray-500 !default;
-$table-dark-border-color:     darken($gray-500, 7.5%) !default;
-$table-dark-color:            $body-bg !default;
+$table-dark-bg:                 $gray-500 !default;
+$table-dark-border-color:       darken($gray-500, 7.5%) !default;
 
 // Buttons
 
@@ -70,13 +71,11 @@ $input-btn-padding-x:       1rem !default;
 
 // Forms
 
-$input-disabled-bg:              $gray-400 !default;
-
-$input-border-color:             transparent !default;
-
+$input-disabled-bg:                 $gray-400 !default;
+$input-border-color:                $white !default;
 $input-group-addon-color:           $white !default;
 $input-group-addon-bg:              $gray-700 !default;
-
+$input-group-addon-border-color:    transparent !default;
 $custom-file-color:                 $white !default;
 $custom-file-border-color:          $gray-700 !default;
 
@@ -84,7 +83,6 @@ $custom-file-border-color:          $gray-700 !default;
 
 $dropdown-bg:                    $gray-700 !default;
 $dropdown-divider-bg:            $gray-800 !default;
-
 $dropdown-link-color:            $white !default;
 $dropdown-link-hover-color:      $white !default;
 $dropdown-link-hover-bg:         $primary !default;
@@ -106,62 +104,65 @@ $navbar-dark-hover-color:           $white !default;
 $pagination-color:                     $white !default;
 $pagination-bg:                        $gray-700 !default;
 $pagination-border-color:              transparent !default;
-
 $pagination-hover-color:               $white !default;
 $pagination-hover-bg:                  $primary !default;
 $pagination-hover-border-color:        $pagination-border-color !default;
-
 $pagination-disabled-bg:               $pagination-bg !default;
 $pagination-disabled-border-color:     $pagination-border-color !default;
 
 
 // Jumbotron
 
-$jumbotron-bg:                   $gray-700 !default;
+$jumbotron-bg:                      $gray-700 !default;
 
 // Cards
 
-$card-bg:                  $gray-700 !default;
+$card-bg:                           $gray-700 !default;
 
 // Tooltips
 
-$tooltip-bg:                  $gray-700 !default;
-$tooltip-opacity:             1 !default;
+$tooltip-bg:                        $gray-700 !default;
+$tooltip-opacity:                   1 !default;
 
 // Popovers
 
-$popover-bg:                          $gray-700 !default;
+$popover-bg:                        $gray-700 !default;
 
-// Modals
+// Toasts
 
-$modal-content-bg:               $gray-800 !default;
+$toast-color:                       $white !default;
+$toast-background-color:            $gray-800 !default;
+$toast-border-color:                $gray-700 !default;
+$toast-header-color:                $body-color !default;
+$toast-header-background-color:     $toast-background-color !default;
+$toast-header-border-color:         $toast-border-color !default;
+
+// Modals
 
-$modal-header-border-color:   $gray-700 !default;
+$modal-content-bg:                  $gray-800 !default;
+$modal-header-border-color:         $gray-700 !default;
 
 // Progress bars
 
-$progress-bg:                   $gray-700 !default;
+$progress-bg:                       $gray-700 !default;
 
 // List group
 
-$list-group-bg:                  $gray-800 !default;
-$list-group-border-color:        $gray-700 !default;
-
-$list-group-hover-bg:                 $primary !default;
-
-$list-group-disabled-bg:         $gray-700 !default;
-
-$list-group-action-active-bg:         $primary !default;
+$list-group-bg:                     $gray-800 !default;
+$list-group-border-color:           $gray-700 !default;
+$list-group-hover-bg:               $primary !default;
+$list-group-disabled-bg:            $gray-700 !default;
+$list-group-action-active-bg:       $primary !default;
 
 // Breadcrumbs
 
-$breadcrumb-bg:                 $gray-700 !default;
+$breadcrumb-bg:                     $gray-700 !default;
 
 // Close
 
-$close-color:                 $white !default;
-$close-text-shadow:           none !default;
+$close-color:                       $white !default;
+$close-text-shadow:                 none !default;
 
 // Code
 
-$pre-color:                         inherit !default;
+$pre-color:                         inherit !default;