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) @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 @code
{ {

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

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

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

@ -16,14 +16,15 @@
@inherits LayoutComponentBase @inherits LayoutComponentBase
@using Wonky.Client.Components @using Wonky.Client.Components
@using Wonky.Entity.Configuration
@using Microsoft.Extensions.Options
<div class="page"> <div class="page">
<div class="sidebar d-print-none"> <div class="sidebar d-print-none">
<NavMenu/> <NavMenu/>
</div> </div>
<main> <main>
<div class="top-row px-4 d-print-none"> <div class="top-row px-4 d-print-none @(_app.Sandbox ? "sandbox" : "")">
<AppVersion />
<AppSandbox /> <AppSandbox />
<TopbarNavigation/> <TopbarNavigation/>
</div> </div>
@ -36,3 +37,14 @@
<BlazoredToasts Position="ToastPosition.TopRight" Timeout="10" /> <BlazoredToasts Position="ToastPosition.TopRight" Timeout="10" />
</main> </main>
</div> </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 { .sidebar {
background-image: linear-gradient(180deg, rgb(22, 21, 23) 10%, #ffaa00 100%); background-image: linear-gradient(180deg, rgb(22, 21, 23) 10%, #ffaa00 100%);
} }
.bar-system-date { .bar-system-date {
color: #ffaa00; color: #ffaa00;
background-color: #0e0e0e; background-color: #0e0e0e;
@ -36,6 +37,7 @@ main {
font-size: 2rem; font-size: 2rem;
font-variant: all-petite-caps; font-variant: all-petite-caps;
} }
.top-row { .top-row {
color: #ffaa00; color: #ffaa00;
background-color: #0e0e0e; background-color: #0e0e0e;
@ -63,6 +65,11 @@ main {
text-overflow: ellipsis; text-overflow: ellipsis;
} }
.sandbox {
color: black;
background-color: darkred;
}
@media (max-width: 1024px) { @media (max-width: 1024px) {
.top-row:not(.auth) { .top-row:not(.auth) {