mirror of
https://github.com/yhl452493373/frpc-panel.git
synced 2026-04-04 06:17:00 +08:00
customize scrollbar style;
add proxy popup layout adjust;
This commit is contained in:
@@ -1,3 +1,7 @@
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: rgba(199, 199, 199, 0.8);
|
||||
}
|
||||
|
||||
.layui-bg-blue {
|
||||
background-color: #58b7ff !important;
|
||||
}
|
||||
@@ -132,6 +136,10 @@ section.proxy-list .proxy-info .layui-row .layui-row > div:first-child {
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: rgba(107, 107, 107, 0.8);
|
||||
}
|
||||
|
||||
.login-title,
|
||||
.login-title a {
|
||||
color: #99a9bf !important;
|
||||
|
||||
@@ -1,3 +1,13 @@
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
border-radius: 4px;
|
||||
transition: 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
html, body {
|
||||
padding: 0;
|
||||
word-break: break-all;
|
||||
@@ -70,31 +80,6 @@ section {
|
||||
left: 225px;
|
||||
}
|
||||
|
||||
#searchForm input {
|
||||
height: 30px;
|
||||
line-height: 28px;
|
||||
}
|
||||
|
||||
#searchForm .layui-input-suffix,
|
||||
#searchForm .layui-input-prefix {
|
||||
line-height: 30px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#addUserForm {
|
||||
padding: 15px 15px 0 15px;
|
||||
}
|
||||
|
||||
#addUserForm .layui-form-item:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
#addUserForm .layui-textarea {
|
||||
min-height: 80px;
|
||||
padding: 9px 10px;
|
||||
resize: none;
|
||||
}
|
||||
|
||||
.layui-form-label {
|
||||
width: 140px;
|
||||
}
|
||||
@@ -155,25 +140,80 @@ section.common-info .text-row .text-col {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
#addProxyForm {
|
||||
.layui-layer-btn > a[class^=layui-layer-btn] {
|
||||
margin: 0 5px !important;
|
||||
}
|
||||
|
||||
.add-popup .layui-layer-setwin {
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.add-popup .layui-layer-close2 {
|
||||
padding: 0;
|
||||
border: none;
|
||||
right: 0;
|
||||
top: 0;
|
||||
background: none;
|
||||
border-radius: 0;
|
||||
color: #787878;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#addProxyForm .layui-tab {
|
||||
margin: 15px 15px 0 15px;
|
||||
.add-popup .layui-layer-close2:hover {
|
||||
background: none;
|
||||
}
|
||||
|
||||
#addProxyForm .layui-tab .layui-tab-content {
|
||||
padding-bottom: 0;
|
||||
.add-popup form {
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
#addProxyForm .layui-textarea {
|
||||
.add-popup .layui-tab {
|
||||
flex: 1;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.add-popup .layui-tab .layui-tab-content {
|
||||
padding: 15px 8px 0 8px;
|
||||
position: absolute;
|
||||
top: 41px;
|
||||
bottom: 0;
|
||||
left: 8px;
|
||||
right: 8px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.add-popup .layui-textarea {
|
||||
min-height: 80px;
|
||||
padding: 9px 10px;
|
||||
resize: none;
|
||||
}
|
||||
|
||||
#addProxyForm .layui-row .layui-form-item {
|
||||
.add-popup .layui-form-select dl {
|
||||
max-height: 156px;
|
||||
}
|
||||
|
||||
.add-popup .layui-row .layui-form-item {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
#searchForm input {
|
||||
height: 30px;
|
||||
line-height: 28px;
|
||||
}
|
||||
|
||||
#searchForm .layui-input-suffix,
|
||||
#searchForm .layui-input-prefix {
|
||||
line-height: 30px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
@@ -70,13 +70,15 @@ var loadProxyInfo = (function ($) {
|
||||
proxyListTable.resize();
|
||||
}
|
||||
|
||||
bindFormEvent();
|
||||
bindFormEvent(proxyType);
|
||||
}
|
||||
|
||||
/**
|
||||
* bind event of {{@link layui.form}}
|
||||
*
|
||||
* @param type proxy type
|
||||
*/
|
||||
function bindFormEvent() {
|
||||
function bindFormEvent(type) {
|
||||
layui.table.on('toolbar(proxyListTable)', function (obj) {
|
||||
var id = obj.config.id;
|
||||
var checkStatus = layui.table.checkStatus(id);
|
||||
@@ -84,7 +86,7 @@ var loadProxyInfo = (function ($) {
|
||||
|
||||
switch (obj.event) {
|
||||
case 'add':
|
||||
addPopup();
|
||||
addPopup(type);
|
||||
break
|
||||
case 'remove':
|
||||
// batchRemovePopup(data);
|
||||
@@ -108,13 +110,17 @@ var loadProxyInfo = (function ($) {
|
||||
|
||||
/**
|
||||
* add proxy popup
|
||||
* @param type proxy type
|
||||
*/
|
||||
function addPopup() {
|
||||
function addPopup(type) {
|
||||
layui.layer.open({
|
||||
type: 1,
|
||||
title: 'NewProxy',
|
||||
area: ['500px'],
|
||||
content: layui.laytpl(document.getElementById('addProxyTemplate').innerHTML).render(),
|
||||
title: false,
|
||||
skin: 'add-popup',
|
||||
area: ['500px', '400px'],
|
||||
content: layui.laytpl(document.getElementById('addProxyTemplate').innerHTML).render({
|
||||
type: type
|
||||
}),
|
||||
btn: ['Confirm', 'Cancel'],
|
||||
btn1: function (index) {
|
||||
if (layui.form.validate('#addProxyTemplate')) {
|
||||
@@ -126,7 +132,6 @@ var loadProxyInfo = (function ($) {
|
||||
layui.layer.close(index);
|
||||
},
|
||||
success: function (layero, index, that) {
|
||||
layero.find('.layui-layer-content').css('overflow', 'visible');
|
||||
layui.form.render(null, 'addProxyForm');
|
||||
}
|
||||
});
|
||||
|
||||
@@ -156,14 +156,8 @@
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">ProxyType</label>
|
||||
<div class="layui-input-block">
|
||||
<select name="type" id="type">
|
||||
<option value="http">HTTP</option>
|
||||
<option value="https">HTTPS</option>
|
||||
<option value="tcp">TCP</option>
|
||||
<option value="udp">UDP</option>
|
||||
<option value="stcp">STCP</option>
|
||||
<option value="sudp">SUDP</option>
|
||||
</select>
|
||||
<input type="text" name="type" value="{{= d.type.toUpperCase() }}" readonly
|
||||
class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item">
|
||||
@@ -180,27 +174,31 @@
|
||||
autocomplete="off" class="layui-input"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item layui-hide http https">
|
||||
{{# if (d.type === 'http' || d.type === 'https') { }}
|
||||
<div class="layui-form-item http https">
|
||||
<label class="layui-form-label">CustomizeDomains</label>
|
||||
<div class="layui-input-block">
|
||||
<textarea name="custom_domains" placeholder="CustomDomains" autocomplete="off"
|
||||
class="layui-textarea"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item layui-form-text layui-hide http https">
|
||||
<div class="layui-form-item layui-form-text http https">
|
||||
<label class="layui-form-label">Subdomain</label>
|
||||
<div class="layui-input-block">
|
||||
<textarea name="subdomain" placeholder="Subdomain" autocomplete="off"
|
||||
class="layui-textarea"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-form-item layui-hide tcp udp">
|
||||
{{# } }}
|
||||
{{# if (d.type === 'tcp' || d.type === 'udp') { }}
|
||||
<div class="layui-form-item tcp udp">
|
||||
<label class="layui-form-label">RemotePort</label>
|
||||
<div class="layui-input-block">
|
||||
<input type="text" name="remote_port" placeholder="RemotePort"
|
||||
autocomplete="off" class="layui-input"/>
|
||||
</div>
|
||||
</div>
|
||||
{{# } }}
|
||||
<div class="layui-row">
|
||||
<div class="layui-col-xs6">
|
||||
<div class="layui-form-item">
|
||||
|
||||
Reference in New Issue
Block a user