From c8e21fa1f5813eed81296a6d4de0213e08d692f9 Mon Sep 17 00:00:00 2001
From: shiibe <82057235+shiibe@users.noreply.github.com>
Date: Thu, 24 Oct 2024 17:13:59 -0400
Subject: [PATCH] Fix breadcrumb colors

---
 TaikoWebUI/Components/MainLayout.razor |  2 +-
 TaikoWebUI/wwwroot/css/app.css         | 90 ++++++++++++++++++++++++++
 TaikoWebUI/wwwroot/index.html          |  3 +-
 TaikoWebUI/wwwroot/style.overrides.css | 76 ----------------------
 4 files changed, 92 insertions(+), 79 deletions(-)
 delete mode 100644 TaikoWebUI/wwwroot/style.overrides.css

diff --git a/TaikoWebUI/Components/MainLayout.razor b/TaikoWebUI/Components/MainLayout.razor
index 7040648..3194342 100644
--- a/TaikoWebUI/Components/MainLayout.razor
+++ b/TaikoWebUI/Components/MainLayout.razor
@@ -15,7 +15,7 @@
 <MudLayout>
     <MudAppBar Elevation="0">
         <MudIconButton Icon="@Icons.Material.Filled.Menu" Color="Color.Inherit" Edge="Edge.Start" OnClick="DrawerToggle" Size="Size.Small" />
-        <MudBreadcrumbs Items="BreadcrumbsStateContainer.breadcrumbs" Class="p-0"></MudBreadcrumbs>
+        <MudBreadcrumbs Items="BreadcrumbsStateContainer.breadcrumbs" Class="p-0 top-breadcrumbs"></MudBreadcrumbs>
         <MudSpacer />
         <MudStack Spacing="3" Row="true">
             <LanguageToggle />
diff --git a/TaikoWebUI/wwwroot/css/app.css b/TaikoWebUI/wwwroot/css/app.css
index 06f8fa2..5e0bd29 100644
--- a/TaikoWebUI/wwwroot/css/app.css
+++ b/TaikoWebUI/wwwroot/css/app.css
@@ -210,4 +210,94 @@
     padding: 0.5em 1em;
     min-width: 500px;
     width: 65%;
+}
+
+.dani-results .mud-progress-linear {
+    height: 25px !important;
+}
+
+.mud-progress-linear.bar-pass-gold .mud-progress-linear-bars .mud-progress-linear-bar {
+    background: linear-gradient( 90deg, rgb(255,83,147) 0%, rgb(255,248,6) 15%, rgb(255,248,6) 20%, rgb(122,255,79) 30%, rgb(122,244,255) 45%, rgb(149,104,255) 70%, rgb(255,98,244) 90%, rgb(255,98,244) 95%, rgb(255,83,147) 100% );
+}
+
+.mud-progress-linear.bar-pass-red .mud-progress-linear-bars .mud-progress-linear-bar {
+    background-color: #ff584d;
+}
+
+.mud-progress-linear.bar-default .mud-progress-linear-bars .mud-progress-linear-bar {
+    background-color: lightgrey;
+}
+
+.mud-progress-linear.bar-pass-gold .mud-typography,
+.mud-progress-linear.bar-pass-red .mud-typography {
+    font-weight: bold;
+    color: #333;
+}
+
+.mud-table-toolbar {
+    flex-wrap: wrap;
+    height: inherit;
+    padding: 20px 10px;
+}
+
+.color-box {
+    width: 16px;
+    height: 16px;
+    border-radius: 9999px;
+    display: inline-block;
+    margin-right: 10px;
+    border: 1px solid black;
+    position: relative;
+    top: 2px;
+}
+
+.columns-panel {
+    column-count: 2;
+}
+
+.ai-battle-td {
+    position: sticky;
+    left: 0;
+    top: 0;
+    z-index: 99;
+    background: #FAFAFA;
+    display: none;
+}
+
+.dialog-user-qr-code svg {
+    /* makes the qr code render with no subpixels */
+    transform: scale(1.1);
+}
+
+tr.is-current-user {
+    background-color: #8c9eff75 !important
+}
+
+tr.is-current-user td,
+tr.is-current-user span,
+tr.is-current-user p {
+    font-weight: bold;
+}
+
+.lang-menu-item .mud-list-item-icon {
+    min-width: 26px;
+}
+
+@media only screen and (min-width: 600px) {
+    .ai-battle-td {
+        display: revert;
+    }
+}
+
+.mud-breadcrumb-item {
+    font-size: 15px;
+}
+
+.mud-breadcrumb-item a,
+.mud-breadcrumb-separator span {
+    color: white;
+}
+
+.mud-breadcrumb-item.mud-disabled a {
+    color: rgba(255, 255, 255, 0.6);
 }
\ No newline at end of file
diff --git a/TaikoWebUI/wwwroot/index.html b/TaikoWebUI/wwwroot/index.html
index 895fd01..6edafaf 100644
--- a/TaikoWebUI/wwwroot/index.html
+++ b/TaikoWebUI/wwwroot/index.html
@@ -7,9 +7,8 @@
     <title>TaikoWebUI</title>
     <base href="/" />
     <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet" />
-    <link href="css/app.css" rel="stylesheet"/>
     <link href="_content/MudBlazor/MudBlazor.min.css" rel="stylesheet" />
-    <link href="style.overrides.css" rel="stylesheet" />
+    <link href="css/app.css" rel="stylesheet"/>
 </head>
 
 <body>
diff --git a/TaikoWebUI/wwwroot/style.overrides.css b/TaikoWebUI/wwwroot/style.overrides.css
deleted file mode 100644
index f0d83e2..0000000
--- a/TaikoWebUI/wwwroot/style.overrides.css
+++ /dev/null
@@ -1,76 +0,0 @@
-.dani-results .mud-progress-linear {
-    height: 25px !important;
-}
-
-.mud-progress-linear.bar-pass-gold .mud-progress-linear-bars .mud-progress-linear-bar {
-    background: linear-gradient( 90deg, rgb(255,83,147) 0%, rgb(255,248,6) 15%, rgb(255,248,6) 20%, rgb(122,255,79) 30%, rgb(122,244,255) 45%, rgb(149,104,255) 70%, rgb(255,98,244) 90%, rgb(255,98,244) 95%, rgb(255,83,147) 100% );
-}
-
-.mud-progress-linear.bar-pass-red .mud-progress-linear-bars .mud-progress-linear-bar {
-    background-color: #ff584d;
-}
-
-.mud-progress-linear.bar-default .mud-progress-linear-bars .mud-progress-linear-bar {
-    background-color: lightgrey;
-}
-
-.mud-progress-linear.bar-pass-gold .mud-typography,
-.mud-progress-linear.bar-pass-red .mud-typography {
-    font-weight: bold;
-    color: #333;
-}
-
-.mud-table-toolbar {
-    flex-wrap: wrap;
-    height: inherit;
-    padding: 20px 10px;
-}
-
-.color-box {
-    width: 16px;
-    height: 16px;
-    border-radius: 9999px;
-    display: inline-block;
-    margin-right: 10px;
-    border: 1px solid black;
-    position: relative;
-    top: 2px;
-}
-
-.columns-panel {
-    column-count: 2;
-}
-
-.ai-battle-td {
-    position: sticky;
-    left: 0;
-    top: 0;
-    z-index: 99;
-    background: #FAFAFA;
-    display: none;
-}
-
-.dialog-user-qr-code svg {
-    /* makes the qr code render with no subpixels */
-    transform: scale(1.1);
-}
-
-tr.is-current-user {
-    background-color: #8c9eff75 !important
-}
-
-tr.is-current-user td,
-tr.is-current-user span,
-tr.is-current-user p {
-    font-weight: bold;
-}
-
-.lang-menu-item .mud-list-item-icon {
-    min-width: 26px;
-}
-
-@media only screen and (min-width: 600px) {
-    .ai-battle-td {
-        display: revert;
-    }
-}
\ No newline at end of file