Added RWD to new HTTP Proxy UI

This commit is contained in:
Toby Chui
2025-06-11 21:24:43 +08:00
parent 7164b74d4a
commit 6d0c0be8c2
6 changed files with 82 additions and 257 deletions

View File

@@ -25,7 +25,7 @@
<div class="scrolling content ui form">
<div id="inlineEditBasicAuthCredentials" class="field">
<p>Enter alias hostname or wildcard matching keywords for <code class="epname"></code></p>
<table class="ui very basic compacted unstackable celled table">
<table class="ui basic very compact unstackable celled table">
<thead>
<tr>
<th>Alias Hostname</th>
@@ -161,7 +161,7 @@
}
$("#inlineEditTable").append(`<tr>
<td>${domainLink}</td>
<td><button class="ui basic button" onclick="removeAliasDomain('${aliasDomain}');"><i class="red remove icon"></i> Remove</button></td>
<td><button class="ui basic mini circular icon button" onclick="removeAliasDomain('${aliasDomain}');"><i class="red trash icon"></i></button></td>
</tr>`);
});

View File

@@ -14,18 +14,11 @@
<script src="../script/darktheme.js"></script>
<br>
<div class="ui container">
<div class="ui header">
<div class="content">
Basic Auth Settings
<div class="sub header" id="epname"></div>
</div>
</div>
<div class="ui divider"></div>
<h3 class="ui header">Basic Auth Credential</h3>
<div class="scrolling content ui form">
<div id="inlineEditBasicAuthCredentials" class="field">
<p>Enter the username and password for allowing them to access this proxy endpoint</p>
<table class="ui very basic compacted unstackable celled table">
<table class="ui basic very compacted unstackable celled table">
<thead>
<tr>
<th>Username</th>
@@ -56,7 +49,7 @@
<h3 class="ui header">Authentication Exclusion Paths</h3>
<div class="scrolling content ui form">
<p>Exclude specific directories / paths which contains the following subpath prefix from authentication. Useful if you are hosting services require remote API access.</p>
<table class="ui very basic compacted unstackable celled table">
<table class="ui basic very compacted unstackable celled table">
<thead>
<tr>
<th>Path Prefix</th>
@@ -86,10 +79,6 @@
<code>/public/res/far/boo/</code></p>
</div>
</div>
<div class="ui divider"></div>
<div class="field" >
<button class="ui basic button" style="float: right;" onclick="closeThisWrapper();">Close</button>
</div>
</div>
<br><br><br><br>
@@ -232,7 +221,7 @@
data.forEach(function(rule){
$("#exclusionPaths").append(` <tr>
<td>${rule.PathPrefix}</td>
<td><button class="ui red basic mini icon button" onclick="removeExceptionPath(this);" prefix="${rule.PathPrefix}"><i class="ui red times icon"></i></button></td>
<td><button class="ui red basic mini circular icon button" onclick="removeExceptionPath(this);" prefix="${rule.PathPrefix}"><i class="ui red times icon"></i></button></td>
</tr>`);
})
}
@@ -261,7 +250,7 @@
var row = '<tr>' +
'<td>' + username + '</td>' +
'<td>' + password + '</td>' +
'<td><button class="ui basic button" onclick="removeCredentialFromEditingList(' + i + ');"><i class="red remove icon"></i> Remove</button></td>' +
'<td><button class="ui basic tiny circular button" onclick="removeCredentialFromEditingList(' + i + ');"><i class="red remove icon"></i> Remove</button></td>' +
'</tr>';
tableBody.append(row);

View File

@@ -44,7 +44,7 @@
<a class="item narrowpadding" data-tab="security">Security Headers</a>
</div>
<div class="ui tab basic segment active" data-tab="customheaders">
<table class="ui very basic compacted unstackable celled table">
<table class="ui basic very compacted unstackable celled table">
<thead>
<tr>
<th>Key</th>

View File

@@ -155,6 +155,10 @@
function addSelectedTags() {
let tags = $('#tagsInput').val().split(',').map(tag => tag.trim());
if (tags.length == 0 || (tags.length == 1 && tags[0] == "")){
parent.msgbox("Please enter at least one tag", false);
return;
}
tags.forEach(tag => {
if (tag && !tagAlreadyExistsInTable(tag)) {
addTagRow(tag);
@@ -201,8 +205,8 @@
const row = `<tr class="tagEntry" value="${tag}">
<td><div class="ui circular label tag-color" style="background-color: ${getTagColorByName(tag)};"></div> ${tag}</td>
<td>
<button title="Delete Tag" class="ui circular mini red basic icon button" onclick="removeTag('${tag}')">
<i class="trash icon"></i>
<button title="Delete Tag" class="ui circular mini basic button" onclick="removeTag('${tag}')">
<i class="red trash icon"></i> Delete
</button>
</td>
</tr>`;