fix: stules in save as policy[3141]

hashgraph · Jan 31, 2025 · a88393e · a88393e
1 parent e451c89
commit a88393e
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 11 deletions.
diff --git a/...rc/app/modules/policy-engine/dialogs/save-policy-dialog/save-policy-dialog.component.html b/...rc/app/modules/policy-engine/dialogs/save-policy-dialog/save-policy-dialog.component.html
@@ -8,22 +8,18 @@
     <div class="dialog-content">
         <ng-container *ngIf="isActionSelected$ | async; else selectActionTemplate">
             <form [formGroup]="dataForm" (ngSubmit)="onSubmit()" class="form-field">
-                <div class="example-full-width custom-form-field">
-                    <label>NAME:</label>
-                    <input pInputText type="text" placeholder="Policy name" formControlName="name"/>
+                <div class="example-full-width custom-form-field required">
+                    <input pInputText type="text" placeholder="NAME" formControlName="name"/>
                 </div>
                 <div class="example-full-width custom-form-field">
-                    <label>TAG:</label>
-                    <input pInputText type="text" placeholder="policyTag" formControlName="policyTag"/>
+                    <input pInputText type="text" placeholder="TAG" formControlName="policyTag"/>
                 </div>
                 <div class="example-full-width custom-form-field">
-                    <label>TOPIC DESCRIPTION:</label>
-                    <input pInputText type="text" placeholder="Topic description" formControlName="topicDescription"
+                    <input pInputText type="text" placeholder="TOPIC DESCRIPTION" formControlName="topicDescription"
                            maxlength="50"/>
                 </div>
                 <div class="example-full-width custom-form-field">
-                    <label>DESCRIPTION:</label>
-                    <textarea pInputTextarea placeholder="Description" formControlName="description"></textarea>
+                    <textarea pInputTextarea placeholder="DESCRIPTION" formControlName="description"></textarea>
                 </div>
                 <div class="dialog-actions">
                     <p-button label="Ok" icon="pi pi-check" type="submit" [disabled]="!dataForm.valid"

diff --git a/...rc/app/modules/policy-engine/dialogs/save-policy-dialog/save-policy-dialog.component.scss b/...rc/app/modules/policy-engine/dialogs/save-policy-dialog/save-policy-dialog.component.scss
@@ -80,20 +80,51 @@ form {
 
 .form-field {
     margin-bottom: 1em;
+    width: 100% !important
 }
 
 .custom-form-field {
     position: relative;
-    padding: 0.5em;
-    border: 1px solid var(--color-grey-2);
+    border: 2px solid var(--color-grey-2);
     border-radius: 4px;
     transition: border-color 0.3s;
+    margin-bottom: 10px;
+}
+
+.custom-form-field input {
+  width: 100%;
+  height: 50px !important;
+  border: none;
+    &:focus {
+        box-shadow: none;
+    }
+}
+
+.custom-form-field textarea {
+    resize: vertical;
+    min-height: 70px;
+}
+
+.custom-form-field input,
+.custom-form-field textarea{
+    width: 100%;
+    border: none;
+    &:focus {
+        box-shadow: none;
+    }
 }
 
 .custom-form-field:focus-within {
     border: 2px solid var(--primary-color);
 }
 
+.form-field.ng-invalid .ng-invalid {
+    border: 2px solid var(--color-accent-red-1);
+    &:focus {
+        border: none;
+    }
+}
+
 .dialog-actions {
     display: flex;
     justify-content: flex-start;
@@ -121,3 +152,5 @@ form {
 :host ::ng-deep .p-dialog .p-button-ok:hover {
     background-color: var(--blue-700);
 }
+
+