为安全中心美化

This commit is contained in:
fishcpy 2025-03-13 21:56:05 +08:00
parent c2755eea17
commit 86c2e30ec1
2 changed files with 14 additions and 6 deletions

View File

@ -1468,6 +1468,14 @@ spec:
label: 安全链接页面-提示区域文本描述 label: 安全链接页面-提示区域文本描述
placeholder: '请输入安全链接页面提示区域的文本描述' placeholder: '请输入安全链接页面提示区域的文本描述'
help: '输入安全链接页面提示区域的文本描述,留空使用默认文本描述。' help: '输入安全链接页面提示区域的文本描述,留空使用默认文本描述。'
- $formkit: number
name: security_link_auto_jump_time
if: $get(enable_security_link).value
label: 安全链接页面-自动跳转时间
value: 5
validation: required
placeholder: '请输入安全链接页面自动跳转时间(秒)'
help: '输入安全链接页面自动跳转时间(秒)默认5秒。'
- $formkit: code - $formkit: code
name: security_link_jump_desc name: security_link_jump_desc
if: $get(enable_security_link).value if: $get(enable_security_link).value

View File

@ -28,18 +28,18 @@
background-position: center; background-position: center;
background-size: cover; background-size: cover;
background-repeat: no-repeat; background-repeat: no-repeat;
background-image: url([[${#strings.isEmpty(theme.config.security_link_config.security_link_site_img_background) ? '' : theme.config.security_link_config.security_link_site_img_background}]]); background-image: url([[${#strings.defaultString(theme.config.security_link_config.security_link_site_img_background, '')}]]);
} }
html.light body { html.light body {
background-color: #f6d365; background-color: #f6d365;
background-image: linear-gradient(135deg, #f6d365 0%, #fda085 100%), url([[${#strings.isEmpty(theme.config.security_link_config.security_link_site_img_background) ? '' : theme.config.security_link_config.security_link_site_img_background}]]); background-image: linear-gradient(135deg, #f6d365 0%, #fda085 100%), url([[${#strings.defaultString(theme.config.security_link_config.security_link_site_img_background, '')}]]);
background-blend-mode: overlay; background-blend-mode: overlay;
} }
html.dark body { html.dark body {
background-color: #434343; background-color: #434343;
background-image: linear-gradient(135deg, #434343 0%, #000000 100%), url([[${#strings.isEmpty(theme.config.security_link_config.security_link_site_img_background) ? '' : theme.config.security_link_config.security_link_site_img_background}]]); background-image: linear-gradient(135deg, #434343 0%, #000000 100%), url([[${#strings.defaultString(theme.config.security_link_config.security_link_site_img_background, '')}]]);
background-blend-mode: overlay; background-blend-mode: overlay;
} }
@ -326,7 +326,7 @@
width: 0; width: 0;
height: 100%; height: 100%;
background-color: #abedd8; background-color: #abedd8;
transition: width 4s linear; transition: width [[${theme.config.security_link_config.security_link_auto_jump_time}]]s linear;
} }
.countdown-text { .countdown-text {
margin-top: 12px; margin-top: 12px;
@ -360,7 +360,7 @@
<div class="progress"></div> <div class="progress"></div>
</div> </div>
<div class="countdown-text"> <div class="countdown-text">
⚡将在<span id="countdown">4</span>秒后跳转,请自行确认链接安全性 ⚡将在<span id="countdown">[[${theme.config.security_link_config.security_link_auto_jump_time}]]</span>秒后跳转,请自行确认链接安全性
</div> </div>
<div class="others-end"> <div class="others-end">
<a th:href="${url}" target="_self">继续访问</a> <a th:href="${url}" target="_self">继续访问</a>
@ -370,7 +370,7 @@
<script> <script>
window.onload = function() { window.onload = function() {
document.querySelector('.progress').style.width = '100%'; document.querySelector('.progress').style.width = '100%';
let countdown = 4; let countdown = [[${theme.config.security_link_config.security_link_auto_jump_time}]];
const countdownElement = document.getElementById('countdown'); const countdownElement = document.getElementById('countdown');
const timer = setInterval(function() { const timer = setInterval(function() {