diff --git a/DSL/Resql/rag-search/POST/update-llm-connection.sql b/DSL/Resql/rag-search/POST/update-llm-connection.sql index e4fa4fd..3fa7bc6 100644 --- a/DSL/Resql/rag-search/POST/update-llm-connection.sql +++ b/DSL/Resql/rag-search/POST/update-llm-connection.sql @@ -25,19 +25,19 @@ SET embedding_target_uri = :embedding_target_uri, embedding_azure_api_key = :embedding_azure_api_key WHERE id = :connection_id -RETURNING - id, +RETURNING + id, connection_name, - llm_platform, - llm_model, - embedding_platform, - embedding_model, - monthly_budget, + llm_platform, + llm_model, + embedding_platform, + embedding_model, + monthly_budget, warn_budget_threshold, stop_budget_threshold, disconnect_on_budget_exceed, - environment, - connection_status, + environment, + connection_status, created_at, deployment_name, target_uri, diff --git a/GUI/src/components/molecules/LLMConnectionForm/LLMConnectionForm.scss b/GUI/src/components/molecules/LLMConnectionForm/LLMConnectionForm.scss index 571d801..c999f4a 100644 --- a/GUI/src/components/molecules/LLMConnectionForm/LLMConnectionForm.scss +++ b/GUI/src/components/molecules/LLMConnectionForm/LLMConnectionForm.scss @@ -90,15 +90,54 @@ .flex-grid { display: flex; gap: 12px; + flex-wrap: wrap; + + button { + flex: 0 1 auto; + min-width: 80px; + max-width: 100%; + } } // Responsive design - @media (max-width: 768px) { - padding: 16px; - + // Very small screens - wrap buttons (inline buttons with wrapping) + @media (max-width: 480px) { + padding: 8px; + + .form-section { + padding: 12px; + margin-bottom: 20px; + } + + .form-footer { + margin-top: 20px; + padding-top: 12px; + } + + .flex-grid { + + flex-wrap: wrap; + gap: 8px; + justify-content: flex-end; + + button { + flex: 0 1 auto; + + min-width: 60px; + max-width: calc(50% - 4px); + padding: 8px 12px; + font-size: 13px; + } + } + } + + // Small screens - mobile + @media (min-width: 481px) and (max-width: 768px) { + padding: 12px; + .form-section { - padding: 16px; - margin-bottom: 24px; + padding: 14px; + margin-bottom: 22px; } .radio-options { @@ -109,9 +148,34 @@ padding: 6px 10px; } + .form-footer { + margin-top: 24px; + padding-top: 16px; + } + + .flex-grid { + flex-direction: column-reverse; + gap: 12px; + + button { + width: 100%; + min-width: unset; + } + } + } + + // Medium screens - tablet + @media (min-width: 769px) and (max-width: 1024px) { .flex-grid { - flex-direction: column; gap: 8px; + + button { + flex: 1 1 auto; + min-width: 70px; + max-width: 200px; + font-size: 14px; + padding: 8px 12px; + } } } }