feat: the new forward rule form on one line, with short type names

This commit is contained in:
redtea committed 2026-10-13 23:18:49 +03:00
1 parent 67c02ad6b4
commit fbd8f30de3
1 file changed
+28 -25
+28 -25
View File
@@ -6,16 +6,19 @@
<title>Порты · {{.Agent.Name}} - LPRA</title>
<link rel="stylesheet" href="/static/app.css">
<style>
.frow { display:flex; align-items:flex-end; gap:14px; flex-wrap:wrap; }
.frow label { margin:0 0 6px; }
.frow .fld { display:flex; flex-direction:column; }
.frow select, .frow input, .frow button {
/* One line: fixed narrow fields, the label takes what is left. */
.frow { display:flex; align-items:flex-end; gap:12px; flex-wrap:wrap; }
.frow label { margin:0 0 6px; white-space:nowrap; }
.frow .fld { display:flex; flex-direction:column; flex:none; width:108px; }
.frow .fld.addr { width:128px; }
.frow .fld.grow { flex:1; width:auto; min-width:150px; }
.frow select, .frow input[type=text], .frow button {
height:40px; box-sizing:border-box; font-size:14px; line-height:1; margin:0;
}
label.check { display:inline-flex; align-items:center; gap:8px; margin:14px 0 0; color:var(--text); font-size:14px; cursor:pointer; }
.frow select {
padding:0 32px 0 12px; border-radius:8px; border:1px solid var(--border);
background:#0c0f13; color:var(--text);
.frow select { min-width:0; width:100%; padding:0 30px 0 12px; background-position:right 10px center; }
.frow label.check {
display:inline-flex; align-items:center; gap:8px; height:40px; margin:0;
color:var(--text); font-size:14px; cursor:pointer;
}
</style>
</head>
@@ -73,34 +76,34 @@
<div class="fld">
<label>Тип</label>
<select name="proto" id="proto">
<option value="http">http (long-poll, работает везде)</option>
<option value="tcp">tcp (прямой, низкая задержка, порт {{.TunnelPort}})</option>
<option value="udp">udp (прямой, порт {{.TunnelPort}})</option>
<option value="http">http-lp</option>
<option value="tcp">tcp</option>
<option value="udp">udp</option>
</select>
</div>
<div class="fld">
<label>Порт на клиенте</label>
<input type="text" name="client_port" placeholder="напр. 22" style="max-width:140px" required>
<label>Порт клиента</label>
<input type="text" name="client_port" placeholder="22" required>
</div>
<div class="fld">
<label>Порт на хосте</label>
<input type="text" name="host_port" placeholder="напр. 2222" style="max-width:140px" required>
<label>Порт хоста</label>
<input type="text" name="host_port" placeholder="2222" required>
</div>
<div class="fld">
<label>Слушать на хосте</label>
<input type="text" name="listen_addr" value="0.0.0.0" style="max-width:160px">
<div class="fld addr">
<label>Слушать на</label>
<input type="text" name="listen_addr" value="0.0.0.0">
</div>
<div class="fld" style="flex:1; min-width:200px">
<label>Метка (необязательно)</label>
<input type="text" name="label" maxlength="80" placeholder="для чего это правило">
</div>
<button type="submit">Создать</button>
<div class="fld grow">
<label>Метка</label>
<input type="text" name="label" maxlength="80" placeholder="необязательно">
</div>
{{if .UfwEnabled}}
<label class="check" title="Порт не будет открыт в ufw, и при удалении правила в ufw ничего не изменится">
<input type="checkbox" name="no_ufw" value="1"> Без ufw правила
<input type="checkbox" name="no_ufw" value="1"> Без ufw
</label>
{{end}}
<button type="submit">Создать</button>
</div>
</form>
<p class="muted" id="note" style="font-size:13px; margin-top:12px"></p>
</div>
@@ -108,7 +111,7 @@
<div class="card">
<h2>Режимы</h2>
<ul class="muted" style="font-size:14px; line-height:1.7">
<li><b>http</b> - туннель поверх HTTP long-poll (через адрес панели, порт {{.PanelPort}}). Работает везде, где доступна панель, но задержка выше.</li>
<li><b>http-lp</b> - туннель поверх HTTP long-poll (через адрес панели, порт {{.PanelPort}}). Работает везде, где доступна панель, но задержка выше.</li>
<li><b>tcp</b> - прямой TCP-мультиплексор через порт <b>{{.TunnelPort}}</b> хоста. Минимальная задержка, keep-alive, TCP_NODELAY. Нужно открыть {{.TunnelPort}}/tcp на хосте.</li>
<li><b>udp</b> - прямой UDP через порт <b>{{.TunnelPort}}</b> хоста. Нужно открыть {{.TunnelPort}}/udp.</li>
</ul>