From c73c6f216a479b3995ebc5c2c03247c798233a4b Mon Sep 17 00:00:00 2001 From: liyasthomas Date: Thu, 31 Mar 2022 14:36:00 +0530 Subject: [PATCH] fix: force accent contrast color on environment variables - resolved #2217 --- packages/hoppscotch-app/assets/scss/styles.scss | 6 ++++++ .../helpers/editor/extensions/HoppEnvironment.ts | 5 +++-- 2 files changed, 9 insertions(+), 2 deletions(-) diff --git a/packages/hoppscotch-app/assets/scss/styles.scss b/packages/hoppscotch-app/assets/scss/styles.scss index b3943ddfd..a795b0b47 100644 --- a/packages/hoppscotch-app/assets/scss/styles.scss +++ b/packages/hoppscotch-app/assets/scss/styles.scss @@ -491,3 +491,9 @@ details summary::-webkit-details-marker { @apply overflow-auto; @apply break-words; } + +.env-highlight { + * { + @apply text-accentContrast; + } +} diff --git a/packages/hoppscotch-app/helpers/editor/extensions/HoppEnvironment.ts b/packages/hoppscotch-app/helpers/editor/extensions/HoppEnvironment.ts index 66a1bbd5d..6111a560f 100644 --- a/packages/hoppscotch-app/helpers/editor/extensions/HoppEnvironment.ts +++ b/packages/hoppscotch-app/helpers/editor/extensions/HoppEnvironment.ts @@ -19,10 +19,11 @@ import { const HOPP_ENVIRONMENT_REGEX = /(<<\w+>>)/g const HOPP_ENV_HIGHLIGHT = - "cursor-help transition rounded px-1 focus:outline-none mx-0.5" + "cursor-help transition rounded px-1 focus:outline-none mx-0.5 env-highlight" const HOPP_ENV_HIGHLIGHT_FOUND = "bg-accentDark text-accentContrast hover:bg-accent" -const HOPP_ENV_HIGHLIGHT_NOT_FOUND = "bg-red-400 text-red-50 hover:bg-red-600" +const HOPP_ENV_HIGHLIGHT_NOT_FOUND = + "bg-red-500 text-accentContrast hover:bg-red-600" const cursorTooltipField = (aggregateEnvs: AggregateEnvironment[]) => hoverTooltip(