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 8f44b4566..5f4c4a311 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 @@ -5,6 +5,10 @@ button { &.show-bg { background-color: $grey-6; + + &:not(.mat-button-disabled):hover { + background-color: $grey-4; + } } mat-icon { diff --git a/apps/red-ui/src/app/screens/admin/dictionary-overview-screen/dictionary-overview-screen.component.scss b/apps/red-ui/src/app/screens/admin/dictionary-overview-screen/dictionary-overview-screen.component.scss index 035108650..28ba1375a 100644 --- a/apps/red-ui/src/app/screens/admin/dictionary-overview-screen/dictionary-overview-screen.component.scss +++ b/apps/red-ui/src/app/screens/admin/dictionary-overview-screen/dictionary-overview-screen.component.scss @@ -45,7 +45,7 @@ .red-input-group { margin-bottom: 16px; - max-width: 450px; + max-width: 300px; input { padding-right: 32px; diff --git a/apps/red-ui/src/app/screens/admin/watermark-screen/watermark-screen.component.html b/apps/red-ui/src/app/screens/admin/watermark-screen/watermark-screen.component.html index 23418b272..c6c53324b 100644 --- a/apps/red-ui/src/app/screens/admin/watermark-screen/watermark-screen.component.html +++ b/apps/red-ui/src/app/screens/admin/watermark-screen/watermark-screen.component.html @@ -71,11 +71,16 @@
- + -
+
diff --git a/apps/red-ui/src/app/screens/project-overview-screen/project-overview-screen.component.html b/apps/red-ui/src/app/screens/project-overview-screen/project-overview-screen.component.html index 5dd77925d..44dd459fa 100644 --- a/apps/red-ui/src/app/screens/project-overview-screen/project-overview-screen.component.html +++ b/apps/red-ui/src/app/screens/project-overview-screen/project-overview-screen.component.html @@ -95,7 +95,7 @@
-
+
diff --git a/apps/red-ui/src/assets/styles/red-button.scss b/apps/red-ui/src/assets/styles/red-button.scss index 008154754..b80c936c2 100644 --- a/apps/red-ui/src/assets/styles/red-button.scss +++ b/apps/red-ui/src/assets/styles/red-button.scss @@ -13,6 +13,7 @@ display: flex; align-items: center; line-height: 34px; + transition: opacity 0.2s; > *:not(last-child) { margin-right: 6px; @@ -20,17 +21,25 @@ } &.mat-button-disabled { - background-color: $grey-6 !important; + .mat-button-wrapper { + opacity: 0.3; + } } } -.cdk-program-focused .mat-button-focus-overlay { +.mat-button-focus-overlay { opacity: 0 !important; } -.mat-flat-button.mat-primary.red-button { +.mat-flat-button.mat-primary { padding: 0 14px; - transition: background-color 0.2s; + transition: background-color 0.2s, color 0.2s; + background-color: $red-1; + + &.mat-button-disabled { + background-color: $red-1; + color: rgba($white, 0.5); + } &:not(.mat-button-disabled):hover { background-color: $red-2; @@ -42,10 +51,10 @@ redaction-chevron-button, redaction-circle-button { position: relative; display: flex; - transition: background-color 0.2s; button { font-weight: 400 !important; + transition: background-color 0.2s; &.overlay { background: rgba($primary, 0.1); diff --git a/apps/red-ui/src/assets/styles/red-input.scss b/apps/red-ui/src/assets/styles/red-input.scss index 99314813d..46873f1a7 100644 --- a/apps/red-ui/src/assets/styles/red-input.scss +++ b/apps/red-ui/src/assets/styles/red-input.scss @@ -173,6 +173,7 @@ .mat-datepicker-input { margin-top: 0; + width: 120px; } .mat-datepicker-toggle { diff --git a/apps/red-ui/src/assets/styles/red-page-layout.scss b/apps/red-ui/src/assets/styles/red-page-layout.scss index 9267eff66..c5e4d2fa1 100644 --- a/apps/red-ui/src/assets/styles/red-page-layout.scss +++ b/apps/red-ui/src/assets/styles/red-page-layout.scss @@ -82,7 +82,7 @@ body { height: 4px; } - .no-data { + .empty-state { display: flex; flex-direction: column; align-items: center;