fix: broken environment highlight color

packages/hoppscotch-common/assets/scss/styles.scss

@@ -135,7 +135,7 @@ a {
     @apply shadow-none;
     @apply fixed;
     @apply inline-flex;
-    @apply -mt-6;
+    @apply -mt-8;
   }
 }
 
@@ -538,8 +538,16 @@ details[open] summary .indicator {
 }
 
 .env-highlight {
-  * {
   @apply text-accentContrast;
+
+  &.env-found {
+    @apply bg-accentDark;
+    @apply hover:bg-accent;
+  }
+
+  &.env-not-found {
+    @apply bg-red-500;
+    @apply hover:bg-red-600;
   }
 }
 

packages/hoppscotch-common/src/components.d.ts

@@ -100,21 +100,17 @@ declare module '@vue/runtime-core' {
     HttpTests: typeof import('./components/http/Tests.vue')['default']
     HttpURLEncodedParams: typeof import('./components/http/URLEncodedParams.vue')['default']
     IconLucideArrowLeft: typeof import('~icons/lucide/arrow-left')['default']
-    IconLucideBrush: typeof import('~icons/lucide/brush')['default']
     IconLucideCheckCircle: typeof import('~icons/lucide/check-circle')['default']
     IconLucideChevronRight: typeof import('~icons/lucide/chevron-right')['default']
     IconLucideGlobe: typeof import('~icons/lucide/globe')['default']
-    IconLucideHelpCircle: typeof import('~icons/lucide/help-circle')['default']
     IconLucideInbox: typeof import('~icons/lucide/inbox')['default']
     IconLucideInfo: typeof import('~icons/lucide/info')['default']
     IconLucideLayers: typeof import('~icons/lucide/layers')['default']
     IconLucideLoader: typeof import('~icons/lucide/loader')['default']
     IconLucideMinus: typeof import('~icons/lucide/minus')['default']
-    IconLucideRss: typeof import('~icons/lucide/rss')['default']
     IconLucideSearch: typeof import('~icons/lucide/search')['default']
     IconLucideUser: typeof import('~icons/lucide/user')['default']
     IconLucideUsers: typeof import('~icons/lucide/users')['default']
-    IconLucideVerified: typeof import('~icons/lucide/verified')['default']
     LensesHeadersRenderer: typeof import('./components/lenses/HeadersRenderer.vue')['default']
     LensesHeadersRendererEntry: typeof import('./components/lenses/HeadersRendererEntry.vue')['default']
     LensesRenderersHTMLLensRenderer: typeof import('./components/lenses/renderers/HTMLLensRenderer.vue')['default']

packages/hoppscotch-common/src/helpers/editor/extensions/HoppEnvironment.ts

@@ -22,10 +22,8 @@ const HOPP_ENVIRONMENT_REGEX = /(<<[a-zA-Z0-9-_]+>>)/g
 
 const HOPP_ENV_HIGHLIGHT =
   "cursor-help transition rounded px-1 focus:outline-none mx-0.5 env-highlight"
-const HOPP_ENV_HIGHLIGHT_FOUND =
+const HOPP_ENV_HIGHLIGHT_FOUND = "env-found"
-  "bg-accentDark text-accentContrast hover:bg-accent"
+const HOPP_ENV_HIGHLIGHT_NOT_FOUND = "env-not-found"
-const HOPP_ENV_HIGHLIGHT_NOT_FOUND =
-  "bg-red-500 text-accentContrast hover:bg-red-600"
 
 const cursorTooltipField = (aggregateEnvs: AggregateEnvironment[]) =>
   hoverTooltip(

packages/hoppscotch-ui/src/stories/Anchor.story.vue

@@ -3,14 +3,14 @@
     <div class="text-secondaryLight text-tiny">
       By signing in, you are agreeing to our
       <SmartAnchor
-        class="link text-red-800"
+        class="text-red-800 link"
         to="https://docs.hoppscotch.io/terms"
         blank
         label="Terms of Service"
       />
       and
       <SmartAnchor
-        class="link text-red-600"
+        class="text-red-600 link"
         to="https://docs.hoppscotch.io/privacy"
         blank
         label="Privacy Policy"