diff --git a/view/theme/frio/css/style.css b/view/theme/frio/css/style.css index f213123fb..1caaba9b9 100644 --- a/view/theme/frio/css/style.css +++ b/view/theme/frio/css/style.css @@ -1669,7 +1669,13 @@ aside .panel-body { /* wall items */ .wall-item-container { - position: relative; + background-color: rgba(0, 0, 0, 0.03); + padding: 0.5em; + border-top: 1px solid rgba(255, 255, 255, 0.8); +} + +.wall-item-container .media { + margin-top: 0; } /* wall items contact photo */ @@ -1914,12 +1920,13 @@ code > .hl-main { /* item social action buttons */ .wall-item-actions { - margin-top: 15px; + display: flex; + margin: .5em 0; + justify-content: space-between; } -.wall-item-actions, .wall-item-actions a, .wall-item-actions button { +.wall-item-actions a, .wall-item-actions button { font-size: 13px; color: #555; - margin-bottom: 0; } .wall-item-actions .active { font-weight: bold; @@ -2013,9 +2020,10 @@ code > .hl-main { position: relative!important; margin-top: 0; } -.hide-comments-outer-wrapper { -/* text-align: center; - margin-top: -18px;*/ +.hide-comments-outer { + background-color: rgba(0, 0, 0, 0.03); + padding: 0.5em; + border-radius: 0.5em 0.5em 0 0; } .hide-comments-total { cursor: pointer; @@ -2024,21 +2032,31 @@ code > .hl-main { /* * Comment Box */ -.thread_level_2 .wall-item-comment-wrapper { - padding-right: 5px; + +.comment-fake-form, +.wall-item-comment-wrapper { + padding: 10px; + border-top: 1px solid rgba(255, 255, 255, 0.8); + background-color: rgba(0, 0, 0, 0.03); + border-radius: 0 0 10px 10px; } + +.comment-fake-form { + border-color: #d9d9d9; +} + +.comment-container .wall-item-comment-wrapper { + margin-top: 0.5em; +} + .comment-edit-submit-wrapper { - margin-bottom: 25px; + display: flex; + justify-content: flex-end; } -.comment-edit-submit-wrapper a, -.comment-edit-submit-wrapper a:hover { - padding-top: 5px !important; - padding-bottom: 5px !important; -} -.comment-icon-list > li > .icon, -.comment-icon-list > li > .icon:hover { - color: #555; - background-color: transparent; + +.comment-icon-list { + display: flex; + justify-content: space-between; } /* acpopup + textcompletion*/ diff --git a/view/theme/frio/js/textedit.js b/view/theme/frio/js/textedit.js index e0c06af58..93d7fe8ce 100644 --- a/view/theme/frio/js/textedit.js +++ b/view/theme/frio/js/textedit.js @@ -82,7 +82,8 @@ function insertFormatting(BBcode, id) { if (tmpStr == '') { $("#comment-edit-text-" + id).addClass("comment-edit-text-full"); $("#comment-edit-text-" + id).removeClass("comment-edit-text-empty"); - openMenu("comment-edit-submit-wrapper-" + id); + closeMenu("comment-fake-form-" + id); + openMenu("item-comments-" + id); } textarea = document.getElementById("comment-edit-text-" + id); @@ -134,115 +135,99 @@ function cmtBbClose(id) { $("#comment-edit-bb-" + id).hide(); } -function commentExpand(id) { - $("#comment-edit-text-" + id).putCursorAtEnd(); - $("#comment-edit-text-" + id).addClass("comment-edit-text-full"); - $("#comment-edit-text-" + id).removeClass("comment-edit-text-empty"); - $("#comment-edit-text-" + id).focus(); +function commentExpand(id) +{ $("#mod-cmnt-wrap-" + id).show(); - openMenu("comment-edit-submit-wrapper-" + id); + closeMenu("comment-fake-form-" + id); + openMenu("item-comments-" + id); + $("#comment-edit-text-" + id) + .putCursorAtEnd() + .addClass("comment-edit-text-full") + .removeClass("comment-edit-text-empty"); + return true; } -function commentClose(obj, id) { - if (obj.value == '') { - $("#comment-edit-text-" + id).removeClass("comment-edit-text-full"); - $("#comment-edit-text-" + id).addClass("comment-edit-text-empty"); +function commentClose(obj, id) +{ + if (obj.value === '' || obj.value === obj.dataset.default) { + $("#comment-edit-text-" + id) + .removeClass("comment-edit-text-full") + .addClass("comment-edit-text-empty"); $("#mod-cmnt-wrap-" + id).hide(); - closeMenu("comment-edit-submit-wrapper-" + id); + openMenu("comment-fake-form-" + id); + closeMenu("item-comments-" + id); return true; } return false; } function showHideCommentBox(id) { - if ($('#comment-edit-form-' + id).is(':visible')) { - $('#comment-edit-form-' + id).hide(); + var $el = $('#comment-edit-form-' + id); + if ($el.is(':visible')) { + $el.hide(); } else { - $('#comment-edit-form-' + id).show(); + $el.show(); } } function commentOpenUI(obj, id) { - $("#comment-edit-text-" + id).addClass("comment-edit-text-full").removeClass("comment-edit-text-empty"); - // Choose an arbitrary tab index that's greater than what we're using in jot (3 of them) - // The submit button gets tabindex + 1 - $("#comment-edit-text-" + id).attr('tabindex', '9'); - $("#comment-edit-submit-" + id).attr('tabindex', '10'); - $("#comment-edit-submit-wrapper-" + id).show(); + closeMenu("comment-fake-form-" + id); + openMenu("item-comments-" + id); + $("#comment-edit-text-" + id) + .putCursorAtEnd() + .addClass("comment-edit-text-full").removeClass("comment-edit-text-empty") + .attr('tabindex', '9'); // Choose an arbitrary tab index that's greater than what we're using in jot (3 of them) + $("#comment-edit-submit-" + id).attr('tabindex', '10'); // The submit button gets tabindex + 1 // initialize autosize for this comment autosize($("#comment-edit-text-" + id + ".text-autosize")); } function commentCloseUI(obj, id) { - if (obj.value === '') { - $("#comment-edit-text-" + id).removeClass("comment-edit-text-full").addClass("comment-edit-text-empty"); - $("#comment-edit-text-" + id).removeAttr('tabindex'); + if (obj.value === '' || obj.value === obj.dataset.default) { + $("#comment-edit-text-" + id) + .removeClass("comment-edit-text-full").addClass("comment-edit-text-empty") + .removeAttr('tabindex'); $("#comment-edit-submit-" + id).removeAttr('tabindex'); - $("#comment-edit-submit-wrapper-" + id).hide(); + openMenu("comment-fake-form-" + id); + closeMenu("item-comments-" + id); // destroy the automatic textarea resizing autosize.destroy($("#comment-edit-text-" + id + ".text-autosize")); } } function jotTextOpenUI(obj) { - if (obj.value == '') { - $(".modal-body #profile-jot-text").addClass("profile-jot-text-full").removeClass("profile-jot-text-empty"); + if (obj.value === '' || obj.value === obj.dataset.default) { + var $el = $(".modal-body #profile-jot-text"); + $el.addClass("profile-jot-text-full").removeClass("profile-jot-text-empty"); // initiale autosize for the jot - autosize($(".modal-body #profile-jot-text")); + autosize($el); } } function jotTextCloseUI(obj) { - if (obj.value === '') { - $(".modal-body #profile-jot-text").removeClass("profile-jot-text-full").addClass("profile-jot-text-empty"); + if (obj.value === '' || obj.value === obj.dataset.default) { + var $el = $(".modal-body #profile-jot-text"); + $el.removeClass("profile-jot-text-full").addClass("profile-jot-text-empty"); // destroy the automatic textarea resizing - autosize.destroy($(".modal-body #profile-jot-text")); + autosize.destroy($el); } } function commentOpen(obj, id) { - if (obj.value == '') { - $("#comment-edit-text-" + id).addClass("comment-edit-text-full"); - $("#comment-edit-text-" + id).removeClass("comment-edit-text-empty"); + if (obj.value === '' || obj.value === obj.dataset.default) { + $("#comment-edit-text-" + id) + .putCursorAtEnd() + .addClass("comment-edit-text-full") + .removeClass("comment-edit-text-empty"); $("#mod-cmnt-wrap-" + id).show(); - openMenu("comment-edit-submit-wrapper-" + id); + closeMenu("comment-fake-form-" + id); + openMenu("item-comments-" + id); return true; } return false; } -function commentInsert(obj, id) { - var tmpStr = $("#comment-edit-text-" + id).val(); - if (tmpStr == '') { - $("#comment-edit-text-" + id).addClass("comment-edit-text-full"); - $("#comment-edit-text-" + id).removeClass("comment-edit-text-empty"); - openMenu("comment-edit-submit-wrapper-" + id); - } - var ins = $(obj).html(); - ins = ins.replace('<', '<'); - ins = ins.replace('>', '>'); - ins = ins.replace('&', '&'); - ins = ins.replace('"', '"'); - $("#comment-edit-text-" + id).val(tmpStr + ins); -} - -function qCommentInsert(obj, id) { - var tmpStr = $("#comment-edit-text-" + id).val(); - if (tmpStr == '') { - $("#comment-edit-text-" + id).addClass("comment-edit-text-full"); - $("#comment-edit-text-" + id).removeClass("comment-edit-text-empty"); - openMenu("comment-edit-submit-wrapper-" + id); - } - var ins = $(obj).val(); - ins = ins.replace('<', '<'); - ins = ins.replace('>', '>'); - ins = ins.replace('&', '&'); - ins = ins.replace('"', '"'); - $("#comment-edit-text-" + id).val(tmpStr + ins); - $(obj).val(''); -} - function confirmDelete() { return confirm(aStr.delitem); } diff --git a/view/theme/frio/templates/comment_item.tpl b/view/theme/frio/templates/comment_item.tpl index 4edc8f473..903eb1346 100644 --- a/view/theme/frio/templates/comment_item.tpl +++ b/view/theme/frio/templates/comment_item.tpl @@ -1,10 +1,10 @@ {{if $threaded}} -
{{* Action buttons to interact with the item (like: like, dislike, share and so on *}} -
{{* Action buttons to interact with the item (like: like, dislike, share and so on *}} -
+ {{* Insert comment box of threaded children *}} + {{if $item.threaded && $item.comment && $item.indent==comment}} +