Refactor: wrap form labels in a div.col-sm-3 for improved layout and styling consistency.
This commit is contained in:
@@ -13,17 +13,19 @@
|
||||
<form @ref="form" class="@(validated ? " was-validated" : "needs-validation" )" novalidate>
|
||||
<div class="container">
|
||||
<div class="row mb-3 align-items-center">
|
||||
<Label Class="col-sm-3 col-form-label" For="name" HelpText="Gib deinen Namen ein" ResourceKey="Name">Name:
|
||||
</Label>
|
||||
<div class="col-sm-3">
|
||||
<Label For="name" HelpText="Gib deinen Namen ein" ResourceKey="Name">Name:</Label>
|
||||
</div>
|
||||
<div class="col-sm-9">
|
||||
<input id="name" class="form-control" @bind="@_name" required maxlength="120" />
|
||||
<div class="invalid-feedback">Bitte gib einen Namen ein (max. 120 Zeichen).</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mb-3 align-items-center">
|
||||
<Label Class="col-sm-3 col-form-label" For="year"
|
||||
HelpText="Gib das Jahr ein, in dem du die Matura abgeschlossen hast (z.B. 2020)"
|
||||
<div class="col-sm-3">
|
||||
<Label For="year" HelpText="Gib das Jahr ein, in dem du die Matura abgeschlossen hast (z.B. 2020)"
|
||||
ResourceKey="Year">Jahrgang: </Label>
|
||||
</div>
|
||||
<div class="col-sm-9">
|
||||
<input id="year" type="number" class="form-control" @bind="@_year" required min="1900"
|
||||
max="@Int32.MaxValue" />
|
||||
@@ -31,8 +33,10 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<Label Class="col-sm-3 col-form-label" For="description" HelpText="Kurzbeschreibung / Werdegang"
|
||||
ResourceKey="Description">Beschreibung: </Label>
|
||||
<div class="col-sm-3">
|
||||
<Label For="description" HelpText="Kurzbeschreibung / Werdegang" ResourceKey="Description">Beschreibung:
|
||||
</Label>
|
||||
</div>
|
||||
<div class="col-sm-9">
|
||||
@if (_descriptionLoaded)
|
||||
{
|
||||
@@ -42,8 +46,9 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mb-3">
|
||||
<Label Class="col-sm-3 col-form-label" For="image" HelpText="Porträtfoto hochladen (JPG/PNG)"
|
||||
ResourceKey="Image">Foto: </Label>
|
||||
<div class="col-sm-3">
|
||||
<Label For="image" HelpText="Porträtfoto hochladen (JPG/PNG)" ResourceKey="Image">Foto: </Label>
|
||||
</div>
|
||||
<div class="col-sm-9">
|
||||
<div class="mb-2">
|
||||
@if (!string.IsNullOrEmpty(_image))
|
||||
@@ -79,15 +84,18 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mb-3 align-items-center">
|
||||
<Label Class="col-sm-3 col-form-label" For="link" HelpText="Externer Link (optional)"
|
||||
ResourceKey="Link">Link: </Label>
|
||||
<div class="col-sm-3">
|
||||
<Label For="link" HelpText="Externer Link (optional)" ResourceKey="Link">Link: </Label>
|
||||
</div>
|
||||
<div class="col-sm-9">
|
||||
<input id="link" type="url" class="form-control" @bind="@_link" placeholder="https://" />
|
||||
<div class="invalid-feedback">Bitte gib eine gültige URL ein (startet mit http:// oder https://).</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mb-3 align-items-center">
|
||||
<Label Class="col-sm-3 col-form-label" For="status" HelpText="Status" ResourceKey="Status">Status: </Label>
|
||||
<div class="col-sm-3">
|
||||
<Label For="status" HelpText="Status" ResourceKey="Status">Status: </Label>
|
||||
</div>
|
||||
<div class="col-sm-9">
|
||||
<p>Aktuell: <strong>@(_status ?? "Neu")</strong></p>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user