Update flare-ui/src/app/dialogs/api-edit-dialog/api-edit-dialog.component.scss

flare-ui/src/app/dialogs/api-edit-dialog/api-edit-dialog.component.scss

@@ -36,6 +36,7 @@
     padding: 12px;
     background-color: #f5f5f5;
     resize: vertical;
+    min-height: 150px; // minimum yükseklik eklendi
 
     &:focus {
       outline: none;
@@ -52,6 +53,10 @@
 .template-helpers {
   margin-top: 16px;
 
+  ::ng-deep .mat-expansion-panel-header {
+    padding: 0 16px; // padding eklendi
+  }
+
   .template-list {
     padding: 16px;
     display: flex;
@@ -166,77 +171,18 @@
     margin-bottom: 24px;
   }
 
-  .test-info {
-    margin: 16px 0;
-
-    mat-chip-listbox {
-      mat-chip-option {
-        margin-right: 8px;
-      }
-    }
-  }
-
-  button {
-    margin-bottom: 24px;
-  }
-
   .test-result {
     margin-top: 24px;
     border: 1px solid #e0e0e0;
     border-radius: 4px;
     padding: 16px;
     background-color: #fafafa;
+    max-height: 500px; // maksimum yükseklik
+    overflow-y: auto; // scroll eklendi
 
     h4 {
       margin-top: 0;
-    }
-
-    .result-status {
-      display: flex;
-      align-items: center;
-      gap: 12px;
-      padding: 12px;
-      border-radius: 4px;
       margin-bottom: 16px;
-
-      &.success {
-        background-color: #e8f5e9;
-        color: #2e7d32;
-
-        mat-icon {
-          color: #2e7d32;
-        }
-      }
-
-      &.error {
-        background-color: #ffebee;
-        color: #c62828;
-
-        mat-icon {
-          color: #c62828;
-        }
-      }
-
-      .status-code,
-      .response-time {
-        margin-left: auto;
-        font-size: 14px;
-      }
-    }
-
-    .error-message {
-      display: flex;
-      align-items: center;
-      gap: 8px;
-      padding: 12px;
-      background-color: #ffebee;
-      color: #c62828;
-      border-radius: 4px;
-      margin-bottom: 16px;
-
-      mat-icon {
-        color: #c62828;
-      }
     }
 
     .response-section {
@@ -255,9 +201,12 @@
         overflow-x: auto;
         font-size: 12px;
         margin: 0;
+        white-space: pre-wrap; // uzun satırları sar
+        word-break: break-word; // kelime kırılması
       }
     }
   }
+}
 
   .test-note {
     display: flex;
@@ -289,10 +238,21 @@ mat-dialog-content {
 
   mat-tab-group {
     height: 100%;
+    
+    ::ng-deep .mat-mdc-tab-body-wrapper {
+      flex: 1;
+      overflow-y: auto; // tab içeriği için scroll
+    }
   }
 }
 
 mat-dialog-actions {
   padding: 16px 24px;
   margin: 0;
+  border-top: 1px solid #e0e0e0; // üst border
+  gap: 8px; // butonlar arası boşluk
+  
+  button {
+    margin: 0 !important; // varsayılan margin'leri kaldır
+  }
 }