From fba1409143711330f60a82b60c362aeca913887f Mon Sep 17 00:00:00 2001
From: Hugo <hugoattal@hotmail.fr>
Date: Wed, 13 Apr 2022 22:57:14 +0200
Subject: [PATCH 1/3] fix: Lock link color with tailwind class

---
 packages/histoire/src/client/app/components/app/AppHeader.vue | 4 ++--
 .../src/client/app/components/base/BaseListItemLink.vue       | 2 +-
 packages/histoire/src/client/app/components/base/BaseTab.vue  | 2 +-
 .../app/components/story/toolbar/StoryVariantNewTab.vue       | 2 +-
 4 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/histoire/src/client/app/components/app/AppHeader.vue b/packages/histoire/src/client/app/components/app/AppHeader.vue
index e112ccf6..e4970506 100644
--- a/packages/histoire/src/client/app/components/app/AppHeader.vue
+++ b/packages/histoire/src/client/app/components/app/AppHeader.vue
@@ -39,7 +39,7 @@ onKeyboardShortcut(['ctrl+shift+d', 'meta+shift+d'], (event) => {
     <div class="htw-ml-auto htw-flex-none htw-flex">
       <a
         v-tooltip="makeTooltip('Search', ({ isMac }) => isMac ? 'meta+k' : 'ctrl+k')"
-        class="htw-p-2 sm:htw-p-1 hover:htw-text-primary-500 dark:hover:htw-text-primary-400 htw-cursor-pointer"
+        class="htw-p-2 sm:htw-p-1 hover:htw-text-primary-500 dark:hover:htw-text-primary-400 htw-cursor-pointer htw-text-gray-900 dark:htw-text-gray-100"
         data-test-id="search-btn"
         @click="$emit('search')"
       >
@@ -51,7 +51,7 @@ onKeyboardShortcut(['ctrl+shift+d', 'meta+shift+d'], (event) => {
 
       <a
         v-tooltip="makeTooltip('Toggle dark mode', ({ isMac }) => isMac ? 'meta+shift+d' : 'ctrl+shift+d')"
-        class="htw-p-2 sm:htw-p-1 hover:htw-text-primary-500 dark:hover:htw-text-primary-400 htw-cursor-pointer"
+        class="htw-p-2 sm:htw-p-1 hover:htw-text-primary-500 dark:hover:htw-text-primary-400 htw-cursor-pointer htw-text-gray-900 dark:htw-text-gray-100"
         @click="toggleDark()"
       >
         <Icon
diff --git a/packages/histoire/src/client/app/components/base/BaseListItemLink.vue b/packages/histoire/src/client/app/components/base/BaseListItemLink.vue
index 55a11a2d..28928ae0 100644
--- a/packages/histoire/src/client/app/components/base/BaseListItemLink.vue
+++ b/packages/histoire/src/client/app/components/base/BaseListItemLink.vue
@@ -36,7 +36,7 @@ export default defineComponent({
   >
     <a
       :href="href"
-      class="htw-flex htw-items-center htw-gap-2"
+      class="htw-flex htw-items-center htw-gap-2 htw-text-gray-900 dark:htw-text-gray-100"
       :class="[
         $attrs.class,
         (isActive != null ? isActive : linkIsActive)
diff --git a/packages/histoire/src/client/app/components/base/BaseTab.vue b/packages/histoire/src/client/app/components/base/BaseTab.vue
index d1c7684f..48bd7557 100644
--- a/packages/histoire/src/client/app/components/base/BaseTab.vue
+++ b/packages/histoire/src/client/app/components/base/BaseTab.vue
@@ -27,7 +27,7 @@ export default defineComponent({
     <a
       v-bind="$attrs"
       :href="href"
-      class="htw-px-4 htw-h-full htw-inline-flex htw-items-center hover:htw-bg-primary-50 dark:hover:htw-bg-primary-900 htw-relative"
+      class="htw-px-4 htw-h-full htw-inline-flex htw-items-center hover:htw-bg-primary-50 dark:hover:htw-bg-primary-900 htw-relative  htw-text-gray-900 dark:htw-text-gray-100"
       :class="{
         'htw-text-primary-500 dark:htw-text-primary-400': matched != null ? matched : (exact && isExactActive) || (!exact && isActive),
       }"
diff --git a/packages/histoire/src/client/app/components/story/toolbar/StoryVariantNewTab.vue b/packages/histoire/src/client/app/components/story/toolbar/StoryVariantNewTab.vue
index 523f2370..7ef336cb 100644
--- a/packages/histoire/src/client/app/components/story/toolbar/StoryVariantNewTab.vue
+++ b/packages/histoire/src/client/app/components/story/toolbar/StoryVariantNewTab.vue
@@ -19,7 +19,7 @@ const sandboxUrl = computed(() => {
     v-tooltip="'Open variant in new tab'"
     :href="sandboxUrl"
     target="_blank"
-    class="htw-flex htw-items-center htw-gap-1 htw-h-full htw-px-2 hover:htw-text-primary-500 htw-opacity-50 hover:htw-opacity-100"
+    class="htw-flex htw-items-center htw-gap-1 htw-h-full htw-px-2 hover:htw-text-primary-500 htw-opacity-50 hover:htw-opacity-100 dark:hover:htw-text-primary-400 htw-text-gray-900 dark:htw-text-gray-100"
   >
     <Icon
       icon="carbon:launch"

From ec44daebc31b15493628681b00105a0b383ee8ec Mon Sep 17 00:00:00 2001
From: Hugo <hugoattal@hotmail.fr>
Date: Wed, 13 Apr 2022 23:00:33 +0200
Subject: [PATCH 2/3] typo

---
 packages/histoire/src/client/app/components/base/BaseTab.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/histoire/src/client/app/components/base/BaseTab.vue b/packages/histoire/src/client/app/components/base/BaseTab.vue
index 48bd7557..e0a9855b 100644
--- a/packages/histoire/src/client/app/components/base/BaseTab.vue
+++ b/packages/histoire/src/client/app/components/base/BaseTab.vue
@@ -27,7 +27,7 @@ export default defineComponent({
     <a
       v-bind="$attrs"
       :href="href"
-      class="htw-px-4 htw-h-full htw-inline-flex htw-items-center hover:htw-bg-primary-50 dark:hover:htw-bg-primary-900 htw-relative  htw-text-gray-900 dark:htw-text-gray-100"
+      class="htw-px-4 htw-h-full htw-inline-flex htw-items-center hover:htw-bg-primary-50 dark:hover:htw-bg-primary-900 htw-relative htw-text-gray-900 dark:htw-text-gray-100"
       :class="{
         'htw-text-primary-500 dark:htw-text-primary-400': matched != null ? matched : (exact && isExactActive) || (!exact && isActive),
       }"

From 190380e40f41b9d915ca57d48068ee6d90bcbfd5 Mon Sep 17 00:00:00 2001
From: Hugo <hugoattal@hotmail.fr>
Date: Wed, 13 Apr 2022 23:20:23 +0200
Subject: [PATCH 3/3] fix cypress test

---
 examples/vue3/cypress/integration/search.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/examples/vue3/cypress/integration/search.js b/examples/vue3/cypress/integration/search.js
index 7e7722be..06fb70e3 100644
--- a/examples/vue3/cypress/integration/search.js
+++ b/examples/vue3/cypress/integration/search.js
@@ -27,6 +27,7 @@ describe('Search', () => {
     cy.visit('/')
     // Click on backdrop
     cy.get('[data-test-id="search-btn"]').click()
+    cy.get('[data-test-id="search-modal"]').should('be.visible')
     cy.get('body').click(10, 10)
     cy.get('[data-test-id="search-modal"]').should('not.be.visible')
     // Use escape key