From b4a9181517d84ff5798da8db480ea6ca050bbfc1 Mon Sep 17 00:00:00 2001
From: Ronit Jadhav <ronitjadhav17@gmail.com>
Date: Fri, 15 Mar 2024 12:56:34 +0100
Subject: [PATCH 1/3] Updated styling for the navigation-button

---
 .../src/app/record/header-record/header-record.component.html  | 1 +
 .../src/lib/navigation-button/navigation-button.component.css  | 3 +++
 .../src/lib/navigation-button/navigation-button.component.html | 2 +-
 3 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/apps/datahub/src/app/record/header-record/header-record.component.html b/apps/datahub/src/app/record/header-record/header-record.component.html
index 7cf866be08..0a646c0e55 100644
--- a/apps/datahub/src/app/record/header-record/header-record.component.html
+++ b/apps/datahub/src/app/record/header-record/header-record.component.html
@@ -8,6 +8,7 @@
           (click)="back()"
           [label]="'datahub.search.back' | translate"
           [icon]="'arrow_back'"
+          [style.--navigation-button-color]="foregroundColor"
         >
         </gn-ui-navigation-button>
       </div>
diff --git a/libs/ui/inputs/src/lib/navigation-button/navigation-button.component.css b/libs/ui/inputs/src/lib/navigation-button/navigation-button.component.css
index e69de29bb2..b84096e30c 100644
--- a/libs/ui/inputs/src/lib/navigation-button/navigation-button.component.css
+++ b/libs/ui/inputs/src/lib/navigation-button/navigation-button.component.css
@@ -0,0 +1,3 @@
+button {
+  color: var(--navigation-button-color);
+}
diff --git a/libs/ui/inputs/src/lib/navigation-button/navigation-button.component.html b/libs/ui/inputs/src/lib/navigation-button/navigation-button.component.html
index 97789516cf..a1e161b544 100644
--- a/libs/ui/inputs/src/lib/navigation-button/navigation-button.component.html
+++ b/libs/ui/inputs/src/lib/navigation-button/navigation-button.component.html
@@ -1,5 +1,5 @@
 <button
-  class="group flex items-center justify-center gap-1 backdrop-blur p-1 bg-primary-opacity-30 text-white rounded content-center"
+  class="group flex items-center justify-center gap-1 backdrop-blur p-1 bg-primary-opacity-30 rounded content-center"
 >
   <mat-icon class="material-symbols-outlined align-middle w-[18px]">{{
     icon

From a78d4d271eedb3fa4d0d9c9ac4cc42df278e300f Mon Sep 17 00:00:00 2001
From: Ronit Jadhav <ronitjadhav17@gmail.com>
Date: Mon, 18 Mar 2024 12:14:58 +0100
Subject: [PATCH 2/3] Update styling for the language-switcher

---
 .../src/app/record/header-record/header-record.component.html | 4 +++-
 .../lib/language-switcher/language-switcher.component.html    | 2 +-
 tailwind.base.css                                             | 4 ++--
 3 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/apps/datahub/src/app/record/header-record/header-record.component.html b/apps/datahub/src/app/record/header-record/header-record.component.html
index 0a646c0e55..20dc00144d 100644
--- a/apps/datahub/src/app/record/header-record/header-record.component.html
+++ b/apps/datahub/src/app/record/header-record/header-record.component.html
@@ -24,7 +24,9 @@
         ></gn-ui-favorite-star>
         <gn-ui-language-switcher
           *ngIf="showLanguageSwitcher"
-          class="language-switcher text-[13px] text-white bg-opacity-0 border border-white rounded mt-0.5"
+          class="language-switcher text-[13px] mt-0.5"
+          [style.--color-main]="foregroundColor"
+          [style.--color-gray-300]="foregroundColor"
         ></gn-ui-language-switcher>
       </div>
     </div>
diff --git a/libs/ui/catalog/src/lib/language-switcher/language-switcher.component.html b/libs/ui/catalog/src/lib/language-switcher/language-switcher.component.html
index 6922b307ad..c1e704ccbd 100644
--- a/libs/ui/catalog/src/lib/language-switcher/language-switcher.component.html
+++ b/libs/ui/catalog/src/lib/language-switcher/language-switcher.component.html
@@ -5,6 +5,6 @@
   [selected]="currentLang"
   ariaName="languages"
   [showTitle]="false"
-  [extraBtnClass]="'flex justify-items-center text-white !pl-2 !py-1'"
+  [extraBtnClass]="'flex justify-items-center !pl-2 !py-1'"
 >
 </gn-ui-dropdown-selector>
diff --git a/tailwind.base.css b/tailwind.base.css
index 7228a1dd10..c9488882bf 100644
--- a/tailwind.base.css
+++ b/tailwind.base.css
@@ -31,8 +31,8 @@
 
   .btn-outline {
     @apply btn text-main
-      bg-white hover:text-primary-darker focus:text-primary-darker active:text-primary-black
-      border border-gray-300 hover:border-primary-lighter focus:border-primary-lighter focus:ring-4 focus:ring-primary-lightest active:border-primary-darker;
+    bg-transparent hover:text-primary-darker focus:text-primary-darker active:text-primary-black
+    border border-gray-300 hover:border-primary-lighter focus:border-primary-lighter focus:ring-4 focus:ring-primary-lightest active:border-primary-darker;
   }
 
   .btn-light {

From 392a35238156c3a24b667365a6526cdb074df0d7 Mon Sep 17 00:00:00 2001
From: Ronit Jadhav <ronitjadhav17@gmail.com>
Date: Mon, 18 Mar 2024 13:26:17 +0100
Subject: [PATCH 3/3] All text in the header is of same color

---
 .../record/header-record/header-record.component.html    | 9 ++++-----
 .../navigation-button/navigation-button.component.css    | 2 +-
 2 files changed, 5 insertions(+), 6 deletions(-)

diff --git a/apps/datahub/src/app/record/header-record/header-record.component.html b/apps/datahub/src/app/record/header-record/header-record.component.html
index 20dc00144d..540d37031d 100644
--- a/apps/datahub/src/app/record/header-record/header-record.component.html
+++ b/apps/datahub/src/app/record/header-record/header-record.component.html
@@ -37,7 +37,7 @@
     >
       {{ metadata.title }}
     </div>
-    <div class="flex flex-row text-white gap-2 mb-4 ml-4">
+    <div class="flex flex-row gap-2 mb-4 ml-4" [style.color]="foregroundColor">
       <div
         *ngIf="(isGeodata$ | async) === true"
         class="flex flex-row bg-primary-darker rounded"
@@ -45,18 +45,17 @@
         <span class="material-symbols-outlined mt-0.5 ml-2 text-[20px]">
           my_location
         </span>
-        <p class="text-white ml-2 mr-2" translate>record.metadata.type</p>
+        <p class="ml-2 mr-2" translate>record.metadata.type</p>
       </div>
       <div *ngIf="metadata.recordUpdated" class="flex flex-row gap-1">
-        <p class="text-white" translate>record.metadata.lastUpdate</p>
-        <p class="text-white">
+        <p translate>record.metadata.lastUpdate</p>
+        <p>
           {{ lastUpdate }}
         </p>
       </div>
       <div *ngIf="metadata.status" class="flex flex-row gap-2">
         <p>•</p>
         <p
-          class="text-white"
           [innerHTML]="'domain.record.status.' + metadata.status | translate"
         ></p>
       </div>
diff --git a/libs/ui/inputs/src/lib/navigation-button/navigation-button.component.css b/libs/ui/inputs/src/lib/navigation-button/navigation-button.component.css
index b84096e30c..847e129969 100644
--- a/libs/ui/inputs/src/lib/navigation-button/navigation-button.component.css
+++ b/libs/ui/inputs/src/lib/navigation-button/navigation-button.component.css
@@ -1,3 +1,3 @@
 button {
-  color: var(--navigation-button-color);
+  color: var(--navigation-button-color, --color-background);
 }