Redesigned network tab

This commit is contained in:
Marcel Baumgartner 2024-02-13 22:32:49 +01:00
parent 970bca7121
commit 8d11d2360e

View file

@ -1,14 +1,30 @@
@using Moonlight.Features.Servers.Entities @using Moonlight.Features.Servers.Entities
@using System.Net @using System.Net
<div class="row"> <div class="card card-body mb-8 pb-1 d-none d-md-flex">
<div class="row g-3 align-items-center mx-2">
<div class="col">
<label class="form-label fs-5">FQDN (or dedicated ip address)</label>
</div>
<div class="col">
<label class="form-label fs-5">IP Address</label>
</div>
<div class="col">
<label class="form-label fs-5">Port</label>
</div>
<div class="col">
<label class="form-label fs-5">Notes</label>
</div>
<div class="col">
</div>
</div>
</div>
@foreach (var allocation in Server.Allocations) @foreach (var allocation in Server.Allocations)
{ {
<div class="col-md-12 col-12 my-3"> <div class="card card-body py-2 my-3">
<div class="card card-body"> <div class="row g-3 align-items-center mx-2">
<div class="d-flex justify-content-between align-items-center px-8"> <div class="col">
<div>
<label class="form-label">FQDN (or dedicated ip address)</label>
<div class="fw-semibold fs-3"> <div class="fw-semibold fs-3">
@if (allocation.IpAddress == "0.0.0.0") @if (allocation.IpAddress == "0.0.0.0")
{ {
@ -20,8 +36,7 @@
} }
</div> </div>
</div> </div>
<div> <div class="col">
<label class="form-label">IP Address</label>
@if (allocation.IpAddress != "0.0.0.0" || IsIpAddress(Server.Node.Fqdn)) @if (allocation.IpAddress != "0.0.0.0" || IsIpAddress(Server.Node.Fqdn))
{ {
<div class="fw-semibold fs-3"> <div class="fw-semibold fs-3">
@ -36,26 +51,22 @@
</div> </div>
} }
</div> </div>
<div> <div class="col">
<label class="form-label">Port</label>
<div class="fw-semibold fs-3"> <div class="fw-semibold fs-3">
@allocation.Port @allocation.Port
</div> </div>
</div> </div>
<div> <div class="col d-none d-sm-block">
<label class="form-label">Notes</label>
<input type="text" class="form-control" placeholder="What is this allocation for?"/> <input type="text" class="form-control" placeholder="What is this allocation for?"/>
</div> </div>
<div> <div class="col text-end">
<button class="btn btn-danger disabled" type="button" disabled="disabled"> <button class="btn btn-icon btn-danger disabled" type="button" disabled="disabled">
<i class="bx bx-sm bx-trash"></i>Remove <i class="bx bx-sm bx-trash"></i>
</button> </button>
</div> </div>
</div> </div>
</div> </div>
</div>
} }
</div>
@code @code
{ {