root/Wonky.Client
root/Wonky.Client
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

FIX: change top bar color for sandbox - make username smaller to fit

Browse source
This commit is contained in:
Frede Hundewadt 2023-06-13 11:34:41 +02:00
parent bee00da792
commit 9055324779
4 changed files with 23 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
Wonky.Client/Components/AppSandbox.razor
View file

@ -18,7 +18,7 @@
@if (_app!.Sandbox)
{
<div class="badge text-bg-danger mx-3">EDU DEMO</div>
<div class="badge text-bg-danger mx-3 pt-2">DEMO SANDKASSE</div>
}
@code
{

2
Wonky.Client/Components/TopbarDisplayUser.razor
View file

@ -18,7 +18,7 @@
<AuthorizeView>
<Authorized>
<div class="d-print-none">
@context.User.Identity?.Name
<span style="font-size: 14px;">@context.User.Identity?.Name</span>
</div>
</Authorized>
</AuthorizeView>

16
Wonky.Client/Shared/MainLayout.razor
View file

@ -16,14 +16,15 @@
@inherits LayoutComponentBase
@using Wonky.Client.Components
@using Wonky.Entity.Configuration
@using Microsoft.Extensions.Options
<div class="page">
<div class="sidebar d-print-none">
<NavMenu/>
</div>
<main>
<div class="top-row px-4 d-print-none">
<AppVersion />
<div class="top-row px-4 d-print-none @(_app.Sandbox ? "sandbox" : "")">
<AppSandbox />
<TopbarNavigation/>
</div>
@ -36,3 +37,14 @@
<BlazoredToasts Position="ToastPosition.TopRight" Timeout="10" />
</main>
</div>
@code{
[Inject] IOptions<AppInfo?>? AppInfo { get; set; }
private AppInfo? _app;
protected override void OnInitialized()
{
_app = AppInfo?.Value;
}
}

7
Wonky.Client/Shared/MainLayout.razor.css
View file

@ -25,6 +25,7 @@ main {
.sidebar {
background-image: linear-gradient(180deg, rgb(22, 21, 23) 10%, #ffaa00 100%);
}
.bar-system-date {
color: #ffaa00;
background-color: #0e0e0e;
@ -36,6 +37,7 @@ main {
font-size: 2rem;
font-variant: all-petite-caps;
}
.top-row {
color: #ffaa00;
background-color: #0e0e0e;
@ -63,6 +65,11 @@ main {
text-overflow: ellipsis;
}
.sandbox {
color: black;
background-color: darkred;
}
@media (max-width: 1024px) {
.top-row:not(.auth) {