feat(user-ban): frontend ban modal replaces the backend restrictions tab
1:1 replicate the reference theme user-ban flow on the frontend: - Ban/unban modal rendered by inc/helpers/user-ban.php, opened via AksrtModalRuntime.openRemote (600px desktop dialog, 360px initial height, mobile bottom drawer, c-yellow colorful unban header). - Three entry points wired: user homepage cover three-dot menu, comment section menu, article author card menu (ban item takes priority over report, matching the reference hook order). - REST endpoints /user-ban/modal and /user-ban/set under aksrt/v1, guarded by check_permission, persisted through User\Restriction. - Submit semantics match zib_ajax_set_user_ban: ban reloads the page, unban only closes the modal. Cleanup (no dual-track): the backend ban-restrictions tab, its form handlers and flash keys are removed; ticket processing links to the frontend user homepage as the reference theme does; admin/report and appeal notification URLs move to type/status query args. Verification: 337/337 widget-system contract tests, 41/41 admin and front-submit tests, php -l clean on all changed PHP files.
This commit is contained in:
@@ -7224,6 +7224,141 @@ body.aksrt-modal-runtime-open {
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
/* ---- 禁封用户弹窗（参考主题 set_user_ban 模态框几何 1:1）----
|
||||
参考主题 zib_get_edit_user_ban_link 未传 data-class → 走 Bootstrap 默认
|
||||
.modal-dialog（>=768px 宽 600px）；data-height=360 → .modal-content 初始
|
||||
高度 360 后动画至内容高度；mobile-bottom → <769px 底部抽屉。
|
||||
此处以 min-height:360px 复刻初始高度契约，桌面宽取 600px。 */
|
||||
.aksrt-user-ban-modal:not(.aksrt-modal-runtime--bottom) .aksrt-modal-runtime__dialog {
|
||||
width: min(600px, calc(100vw - 32px));
|
||||
border-radius: var(--main-radius, 8px);
|
||||
background: var(--main-bg-color, #fff);
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .aksrt-modal-runtime__skeleton {
|
||||
padding: 24px 18px;
|
||||
}
|
||||
|
||||
/* edit-header：与禁封表单头部同构（关闭钮靠右，红色警示徽标 + 标题居左）。 */
|
||||
.aksrt-user-ban-modal .edit-header {
|
||||
position: relative;
|
||||
padding-right: 32px;
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .edit-header .close {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
float: none;
|
||||
font-size: 20px;
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
background: none;
|
||||
border: 0;
|
||||
padding: 2px 6px;
|
||||
}
|
||||
|
||||
/* 解封视图多彩横幅（参考主题 zib_get_modal_colorful_header('c-yellow', ...)）：
|
||||
120px 高绝对定位横幅 + 旋转彩斑，后续表单整体下移 120px。 */
|
||||
.aksrt-user-ban-modal .modal-colorful-header,
|
||||
.aksrt-user-ban-modal .colorful-bg {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
color: var(--this-color);
|
||||
background: var(--this-bg);
|
||||
background-size: 120%;
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .modal-colorful-header {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 120px;
|
||||
border-radius: var(--main-radius, 8px) var(--main-radius, 8px) 0 0;
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .modal-colorful-header + * {
|
||||
margin-top: 120px;
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .modal-colorful-header > .close {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
z-index: 9;
|
||||
color: var(--this-color);
|
||||
font-size: 18px;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .colorful-bg > .colorful-make,
|
||||
.aksrt-user-ban-modal .colorful-bg > .colorful-make::before,
|
||||
.aksrt-user-ban-modal .colorful-bg > .colorful-make::after {
|
||||
position: absolute;
|
||||
color: var(--this-color);
|
||||
background: var(--this-bg);
|
||||
border-radius: 100%;
|
||||
content: '';
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .colorful-bg > .colorful-make {
|
||||
top: 60%;
|
||||
bottom: 0;
|
||||
width: 323px;
|
||||
height: 290px;
|
||||
animation: aksrt-ban-colorful 120s linear infinite;
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .colorful-bg > .colorful-make::before {
|
||||
top: -325px;
|
||||
right: -558px;
|
||||
bottom: 0;
|
||||
width: 677px;
|
||||
height: 300px;
|
||||
opacity: 0.6;
|
||||
transform: rotate(341deg);
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .colorful-bg > .colorful-make::after {
|
||||
top: -170px;
|
||||
bottom: 0;
|
||||
left: -262px;
|
||||
width: 402px;
|
||||
height: 214px;
|
||||
opacity: 0.4;
|
||||
transform: rotate(326deg);
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .colorful-bg > .colorful-make + * {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* 单选徽章行（参考主题 .form-but-radio 契约）：input 由 main.css 隐藏，
|
||||
label 可点；选中态由 main.css 的 input:checked + .but-radio 驱动。 */
|
||||
.aksrt-user-ban-modal .form-but-radio label {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .form-but-radio .but-radio {
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
/* 开关行（删除全部内容 / 禁止用户申诉）：原生 checkbox 隐藏，
|
||||
视觉态由 main.css 的 input:checked ~ .form-switch 驱动。 */
|
||||
.aksrt-user-ban-modal .aksrt-user-ban-form label {
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
@keyframes aksrt-ban-colorful {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
/* ---- order review modal content ---- */
|
||||
.order-comment-from .shop-score-box {
|
||||
display: flex;
|
||||
|
||||
Vendored
+1
-1
File diff suppressed because one or more lines are too long
@@ -307,6 +307,141 @@ body.aksrt-modal-runtime-open {
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
/* ---- 禁封用户弹窗（参考主题 set_user_ban 模态框几何 1:1）----
|
||||
参考主题 zib_get_edit_user_ban_link 未传 data-class → 走 Bootstrap 默认
|
||||
.modal-dialog（>=768px 宽 600px）；data-height=360 → .modal-content 初始
|
||||
高度 360 后动画至内容高度；mobile-bottom → <769px 底部抽屉。
|
||||
此处以 min-height:360px 复刻初始高度契约，桌面宽取 600px。 */
|
||||
.aksrt-user-ban-modal:not(.aksrt-modal-runtime--bottom) .aksrt-modal-runtime__dialog {
|
||||
width: min(600px, calc(100vw - 32px));
|
||||
border-radius: var(--main-radius, 8px);
|
||||
background: var(--main-bg-color, #fff);
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .aksrt-modal-runtime__skeleton {
|
||||
padding: 24px 18px;
|
||||
}
|
||||
|
||||
/* edit-header：与禁封表单头部同构（关闭钮靠右，红色警示徽标 + 标题居左）。 */
|
||||
.aksrt-user-ban-modal .edit-header {
|
||||
position: relative;
|
||||
padding-right: 32px;
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .edit-header .close {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
float: none;
|
||||
font-size: 20px;
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
background: none;
|
||||
border: 0;
|
||||
padding: 2px 6px;
|
||||
}
|
||||
|
||||
/* 解封视图多彩横幅（参考主题 zib_get_modal_colorful_header('c-yellow', ...)）：
|
||||
120px 高绝对定位横幅 + 旋转彩斑，后续表单整体下移 120px。 */
|
||||
.aksrt-user-ban-modal .modal-colorful-header,
|
||||
.aksrt-user-ban-modal .colorful-bg {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
color: var(--this-color);
|
||||
background: var(--this-bg);
|
||||
background-size: 120%;
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .modal-colorful-header {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 120px;
|
||||
border-radius: var(--main-radius, 8px) var(--main-radius, 8px) 0 0;
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .modal-colorful-header + * {
|
||||
margin-top: 120px;
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .modal-colorful-header > .close {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
z-index: 9;
|
||||
color: var(--this-color);
|
||||
font-size: 18px;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .colorful-bg > .colorful-make,
|
||||
.aksrt-user-ban-modal .colorful-bg > .colorful-make::before,
|
||||
.aksrt-user-ban-modal .colorful-bg > .colorful-make::after {
|
||||
position: absolute;
|
||||
color: var(--this-color);
|
||||
background: var(--this-bg);
|
||||
border-radius: 100%;
|
||||
content: '';
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .colorful-bg > .colorful-make {
|
||||
top: 60%;
|
||||
bottom: 0;
|
||||
width: 323px;
|
||||
height: 290px;
|
||||
animation: aksrt-ban-colorful 120s linear infinite;
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .colorful-bg > .colorful-make::before {
|
||||
top: -325px;
|
||||
right: -558px;
|
||||
bottom: 0;
|
||||
width: 677px;
|
||||
height: 300px;
|
||||
opacity: 0.6;
|
||||
transform: rotate(341deg);
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .colorful-bg > .colorful-make::after {
|
||||
top: -170px;
|
||||
bottom: 0;
|
||||
left: -262px;
|
||||
width: 402px;
|
||||
height: 214px;
|
||||
opacity: 0.4;
|
||||
transform: rotate(326deg);
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .colorful-bg > .colorful-make + * {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* 单选徽章行（参考主题 .form-but-radio 契约）：input 由 main.css 隐藏，
|
||||
label 可点；选中态由 main.css 的 input:checked + .but-radio 驱动。 */
|
||||
.aksrt-user-ban-modal .form-but-radio label {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.aksrt-user-ban-modal .form-but-radio .but-radio {
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
/* 开关行（删除全部内容 / 禁止用户申诉）：原生 checkbox 隐藏，
|
||||
视觉态由 main.css 的 input:checked ~ .form-switch 驱动。 */
|
||||
.aksrt-user-ban-modal .aksrt-user-ban-form label {
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
@keyframes aksrt-ban-colorful {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
/* ---- order review modal content ---- */
|
||||
.order-comment-from .shop-score-box {
|
||||
display: flex;
|
||||
|
||||
Reference in New Issue
Block a user