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,7 +36,7 @@
     padding: 12px;
     background-color: #f5f5f5;
     resize: vertical;
-    min-height: 150px; // minimum yükseklik eklendi
+    min-height: 150px;
 
     &:focus {
       outline: none;
@@ -54,7 +54,7 @@
   margin-top: 16px;
 
   ::ng-deep .mat-expansion-panel-header {
-    padding: 0 16px; // padding eklendi
+    padding: 0 16px;
   }
 
   .template-list {
@@ -171,20 +171,82 @@
     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
+    max-height: 500px;
+    overflow-y: auto;
 
     h4 {
       margin-top: 0;
       margin-bottom: 16px;
     }
 
+    .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 {
       margin-top: 16px;
 
@@ -201,12 +263,11 @@
         overflow-x: auto;
         font-size: 12px;
         margin: 0;
-        white-space: pre-wrap; // uzun satırları sar
-        word-break: break-word; // kelime kırılması
+        white-space: pre-wrap;
+        word-break: break-word;
       }
     }
   }
-}
 
   .test-note {
     display: flex;
@@ -241,7 +302,7 @@ mat-dialog-content {
     
     ::ng-deep .mat-mdc-tab-body-wrapper {
       flex: 1;
-      overflow-y: auto; // tab içeriği için scroll
+      overflow-y: auto;
     }
   }
 }
@@ -249,10 +310,10 @@ mat-dialog-content {
 mat-dialog-actions {
   padding: 16px 24px;
   margin: 0;
-  border-top: 1px solid #e0e0e0; // üst border
-  gap: 8px; // butonlar arası boşluk
+  border-top: 1px solid #e0e0e0;
+  gap: 8px;
   
   button {
-    margin: 0 !important; // varsayılan margin'leri kaldır
+    margin: 0 !important;
   }
 }