diff --git a/packages/ui/src/components/CodeMirrorEditor.vue b/packages/ui/src/components/CodeMirrorEditor.vue index df775803..c24b022d 100644 --- a/packages/ui/src/components/CodeMirrorEditor.vue +++ b/packages/ui/src/components/CodeMirrorEditor.vue @@ -204,26 +204,4 @@ export default { .code-mirror-editor .cm-editor { height: 100%; } - -.code-mirror-editor .valid-env-var { - background-color: var(--valid-env-highlight-background-color); - border-radius: 3px; - padding: 2px 0; - color: var(--valid-env-highlight-color); -} - -.code-mirror-editor .valid-env-var * { - color: var(--valid-env-highlight-color) !important; -} - -.code-mirror-editor .invalid-env-var { - background-color: var(--invalid-env-highlight-background-color); - border-radius: 3px; - padding: 2px 0; - color: var(--invalid-env-highlight-color); -} - -.code-mirror-editor .invalid-env-var * { - color: var(--invalid-env-highlight-color) !important; -} diff --git a/packages/ui/src/components/CodeMirrorSingleLine.vue b/packages/ui/src/components/CodeMirrorSingleLine.vue index ad03b9c4..ce2f9671 100644 --- a/packages/ui/src/components/CodeMirrorSingleLine.vue +++ b/packages/ui/src/components/CodeMirrorSingleLine.vue @@ -156,20 +156,6 @@ export default { padding: v-bind('inputTextCompatible ? "0" : "4px 0"'); } -.code-mirror-single-line .valid-env-var { - background-color: var(--valid-env-highlight-background-color); - border-radius: 3px; - padding: 2px 0; - color: var(--valid-env-highlight-color); -} - -.code-mirror-single-line .invalid-env-var { - background-color: var(--invalid-env-highlight-background-color); - border-radius: 3px; - padding: 2px 0; - color: var(--invalid-env-highlight-color); -} - .code-mirror-single-line .cm-line { padding: v-bind('inputTextCompatible ? "0" : "0 2px 0 4px"'); } diff --git a/packages/ui/src/styles/main.css b/packages/ui/src/styles/main.css index 28b19c21..1e44c461 100644 --- a/packages/ui/src/styles/main.css +++ b/packages/ui/src/styles/main.css @@ -71,6 +71,10 @@ html { --valid-env-highlight-background-color: #e8f5e9; --invalid-env-highlight-color: #d32f2f; --invalid-env-highlight-background-color: #ffebee; + --modal-valid-env-highlight-color: #2e7d32; + --modal-valid-env-highlight-background-color: #e8f5e9; + --modal-invalid-env-highlight-color: #d32f2f; + --modal-invalid-env-highlight-background-color: #ffebee; } html.theme-dark { @@ -127,6 +131,10 @@ html.theme-dark { --valid-env-highlight-background-color: #1b5e20; --invalid-env-highlight-color: #ffcccb; --invalid-env-highlight-background-color: #7c0404; + --modal-valid-env-highlight-color: #2e7d32; + --modal-valid-env-highlight-background-color: #e8f5e9; + --modal-invalid-env-highlight-color: #d32f2f; + --modal-invalid-env-highlight-background-color: #ffebee; } * { @@ -290,6 +298,46 @@ button.button:hover { color: var(--modal-cm-number); } +.cm-editor .valid-env-var { + background-color: var(--valid-env-highlight-background-color); + border-radius: 3px; + padding: 2px 0; + color: var(--valid-env-highlight-color); +} + +.cm-editor .valid-env-var * { + color: var(--valid-env-highlight-color) !important; +} + +.cm-editor .invalid-env-var { + background-color: var(--invalid-env-highlight-background-color); + border-radius: 3px; + padding: 2px 0; + color: var(--invalid-env-highlight-color); +} + +.cm-editor .invalid-env-var * { + color: var(--invalid-env-highlight-color) !important; +} + +.modal .cm-editor .valid-env-var { + background-color: var(--modal-valid-env-highlight-background-color); + color: var(--modal-valid-env-highlight-color); +} + +.modal .cm-editor .valid-env-var * { + color: var(--modal-valid-env-highlight-color) !important; +} + +.modal .cm-editor .invalid-env-var { + background-color: var(--modal-invalid-env-highlight-background-color); + color: var(--modal-invalid-env-highlight-color); +} + +.modal .cm-editor .invalid-env-var * { + color: var(--modal-invalid-env-highlight-color) !important; +} + a { color: var(--link-color); }