From b399e676a1e5e2e089963602e98fbaa024aee5b7 Mon Sep 17 00:00:00 2001
From: Alan Orth <alan.orth@gmail.com>
Date: Sat, 30 Sep 2023 18:57:38 +0300
Subject: [PATCH] src/themes/cgspace: import scss from dspace theme

Instead of copying the entire SCSS and having to keep it in sync
with upstream changes, just import the styles and override what
we need.
---
 .../cgspace/app/header/header.component.scss  | 26 +-------
 .../cgspace/app/navbar/navbar.component.scss  | 59 ++-----------------
 2 files changed, 7 insertions(+), 78 deletions(-)

diff --git a/src/themes/cgspace/app/header/header.component.scss b/src/themes/cgspace/app/header/header.component.scss
index 987ecf80f64..a58b1facf3c 100644
--- a/src/themes/cgspace/app/header/header.component.scss
+++ b/src/themes/cgspace/app/header/header.component.scss
@@ -1,28 +1,6 @@
-@media screen and (min-width: map-get($grid-breakpoints, md)) {
-  nav.navbar {
-    display: none;
-  }
-}
+@import '../../../dspace/app/header/header.component.scss';
 
-/* always set header background, not only on medium size screens! */
+// The dspace theme only sets the header background on medium screens and up
 .header {
   background-color: var(--ds-header-bg);
 }
-
-.navbar-brand img {
-  @media screen and (max-width: map-get($grid-breakpoints, md)) {
-    height: var(--ds-header-logo-height-xs);
-  }
-}
-.navbar-toggler .navbar-toggler-icon {
-  background-image: none !important;
-  line-height: 1.5;
-}
-
-.navbar-toggler {
-  color: var(--ds-header-icon-color);
-
-  &:hover, &:focus {
-    color: var(--ds-header-icon-color-hover);
-  }
-}
diff --git a/src/themes/cgspace/app/navbar/navbar.component.scss b/src/themes/cgspace/app/navbar/navbar.component.scss
index 1d996149765..f2fbb4c06d9 100644
--- a/src/themes/cgspace/app/navbar/navbar.component.scss
+++ b/src/themes/cgspace/app/navbar/navbar.component.scss
@@ -1,61 +1,12 @@
-nav.navbar {
-  // Ignore this style from the dspace theme because it creates a white gap
-  //border-top: 1px var(--ds-header-navbar-border-top-color) solid;
-  border-bottom: 5px var(--ds-header-navbar-border-bottom-color) solid;
-  align-items: baseline;
-  color: var(--ds-header-icon-color);
-}
-
-/** Mobile menu styling **/
-@media screen and (max-width: map-get($grid-breakpoints, md)-0.02) {
-  .navbar {
-    width: 100vw;
-    background-color: var(--bs-white);
-    position: absolute;
-    overflow: hidden;
-    height: 0;
-    &.open {
-      height: 100vh; //doesn't matter because wrapper is sticky
-    }
-  }
-}
-
-@media screen and (min-width: map-get($grid-breakpoints, md)) {
-  .reset-padding-md {
-    margin-left: calc(var(--bs-spacer) / -2);
-    margin-right: calc(var(--bs-spacer) / -2);
-  }
-}
+@import '../../../dspace/app/navbar/navbar.component.scss';
 
-/* TODO remove when https://github.com/twbs/bootstrap/issues/24726 is fixed */
-.navbar-expand-md.navbar-container {
-  @media screen and (max-width: map-get($grid-breakpoints, md)-0.02) {
-    > .navbar-inner-container {
-      padding: 0 var(--bs-spacer);
-      a.navbar-brand {
-        display: none;
-      }
-      .navbar-collapsed {
-        display: none;
-      }
-    }
-    padding: 0;
-  }
-  height: 80px;
-}
-
-a.navbar-brand img {
-  max-height: var(--ds-header-logo-height);
+nav.navbar {
+  // Override this style from the dspace theme because it creates a white gap
+  // on mobile.
+  border-top: none;
 }
 
 .navbar-nav {
-  ::ng-deep a.nav-link {
-    color: var(--ds-navbar-link-color);
-  }
-  ::ng-deep a.nav-link:hover {
-    color: var(--ds-navbar-link-color-hover);
-  }
-
   ::ng-deep ul a.nav-link {
     color: var(--ds-home-news-link-color);
   }