Refactoring tip styles

apps/common/forms/resources/less/common.less

@@ -594,39 +594,6 @@
     font-size: 11px;
 }
 
-.synch-tip-root {
-    &.colored {
-        @tip-width: 240px;
-        width: @tip-width;
-        .tip-text {
-            width: @tip-width - 40px;
-        }
-
-        .asc-synchronizetip {
-            background-color: @background-contrast-popover;
-            color: @text-contrast-background;
-            .close {
-                &:before, &:after {
-                    background-color: @text-contrast-background;
-                }
-            }
-        }
-
-        .tip-arrow:after {
-            background-color: @background-contrast-popover;
-        }
-
-        .btn-div {
-            display: inline-block;
-            border: 1px solid @border-regular-control-ie;
-            border: 1px solid @border-regular-control;
-            border-radius: 2px;
-            padding: 3px 12px;
-            margin-top: 10px;
-        }
-    }
-}
-
 .font-size-small {
     .fontsize(@font-size-small);
 }

apps/common/main/resources/less/colors-table-dark.less

@@ -15,7 +15,7 @@
         --background-scrim: fade(black, 60%);
         --background-loader: fade(#181818, 90%);
         --background-alt-key-hint: #FFD938;
-        --background-contrast-popover: #363636;
+        --background-contrast-popover: #313131;
 
         --highlight-button-hover: #555;
         --highlight-button-pressed: #707070;

apps/common/main/resources/less/synchronize-tip.less

@@ -68,6 +68,12 @@
     }
 
     &.colored {
+        @tip-width: 270px;
+        width: @tip-width;
+        .tip-text {
+            width: @tip-width - 40px;
+        }
+
         .asc-synchronizetip {
             background-color: @background-contrast-popover;
             color: @text-contrast-background;