From d704f5362b686366b290abfb4655c221473405f2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adina=20=C8=9Aeudan?= <adina@devplant.ro>
Date: Wed, 24 Feb 2021 15:39:09 +0200
Subject: [PATCH] Fixed button styles

---
 .../buttons/icon-button/icon-button.component.html  |  1 +
 .../buttons/icon-button/icon-button.component.scss  |  6 +++++-
 .../overwrite-files-dialog.component.html           |  2 +-
 apps/red-ui/src/assets/styles/red-button.scss       | 13 ++-----------
 4 files changed, 9 insertions(+), 13 deletions(-)

diff --git a/apps/red-ui/src/app/components/buttons/icon-button/icon-button.component.html b/apps/red-ui/src/app/components/buttons/icon-button/icon-button.component.html
index 1cb7087e1..f37a1f75f 100644
--- a/apps/red-ui/src/app/components/buttons/icon-button/icon-button.component.html
+++ b/apps/red-ui/src/app/components/buttons/icon-button/icon-button.component.html
@@ -5,6 +5,7 @@
     (click)="action.emit($event)"
     [class.show-bg]="type === 'show-bg'"
     [disabled]="disabled"
+    [class.has-icon]="!!icon"
     type="button"
 >
     <mat-icon [svgIcon]="icon" *ngIf="icon"></mat-icon>
diff --git a/apps/red-ui/src/app/components/buttons/icon-button/icon-button.component.scss b/apps/red-ui/src/app/components/buttons/icon-button/icon-button.component.scss
index 5f4c4a311..f60ecdbf2 100644
--- a/apps/red-ui/src/app/components/buttons/icon-button/icon-button.component.scss
+++ b/apps/red-ui/src/app/components/buttons/icon-button/icon-button.component.scss
@@ -1,7 +1,11 @@
 @import '../../../../assets/styles/red-variables';
 
 button {
-    padding: 0 14px 0 10px;
+    padding: 0 14px;
+
+    &.has-icon {
+        padding: 0 14px 0 10px;
+    }
 
     &.show-bg {
         background-color: $grey-6;
diff --git a/apps/red-ui/src/app/dialogs/overwrite-files-dialog/overwrite-files-dialog.component.html b/apps/red-ui/src/app/dialogs/overwrite-files-dialog/overwrite-files-dialog.component.html
index 169cc1350..db6caf293 100644
--- a/apps/red-ui/src/app/dialogs/overwrite-files-dialog/overwrite-files-dialog.component.html
+++ b/apps/red-ui/src/app/dialogs/overwrite-files-dialog/overwrite-files-dialog.component.html
@@ -11,7 +11,7 @@
 
     <div class="dialog-actions">
         <button (click)="selectOption('overwrite')" color="primary" mat-flat-button translate="overwrite-files-dialog.options.overwrite"></button>
-        <button (click)="selectOption('skip')" mat-flat-button translate="overwrite-files-dialog.options.skip"></button>
+        <redaction-icon-button text="overwrite-files-dialog.options.skip" (action)="selectOption('skip')" type="show-bg"></redaction-icon-button>
         <div class="all-caps-label cancel" (click)="cancel()" translate="overwrite-files-dialog.options.cancel"></div>
     </div>
 </section>
diff --git a/apps/red-ui/src/assets/styles/red-button.scss b/apps/red-ui/src/assets/styles/red-button.scss
index 0dce4a455..8ddf17bef 100644
--- a/apps/red-ui/src/assets/styles/red-button.scss
+++ b/apps/red-ui/src/assets/styles/red-button.scss
@@ -31,20 +31,11 @@
     opacity: 0 !important;
 }
 
-.mat-flat-button,
-.mat-button {
+.mat-flat-button.mat-primary,
+.mat-button.primary {
     padding: 0 14px;
     transition: background-color 0.2s, color 0.2s;
 
-    background-color: $grey-6;
-
-    &:not(.mat-button-disabled):hover {
-        background-color: $grey-4;
-    }
-}
-
-.mat-flat-button.mat-primary,
-.mat-button.primary {
     background-color: $red-1;
 
     &.mat-button-disabled {