fix: Status icon not clearly visible (#725)

sovity · Apr 11, 2024 · ca8c8e1 · ca8c8e1
1 parent d7fe4d8
commit ca8c8e1
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 1 deletion.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -129,6 +129,7 @@ MDS feature release for Connector UI and Broker UI
 
 - Improved handling of asset keywords in cards
 - EE: Fixed issues around logout page
+- Fix status icon for data offers
 
 #### Deployment Migration Notes
 

diff --git a/...pp/component-library/catalog/icon-with-online-status/icon-with-online-status.component.ts b/...pp/component-library/catalog/icon-with-online-status/icon-with-online-status.component.ts
@@ -10,7 +10,7 @@ import {
   template: `
     <mat-icon
       *ngIf="onlineStatus"
-      class="absolute mat-icon-[16px] mt-[26px] ml-[26px]"
+      class="absolute mat-icon-[24px] mt-[26px] ml-[26px]"
       [ngClass]="onlineStatusColor"
       >{{ onlineStatusIcon }}</mat-icon
     >

diff --git a/src/styles.scss b/src/styles.scss
@@ -181,6 +181,13 @@ body {
   line-height: 22px !important;
 }
 
+.mat-icon-\[24px\] {
+  font-size: 24px !important;
+  width: 24px !important;
+  height: 24px !important;
+  line-height: 24px !important;
+}
+
 .mat-icon-\[28px\] {
   margin-top: 8px;
   font-size: 28px !important;