update core styles

Author: shoudaos

src/app/layout/navbar/navbar.template.html

@@ -149,16 +149,16 @@
             <div>Sidebar on the</div>
             <div id="sidebar-toggle" class="btn-group">
               <!--nRight = sidebar == 'right'-->
-              <button type="button" btnRadio="Left"  [(ngModel)]="radioModel" (click)="sidebarPosition('Left')"  class="btn btn-sm btn-default">Left</button>
-              <button type="button" btnRadio="Right" [(ngModel)]="radioModel" (click)="sidebarPosition('Right')"  class="btn btn-sm btn-default">Right</button>
+              <button type="button" btnRadio="Left"  [(ngModel)]="radioModel" (click)="sidebarPosition('Left')"  class="btn btn-dark">Left</button>
+              <button type="button" btnRadio="Right" [(ngModel)]="radioModel" (click)="sidebarPosition('Right')"  class="btn btn-dark">Right</button>
             </div>
           </div>
           <div class="setting clearfix">
             <div>Sidebar</div>
             <div id="display-sidebar-toggle" class="btn-group" data-toggle="buttons-radio">
               <!--display = displaySidebar-->
-              <button type="button" btnRadio="Left"  [(ngModel)]="display" (click)="sidebarDisplay('Show')" class="btn btn-sm btn-default">Show</button>
-              <button type="button" btnRadio="Right" [(ngModel)]="display" (click)="sidebarDisplay('Hide')" class="btn btn-sm btn-default">Hide</button>
+              <button type="button" btnRadio="Left"  [(ngModel)]="display" (click)="sidebarDisplay('Show')" class="btn btn-dark">Show</button>
+              <button type="button" btnRadio="Right" [(ngModel)]="display" (click)="sidebarDisplay('Hide')" class="btn btn-dark">Hide</button>
             </div>
           </div>
         </div>

src/app/styles/_base.scss

@@ -295,7 +295,7 @@
 .sidebar-on-right{
   .sidebar{
     right: 0;
-    margin: $sidebar-mt 25px 0 0;
+    margin-right: 25px;
   }
 
   .wrap{
@@ -849,13 +849,12 @@
 /**********************************/
 
 .messages{
-  background: $header-dropdown-bg;
   @include box-shadow($header-dropdown-shadow);
   border-radius: $border-radius-base !important;
   color: $header-dropdown-primary-color;
 }
 
-.navbar .nav > li > .messages{
+.messages{
   &:before{
     border-bottom: none;
   }
@@ -910,7 +909,6 @@
 /**********************************/
 
 .support{
-  background: $header-dropdown-bg;
   @include box-shadow($header-dropdown-shadow);
   border-radius: $border-radius-base !important;
   color: $header-dropdown-primary-color;
@@ -963,10 +961,8 @@
 /**********************************/
 
 .navbar-nav.nav > li > .settings{
-  background: $header-dropdown-bg;
   border-radius: $border-radius-base !important;
   color: $header-dropdown-primary-color;
-  width: 122px;
   font-size: $font-size-sm;
   text-align: center;
   min-width: auto;
@@ -1008,7 +1004,6 @@
 
 .account{
   width: 180px;
-  background: $header-dropdown-bg;
   @include box-shadow($header-dropdown-shadow);
   border-radius: $border-radius-base !important;
   color: $header-dropdown-primary-color;
@@ -1047,6 +1042,19 @@
   padding: 7px 10px;
 }
 
+.dropdown .dropdown-menu.show {
+  &.messages,
+  &.support,
+  &.settings,
+  &.account {
+    background-color: rgba(51, 51, 51, .85);
+
+    &:after {
+      visibility: hidden;
+    }
+  }
+}
+
 /***********************************/
 /**          BUTTONS              **/
 /**********************************/

src/app/styles/_override-bootstrap.scss

@@ -340,7 +340,6 @@ legend {
 }
 
 .dropdown-menu{
-  background-color: $black;
   border-radius: $border-radius-lg;
 
   & > li > a {

src/app/styles/_variables.scss

@@ -57,7 +57,7 @@ $theme-colors: (
   'warning': $yellow,
   'danger': $red,
   'light': $gray-200,
-  'dark': $gray-800,
+  'dark': $gray-700,
   'inverse': $white-dark,
   'gray': $gray-300,
   'default': #f8f8f8
@@ -130,7 +130,7 @@ $widget-border-radius: 10px;
 $widget-bg-color: rgba(0, 0, 0, .24);
 
 $text-transparent: opacify($widget-bg-color, .07);
-$bg-addition: rgba($widget-bg-color, 0.3);
+$bg-addition: darken($widget-bg-color, .07);
 
 $widget-padding-vertical: 15px;
 $widget-padding-horizontal: 17px;
@@ -245,7 +245,7 @@ $legend-color:                   $white !default;
 // Dropdowns
 // -------------------------
 
-$dropdown-bg:                    $white !default;
+$dropdown-bg:                    rgba($bg-addition, .8) !default;
 $dropdown-border:                rgba(0, 0, 0, 0.2) !default;
 
 $dropdown-link-active-color:     #fff !default;