[frontend/components] Add reusable warning banner
This commit is contained in:
parent
0a12087072
commit
c2fa48f51d
4 changed files with 17 additions and 7 deletions
|
@ -3,10 +3,10 @@
|
||||||
@inject IStringLocalizer<Localization> Loc;
|
@inject IStringLocalizer<Localization> Loc;
|
||||||
|
|
||||||
<div class="remote-user-notice">
|
<div class="remote-user-notice">
|
||||||
<span>
|
<WarningBanner>
|
||||||
@Loc["Information from remote users may be incomplete."]
|
@Loc["Information from remote users may be incomplete."]
|
||||||
<a href="@OriginalPageUrl" target="_blank">@Loc["Open original page"]</a>
|
<a href="@OriginalPageUrl" target="_blank">@Loc["Open original page"]</a>
|
||||||
</span>
|
</WarningBanner>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@code {
|
@code {
|
||||||
|
|
|
@ -1,8 +1,4 @@
|
||||||
.remote-user-notice {
|
.remote-user-notice {
|
||||||
max-width: 45rem;
|
max-width: 45rem;
|
||||||
padding: 0.5rem 1rem;
|
margin: 0 auto auto;
|
||||||
margin: 1rem auto auto;
|
|
||||||
border: 1px solid var(--warning-color);
|
|
||||||
color: var(--warning-color);
|
|
||||||
border-radius: 0.5rem;
|
|
||||||
}
|
}
|
7
Iceshrimp.Frontend/Components/WarningBanner.razor
Normal file
7
Iceshrimp.Frontend/Components/WarningBanner.razor
Normal file
|
@ -0,0 +1,7 @@
|
||||||
|
<div class="warning-banner">
|
||||||
|
@ChildContent
|
||||||
|
</div>
|
||||||
|
|
||||||
|
@code {
|
||||||
|
[Parameter] public RenderFragment? ChildContent { get; set; }
|
||||||
|
}
|
7
Iceshrimp.Frontend/Components/WarningBanner.razor.css
Normal file
7
Iceshrimp.Frontend/Components/WarningBanner.razor.css
Normal file
|
@ -0,0 +1,7 @@
|
||||||
|
.warning-banner {
|
||||||
|
padding: 0.5rem 1rem;
|
||||||
|
margin: 1rem auto auto;
|
||||||
|
border: 1px solid var(--warning-color);
|
||||||
|
color: var(--warning-color);
|
||||||
|
border-radius: 0.5rem;
|
||||||
|
}
|
Loading…
Add table
Reference in a new issue