From 7ce336a2ec500beffa2a1348a064c754b948a17c Mon Sep 17 00:00:00 2001
From: Badrish Chandramouli <badrishc@microsoft.com>
Date: Fri, 19 Jul 2024 13:07:03 -0700
Subject: [PATCH] Fix website accessibility issues (#527)

* fix search color

* oops

* accessibility fixes for docs/dev/configutaion.md

---------

Co-authored-by: Tal Zaccai <talzacc@microsoft.com>
---
 website/docs/dev/configuration.md | 4 ++++
 website/docusaurus.config.js      | 3 +++
 website/src/css/custom.css        | 8 +++++++-
 3 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/website/docs/dev/configuration.md b/website/docs/dev/configuration.md
index 0197b297ab..3063eca39d 100644
--- a/website/docs/dev/configuration.md
+++ b/website/docs/dev/configuration.md
@@ -12,6 +12,8 @@ It then calls the instance method **GetServerOptions()** which returns an instan
 
 ```mermaid
 flowchart LR
+    accTitle: Configuration Flow
+    accDescr: Garnet's configuration flow
     def[\Defaults File\]
     cmd[\Command Line Args\]
     conf[\Configuration File\]
@@ -44,6 +46,8 @@ This is done by calling the following factory methods:
 
 ```mermaid
 flowchart LR
+    accTitle: Configuration File Parsing Flow
+    accDescr: Garnet's configuration file parsing flow
     getsp[[StreamProviderFactory.GetStreamProvider]]
     getcp[[ConfigProviderFactory.GetConfigProvider]]
     spb[\StreamProviderBase\]
diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js
index 7ebac29780..eed2fd2c4c 100644
--- a/website/docusaurus.config.js
+++ b/website/docusaurus.config.js
@@ -72,6 +72,9 @@ const config = {
   themeConfig:
     /** @type {import('@docusaurus/preset-classic').ThemeConfig} */
     ({
+      mermaid: {
+        theme: {light: 'neutral', dark: 'dark'},
+      },
       // Replace with your project's social card
       //image: 'img/docusaurus-social-card.jpg',
       navbar: {
diff --git a/website/src/css/custom.css b/website/src/css/custom.css
index 4921d8b0ff..f2f95f433f 100644
--- a/website/src/css/custom.css
+++ b/website/src/css/custom.css
@@ -16,6 +16,7 @@
     --ifm-color-primary-light: #aa6e6f;
     --ifm-color-primary-lighter: #ae7677;
     --ifm-color-primary-lightest: #bc8e8e;
+    --ifm-navbar-search-input-placeholder-color: #686b6e;
 }
 /*:root {
   --ifm-color-primary: #2e8555;
@@ -43,8 +44,13 @@
 }
 */
 
+
+html[data-theme="dark"] {
+  --ifm-navbar-search-input-placeholder-color: #8a8d91;
+}
+
 .hero {
     background-image: url("/static/img/garnet-bg2-2800x720.jpg");
     background-repeat: no-repeat;
     background-size: cover;
-}
\ No newline at end of file
+}