Mirrors
/
aredn
mirror of https://github.com/aredn/aredn.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Local services (#1614)

This commit is contained in:
Tim Wilkinson 2024-10-10 13:34:15 -07:00 committed by GitHub
parent 651ccfb603
commit 8b67e13a6b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 55 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
files/app/main/status/e/local-services.ut
View File

@ -319,19 +319,20 @@ if (f) {
traffic may be included. When forwarding a port range, specify the range as <b>start-end</b>.
The top line of each entry describes where the traffic originates, the bottom line where it is destined.")}}
{% } %}
<div class="cols port-forwards-label">
<div class="port-forwards-label">
<div>addresses</div>
<div>ports</div>
<div>protocol</div>
<div>enabled</div>
<div style="min-width:24px"></div>
</div>
<form>
<div id="port-forwards">{%
for (let i = 0; i < length(ports); i++) {
const p = ports[i];
%}<div class="noborder forward adr">
<div>
<div>
<div class="cols">
<div class="cols">
{% if (dhcp.mode === 0) { %}
<select name="port_src">
<option value="wifi" {{p.src == "wifi" ? "selected" : ""}}>Mesh</option>
@ -351,7 +352,7 @@ if (f) {
</select>
<label class="switch"><input type="checkbox" name="port_enable" {{p.enabled ? "checked" : ""}}></label>
</div>
<div>
<div class="cols">
<select name="port_dst">
{%
for (let j = as[3]; j <= ae[3]; j++) {
@ -362,6 +363,8 @@ if (f) {
%}
</select>
<input name="port_dport" type="text" required placeholder="LAN Port" pattern="{{constants.patPort}}" value="{{p.dport}}">
<div></div>
<div></div>
</div>
</div>
<button>-</button>
@ -427,7 +430,7 @@ if (f) {
return;
}
const ports = [];
const rows = htmx.findAll("#port-forwards .cols .row");
const rows = htmx.findAll("#port-forwards .forward");
for (let i = 0; i < rows.length; i++) {
const r = rows[i];
const src = htmx.find(r, "[name=port_src]");

40
files/app/resource/css/admin.css
View File

@ -799,37 +799,63 @@ label.switch
flex: 0;
padding-right: 6px;
}
#ctrl-modal #port-forwards > .cols
#ctrl-modal .port-forwards-label
{
display: flex;
}
#ctrl-modal .port-forwards-label div
{
margin-right: 2px;
}
#ctrl-modal #port-forwards > .adr
{
padding-bottom: 6px;
}
#ctrl-modal #port-forwards > .adr > .cols > .cols
{
flex-wrap: nowrap;
min-width: 100%;
}
#ctrl-modal #port-forwards > .adr > .cols > .cols > *
{
margin: 2px 2px 0 0;
}
#ctrl-modal #port-forwards label.switch input
{
top: 1px;
height: 28px;
top: -3px;
margin-left: 0;
}
#ctrl-modal #port-forwards select[name=port_src],
#ctrl-modal #port-forwards input[name=port_src],
#ctrl-modal #port-forwards select[name=port_dst]
#ctrl-modal #port-forwards select[name=port_dst],
#ctrl-modal .port-forwards-label div:nth-child(1)
{
width: 180px;
max-width: 180px;
overflow-x: hidden;
min-width: 180px;
flex-grow: 1;
}
#ctrl-modal #port-forwards input[name=port_sports],
#ctrl-modal #port-forwards input[name=port_dport],
#ctrl-modal .port-forwards-label div:nth-child(2)
{
width: 110px;
min-width: 110px;
flex-grow: 1;
}
#ctrl-modal #port-forwards select[name=port_type],
#ctrl-modal #port-forwards div:nth-child(3),
#ctrl-modal .port-forwards-label div:nth-child(3)
{
width: 92px;
min-width: 92px;
flex: 0;
}
#ctrl-modal #port-forwards label,
#ctrl-modal #port-forwards div:nth-child(4),
#ctrl-modal .port-forwards-label div:nth-child(4)
{
width: 56px;
min-width: 56px;
flex: 0;
}
#ctrl-modal:has(#port-forwards:empty) .port-forwards-label
{

14
files/app/resource/css/mobile.css
View File

@ -188,6 +188,20 @@ body.mobile #ctrl-modal #local-services .service .cols:last-child select
{
width: 120px;
}
body.mobile #ctrl-modal #port-forwards select[name=port_src],
body.mobile #ctrl-modal #port-forwards select[name=port_dst],
body.mobile #ctrl-modal .port-forwards-label div:nth-child(1)
{
width: 90px;
min-width: 90px;
}
body.mobile #ctrl-modal #port-forwards input[name=port_sports],
body.mobile #ctrl-modal #port-forwards input[name=port_dport],
body.mobile #ctrl-modal .port-forwards-label div:nth-child(2)
{
width: 70px;
min-width: 70px;
}
body.mobile .tunnel .cols .cols.pwnw input[name=network]
{