- introductie van vue files - bijna werkende versie van eveai_chat_client.

2025-07-18 20:32:55 +02:00
parent 11b1d548bd
commit b60600e9f6
77 changed files with 47785 additions and 970 deletions
--- a/nginx/static/assets/css/eveai-json-editor.css
+++ b/nginx/static/assets/css/eveai-json-editor.css
@@ -0,0 +1,107 @@
+:root {
+  /* Hoofdkleuren gebaseerd op EveAI kleurenschema */
+  --jse-theme-color: var(--bs-primary); /* Paars als hoofdkleur */
+  --jse-theme-color-highlight: var(--bs-secondary); /* Secundair paars voor highlights */
+
+  /* Achtergrondkleuren */
+  --jse-background-color: #fff;
+  --jse-panel-background: #f8f9fa;
+  --jse-panel-border: 1px solid var(--bs-secondary);
+  --jse-panel-border-radius: 0.375rem;
+
+  /* Tekstkleuren */
+  --jse-text-color: var(--bs-body-color);
+  --jse-text-color-inverse: #ffffff;
+
+  /* Navigatie */
+  --jse-navigation-bar-background: linear-gradient(90deg, var(--bs-primary) 0%, var(--bs-secondary) 100%);
+  --jse-navigation-bar-background-highlight: var(--bs-secondary);
+  --jse-navigation-bar-text-color: #ffffff;
+
+  /* Status balk */
+  --jse-status-bar-background: var(--bs-light);
+  --jse-status-bar-color: var(--bs-body-color);
+  --jse-status-bar-border: 1px solid var(--bs-secondary);
+  --jse-status-bar-border-radius: 0 0 0.375rem 0.375rem;
+
+  /* Main menu bar */
+  --jse-main-menu-background: linear-gradient(90deg, var(--bs-primary) 0%, var(--bs-secondary) 100%);
+  --jse-main-menu-color: #ffffff;
+  --jse-main-menu-button-background-highlight: var(--bs-secondary);
+  --jse-main-menu-button-color-highlight: #ffffff;
+
+  /* Contextmenu */
+  --jse-context-menu-background: #fff;
+  --jse-context-menu-background-highlight: var(--bs-secondary);
+  --jse-context-menu-color: var(--bs-body-color);
+  --jse-context-menu-color-highlight: #ffffff;
+  --jse-context-menu-border: 1px solid var(--bs-secondary);
+  --jse-context-menu-box-shadow: 0 4px 8px rgba(118, 89, 154, 0.2);
+  --jse-context-menu-border-radius: 0.375rem;
+
+  /* Knoppen */
+  --jse-button-background: var(--bs-primary);
+  --jse-button-background-highlight: var(--bs-secondary);
+  --jse-button-color: #ffffff;
+  --jse-button-color-highlight: #ffffff;
+  --jse-button-border-radius: 0.375rem;
+
+  /* JSON Tree Mode */
+  --jse-key-color: var(--bs-info);
+  --jse-delimiter-color: #666;
+  --jse-string-color: var(--bs-primary);
+  --jse-number-color: var(--bs-warning);
+  --jse-boolean-color: var(--bs-danger);
+  --jse-null-color: #888;
+  --jse-invalid-color: #e0b4b4;
+  --jse-readonly-color: #888;
+  --jse-readonly-background-color: #f0f0f0;
+
+  /* Selectie */
+  --jse-selection-background-color: rgba(118, 89, 154, 0.2);
+  --jse-selection-background-inactive-color: rgba(118, 89, 154, 0.1);
+
+  /* Foutmeldingen */
+  --jse-error-color: var(--bs-danger);
+  --jse-error-background-color: rgba(156, 45, 102, 0.1);
+
+  /* Tooltips */
+  --jse-tooltip-background: var(--bs-primary);
+  --jse-tooltip-color: #ffffff;
+  --jse-tooltip-border-radius: 0.375rem;
+  --jse-tooltip-box-shadow: 0 4px 8px rgba(118, 89, 154, 0.2);
+}
+
+/* Extra stijlen voor de containers */
+.jsoneditor-initialized {
+  border: 1px solid var(--bs-secondary);
+  border-radius: 0.375rem;
+  min-height: 300px;
+  box-shadow: 0 4px 8px rgba(118, 89, 154, 0.1);
+}
+
+.jsoneditor-readonly-mode {
+  background-color: var(--bs-light);
+}
+
+/* Stijlen voor de knoppen in de editor */
+.jse-button {
+  border: none !important;
+  transition: background-color 0.3s ease;
+}
+
+/* Stijlen voor veldlabels in de boom */
+.jse-tree .jse-key {
+  font-weight: 500;
+}
+
+/* Stijlen voor waarden in de boom */
+.jse-tree .jse-value {
+  font-family: monospace;
+}
+
+/* Verbeter de leesbaarheid van de tekstmodus */
+.jse-text-mode {
+  font-family: monospace;
+  line-height: 1.5;
+}