Taiko_Stuff/TaikoLocalServer
1
0
Fork 0
mirror of synced 2024-11-24 06:50:15 +01:00
Code Releases Activity

Fix breadcrumb colors

Browse Source
This commit is contained in:
shiibe 2024-10-24 17:13:59 -04:00
parent ccee0e00be
commit c8e21fa1f5
4 changed files with 92 additions and 79 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
TaikoWebUI/Components/MainLayout.razor
View File

@ -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 />

90
TaikoWebUI/wwwroot/css/app.css
View File

@ -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);
}

3
TaikoWebUI/wwwroot/index.html
View File

@ -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>

76
TaikoWebUI/wwwroot/style.overrides.css
View File

@ -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;
}
}