From 47ee925f4fcc83d8fd5cf090855a60a740548a1a Mon Sep 17 00:00:00 2001
From: kurilova <kurilova@google.com>
Date: Wed, 18 Dec 2024 12:50:49 +0000
Subject: [PATCH 1/2] Change style for delete certificate dialog

---
 .../simple-dialog/simple-dialog.component.html     |  2 +-
 .../simple-dialog/simple-dialog.component.scss     | 14 ++++++++++----
 .../pages/certificates/certificates.component.ts   |  2 +-
 .../certificates-table.component.scss              |  4 ++++
 4 files changed, 16 insertions(+), 6 deletions(-)

diff --git a/modules/ui/src/app/components/simple-dialog/simple-dialog.component.html b/modules/ui/src/app/components/simple-dialog/simple-dialog.component.html
index 975773924..296c030f3 100644
--- a/modules/ui/src/app/components/simple-dialog/simple-dialog.component.html
+++ b/modules/ui/src/app/components/simple-dialog/simple-dialog.component.html
@@ -18,7 +18,7 @@
   {{ data.content }}
 </p>
 
-<mat-dialog-actions align="end" class="delete-form-actions">
+<mat-dialog-actions align="end" class="simple-dialog-actions">
   <button
     cdkFocusInitial
     aria-label="Cancel"
diff --git a/modules/ui/src/app/components/simple-dialog/simple-dialog.component.scss b/modules/ui/src/app/components/simple-dialog/simple-dialog.component.scss
index 3a4f64140..57eefe1fd 100644
--- a/modules/ui/src/app/components/simple-dialog/simple-dialog.component.scss
+++ b/modules/ui/src/app/components/simple-dialog/simple-dialog.component.scss
@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 @use 'colors';
+@use 'variables';
 @use 'mixins';
 
 ::ng-deep :root {
@@ -22,26 +23,31 @@
 
 :host {
   @include mixins.dialog;
-  padding: 24px 16px 8px 24px;
+  padding: 24px;
   gap: 10px;
 }
 
 .simple-dialog-title {
-  color: colors.$grey-900;
   font-size: 18px;
   line-height: 24px;
   padding: 0;
+  text-align: center;
+  color: colors.$on-surface;
+  font-family: variables.$font-primary;
 }
 
 .simple-dialog-content {
-  font-family: Roboto, sans-serif;
+  font-family: variables.$font-text;
   font-size: 14px;
   line-height: 20px;
   letter-spacing: 0.2px;
-  color: colors.$grey-800;
+  color: colors.$on-surface-variant;
 }
 
 .simple-dialog-actions {
   padding: 0;
   min-height: 30px;
+  button {
+    font-family: variables.$font-text;
+  }
 }
diff --git a/modules/ui/src/app/pages/certificates/certificates.component.ts b/modules/ui/src/app/pages/certificates/certificates.component.ts
index 9c6efd980..0848f7807 100644
--- a/modules/ui/src/app/pages/certificates/certificates.component.ts
+++ b/modules/ui/src/app/pages/certificates/certificates.component.ts
@@ -72,7 +72,7 @@ export class CertificatesComponent implements OnDestroy {
       autoFocus: true,
       hasBackdrop: true,
       disableClose: true,
-      panelClass: 'simple-dialog',
+      panelClass: ['simple-dialog', 'delete-certificate'],
     });
 
     dialogRef
diff --git a/modules/ui/src/app/pages/certificates/components/certificates-table/certificates-table.component.scss b/modules/ui/src/app/pages/certificates/components/certificates-table/certificates-table.component.scss
index 73e462b48..052dda110 100644
--- a/modules/ui/src/app/pages/certificates/components/certificates-table/certificates-table.component.scss
+++ b/modules/ui/src/app/pages/certificates/components/certificates-table/certificates-table.component.scss
@@ -31,6 +31,10 @@
   );
 }
 
+::ng-deep .delete-certificate app-simple-dialog {
+  width: 329px;
+}
+
 .table-cell-actions {
   text-align: right;
 }

From c3a461c04d45fcb6512d150d5205c22d850567be Mon Sep 17 00:00:00 2001
From: kurilova <kurilova@google.com>
Date: Wed, 18 Dec 2024 13:09:05 +0000
Subject: [PATCH 2/2] Fix tests

---
 .../src/app/pages/certificates/certificates.component.spec.ts   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/modules/ui/src/app/pages/certificates/certificates.component.spec.ts b/modules/ui/src/app/pages/certificates/certificates.component.spec.ts
index be598c5f9..139c2605d 100644
--- a/modules/ui/src/app/pages/certificates/certificates.component.spec.ts
+++ b/modules/ui/src/app/pages/certificates/certificates.component.spec.ts
@@ -113,7 +113,7 @@ describe('CertificatesComponent', () => {
           autoFocus: true,
           hasBackdrop: true,
           disableClose: true,
-          panelClass: 'simple-dialog',
+          panelClass: ['simple-dialog', 'delete-certificate'],
         });
 
         openSpy.calls.reset();