From 7c6a841b079adabbb5fe35bc573f6b32eb2862f7 Mon Sep 17 00:00:00 2001 From: ruibaby Date: Fri, 5 Oct 2018 17:30:49 +0800 Subject: [PATCH] =?UTF-8?q?:art:=20=E4=BC=98=E5=8C=96=E8=AF=84=E8=AE=BA?= =?UTF-8?q?=E6=A8=A1=E5=9D=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../front/FrontCommentController.java | 4 +- src/main/resources/i18n/messages.properties | 1 + .../resources/i18n/messages_en_US.properties | 1 + .../resources/i18n/messages_zh_CN.properties | 1 + src/main/resources/static/css/comment.css | 183 ++++++++++-------- src/main/resources/static/js/comment.js | 97 ++++++++++ .../activate-power-mode.js | 1 + .../resources/static/plugins/md5/md5.min.js | 1 - .../templates/admin/admin_option.ftl | 17 ++ .../common/comment/_native_comment.ftl | 172 +++++----------- 10 files changed, 268 insertions(+), 210 deletions(-) create mode 100644 src/main/resources/static/js/comment.js create mode 100644 src/main/resources/static/plugins/activate-power-mode/activate-power-mode.js diff --git a/src/main/java/cc/ryanc/halo/web/controller/front/FrontCommentController.java b/src/main/java/cc/ryanc/halo/web/controller/front/FrontCommentController.java index a9a628e92..9c5b8ba61 100644 --- a/src/main/java/cc/ryanc/halo/web/controller/front/FrontCommentController.java +++ b/src/main/java/cc/ryanc/halo/web/controller/front/FrontCommentController.java @@ -126,8 +126,8 @@ public class FrontCommentController { } if (comment.getCommentParent() > 0) { lastComment = commentService.findCommentById(comment.getCommentParent()).get(); - String lastContent = "@" + lastComment.getCommentAuthor() + ""; - comment.setCommentContent(lastContent + StrUtil.subAfter(OwoUtil.markToImg(HtmlUtil.escape(comment.getCommentContent())), ":", true)); + String lastContent = "@" + lastComment.getCommentAuthor() + " "; + comment.setCommentContent(lastContent + OwoUtil.markToImg(HtmlUtil.escape(comment.getCommentContent()))); } else { //将评论内容的字符专为安全字符 comment.setCommentContent(OwoUtil.markToImg(HtmlUtil.escape(comment.getCommentContent()))); diff --git a/src/main/resources/i18n/messages.properties b/src/main/resources/i18n/messages.properties index 684175f0a..1b9c25f80 100644 --- a/src/main/resources/i18n/messages.properties +++ b/src/main/resources/i18n/messages.properties @@ -195,6 +195,7 @@ admin.setting.form.native-comment-avatar-monsterid = 小怪物 admin.setting.form.native-comment-avatar-retro = 复古 admin.setting.form.native-comment-avatar-robohash = 机器人 admin.setting.form.native-comment-avatar-blank = 不显示头像 +admin.setting.form.comment-activate-power-mode = 打字特效： admin.setting.form.new-comment-need-check = 评论审核后才显示： admin.setting.form.new-comment-notice = 新评论通知： admin.setting.form.comment-pass-notice = 评论审核通过通知对方： diff --git a/src/main/resources/i18n/messages_en_US.properties b/src/main/resources/i18n/messages_en_US.properties index b6b9ef1e5..871bf1558 100644 --- a/src/main/resources/i18n/messages_en_US.properties +++ b/src/main/resources/i18n/messages_en_US.properties @@ -195,6 +195,7 @@ admin.setting.form.native-comment-avatar-monsterid = Monsterid admin.setting.form.native-comment-avatar-retro = Retro admin.setting.form.native-comment-avatar-robohash = Robohash admin.setting.form.native-comment-avatar-blank = Blank +admin.setting.form.comment-activate-power-mode = Typing effect: admin.setting.form.new-comment-need-check = Need review: admin.setting.form.new-comment-notice = New comment notification: admin.setting.form.comment-pass-notice = Comment review by notifying the other party: diff --git a/src/main/resources/i18n/messages_zh_CN.properties b/src/main/resources/i18n/messages_zh_CN.properties index 684175f0a..1b9c25f80 100644 --- a/src/main/resources/i18n/messages_zh_CN.properties +++ b/src/main/resources/i18n/messages_zh_CN.properties @@ -195,6 +195,7 @@ admin.setting.form.native-comment-avatar-monsterid = 小怪物 admin.setting.form.native-comment-avatar-retro = 复古 admin.setting.form.native-comment-avatar-robohash = 机器人 admin.setting.form.native-comment-avatar-blank = 不显示头像 +admin.setting.form.comment-activate-power-mode = 打字特效： admin.setting.form.new-comment-need-check = 评论审核后才显示： admin.setting.form.new-comment-notice = 新评论通知： admin.setting.form.comment-pass-notice = 评论审核通过通知对方： diff --git a/src/main/resources/static/css/comment.css b/src/main/resources/static/css/comment.css index 74c473edd..fbddac99b 100644 --- a/src/main/resources/static/css/comment.css +++ b/src/main/resources/static/css/comment.css @@ -1,32 +1,35 @@ .native-list-one-head a, .native-list-one-content a{ + /* color: #424242; */ + color: #7575d0; opacity: 1;!important; -webkit-transition: all .15s linear; -moz-transition: all .15s linear; -o-transition: all .15s linear; - -ms-transition: all .15s linear; transition: all .15s linear; - /* color: #424242; */ - color: #7575d0;!important; } -.native-comment { + +.comment-container { padding: 10px; } -.native-comment img{ - display: inline-block;!important; - max-width: 100%;!important; - height: auto;!important; - margin: auto;!important; + +.comment-list-one-content img { + display: inline-block !important; + margin: auto !important; + height: auto !important; + max-width: 100% !important; } -.native-wrap { - border: 1px solid #f0f0f0!important; - padding: 10px!important; + +.comment-wrap { position: relative!important; - margin-left: 58px!important; + margin-left: 64px !important; + padding: 10px !important; + border: 1px solid #f0f0f0 !important; } input, textarea, button { outline: none!important; } -.comment-submit,.native-list-one-img,.native-list-one-footer-time,.native-list-one-footer-reback,.native-info,.native-nav,.ua,.native-message{ + +.comment-submit, .native-list-one-img, .native-list-one-footer-time, .native-list-one-footer-reback, .comment-info, .native-nav, .ua, .comment-message { -webkit-user-select:none!important; -moz-user-select:none!important; -ms-user-select:none!important; @@ -37,160 +40,177 @@ input, textarea, button { line-height: 1.8!important; } .comment-input-who, .comment-input-email, .comment-input-website { - width: 33.33% !important; - padding: 10px 0 !important; - font-size: .9rem !important; float: left !important; + padding: 10px 0 !important; + width: 33.33% !important; border: none !important; border-bottom: 1px dashed #dedede !important; + font-size: 16px !important; } .comment-input:focus { border-bottom: 1px dashed red !important; } .comment-input-content { + padding: 10px 0 !important; width: 100% !important; min-height: 120px !important; - resize: vertical!important; border: none!important; - font-size: .9rem !important; - padding: 10px 0!important; -} -.comment-OwO{ - text-align: left!important; - vertical-align: middle!important; - padding-top: 10px!important; + font-size: 16px !important; + resize: vertical !important; } .comment-footer { - text-align: right!important; - vertical-align: middle!important; padding-top: 10px!important; -} -.comment-submit { - border-radius: 0 !important; vertical-align: middle!important; + text-align: right !important; +} + +.comment-submit, .comment-cancel-reply { padding: 7px 14px!important; - font-size: .9rem!important; - cursor: pointer!important; + outline: none !important; border: 1px solid #ededed!important; + border-radius: 0 !important; background: #ededed!important; color: #313131!important; - outline: none!important; + vertical-align: middle !important; + font-size: 16px !important; line-height: normal!important; + cursor: pointer !important; transition: all .3s ease-in-out!important; } .comment-submit:hover{ - background-color: #fff !important; - border-radius: 1.9rem !important; border-color: #859cff !important; + border-radius: 50px !important; + background-color: #fff !important; color: #859cff !important; } -.native-list { - list-style: none!important; + +.comment-cancel-reply:hover { + border-color: #859cff !important; + border-radius: 50px !important; + background-color: #fff !important; + color: #859cff !important; +} + +.comment-list { margin-top: 0!important; margin-bottom: 0!important; padding: 0!important; + list-style: none !important; } -.native-list .native-list-one { - padding-top: 10px!important; + +.comment-list .comment-list-one { position: relative!important; display: block!important; - transition: all .3s ease-in-out!important; margin: 0 !important; + padding-top: 10px !important; + transition: all .3s ease-in-out !important; } -.native-list .native-list-one .native-list-one-img { - width: 2.5rem!important; - height: 2.5rem!important; + +.comment-list .comment-list-one .comment-list-one-img { float: left!important; + margin-right: 16px !important; + width: 48px !important; + height: 48px !important; border-radius: 50%!important; - margin-right: .7rem!important; cursor: pointer!important; -webkit-transition: 0.4s!important; -webkit-transition: -webkit-transform 0.4s ease-out!important; - transition: transform 0.4s ease-out!important; -moz-transition: -moz-transform 0.4s ease-out!important; + transition: transform 0.4s ease-out !important; } -.native-list-one-img:hover{ + +.comment-list-one-img:hover { transform: rotate(360deg)!important; } -.native-list .native-list-one section { + +.comment-list .comment-list-one section { overflow: hidden!important; padding-bottom: 1rem!important; border-bottom: 1px dashed #f5f5f5!important; } -.native-list .native-list-one section .native-list-one-head { - line-height: 1.5!important; - margin-bottom: .5rem!important; + +.comment-list .comment-list-one section .comment-list-one-head { margin-top: 0!important; + margin-bottom: 5px !important; + line-height: 1.5 !important; } -.native-list-one-head-name { - font-size: .875rem!important; - font-weight: 700!important; + +.comment-list-one-head-name { + color: #555 !important; + text-decoration: none !important; + font-weight: 500!important; + font-size: 16px !important; cursor: pointer!important; - text-decoration: none!important; - color: #555!important; } -.native-list-one-head-admin{ - padding: .1em 0.2em!important; - border-radius: 2px!important; - font-size: 70%!important; - font-weight: 700!important; - background-color: #87ceeb!important; + +.comment-list-one-head-admin { + display: inline-block; + margin-right: 5px !important; + padding: 2px 5px !important; + border-radius: 2px !important; + background: #87ceeb!important; color: #fff!important; - display: inline!important; + font-size: 12px !important; } .ua { display: inline-block; - padding: .2rem .5rem!important; + margin-right: 5px !important; + padding: 2px 5px !important; + border-radius: 5px !important; background: #ededed!important; color: #b3b1b1!important; - font-size: .75rem!important; - border-radius: .2rem!important; - margin-right: .3rem!important; + font-size: 8px !important; } -.native-list-one-content p { - font-size: 14px!important; + +.comment-list-one-content p { + margin: 0 !important; letter-spacing: 0!important; - margin: 0!important; font-weight: 400!important; + font-size: 16px !important; } -.native-list-one-footer-time { + +.comment-list-one-footer-time { + margin-right: 5px !important; color: #b3b3b3!important; - font-size: .75rem!important; - margin-right: .875rem!important; + font-size: 12px !important; } -.native-list-one-footer-reback { - font-size: .8125rem!important; + +.comment-list-one-footer-reback { color: #ef2f11!important; + font-size: 14px !important; cursor: pointer!important; } -.native-info{ + +.comment-info { padding-top: 10px!important; - font-size: 12px!important; color: #555!important; + font-size: 16px !important; } .comment-avatar{ position: relative!important; float: left!important; } .comment-avatar img{ + width: 56px; + height: 56px; border-radius: 100%!important; + cursor: pointer; -webkit-transition: 0.4s!important; -webkit-transition: -webkit-transform 0.4s ease-out; - transition: transform 0.4s ease-out; -moz-transition: -moz-transform 0.4s ease-out; - cursor: pointer; + transition: transform 0.4s ease-out; } .comment-avatar img:hover{ transform: rotate(360deg)!important; } .native-nav{ - padding: 10px 0!important;; + padding: 10px 0 !important; } .page-nav{ margin: 20px 0!important;; padding: 0 10px!important;; list-style: none!important;; - text-align: center!important;; + text-align: center !important; } .page-nav li{ display: inline-block!important; @@ -207,7 +227,8 @@ input, textarea, button { .ua{ display: none!important; } - .native-list{ + + .comment-list { margin-left: 5px!important; } } diff --git a/src/main/resources/static/js/comment.js b/src/main/resources/static/js/comment.js new file mode 100644 index 000000000..0a573747b --- /dev/null +++ b/src/main/resources/static/js/comment.js @@ -0,0 +1,97 @@ +var s = new OwO({ + logo: 'OωO表情', + container: document.getElementsByClassName('OwO')[0], + target: document.getElementsByClassName('comment-input-content')[0], + position: 'down', + width: '100%', + maxHeight: '210px', + api:"/static/plugins/OwO/OwO.min.json" +}); +$(document).ready(function () { + $(".comment-list-one-head").each(function (i) { + var uaInfo = $(this).children(".comment-ua-info").html(); + $(this).append(show_ua(uaInfo)); + }); + $("#commentAuthor").val(localStorage.getItem("author")); + $("#commentAuthorEmail").val(localStorage.getItem("email")); + $("#commentAuthorUrl").val(localStorage.getItem("url")); + loadAvatar(); +}); +$('#comment-submit').click(function () { + var author = $("#commentAuthor"); + var content = $("#commentContent"); + var email = $("#commentAuthorEmail"); + var url = $("#commentAuthorUrl"); + if (author.val() == '' || content.val() == '') { + $(".comment-message").html("请输入必填项！"); + $(".comment-message").fadeIn(1000); + setTimeout(function () { + $(".comment-message").fadeOut(1000); + },1500); + return; + } + $(this).attr("disabled","disabled"); + $(this).html("提交中..."); + $.ajax({ + type: 'POST', + url: '/newComment', + async: false, + data: { + 'postId': $('input[name=postId]').val(), + 'commentContent': $('textarea[name=commentContent]').val(), + 'commentAuthor': $('input[name=commentAuthor]').val(), + 'commentAuthorEmail': $('input[name=commentAuthorEmail]').val(), + 'commentAuthorUrl': $('input[name=commentAuthorUrl]').val(), + 'commentAgent': navigator.userAgent, + 'commentParent': $('input[name=commentParent]').val() + }, + success: function (data) { + localStorage.setItem('author', author.val()); + localStorage.setItem('email', email.val()); + localStorage.setItem('url', url.val()); + if(data.code==1){ + $('.comment-input-content').val(""); + $(".comment-message").html(""+data.msg+""); + }else{ + $(".comment-message").html(""+data.msg+""); + } + $(".comment-message").fadeIn(1000); + setTimeout(function () { + $(".comment-message").fadeOut(1000); + $("#comment-submit").removeAttr("disabled"); + $("#comment-submit").html("提交"); + window.location.reload(); + },1500); + } + }); +}); +$('.comment-list-one-footer-reback').click(function () { + var at = $(this).attr("at"); + var commentParentAuthor = $('#comment-id-'+at).find(".comment-list-one-head-name").html(); + $('#commentParent').val(at); + $('#commentContent').attr("placeholder","@"+commentParentAuthor); + $(".comment-cancel-reply").show(); + $('#commentContent').focus(); +}); +$('.comment-cancel-reply').click(function () { + $('#commentParent').val(0); + $('#commentContent').attr("placeholder",""); + $(".comment-cancel-reply").hide(); +}); +function loadAvatar() { + $(".comment-author-avatar").attr("src","//gravatar.loli.net/avatar/"+md5(localStorage.getItem("email"))+"?s=256&d="+avatarType); + if($('input[name=commentAuthorEmail]').val()!='' && $('input[name=commentAuthorEmail]').val()!=null){ + $(".comment-author-avatar").attr("src","//gravatar.loli.net/avatar/"+md5($('input[name=commentAuthorEmail]').val())+"?s=256&d="+avatarType); + } +} +var parser = new UAParser(); +function show_ua(string){ + parser.setUA(string); + var uua = parser.getResult(); + if(uua.os.version=='x86_64') { + uua.os.version = 'x64'; + } + var browser = uua.browser.name+' '+uua.browser.version; + var os = uua.os.name + ' ' + uua.os.version; + return ''+browser+''+os+''; +} diff --git a/src/main/resources/static/plugins/activate-power-mode/activate-power-mode.js b/src/main/resources/static/plugins/activate-power-mode/activate-power-mode.js new file mode 100644 index 000000000..e016b3ae4 --- /dev/null +++ b/src/main/resources/static/plugins/activate-power-mode/activate-power-mode.js @@ -0,0 +1 @@ +(function webpackUniversalModuleDefinition(b,a){if(typeof exports==="object"&&typeof module==="object"){module.exports=a()}else{if(typeof define==="function"&&define.amd){define([],a)}else{if(typeof exports==="object"){exports.POWERMODE=a()}else{b.POWERMODE=a()}}}})(this,function(){return(function(c){var b={};function a(e){if(b[e]){return b[e].exports}var d=b[e]={exports:{},id:e,loaded:false};c[e].call(d.exports,d,d.exports,a);d.loaded=true;return d.exports}a.m=c;a.c=b;a.p="";return a(0)})([function(j,e,a){var b=document.createElement("canvas");b.width=window.innerWidth;b.height=window.innerHeight;b.style.cssText="position:fixed;top:0;left:0;pointer-events:none;z-index:999999";window.addEventListener("resize",function(){b.width=window.innerWidth;b.height=window.innerHeight});document.body.appendChild(b);var c=b.getContext("2d");var l=[];var k=0;m.shake=true;function h(o,n){return Math.random()*(n-o)+o}function g(n){if(m.colorful){var o=h(0,360);return"hsla("+h(o-10,o+10)+", 100%, "+h(50,80)+"%, "+1+")"}else{return window.getComputedStyle(n).color}}function f(){var o=document.activeElement;var n;if(o.tagName==="TEXTAREA"||(o.tagName==="INPUT"&&o.getAttribute("type")==="text")){var p=a(1)(o,o.selectionStart);n=o.getBoundingClientRect();return{x:p.left+n.left,y:p.top+n.top,color:g(o)}}var r=window.getSelection();if(r.rangeCount){var q=r.getRangeAt(0);var s=q.startContainer;if(s.nodeType===document.TEXT_NODE){s=s.parentNode}n=q.getBoundingClientRect();return{x:n.left,y:n.top,color:g(s)}}return{x:0,y:0,color:"transparent"}}function d(o,p,n){return{x:o,y:p,alpha:1,color:n,velocity:{x:-1+Math.random()*2,y:-3.5+Math.random()*2}}}function m(){var n=f();var p=5+Math.round(Math.random()*10);while(p--){l[k]=d(n.x,n.y,n.color);k=(k+1)%500}if(m.shake){var o=1+2*Math.random();var q=o*(Math.random()>0.5?-1:1);var r=o*(Math.random()>0.5?-1:1);document.body.style.marginLeft=q+"px";document.body.style.marginTop=r+"px";setTimeout(function(){document.body.style.marginLeft="";document.body.style.marginTop=""},75)}}m.colorful=false;function i(){requestAnimationFrame(i);c.clearRect(0,0,b.width,b.height);for(var n=0;nparseInt(f.height)){o.overflowY="scroll"}}else{o.overflow="hidden"}i.textContent=k.value.substring(0,m);if(k.nodeName==="INPUT"){i.textContent=i.textContent.replace(/\s/g,"\u00a0")}var n=document.createElement("span");n.textContent=k.value.substring(m)||".";i.appendChild(n);var g={top:n.offsetTop+parseInt(f.borderTopWidth),left:n.offsetLeft+parseInt(f.borderLeftWidth)};if(h){n.style.backgroundColor="#aaa"}else{document.body.removeChild(i)}return g}if(typeof b!="undefined"&&typeof b.exports!="undefined"){b.exports=c}else{window.getCaretCoordinates=c}}())}])}); diff --git a/src/main/resources/static/plugins/md5/md5.min.js b/src/main/resources/static/plugins/md5/md5.min.js index 7d8a3f53c..7d02c647b 100644 --- a/src/main/resources/static/plugins/md5/md5.min.js +++ b/src/main/resources/static/plugins/md5/md5.min.js @@ -1,2 +1 @@ !function(n){"use strict";function t(n,t){var r=(65535&n)+(65535&t);return(n>>16)+(t>>16)+(r>>16)<<16|65535&r}function r(n,t){return n<>>32-t}function e(n,e,o,u,c,f){return t(r(t(t(e,n),t(u,f)),c),o)}function o(n,t,r,o,u,c,f){return e(t&r|~t&o,n,t,u,c,f)}function u(n,t,r,o,u,c,f){return e(t&o|r&~o,n,t,u,c,f)}function c(n,t,r,o,u,c,f){return e(t^r^o,n,t,u,c,f)}function f(n,t,r,o,u,c,f){return e(r^(t|~o),n,t,u,c,f)}function i(n,r){n[r>>5]|=128<>>9<<4)]=r;var e,i,a,d,h,l=1732584193,g=-271733879,v=-1732584194,m=271733878;for(e=0;e>5]>>>t%32&255);return r}function d(n){var t,r=[];for(r[(n.length>>2)-1]=void 0,t=0;t>5]|=(255&n.charCodeAt(t/8))<16&&(o=i(o,8*n.length)),r=0;r<16;r+=1)u[r]=909522486^o[r],c[r]=1549556828^o[r];return e=i(u.concat(d(t)),512+8*t.length),a(i(c.concat(e),640))}function g(n){var t,r,e="";for(r=0;r>>4&15)+"0123456789abcdef".charAt(15&t);return e}function v(n){return unescape(encodeURIComponent(n))}function m(n){return h(v(n))}function p(n){return g(m(n))}function s(n,t){return l(v(n),v(t))}function C(n,t){return g(s(n,t))}function A(n,t,r){return t?r?s(t,n):C(t,n):r?m(n):p(n)}"function"==typeof define&&define.amd?define(function(){return A}):"object"==typeof module&&module.exports?module.exports=A:n.md5=A}(this); -//# sourceMappingURL=md5.min.js.map \ No newline at end of file diff --git a/src/main/resources/templates/admin/admin_option.ftl b/src/main/resources/templates/admin/admin_option.ftl index 7b5e06760..f1af5bdd3 100755 --- a/src/main/resources/templates/admin/admin_option.ftl +++ b/src/main/resources/templates/admin/admin_option.ftl @@ -248,6 +248,23 @@ +
+ +
+
+ +
+ +
+
+
+ +
+ +
+
+
+
diff --git a/src/main/resources/templates/common/comment/_native_comment.ftl b/src/main/resources/templates/common/comment/_native_comment.ftl index 189bf57aa..4816eb911 100644 --- a/src/main/resources/templates/common/comment/_native_comment.ftl +++ b/src/main/resources/templates/common/comment/_native_comment.ftl @@ -4,11 +4,11 @@ -
+
- +
-
+
@@ -21,67 +21,68 @@ ${options.native_css?if_exists}
- + +
- -
- ${commentsCount?default(0)}评论 + +
+ ${commentsCount?default(0)}评论
<#macro childComments comments> -
    +
      <#if comments?? && comments?size gt 0> <#list comments?sort_by("commentDate") as comment> -
    • - +
    • +
      -
      - ${comment.commentAuthor?if_exists} - +
      + ${comment.commentAuthor?if_exists} + <#if comment.isAdmin==1> - + 博主
      -
      +

      ${comment.commentContent?if_exists}

      -
      - ${comment.commentDate?string("yyyy-MM-dd HH:mm")} - 回复 +
      + ${comment.commentDate?string("yyyy-MM-dd HH:mm")} + 回复
      - <#if comment.childComments?? && comment.childComments?size gt 0> - <@childComments comment.childComments> - + <#if comment.childComments?? && comment.childComments?size gt 0> + <@childComments comment.childComments> +
    -
      +
        <#if comments?? && comments.getPageList()?size gt 0> <#list comments.getPageList()?sort_by("commentDate")?reverse as comment> -
      • - +
      • +
        -
        - ${comment.commentAuthor?if_exists} - +
        + ${comment.commentAuthor?if_exists} + <#if comment.isAdmin==1> - +
        -
        +

        ${comment.commentContent?if_exists}

        -
        - ${comment.commentDate?string("yyyy-MM-dd HH:mm")} - 回复 +
        + ${comment.commentDate?string("yyyy-MM-dd HH:mm")} + 回复
        - <#if comment.childComments?? && comment.childComments?size gt 0> - <@childComments comment.childComments> - + <#if comment.childComments?? && comment.childComments?size gt 0> + <@childComments comment.childComments> +
        • @@ -116,97 +117,16 @@ ${options.native_css?if_exists} +<#if options.comment_activate_power_mode?default("false") == "true"> + + + +