进行了一些小优化
This commit is contained in:
1 parent
95540ea32c
commit
4c62fda62b
11 files changed
+290
-13
No files matched your search
@@ -32,6 +32,13 @@
|
|||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#respond:not(.mobile-fixed) #postcomments .comt-box {
|
||||||
|
padding: 5px 5px 4px 5px;
|
||||||
|
background: var(--main-bg-color);
|
||||||
|
border-radius: 4px;
|
||||||
|
margin-top: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
#comments #postcomments .comt-ctrl .but {
|
#comments #postcomments .comt-ctrl .but {
|
||||||
margin-bottom: 2px;
|
margin-bottom: 2px;
|
||||||
}
|
}
|
||||||
@@ -184,6 +191,13 @@
|
|||||||
height: auto;
|
height: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 假输入条仅移动端显示。必须带 #comments 前缀(id 特异性):
|
||||||
|
标记上自带的 .flex{display:flex} 等单类工具规则无论加载顺序
|
||||||
|
如何都压不过它,宽屏不会再重复出现假输入条。 */
|
||||||
|
#comments .virtual-input {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
.commentlist .no-more {
|
.commentlist .no-more {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding-bottom: 10px;
|
padding-bottom: 10px;
|
||||||
@@ -232,7 +246,31 @@
|
|||||||
* ============================================================ */
|
* ============================================================ */
|
||||||
|
|
||||||
@media (max-width: 767px) {
|
@media (max-width: 767px) {
|
||||||
.drop-fixed-sm .dropdown-menu {
|
/* 与 layout.css 的桌面隐藏同特异性,靠 bundle 内靠后顺序在移动端反转。 */
|
||||||
|
#comments .virtual-input {
|
||||||
|
display: flex;
|
||||||
|
height: 36px;
|
||||||
|
border-radius: 120px;
|
||||||
|
background: var(--main-shadow);
|
||||||
|
color: var(--muted-2-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.virtual-input .but,
|
||||||
|
.virtual-input img {
|
||||||
|
width: 28px;
|
||||||
|
height: 28px;
|
||||||
|
border-radius: 120px;
|
||||||
|
margin: 0 4px;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.virtual-input .but {
|
||||||
|
width: auto;
|
||||||
|
padding: 3px 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.drop-fixed-sm .dropdown-menu,
|
||||||
|
.mobile-fixed {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
transform: translateY(220%);
|
transform: translateY(220%);
|
||||||
transition: 0.6s;
|
transition: 0.6s;
|
||||||
@@ -247,12 +285,22 @@
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.drop-fixed-sm.open .dropdown-menu {
|
.drop-fixed-sm.open .dropdown-menu,
|
||||||
|
.mobile-fixed.show {
|
||||||
box-shadow: 0 -50px 50px rgba(0, 0, 0, 0.2);
|
box-shadow: 0 -50px 50px rgba(0, 0, 0, 0.2);
|
||||||
transition: 0.6s cubic-bezier(0.28, 0.9, 0.34, 0.99);
|
transition: 0.6s cubic-bezier(0.28, 0.9, 0.34, 0.99);
|
||||||
transform: unset;
|
transform: unset;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mobile-fixed.show .fixed-body {
|
||||||
|
visibility: unset;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
#respond.mobile-fixed {
|
||||||
|
z-index: 1040;
|
||||||
|
}
|
||||||
|
|
||||||
.drop-fixed-sm .dropdown-menu {
|
.drop-fixed-sm .dropdown-menu {
|
||||||
z-index: 1045;
|
z-index: 1045;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
|
|||||||
Vendored
+1
-1
@@ -1 +1 @@
|
|||||||
#comments .comment-box .comments-closed,#comments .action-text,#comments #cancel-comment-reply-link{display:none}#comments #postcomments .action-text,#comments #postcomments #cancel-comment-reply-link{display:inline-block}#comments .comt-title{width:90px}#comments .comt-title .comt-avatar .avatar{width:60px;height:60px}#comments #postcomments .comt-title{display:none}#comments #postcomments .comt-ctrl .but{margin-bottom:2px}#comments .list-inline{padding:15px}#comment{margin-bottom:5px}.comment-signarea{background:var(--main-shadow)}#respond+#postcomments .comment-filter,.comment-signarea+#postcomments .comment-filter{margin-top:20px}#postcomments .tab-nav-theme{margin-top:0}#postcomments .tab-nav-theme li{padding-bottom:1px}#postcomments .tab-nav-theme li:before{bottom:-2px}#postcomments .comment-footer{position:relative}#postcomments .avatar-img{--this-size: 45px;margin-right:20px}#postcomments .children .avatar-img{--this-size: 26px;vertical-align:2px;margin-right:6px}#postcomments .commentlist>.comment>.list-inline .author-box{align-items:start;margin-bottom:0;padding:0;background:none;border-radius:0;box-shadow:none}#postcomments .commentlist>.comment>.list-inline .comment-footer{margin-left:65px;margin-top:-25px}#postcomments .comment .list-inline>.comt-main{width:100%}#postcomments .commentlist .comment+.comment{border-top:1px solid var(--main-border-color)}#postcomments .comment .list-inline>li{padding:10px;vertical-align:top}#postcomments .comment-header{font-size:15px;position:relative}.comment-header .badge-status{margin-top:0;width:68px;z-index:0}#postcomments .action count{margin-left:4px}#postcomments .comt-meta>span:not(:empty){margin-right:10px;vertical-align:middle}#postcomments .comt-meta>span a{color:inherit}#postcomments .comt-meta>span .but{padding:.2em .8em}#postcomments .comment-approve-link.unapprove{color:#e87725}#postcomments .comment-approve-link.approve{color:#3695ff}#postcomments .comt-meta>span .comment-trash-link{color:#ff4b4b}#postcomments .children{margin-left:86px;background:var(--main-shadow);border-radius:var(--main-radius);margin-bottom:6px}#postcomments .children .children{margin-left:23px}#postcomments .children .avatar-icontag{font-size:8px;height:14px;width:14px}.comment-content{word-wrap:break-word;white-space:pre-wrap}.comment-content .enlighter-default{margin-bottom:0;opacity:.9}#postcomments .comment-content img{max-width:260px;max-height:350px;display:block;width:auto;height:auto}.commentlist .no-more{margin:0;padding-bottom:10px}#comments .comment-header .aksrt-identity-chip{display:inline-flex;align-items:center;gap:3px;vertical-align:middle;max-width:9em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}#comments .comment-header .aksrt-identity-medal{display:inline-block;width:auto;height:1.1em;max-width:6em;object-fit:contain;vertical-align:-.15em}@media(max-width:767px){.drop-fixed-sm .dropdown-menu{position:fixed;transform:translateY(220%);transition:.6s;opacity:1;left:0;right:0;bottom:0;padding:22px 16px;background:var(--main-bg-color);z-index:1080;border-radius:10px 10px 0 0;margin:0}.drop-fixed-sm.open .dropdown-menu{box-shadow:0 -50px 50px #0003;transition:.6s cubic-bezier(.28,.9,.34,.99);transform:unset}.drop-fixed-sm .dropdown-menu{z-index:1045;padding:10px;top:auto!important;right:0!important;left:0!important;max-height:50vh;overflow:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.drop-fixed-sm .dropdown-menu>li>a{font-size:16px!important;padding:10px 20px}.modal-open .drop-fixed-sm.open .dropdown-menu{opacity:0}.drop-fixed-sm .dropdown-menu:before{display:none}}@media(max-width:640px){#comments .comt-title{display:none}#comments .comt-box{width:100%;padding:0}#comments .list-inline{padding:15px 0;margin:0}.comment-signarea h3{font-size:13px}.comt-tips-left .but svg,.comt-tips-left .but .fa{margin:0}.btn-input-expand{width:31px;padding:0;height:31px;line-height:31px}#postcomments .comment-header{font-size:14px}#postcomments .comt-meta{font-size:12px}#postcomments .comment .list-inline>li{padding:0}#postcomments .comment .list-inline>li+li{padding-left:10px}#postcomments .avatar-img{--this-size: 36px;margin-right:10px}#postcomments .commentlist>.comment>.list-inline .comment-footer{margin-left:45px;margin-top:-15px}#postcomments .children{margin-left:0}#postcomments .children .children{margin-left:13px}#postcomments .children .list-inline{padding:15px}#postcomments .post_ajax_loader .ml20{margin-left:5px}}
|
#comments .comment-box .comments-closed,#comments .action-text,#comments #cancel-comment-reply-link{display:none}#comments #postcomments .action-text,#comments #postcomments #cancel-comment-reply-link{display:inline-block}#comments .comt-title{width:90px}#comments .comt-title .comt-avatar .avatar{width:60px;height:60px}#comments #postcomments .comt-title{display:none}#respond:not(.mobile-fixed) #postcomments .comt-box{padding:5px 5px 4px;background:var(--main-bg-color);border-radius:4px;margin-top:12px}#comments #postcomments .comt-ctrl .but{margin-bottom:2px}#comments .list-inline{padding:15px}#comment{margin-bottom:5px}.comment-signarea{background:var(--main-shadow)}#respond+#postcomments .comment-filter,.comment-signarea+#postcomments .comment-filter{margin-top:20px}#postcomments .tab-nav-theme{margin-top:0}#postcomments .tab-nav-theme li{padding-bottom:1px}#postcomments .tab-nav-theme li:before{bottom:-2px}#postcomments .comment-footer{position:relative}#postcomments .avatar-img{--this-size: 45px;margin-right:20px}#postcomments .children .avatar-img{--this-size: 26px;vertical-align:2px;margin-right:6px}#postcomments .commentlist>.comment>.list-inline .author-box{align-items:start;margin-bottom:0;padding:0;background:none;border-radius:0;box-shadow:none}#postcomments .commentlist>.comment>.list-inline .comment-footer{margin-left:65px;margin-top:-25px}#postcomments .comment .list-inline>.comt-main{width:100%}#postcomments .commentlist .comment+.comment{border-top:1px solid var(--main-border-color)}#postcomments .comment .list-inline>li{padding:10px;vertical-align:top}#postcomments .comment-header{font-size:15px;position:relative}.comment-header .badge-status{margin-top:0;width:68px;z-index:0}#postcomments .action count{margin-left:4px}#postcomments .comt-meta>span:not(:empty){margin-right:10px;vertical-align:middle}#postcomments .comt-meta>span a{color:inherit}#postcomments .comt-meta>span .but{padding:.2em .8em}#postcomments .comment-approve-link.unapprove{color:#e87725}#postcomments .comment-approve-link.approve{color:#3695ff}#postcomments .comt-meta>span .comment-trash-link{color:#ff4b4b}#postcomments .children{margin-left:86px;background:var(--main-shadow);border-radius:var(--main-radius);margin-bottom:6px}#postcomments .children .children{margin-left:23px}#postcomments .children .avatar-icontag{font-size:8px;height:14px;width:14px}.comment-content{word-wrap:break-word;white-space:pre-wrap}.comment-content .enlighter-default{margin-bottom:0;opacity:.9}#postcomments .comment-content img{max-width:260px;max-height:350px;display:block;width:auto;height:auto}#comments .virtual-input{display:none}.commentlist .no-more{margin:0;padding-bottom:10px}#comments .comment-header .aksrt-identity-chip{display:inline-flex;align-items:center;gap:3px;vertical-align:middle;max-width:9em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}#comments .comment-header .aksrt-identity-medal{display:inline-block;width:auto;height:1.1em;max-width:6em;object-fit:contain;vertical-align:-.15em}@media(max-width:767px){#comments .virtual-input{display:flex;height:36px;border-radius:120px;background:var(--main-shadow);color:var(--muted-2-color)}.virtual-input .but,.virtual-input img{width:28px;height:28px;border-radius:120px;margin:0 4px;flex-shrink:0}.virtual-input .but{width:auto;padding:3px 10px}.drop-fixed-sm .dropdown-menu,.mobile-fixed{position:fixed;transform:translateY(220%);transition:.6s;opacity:1;left:0;right:0;bottom:0;padding:22px 16px;background:var(--main-bg-color);z-index:1080;border-radius:10px 10px 0 0;margin:0}.drop-fixed-sm.open .dropdown-menu,.mobile-fixed.show{box-shadow:0 -50px 50px #0003;transition:.6s cubic-bezier(.28,.9,.34,.99);transform:unset}.mobile-fixed.show .fixed-body{visibility:unset;z-index:-1}#respond.mobile-fixed{z-index:1040}.drop-fixed-sm .dropdown-menu{z-index:1045;padding:10px;top:auto!important;right:0!important;left:0!important;max-height:50vh;overflow:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.drop-fixed-sm .dropdown-menu>li>a{font-size:16px!important;padding:10px 20px}.modal-open .drop-fixed-sm.open .dropdown-menu{opacity:0}.drop-fixed-sm .dropdown-menu:before{display:none}}@media(max-width:640px){#comments .comt-title{display:none}#comments .comt-box{width:100%;padding:0}#comments .list-inline{padding:15px 0;margin:0}.comment-signarea h3{font-size:13px}.comt-tips-left .but svg,.comt-tips-left .but .fa{margin:0}.btn-input-expand{width:31px;padding:0;height:31px;line-height:31px}#postcomments .comment-header{font-size:14px}#postcomments .comt-meta{font-size:12px}#postcomments .comment .list-inline>li{padding:0}#postcomments .comment .list-inline>li+li{padding-left:10px}#postcomments .avatar-img{--this-size: 36px;margin-right:10px}#postcomments .commentlist>.comment>.list-inline .comment-footer{margin-left:45px;margin-top:-15px}#postcomments .children{margin-left:0}#postcomments .children .children{margin-left:13px}#postcomments .children .list-inline{padLine truncated
|
||||||
@@ -31,6 +31,13 @@
|
|||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#respond:not(.mobile-fixed) #postcomments .comt-box {
|
||||||
|
padding: 5px 5px 4px 5px;
|
||||||
|
background: var(--main-bg-color);
|
||||||
|
border-radius: 4px;
|
||||||
|
margin-top: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
#comments #postcomments .comt-ctrl .but {
|
#comments #postcomments .comt-ctrl .but {
|
||||||
margin-bottom: 2px;
|
margin-bottom: 2px;
|
||||||
}
|
}
|
||||||
@@ -183,6 +190,13 @@
|
|||||||
height: auto;
|
height: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 假输入条仅移动端显示。必须带 #comments 前缀(id 特异性):
|
||||||
|
标记上自带的 .flex{display:flex} 等单类工具规则无论加载顺序
|
||||||
|
如何都压不过它,宽屏不会再重复出现假输入条。 */
|
||||||
|
#comments .virtual-input {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
.commentlist .no-more {
|
.commentlist .no-more {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding-bottom: 10px;
|
padding-bottom: 10px;
|
||||||
|
|||||||
@@ -7,7 +7,31 @@
|
|||||||
* ============================================================ */
|
* ============================================================ */
|
||||||
|
|
||||||
@media (max-width: 767px) {
|
@media (max-width: 767px) {
|
||||||
.drop-fixed-sm .dropdown-menu {
|
/* 与 layout.css 的桌面隐藏同特异性,靠 bundle 内靠后顺序在移动端反转。 */
|
||||||
|
#comments .virtual-input {
|
||||||
|
display: flex;
|
||||||
|
height: 36px;
|
||||||
|
border-radius: 120px;
|
||||||
|
background: var(--main-shadow);
|
||||||
|
color: var(--muted-2-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
.virtual-input .but,
|
||||||
|
.virtual-input img {
|
||||||
|
width: 28px;
|
||||||
|
height: 28px;
|
||||||
|
border-radius: 120px;
|
||||||
|
margin: 0 4px;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.virtual-input .but {
|
||||||
|
width: auto;
|
||||||
|
padding: 3px 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.drop-fixed-sm .dropdown-menu,
|
||||||
|
.mobile-fixed {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
transform: translateY(220%);
|
transform: translateY(220%);
|
||||||
transition: 0.6s;
|
transition: 0.6s;
|
||||||
@@ -22,12 +46,22 @@
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.drop-fixed-sm.open .dropdown-menu {
|
.drop-fixed-sm.open .dropdown-menu,
|
||||||
|
.mobile-fixed.show {
|
||||||
box-shadow: 0 -50px 50px rgba(0, 0, 0, 0.2);
|
box-shadow: 0 -50px 50px rgba(0, 0, 0, 0.2);
|
||||||
transition: 0.6s cubic-bezier(0.28, 0.9, 0.34, 0.99);
|
transition: 0.6s cubic-bezier(0.28, 0.9, 0.34, 0.99);
|
||||||
transform: unset;
|
transform: unset;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mobile-fixed.show .fixed-body {
|
||||||
|
visibility: unset;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
#respond.mobile-fixed {
|
||||||
|
z-index: 1040;
|
||||||
|
}
|
||||||
|
|
||||||
.drop-fixed-sm .dropdown-menu {
|
.drop-fixed-sm .dropdown-menu {
|
||||||
z-index: 1045;
|
z-index: 1045;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
|
|||||||
@@ -2415,6 +2415,8 @@ tbquire.config({
|
|||||||
restoreRespondPosition();
|
restoreRespondPosition();
|
||||||
setLoading(false);
|
setLoading(false);
|
||||||
notyf(json.message || '评论已更新', 'success');
|
notyf(json.message || '评论已更新', 'success');
|
||||||
|
var respondEl = document.getElementById('respond');
|
||||||
|
if (respondEl && window.AksrtFixedInput) window.AksrtFixedInput(respondEl, 'hide');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (json && json.success && json.html) {
|
if (json && json.success && json.html) {
|
||||||
@@ -2446,6 +2448,14 @@ tbquire.config({
|
|||||||
// Move respond back to original position
|
// Move respond back to original position
|
||||||
restoreRespondPosition();
|
restoreRespondPosition();
|
||||||
|
|
||||||
|
// Hide mobile FixedInput after successful submit.
|
||||||
|
var respondEl = document.getElementById('respond');
|
||||||
|
if (respondEl && window.AksrtFixedInput) {
|
||||||
|
window.AksrtFixedInput(respondEl, 'hide');
|
||||||
|
} else if (respondEl) {
|
||||||
|
respondEl.classList.remove('show');
|
||||||
|
}
|
||||||
|
|
||||||
// If editing via moveForm, clear edit field.
|
// If editing via moveForm, clear edit field.
|
||||||
var editField = form.querySelector('[name="edit_comment_ID"]');
|
var editField = form.querySelector('[name="edit_comment_ID"]');
|
||||||
if (editField) editField.remove();
|
if (editField) editField.remove();
|
||||||
@@ -2956,11 +2966,59 @@ tbquire.config({
|
|||||||
|
|
||||||
/* source: assets/js/core/comment-fixed-input.js */
|
/* source: assets/js/core/comment-fixed-input.js */
|
||||||
/**
|
/**
|
||||||
* Autoheight for comment textarea (legacy parity).
|
* Mobile FixedInput + autoheight for comment respond (legacy parity).
|
||||||
*/
|
*/
|
||||||
(function () {
|
(function () {
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
|
function $(sel, root) {
|
||||||
|
return (root || document).querySelector(sel);
|
||||||
|
}
|
||||||
|
|
||||||
|
function FixedInput(el, action) {
|
||||||
|
if (!el) return;
|
||||||
|
if (!el.dataset.fixedBound) {
|
||||||
|
el.addEventListener('click', function (e) {
|
||||||
|
if (e.target && e.target.closest && e.target.closest('.fixed-body')) {
|
||||||
|
FixedInput(el, 'hide');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
el.dataset.fixedBound = '1';
|
||||||
|
}
|
||||||
|
if (action === 'show') {
|
||||||
|
el.classList.add('show');
|
||||||
|
window.setTimeout(function () {
|
||||||
|
var field = el.querySelector('textarea, input');
|
||||||
|
if (field) field.focus();
|
||||||
|
}, 100);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (action === 'hide') {
|
||||||
|
var cancel = el.querySelector('#cancel-comment-reply-link');
|
||||||
|
if (cancel) cancel.click();
|
||||||
|
el.querySelectorAll('input,textarea').forEach(function (n) {
|
||||||
|
try { n.blur(); } catch (e) {}
|
||||||
|
});
|
||||||
|
el.querySelectorAll('.dropup.open, .open').forEach(function (n) {
|
||||||
|
n.classList.remove('open');
|
||||||
|
});
|
||||||
|
el.classList.remove('show');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
document.addEventListener('click', function (e) {
|
||||||
|
var trigger = e.target && e.target.closest ? e.target.closest('[fixed-input]') : null;
|
||||||
|
if (!trigger) return;
|
||||||
|
e.preventDefault();
|
||||||
|
var targetSel = trigger.getAttribute('fixed-input') || '#respond';
|
||||||
|
var panel = document.querySelector(targetSel);
|
||||||
|
var comments = document.getElementById('comments');
|
||||||
|
if (comments && comments.scrollIntoView) {
|
||||||
|
comments.scrollIntoView({ behavior: 'smooth', block: 'start' });
|
||||||
|
}
|
||||||
|
FixedInput(panel, 'show');
|
||||||
|
});
|
||||||
|
|
||||||
// Autoheight textareas.
|
// Autoheight textareas.
|
||||||
function bindAutoheight(ta) {
|
function bindAutoheight(ta) {
|
||||||
if (!ta || ta.dataset.autoheightBound) return;
|
if (!ta || ta.dataset.autoheightBound) return;
|
||||||
@@ -2982,10 +3040,20 @@ tbquire.config({
|
|||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', scan);
|
document.addEventListener('DOMContentLoaded', scan);
|
||||||
if (window.AksrtFrontend && typeof window.AksrtFrontend.register === 'function') {
|
if (window.AksrtFrontend && typeof window.AksrtFrontend.register === 'function') {
|
||||||
window.AksrtFrontend.register('aksrt-comment-fixed-input', function () {
|
window.AksrtFrontend.register('aksrt-comment-fixed-input', function (root) {
|
||||||
scan();
|
scan();
|
||||||
|
// Expose for submit hide.
|
||||||
|
root = root || document;
|
||||||
|
var respond = root.querySelector ? root.querySelector('#respond') : document.getElementById('respond');
|
||||||
|
if (respond) {
|
||||||
|
respond.aksrtFixedInput = function (action) {
|
||||||
|
FixedInput(respond, action);
|
||||||
|
};
|
||||||
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
window.AksrtFixedInput = FixedInput;
|
||||||
})();
|
})();
|
||||||
;
|
;
|
||||||
|
|
||||||
@@ -3100,6 +3168,8 @@ tbquire.config({
|
|||||||
if (textarea) textarea.value = '';
|
if (textarea) textarea.value = '';
|
||||||
editingId = 0;
|
editingId = 0;
|
||||||
cancel.style.display = 'none';
|
cancel.style.display = 'none';
|
||||||
|
if (window.AksrtFixedInput) window.AksrtFixedInput(r, 'hide');
|
||||||
|
else if (r) r.classList.remove('show');
|
||||||
return false;
|
return false;
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -3144,6 +3214,12 @@ tbquire.config({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (window.AksrtFixedInput) {
|
||||||
|
window.AksrtFixedInput(respond, 'show');
|
||||||
|
} else {
|
||||||
|
respond.classList.add('show');
|
||||||
|
}
|
||||||
|
|
||||||
if (comm && comm.scrollIntoView) {
|
if (comm && comm.scrollIntoView) {
|
||||||
comm.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
comm.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,9 +1,57 @@
|
|||||||
/**
|
/**
|
||||||
* Autoheight for comment textarea (legacy parity).
|
* Mobile FixedInput + autoheight for comment respond (legacy parity).
|
||||||
*/
|
*/
|
||||||
(function () {
|
(function () {
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
|
function $(sel, root) {
|
||||||
|
return (root || document).querySelector(sel);
|
||||||
|
}
|
||||||
|
|
||||||
|
function FixedInput(el, action) {
|
||||||
|
if (!el) return;
|
||||||
|
if (!el.dataset.fixedBound) {
|
||||||
|
el.addEventListener('click', function (e) {
|
||||||
|
if (e.target && e.target.closest && e.target.closest('.fixed-body')) {
|
||||||
|
FixedInput(el, 'hide');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
el.dataset.fixedBound = '1';
|
||||||
|
}
|
||||||
|
if (action === 'show') {
|
||||||
|
el.classList.add('show');
|
||||||
|
window.setTimeout(function () {
|
||||||
|
var field = el.querySelector('textarea, input');
|
||||||
|
if (field) field.focus();
|
||||||
|
}, 100);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (action === 'hide') {
|
||||||
|
var cancel = el.querySelector('#cancel-comment-reply-link');
|
||||||
|
if (cancel) cancel.click();
|
||||||
|
el.querySelectorAll('input,textarea').forEach(function (n) {
|
||||||
|
try { n.blur(); } catch (e) {}
|
||||||
|
});
|
||||||
|
el.querySelectorAll('.dropup.open, .open').forEach(function (n) {
|
||||||
|
n.classList.remove('open');
|
||||||
|
});
|
||||||
|
el.classList.remove('show');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
document.addEventListener('click', function (e) {
|
||||||
|
var trigger = e.target && e.target.closest ? e.target.closest('[fixed-input]') : null;
|
||||||
|
if (!trigger) return;
|
||||||
|
e.preventDefault();
|
||||||
|
var targetSel = trigger.getAttribute('fixed-input') || '#respond';
|
||||||
|
var panel = document.querySelector(targetSel);
|
||||||
|
var comments = document.getElementById('comments');
|
||||||
|
if (comments && comments.scrollIntoView) {
|
||||||
|
comments.scrollIntoView({ behavior: 'smooth', block: 'start' });
|
||||||
|
}
|
||||||
|
FixedInput(panel, 'show');
|
||||||
|
});
|
||||||
|
|
||||||
// Autoheight textareas.
|
// Autoheight textareas.
|
||||||
function bindAutoheight(ta) {
|
function bindAutoheight(ta) {
|
||||||
if (!ta || ta.dataset.autoheightBound) return;
|
if (!ta || ta.dataset.autoheightBound) return;
|
||||||
@@ -25,8 +73,18 @@
|
|||||||
|
|
||||||
document.addEventListener('DOMContentLoaded', scan);
|
document.addEventListener('DOMContentLoaded', scan);
|
||||||
if (window.AksrtFrontend && typeof window.AksrtFrontend.register === 'function') {
|
if (window.AksrtFrontend && typeof window.AksrtFrontend.register === 'function') {
|
||||||
window.AksrtFrontend.register('aksrt-comment-fixed-input', function () {
|
window.AksrtFrontend.register('aksrt-comment-fixed-input', function (root) {
|
||||||
scan();
|
scan();
|
||||||
|
// Expose for submit hide.
|
||||||
|
root = root || document;
|
||||||
|
var respond = root.querySelector ? root.querySelector('#respond') : document.getElementById('respond');
|
||||||
|
if (respond) {
|
||||||
|
respond.aksrtFixedInput = function (action) {
|
||||||
|
FixedInput(respond, action);
|
||||||
|
};
|
||||||
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
window.AksrtFixedInput = FixedInput;
|
||||||
})();
|
})();
|
||||||
@@ -108,6 +108,8 @@
|
|||||||
if (textarea) textarea.value = '';
|
if (textarea) textarea.value = '';
|
||||||
editingId = 0;
|
editingId = 0;
|
||||||
cancel.style.display = 'none';
|
cancel.style.display = 'none';
|
||||||
|
if (window.AksrtFixedInput) window.AksrtFixedInput(r, 'hide');
|
||||||
|
else if (r) r.classList.remove('show');
|
||||||
return false;
|
return false;
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
@@ -152,6 +154,12 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (window.AksrtFixedInput) {
|
||||||
|
window.AksrtFixedInput(respond, 'show');
|
||||||
|
} else {
|
||||||
|
respond.classList.add('show');
|
||||||
|
}
|
||||||
|
|
||||||
if (comm && comm.scrollIntoView) {
|
if (comm && comm.scrollIntoView) {
|
||||||
comm.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
comm.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -232,6 +232,8 @@
|
|||||||
restoreRespondPosition();
|
restoreRespondPosition();
|
||||||
setLoading(false);
|
setLoading(false);
|
||||||
notyf(json.message || '评论已更新', 'success');
|
notyf(json.message || '评论已更新', 'success');
|
||||||
|
var respondEl = document.getElementById('respond');
|
||||||
|
if (respondEl && window.AksrtFixedInput) window.AksrtFixedInput(respondEl, 'hide');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (json && json.success && json.html) {
|
if (json && json.success && json.html) {
|
||||||
@@ -263,6 +265,14 @@
|
|||||||
// Move respond back to original position
|
// Move respond back to original position
|
||||||
restoreRespondPosition();
|
restoreRespondPosition();
|
||||||
|
|
||||||
|
// Hide mobile FixedInput after successful submit.
|
||||||
|
var respondEl = document.getElementById('respond');
|
||||||
|
if (respondEl && window.AksrtFixedInput) {
|
||||||
|
window.AksrtFixedInput(respondEl, 'hide');
|
||||||
|
} else if (respondEl) {
|
||||||
|
respondEl.classList.remove('show');
|
||||||
|
}
|
||||||
|
|
||||||
// If editing via moveForm, clear edit field.
|
// If editing via moveForm, clear edit field.
|
||||||
var editField = form.querySelector('[name="edit_comment_ID"]');
|
var editField = form.querySelector('[name="edit_comment_ID"]');
|
||||||
if (editField) editField.remove();
|
if (editField) editField.remove();
|
||||||
|
|||||||
@@ -464,8 +464,12 @@ if (!function_exists('aksrt_comments_render_form')) :
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (function_exists('aksrt_get_comment_virtual_input_html')) {
|
||||||
|
echo aksrt_get_comment_virtual_input_html($placeholder, '#respond'); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
|
||||||
|
}
|
||||||
?>
|
?>
|
||||||
<div id="respond">
|
<div id="respond" class="mobile-fixed">
|
||||||
|
<div class="fixed-body"></div>
|
||||||
<form id="commentform" method="post" action="<?php echo esc_url(site_url('/wp-comments-post.php')); ?>">
|
<form id="commentform" method="post" action="<?php echo esc_url(site_url('/wp-comments-post.php')); ?>">
|
||||||
<div class="flex ac">
|
<div class="flex ac">
|
||||||
<div class="comt-title text-center flex0 mr10">
|
<div class="comt-title text-center flex0 mr10">
|
||||||
|
|||||||
@@ -1,8 +1,8 @@
|
|||||||
<?php
|
<?php
|
||||||
/**
|
/**
|
||||||
* Comment form partials — expand toolbar (legacy DOM contract).
|
* Comment form partials — virtual-input + expand toolbar (legacy DOM contract).
|
||||||
*
|
*
|
||||||
* Mirrors legacy()
|
* Mirrors legacy() and legacy()
|
||||||
* from legacy/inc/functions.
|
* from legacy/inc/functions.
|
||||||
*
|
*
|
||||||
* @package AKSRT
|
* @package AKSRT
|
||||||
@@ -10,6 +10,31 @@
|
|||||||
|
|
||||||
defined('ABSPATH') || exit;
|
defined('ABSPATH') || exit;
|
||||||
|
|
||||||
|
if (!function_exists('aksrt_get_comment_virtual_input_html')) :
|
||||||
|
/**
|
||||||
|
* Mobile virtual input bar (legacy: legacy).
|
||||||
|
*
|
||||||
|
* @param string $placeholder Placeholder text.
|
||||||
|
* @param string $target CSS selector for the FixedInput target.
|
||||||
|
* @return string
|
||||||
|
*/
|
||||||
|
function aksrt_get_comment_virtual_input_html(string $placeholder = '', string $target = '#respond'): string {
|
||||||
|
$user_id = get_current_user_id();
|
||||||
|
$avatar = get_avatar($user_id, 36, '', '', ['class' => 'avatar']);
|
||||||
|
if ($placeholder === '') {
|
||||||
|
$placeholder = __('说点什么吧...', 'aksrt');
|
||||||
|
}
|
||||||
|
$html = '<div class="flex ac jsb virtual-input" fixed-input="' . esc_attr($target) . '">';
|
||||||
|
$html .= '<div class="flex flex1 ac">';
|
||||||
|
$html .= $avatar;
|
||||||
|
$html .= '<div class="text-ellipsis simulation mr10">' . esc_html($placeholder) . '</div>';
|
||||||
|
$html .= '</div>';
|
||||||
|
$html .= '<span class="but c-blue">' . esc_html__('提交', 'aksrt') . '</span>';
|
||||||
|
$html .= '</div>';
|
||||||
|
return $html;
|
||||||
|
}
|
||||||
|
endif;
|
||||||
|
|
||||||
if (!function_exists('aksrt_get_input_expand_but')) :
|
if (!function_exists('aksrt_get_input_expand_but')) :
|
||||||
/**
|
/**
|
||||||
* legacy-style expand toolbar button + dropdown (legacy: legacy).
|
* legacy-style expand toolbar button + dropdown (legacy: legacy).
|
||||||
|
|||||||
@@ -241,7 +241,7 @@ trait ScriptsPart1b {
|
|||||||
|
|
||||||
// 评论区样式(硬切换后全部自有):任何会渲染评论区的 singular
|
// 评论区样式(硬切换后全部自有):任何会渲染评论区的 singular
|
||||||
// (普通文章 / 资源型 post / 启用评论的页面)统一加载 build 聚合。
|
// (普通文章 / 资源型 post / 启用评论的页面)统一加载 build 聚合。
|
||||||
// 缺失时评论表单/列表会失去自有布局规则,按文档流裸显示。
|
// 缺失时手机端 .mobile-fixed 抽屉规则不生效,表单会按文档流直接显示。
|
||||||
if (is_singular() && !empty($singular_assets['needs_comments'])) {
|
if (is_singular() && !empty($singular_assets['needs_comments'])) {
|
||||||
$comments_filename = file_exists(get_template_directory() . '/assets/css/build/comments.min.css')
|
$comments_filename = file_exists(get_template_directory() . '/assets/css/build/comments.min.css')
|
||||||
? 'comments.min.css'
|
? 'comments.min.css'
|
||||||
|
|||||||
Reference in new issue
Block a user