notifications: make styling match the design

rhodecode/public/css/polymer.less

@@ -5,11 +5,5 @@
 @import 'rcicons';
 @import 'fonts';
 @import 'variables';
-@import 'legacy_code_styles';
 @import 'type';
-@import 'alerts';
 @import 'buttons';
-@import 'tags';
-@import 'examples';
-@import 'login';
-@import 'comments';

rhodecode/public/js/src/components/rhodecode-toast/rhodecode-toast.html

@@ -2,6 +2,7 @@
 <link rel="import" href="../rhodecode-unsafe-html/rhodecode-unsafe-html.html">
 <dom-module id="rhodecode-toast">
     <template>
+        <style include="shared-styles"></style>
         <link rel="stylesheet" href="rhodecode-toast.css">
 
         <paper-toast id="p-toast" duration="0"  horizontal-offset="100" horizontal-align="auto" vertical-align="top" always-on-top>
@@ -14,7 +15,7 @@
                 </template>
             </div>
             <div class="toast-close">
-                <paper-button on-tap="dismissNotifications" class="btn btn-info">{{_gettext('Close now')}}</paper-button>
+                <paper-button on-tap="dismissNotifications" class="btn btn-primary">{{_gettext('Close now')}}</paper-button>
             </div>
         </paper-toast>
     </template>

rhodecode/public/js/src/components/rhodecode-toast/rhodecode-toast.less

@@ -1,3 +1,5 @@
+@import '../../../../css/variables';
+
 paper-toast{
     width: 100%;
     min-width: 400px;
@@ -27,13 +29,16 @@ paper-toast a{
     min-width: 100px;
     font-weight: bold;
     text-transform: uppercase;
-    &.info, &.success {
-        color: #0ac878;
+    &.info{
+        color: @alert4;
+    }
+    &.success {
+        color: @alert1;
     }
     &.error, &.danger {
-        color: #e85e4d;
+        color: @alert2;
     }
     &.warning {
-        color: #ffc854;
+        color: @alert3;
     }
 }

rhodecode/templates/admin/my_account/my_account_notifications.html

@@ -36,7 +36,7 @@
                     </div>
                 </div>
                 <div class="buttons">
-                    <a class="btn btn-info" id="test-notification">Test notification</a>
+                    <a class="btn btn-default" id="test-notification">Test notification</a>
                 </div>
             </div>
         </div>