Update theme to reflect the new logo and brand color changes (#13629)

* update theme

* fix alert box has no spacing

* fix couple issues with new theme

* improve contrast and make sure to use correct theme color

* fix notification colour

* fix wrong logo used

* fix theme color

* fix update title not readable

2 files changed, 10 insertions, 9 deletions

diff --git a/plugins/Dashboard/stylesheets/dashboard.less b/plugins/Dashboard/stylesheets/dashboard.less
index 7269aa23ed..80d1583f1a 100644
--- a/plugins/Dashboard/stylesheets/dashboard.less
+++ b/plugins/Dashboard/stylesheets/dashboard.less
@@ -1,5 +1,5 @@
 #dashboard {
-  margin: 0 -6px;
+  margin: 0 -8px;
 }
 
 body#standalone {
@@ -17,11 +17,11 @@ body#standalone {
   #dashboardWidgetsArea > .col {
     min-height: 100px;
     // Customize Bootstrap gutter between columns
-    padding-right: 6px;
-    padding-left: 6px;
+    padding-right: 8px;
+    padding-left: 8px;
 
     >.sortable {
-      padding: 5px 0 8px 0;
+      padding: 5px 0 13px 0;
     }
   }
 }
@@ -425,7 +425,7 @@ div.widgetpreview-preview {
 .ui-button, .ui-dialog-titlebar-close {
   .btn;
   color: @theme-color-brand-contrast !important;
-  background-color: @theme-color-brand !important;
+  background-color: @color-red-piwik !important;
   &:hover {
     background: none;
     background-color: transparent;
diff --git a/plugins/Dashboard/stylesheets/widget.less b/plugins/Dashboard/stylesheets/widget.less
index 7bf51ba107..f4a53bdb00 100644
--- a/plugins/Dashboard/stylesheets/widget.less
+++ b/plugins/Dashboard/stylesheets/widget.less
@@ -1,13 +1,13 @@
 .widget {
     .font-default(13px, 18px);
     background: @theme-color-widget-background;
-    border: 1px solid @theme-color-widget-border;
     border-radius: 2px;
     position: relative;
-    box-shadow: 0 1px 1px 0 rgba(0,0,0,.14),0 1px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.12);
+    box-shadow: @default-box-shade;
+    border: 1px solid @theme-color-widget-background !important;
 
     &:hover, &:focus {
-        box-shadow: 0 1px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12);
+        box-shadow: @default-box-shade;
     }
 
     h2 {
@@ -22,7 +22,7 @@
         margin: 0;
         color: @theme-color-text;
         text-shadow: none;
-        padding: 15px 15px 10px 12px;
+        padding: 22px 15px 16px 12px !important;
     }
     p {
         margin-left: 10px;
@@ -58,6 +58,7 @@
             position: absolute;
             padding-left: 50px;
             display: none;
+            top: 7px;
             color: @theme-color-widget-title-text;
             background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, @theme-color-widget-title-background 45px);
             background: -webkit-linear-gradient(left,rgba(255,255,255,0) 0%, @theme-color-widget-title-background 45px);