Create version-edit-dialog.component.scss

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

@@ -0,0 +1,248 @@
+.version-management-container {
+  min-height: 500px;
+
+  .title-chips {
+    float: right;
+    margin-top: -8px;
+
+    mat-chip {
+      font-size: 12px;
+    }
+  }
+
+  .version-selector {
+    display: flex;
+    gap: 16px;
+    align-items: center;
+    margin-bottom: 24px;
+
+    .version-select {
+      flex: 1;
+      max-width: 400px;
+    }
+
+    .version-actions {
+      display: flex;
+      gap: 8px;
+    }
+
+    .version-status {
+      color: #4caf50;
+      font-weight: 500;
+      margin-left: 8px;
+    }
+  }
+
+  .version-editor {
+    mat-tab-group {
+      min-height: 400px;
+    }
+  }
+
+  .tab-content {
+    padding: 24px;
+  }
+
+  .full-width {
+    width: 100%;
+    margin-bottom: 16px;
+  }
+
+  .metadata-info {
+    margin-bottom: 24px;
+
+    mat-chip {
+      font-size: 12px;
+    }
+  }
+
+  .generation-config {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+    gap: 16px;
+    margin-bottom: 24px;
+  }
+
+  .fine-tune-section {
+    margin-top: 24px;
+
+    mat-checkbox {
+      margin-bottom: 16px;
+    }
+  }
+
+  .intents-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 16px;
+
+    h3 {
+      margin: 0;
+    }
+  }
+
+  .intents-list {
+    mat-expansion-panel {
+      margin-bottom: 8px;
+
+      .intent-chips {
+        margin-left: 16px;
+
+        mat-chip {
+          font-size: 11px;
+          min-height: 20px;
+          padding: 2px 8px;
+        }
+      }
+    }
+
+    .intent-content {
+      padding: 16px;
+    }
+
+    .intent-actions {
+      display: flex;
+      gap: 8px;
+      margin-bottom: 16px;
+      padding-bottom: 16px;
+      border-bottom: 1px solid #e0e0e0;
+    }
+
+    .intent-summary {
+      .summary-item {
+        margin-bottom: 16px;
+
+        strong {
+          display: block;
+          margin-bottom: 8px;
+          color: rgba(0, 0, 0, 0.87);
+        }
+
+        p {
+          margin: 0;
+          color: rgba(0, 0, 0, 0.6);
+        }
+
+        mat-chip {
+          margin: 2px;
+          font-size: 12px;
+        }
+
+        mat-list {
+          padding-top: 0;
+        }
+      }
+    }
+  }
+
+  .test-result {
+    margin-top: 24px;
+
+    h4 {
+      margin-bottom: 16px;
+    }
+
+    .result-card {
+      border: 1px solid #e0e0e0;
+      border-radius: 4px;
+      padding: 16px;
+
+      &.success {
+        background-color: #e8f5e9;
+        border-color: #4caf50;
+
+        .result-header {
+          color: #2e7d32;
+
+          mat-icon {
+            color: #4caf50;
+          }
+        }
+      }
+
+      &.no-match {
+        background-color: #fff3e0;
+        border-color: #ff9800;
+
+        .result-header {
+          color: #e65100;
+
+          mat-icon {
+            color: #ff9800;
+          }
+        }
+      }
+
+      .result-header {
+        display: flex;
+        align-items: center;
+        gap: 8px;
+        margin-bottom: 16px;
+        font-size: 16px;
+
+        mat-icon {
+          font-size: 24px;
+          width: 24px;
+          height: 24px;
+        }
+      }
+
+      .confidence {
+        margin-bottom: 16px;
+
+        mat-progress-bar {
+          margin-top: 8px;
+        }
+      }
+
+      .parameters {
+        h5 {
+          margin-bottom: 8px;
+        }
+
+        mat-list {
+          background: white;
+          border-radius: 4px;
+        }
+      }
+    }
+  }
+
+  .empty-state {
+    text-align: center;
+    padding: 60px 20px;
+
+    mat-icon {
+      font-size: 64px;
+      width: 64px;
+      height: 64px;
+      color: #e0e0e0;
+      margin-bottom: 16px;
+    }
+
+    p {
+      color: #666;
+      margin-bottom: 24px;
+    }
+  }
+
+  .action-buttons {
+    margin-top: 24px;
+    padding-top: 24px;
+    border-top: 1px solid #e0e0e0;
+  }
+}
+
+mat-dialog-content {
+  max-width: 1000px;
+  min-width: 800px;
+  max-height: 80vh;
+  padding: 0;
+}
+
+mat-dialog-actions {
+  padding: 16px 24px;
+  margin: 0;
+  border-top: 1px solid #e0e0e0;
+}