From 00396f063fbbd7c3ddd76ac078439f7703ae1a52 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marina=20A=C3=ADsa?= <marina.aisa@apple.com>
Date: Tue, 19 Nov 2024 18:14:20 +0100
Subject: [PATCH] Delete unnecessary nav-dark mode in HierarchyCollapsedItems

---
 .../Hero/HierarchyCollapsedItems.vue              | 15 ---------------
 src/styles/core/colors/_dark.scss                 |  4 ++--
 src/styles/core/colors/_light.scss                |  4 ++--
 3 files changed, 4 insertions(+), 19 deletions(-)

diff --git a/src/components/DocumentationTopic/Hero/HierarchyCollapsedItems.vue b/src/components/DocumentationTopic/Hero/HierarchyCollapsedItems.vue
index 926acb355..14e7ea13f 100644
--- a/src/components/DocumentationTopic/Hero/HierarchyCollapsedItems.vue
+++ b/src/components/DocumentationTopic/Hero/HierarchyCollapsedItems.vue
@@ -100,7 +100,6 @@ $border-width: 1px;
 // Values specified in rgba due to alpha transparency used in the background
 // of the nav area, so they are represented as clear overlays here
 $toggle-bg-color: var(--color-nav-hierarchy-collapse-background);
-$toggle-bg-color-dark: var(--color-nav-dark-hierarchy-collapse-background);
 $toggle-bg-color-hover: var(--color-nav-hierarchy-collapse-background-hover);
 $toggle-border-color: var(--color-nav-hierarchy-collapse-borders);
 $toggle-border-color-hover: var(--color-nav-hierarchy-collapse-borders-hover);
@@ -111,9 +110,7 @@ $toggle-width: rem(36px);
 // Values specified here are opaque versions of the dropdown colors so that
 // they match (without using alpha)
 $dropdown-bg-color: $toggle-bg-color;
-$dropdown-bg-color-dark: $toggle-bg-color-dark;
 $dropdown-border-color: var(--color-nav-hierarchy-collapse-borders);
-$dropdown-border-color-dark: var(--color-nav-dark-hierarchy-collapse-borders);
 $dropdown-transition-duration: 250ms;
 $hierarchy-dropdown-border-width: 0px !default;
 $hierarchy-dropdown-box-shadow: 0 1px 4px -1px var(--color-figure-gray-secondary) !default;
@@ -197,10 +194,6 @@ $dropdown-vertical-offset: rem(7px);
   position: absolute;
   z-index: 42;
   top: calc(100% + #{$dropdown-vertical-offset});
-  @include nav-dark() {
-    background: $dropdown-bg-color-dark;
-    border-color: $dropdown-border-color-dark;
-  }
 
   &.collapsed {
     opacity: 0;
@@ -238,10 +231,6 @@ $dropdown-vertical-offset: rem(7px);
     left: $tail-offset;
     position: absolute;
     top: rem($border-width) - $tail-width;
-
-    @include nav-dark() {
-      border-bottom-color: $dropdown-bg-color-dark;
-    }
   }
 }
 
@@ -250,10 +239,6 @@ $dropdown-vertical-offset: rem(7px);
   border-top-style: $border-style;
   border-top-width: $border-width;
 
-  @include nav-dark() {
-    border-top-color: $dropdown-border-color-dark;
-  }
-
   &:first-child {
     border-top: none;
   }
diff --git a/src/styles/core/colors/_dark.scss b/src/styles/core/colors/_dark.scss
index 069d75701..2b4a5da38 100644
--- a/src/styles/core/colors/_dark.scss
+++ b/src/styles/core/colors/_dark.scss
@@ -44,8 +44,8 @@
   --color-nav-color: var(--color-nav-dark-color);
   --color-nav-current-link: var(--color-nav-dark-current-link);
   --color-nav-expanded: var(--color-nav-dark-expanded);
-  --color-nav-hierarchy-collapse-background: var(--color-nav-dark-hierarchy-collapse-background);
-  --color-nav-hierarchy-collapse-borders: var(--color-nav-dark-hierarchy-collapse-borders);
+  --color-nav-hierarchy-collapse-background: #{dark-color(fill-gray-tertiary)};
+  --color-nav-hierarchy-collapse-borders: #{light-color(figure-gray-secondary)};
   --color-nav-hierarchy-collapse-background-hover: #{change-color(dark-color(fill-blue), $alpha: 0.5)};
   --color-nav-hierarchy-collapse-borders-hover: #{dark-color(figure-blue)};
   --color-nav-hierarchy-item-borders: var(--color-nav-dark-hierarchy-item-borders);
diff --git a/src/styles/core/colors/_light.scss b/src/styles/core/colors/_light.scss
index ffdb91408..e3b504d9c 100644
--- a/src/styles/core/colors/_light.scss
+++ b/src/styles/core/colors/_light.scss
@@ -103,7 +103,9 @@
   --color-nav-current-link: #{change-color(light-color(figure-gray))};
   --color-nav-expanded: #{light-color(fill)};
   --color-nav-hierarchy-collapse-background: #{light-color(fill-gray-tertiary)};
+  --color-nav-hierarchy-collapse-background-hover: #{change-color(light-color(fill-blue), $alpha: 0.05)};
   --color-nav-hierarchy-collapse-borders: #{dark-color(figure-gray-secondary)};
+  --color-nav-hierarchy-collapse-borders-hover: #{light-color(figure-blue)};
   --color-nav-hierarchy-item-borders: #{dark-color(figure-gray-secondary)};
   --color-nav-keyline: #{change-color(light-color(figure-gray), $alpha: 0.2)};
   --color-nav-link-color: #{light-color(figure-gray)};
@@ -120,8 +122,6 @@
   --color-nav-dark-color: #{dark-color(figure-gray)};
   --color-nav-dark-current-link: #{change-color(dark-color(figure-gray))};
   --color-nav-dark-expanded: #{dark-color(fill-tertiary)};
-  --color-nav-dark-hierarchy-collapse-background: #{dark-color(fill-gray-tertiary)};
-  --color-nav-dark-hierarchy-collapse-borders: #{light-color(figure-gray-secondary)};
   --color-nav-dark-hierarchy-item-borders: #{dark-color(fill-gray-tertiary)};
   --color-nav-dark-keyline: #{change-color(dark-color(fill-gray-tertiary), $alpha: 0.95)};
   --color-nav-dark-link-color: #{dark-color(figure-gray)};