first
This commit is contained in:
shim
21
modules/comment/themes/_desktop/bs4-classic/LICENSE
Normal file
21
modules/comment/themes/_desktop/bs4-classic/LICENSE
Normal file
@@ -0,0 +1,21 @@
|
||||
The RBL License
|
||||
|
||||
Copyright (c) 2011-2018 Redblock, Inc.
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in
|
||||
all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
||||
THE SOFTWARE.
|
||||
17
modules/comment/themes/_desktop/bs4-classic/README.md
Normal file
17
modules/comment/themes/_desktop/bs4-classic/README.md
Normal file
@@ -0,0 +1,17 @@
|
||||
|
||||
# 부트스트랩 4 댓글 기본형 테마
|
||||
|
||||
안녕하세요. 감사합니다.
|
||||
|
||||
## 주요기능
|
||||
- Automated website building technology
|
||||
- Powerful content managing system
|
||||
- Multiple virtual site system
|
||||
- Unlimited extension
|
||||
- Multi Screen implementations
|
||||
|
||||
## 서버 요구사항
|
||||
- PHP version 5.2.x
|
||||
- MYSQL version 3.23.x or greater (recommend MYSQL >= 5.x)
|
||||
- GD Library
|
||||
- ICONV
|
||||
235
modules/comment/themes/_desktop/bs4-classic/css/style.css
Normal file
235
modules/comment/themes/_desktop/bs4-classic/css/style.css
Normal file
@@ -0,0 +1,235 @@
|
||||
@charset "utf-8";
|
||||
.hidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
[data-role="comment-item"],
|
||||
[data-role="comment-item"] .markdown-body {
|
||||
font-size: 13px;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
[data-role="oneline-item"],
|
||||
[data-role="oneline-item"].markdown-body {
|
||||
font-size: 12px
|
||||
}
|
||||
|
||||
[data-role="oneline-item"] blockquote {
|
||||
margin-bottom: 0;
|
||||
padding: 0 1em;
|
||||
color: #6a737d;
|
||||
border-left: 0.25em solid #dfe2e5;
|
||||
}
|
||||
|
||||
.js-like.active {
|
||||
color: #007bff !important
|
||||
}
|
||||
|
||||
.js-like.active::after {
|
||||
content: ' 취소'
|
||||
}
|
||||
|
||||
.js-new.active::before {
|
||||
padding-left: 3px;
|
||||
content: 'new';
|
||||
color: red;
|
||||
font-size: 80%
|
||||
}
|
||||
|
||||
.rb-comments-write .card textarea {
|
||||
height: 34px;
|
||||
background-color: #fafbfc;
|
||||
-webkit-transition: height 1s;
|
||||
/* For Safari 3.1 to 6.0 */
|
||||
transition: height 1s;
|
||||
transition-delay: 1s;
|
||||
-webkit-transition-delay: 1s;
|
||||
}
|
||||
|
||||
.rb-comments-write .card.active textarea {
|
||||
min-height: 70px !important;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.rb-comments-write .card .card-footer {
|
||||
display: none
|
||||
}
|
||||
|
||||
.rb-comments-write .card.active .card-footer {
|
||||
display: block
|
||||
}
|
||||
|
||||
.media[data-role="comment-item"].border-bottom {
|
||||
border-bottom: 1px dotted #dee2e6 !important;
|
||||
}
|
||||
|
||||
.list-group-item[data-role="oneline-item"] {
|
||||
border-style: dotted;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
background-color: #fafbfc;
|
||||
}
|
||||
|
||||
.list-group:empty {
|
||||
margin-top: 0 !important;
|
||||
margin-bottom: 0 !important
|
||||
}
|
||||
|
||||
.flex-column-reverse .list-group-item:last-child {
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
|
||||
/* notify */
|
||||
|
||||
#commentting-container,
|
||||
[data-role=comment-container],
|
||||
[data-role=moreBtn-container] {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#comment-notify {
|
||||
visibility: hidden;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
bottom: 30px;
|
||||
top: auto
|
||||
}
|
||||
|
||||
#comment-notify .comment-notify-msg {
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
background-color: #333;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
border-radius: 5px;
|
||||
padding: 12px 6px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#comment-notify.active {
|
||||
visibility: visible;
|
||||
-webkit-animation: fadein 0.5s, fadeout 0.5s 1.1s;
|
||||
animation: fadein 0.5s, fadeout 0.5s 1.1s;
|
||||
}
|
||||
|
||||
@-webkit-keyframes fadein {
|
||||
from {
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
bottom: 30px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadein {
|
||||
from {
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
bottom: 30px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes fadeout {
|
||||
from {
|
||||
bottom: 30px;
|
||||
opacity: 1;
|
||||
}
|
||||
to {
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadeout {
|
||||
from {
|
||||
bottom: 30px;
|
||||
opacity: 1;
|
||||
}
|
||||
to {
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* notify */
|
||||
|
||||
/* attach trigger */
|
||||
|
||||
#commentting-container .comment-attach {
|
||||
position: relative;
|
||||
display: block;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
padding: 8px 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#commentting-container span.comment-attach input[type='file'] {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: 0;
|
||||
right: -9px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
opacity: 0;
|
||||
font-size: 0;
|
||||
width: 180%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* emoticon */
|
||||
|
||||
#commentting-container .emoticon-wrapper {
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
padding: 15px 5px;
|
||||
}
|
||||
|
||||
#commentting-container .emoticon-wrapper ul {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#commentting-container .emoticon-wrapper li {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
text-align: center;
|
||||
width: 12.5%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#commentting-container .emoticon-wrapper li img {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
[data-role|=oneline-input-wrapper],
|
||||
[data-role|=comment-modify-btn-wrapper],
|
||||
[data-role|=oneline-modify-btn-wrapper] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* loader */
|
||||
|
||||
#comment-spinner-wrap {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.comment-top5p {
|
||||
top: 5%;
|
||||
}
|
||||
|
||||
.comment-bottom5p {
|
||||
bottom: 5%;
|
||||
}
|
||||
@@ -0,0 +1,4 @@
|
||||
<div data-role="{$entry_type}-modify-btn-wrapper-{$uid}" class="my-2">
|
||||
<button class="btn btn-light btn-sm" data-toggle="cancel-edit" data-type="{$entry_type}" data-uid="{$uid}">수정취소</button>
|
||||
<button class="btn btn-primary btn-sm" data-kcact="edit" data-type="{$entry_type}" data-uid="{$uid}" data-parent="{$parent}">수정완료</button>
|
||||
</div>
|
||||
@@ -0,0 +1,12 @@
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-link btn-sm dropdown-toggle" type="button" data-toggle="dropdown" data-role="showHide-menu" data-type="{$entry_type}">
|
||||
</button>
|
||||
<div class="dropdown-menu dropdown-menu-right" data-role="menu-container-{$entry_type}">
|
||||
<a href="#" class="dropdown-item" data-toggle="edit" data-type="{$entry_type}" data-uid="{$uid}">
|
||||
<i class="fa fa-edit"></i> 수정
|
||||
</a>
|
||||
<a href="#" class="dropdown-item" data-kcact="delete" data-type="{$entry_type}" data-uid="{$uid}" data-parent="{$entry_parent}">
|
||||
<i class="fa fa-trash-o"></i> 삭제
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,116 @@
|
||||
<!-- 공통 사항 data-* ="*" 과 {$*} 는 수정 금지 -->
|
||||
<header class="d-flex justify-content-start" data-role="header-container">
|
||||
{$comment_header} <!-- 댓글 header : comment_header.html -->
|
||||
</header>
|
||||
<div class="rb-comments-write" data-role="commentWrite-container"> <!-- 댓글 입렵부 : comment_write.html -->
|
||||
{$comment_write}
|
||||
</div>
|
||||
<main data-role="comment-main">
|
||||
<nav class="d-flex">
|
||||
<div class="btn-group btn-group-sm btn-group-toggle" data-toggle="buttons" role="group">
|
||||
<label class="btn btn-light active" data-kcact="changeSort" data-sort="uid" data-orderby="asc">
|
||||
<input type="radio" name="changeSort" id="sort_uid_asc" autocomplete="off" checked> 최신순
|
||||
</label>
|
||||
<label class="btn btn-light" data-kcact="changeSort" data-sort="uid" data-orderby="desc">
|
||||
<input type="radio" name="changeSort" id="sort_uid_desc" autocomplete="off"> 과거순
|
||||
</label>
|
||||
<label class="btn btn-light" data-kcact="changeSort" data-sort="likes" data-orderby="desc">
|
||||
<input type="radio" name="changeSort" id="sort_likes_desc" autocomplete="off"> 추천순
|
||||
</label>
|
||||
</div>
|
||||
<button type="button" class="btn btn-light btn-sm d-print-none ml-auto" role="button" data-kcact="reload" data-toggle="tooltip" title="새로고침">
|
||||
<i class="fa fa-refresh" aria-hidden="true"></i>
|
||||
</button>
|
||||
</nav>
|
||||
<hr>
|
||||
<ul class="list-unstyled" data-role="comment-container"> <!-- 댓글 출력부 : comment_row.html -->
|
||||
{$comment_rows}
|
||||
</ul>
|
||||
<div data-role="btnMore-container"> <!-- 더보기 버튼 -->
|
||||
<a class="btn btn-block btn-light" data-role="trigger-getMoreComment">더보기</a>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<div class="d-none animated fadeIn" data-role="comment-none">
|
||||
<div class="d-flex justify-content-center align-items-center" style="height: 30vh;">
|
||||
<div class="text-muted text-center">
|
||||
<div class="display-2 mb-3">
|
||||
<i class="fa fa-comment-o" aria-hidden="true"></i>
|
||||
</div>
|
||||
<button type="button" class="btn btn-link text-muted js-comment-focus">첫번째 댓글을 남겨주세요.</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<!-- Modal -->
|
||||
<div class="modal fade" id="modal_reaction" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog modal-sm modal-dialog-centered" role="document">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title">
|
||||
<i class="fa fa-thumbs-o-up fa-lg fa-fw" aria-hidden="true"></i> 공감한 사람 <span class="badge badge-light js-count">9</span>
|
||||
</h5>
|
||||
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
||||
<span aria-hidden="true">×</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body p-0">
|
||||
<ul class="list-group list-group-flush">
|
||||
<li class="list-group-item d-flex justify-content-between align-items-center">
|
||||
<div class="media w-100">
|
||||
<img class="mr-3 border rounded-circle" src="/_core/opensrc/timthumb/thumb.php?src=https://kimsq.com/_var/avatar/180.break93.png&w=38&h=38" alt="아바타" width="38">
|
||||
<div class="media-body">
|
||||
<strong>벽돌공장</strong>
|
||||
<p class="text-muted small mt-1 mb-0">
|
||||
엑스퍼트
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<span class="badge badge-light badge-pill">36분 전</span>
|
||||
</li>
|
||||
<li class="list-group-item d-flex justify-content-between align-items-center">
|
||||
<div class="media w-100">
|
||||
<img class="mr-3 border rounded-circle" src="/_core/opensrc/timthumb/thumb.php?src=https://kimsq.com/_var/avatar/180.break93.png&w=38&h=38" alt="아바타" width="38">
|
||||
<div class="media-body">
|
||||
<strong>벽돌공장</strong>
|
||||
<p class="text-muted small mt-1 mb-0">
|
||||
엑스퍼트
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<span class="badge badge-light badge-pill">36분 전</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-light btn-block" data-dismiss="modal">확인</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
jQuery(function($) {
|
||||
|
||||
$('[data-toggle="tooltip"]').tooltip()
|
||||
|
||||
$(".js-modal-window").click(function() {
|
||||
modalSetting('modal_window',$(this).attr("data-href"));
|
||||
});
|
||||
|
||||
$('.add-comment').click(function() {
|
||||
var uid = $(this).data('parent')
|
||||
var textarea = $('[data-role="oneline-input-'+uid+'"]')
|
||||
setTimeout(function(){ textarea.focus(); }, 200); // 한줄의견 추가시에 textarea focus 처리하기
|
||||
});
|
||||
|
||||
$('.js-comment-focus').click(function() {
|
||||
$('#meta-description-content').focus()
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
</script>
|
||||
@@ -0,0 +1,4 @@
|
||||
<h1 class="h5 text-muted">
|
||||
<i class="fa fa-commenting-o fa-fw" aria-hidden="true"></i> 댓글
|
||||
<span class="text-primary" data-role="show-totalRow">{$comment_total}</span>
|
||||
</h1>
|
||||
@@ -0,0 +1,71 @@
|
||||
<li class="media border-bottom mb-3" data-role="comment-item" data-uid="{$comment_uid}" data-page="{$comment_page}" data-totalPage="{$total_page}" data-type="comment" data-hidden="{$comment_getHidden}" data-notice="{$comment_getNoitce}">
|
||||
<div data-role="comment-origin-content-{$comment_uid}" class="d-none">{$comment_content}</div>
|
||||
<img class="mr-3 border rounded-circle" src="{$comment_user_pic}" alt="아바타" width="50">
|
||||
<div class="media-body">
|
||||
<div class="d-flex w-100 justify-content-between align-items-center">
|
||||
<span>
|
||||
<span data-role="comment-hidden" class="badge"><i class="fa fa-lock fa-lg" aria-hidden="true"></i></span>
|
||||
<strong class="mr-2">{$comment_user_name}</strong>
|
||||
<i class="fa fa-clock-o" aria-hidden="true"></i>
|
||||
<time data-role="comment-time-wrapper-{$comment_uid}">{$comment_regis_time}</time>
|
||||
<small class="ml-1 {$comment_getNew}"></small><!-- 24시간이내 new 출력 -->
|
||||
</span>
|
||||
<span>
|
||||
{$btn_showHideMenu} <!-- 메뉴 출력/숨기 버튼 btn_showHideMenu.html : 권한이 있는 경우(로그인,작성자,관리자) 에만 노출됨 -->
|
||||
</span>
|
||||
</div><!-- /.d-flex -->
|
||||
<div class="markdown-body">
|
||||
<article class="mb-0" data-role="comment-content-editable-{$comment_uid}">{$comment_content}</article>
|
||||
</div>
|
||||
{$btn_editMod} <!-- 수정 모드시 취소/완료 버튼 btn_ediMod.html -->
|
||||
|
||||
<div class="mb-2">
|
||||
<button class="btn btn-link btn-sm add-comment px-0 muted-link" data-role="toggle-oneline-input" data-parent="{$comment_uid}">
|
||||
<i class="fa fa-comment-o fa-lg fa-fw" aria-hidden="true"></i>
|
||||
의견달기
|
||||
</button>
|
||||
<button class="btn btn-link btn-sm muted-link js-like pr-0 {$comment_getIsLiked}"
|
||||
data-kcact="like"
|
||||
data-type="comment"
|
||||
data-entry="{$comment_uid}"
|
||||
data-effect="animated bounceIn delay-1"
|
||||
data-role="comment-isLiked-{$comment_uid}">
|
||||
<i class="fa fa-thumbs-o-up fa-lg fa-fw" aria-hidden="true"></i>
|
||||
좋아요
|
||||
</button>
|
||||
<a href="#modal_reaction" class="badge badge-light"
|
||||
data-toggle="modal"
|
||||
data-type="comment"
|
||||
data-count="{$comment_like_total}"
|
||||
data-entry="{$comment_uid}"
|
||||
data-role="comment-likeTotal-{$comment_uid}" title="좋아요한 사람">
|
||||
{$comment_like_total}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<section>
|
||||
<div class="my-2" data-role="oneline-input-wrapper-{$comment_uid}"> <!-- 한줄의견 등록폼 -->
|
||||
<form class="input-group">
|
||||
<input type="text" class="form-control" data-role="oneline-input-{$comment_uid}"><!-- 주의 : comment_uid 가 들어가야 함 -->
|
||||
<div class="input-group-append">
|
||||
<button class="btn btn-light" type="submit"
|
||||
title="의견추가"
|
||||
data-kcact="regis"
|
||||
data-type="oneline"
|
||||
data-parent="{$comment_uid}"
|
||||
data-effect="animated fadeInUp"
|
||||
data-grant="{$grant_uid}">
|
||||
<i class="fa fa-paper-plane fa-lg" aria-hidden="true"></i>
|
||||
</button>
|
||||
</div>
|
||||
</form><!-- /.input-group -->
|
||||
</div>
|
||||
|
||||
<ul class="list-group my-2" data-role="oneline-container-{$comment_uid}">
|
||||
{$oneline_rows} <!-- 한줄의견 리스트 -->
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
|
||||
</div>
|
||||
</li>
|
||||
@@ -0,0 +1,72 @@
|
||||
<li class="media border-bottom mb-3" data-role="comment-item" data-uid="{$comment_uid}" data-page="{$comment_page}" data-totalPage="{$total_page}" data-type="comment" data-hidden="{$comment_getHidden}" data-notice="{$comment_getNoitce}">
|
||||
<div data-role="comment-origin-content-{$comment_uid}" class="d-none">{$comment_content}</div>
|
||||
<img class="mr-3 border rounded-circle" src="{$comment_user_pic}" alt="아바타" width="50">
|
||||
<div class="media-body">
|
||||
<div class="d-flex w-100 justify-content-between align-items-center">
|
||||
<span>
|
||||
<strong class="mr-2">{$comment_user_name}</strong>
|
||||
<i class="fa fa-clock-o" aria-hidden="true"></i>
|
||||
<time data-role="comment-time-wrapper-{$comment_uid}">{$comment_regis_time}</time>
|
||||
<small class="ml-1 {$comment_getNew}"></small><!-- 24시간이내 new 출력 -->
|
||||
</span>
|
||||
<span>
|
||||
{$btn_showHideMenu} <!-- 메뉴 출력/숨기 버튼 btn_showHideMenu.html : 권한이 있는 경우(로그인,작성자,관리자) 에만 노출됨 -->
|
||||
</span>
|
||||
</div><!-- /.d-flex -->
|
||||
<div class="markdown-body">
|
||||
<article class="mb-0" data-role="comment-content-editable-{$comment_uid}">
|
||||
<div class="text-center text-muted bg-light p-4 my-2"><i class="fa fa-lock fa-fw" aria-hidden="true"></i> 비밀글</div>
|
||||
</article>
|
||||
</div>
|
||||
{$btn_editMod} <!-- 수정 모드시 취소/완료 버튼 btn_ediMod.html -->
|
||||
|
||||
<div class="mb-2">
|
||||
<button class="btn btn-link btn-sm add-comment px-0 muted-link" data-role="toggle-oneline-input" data-parent="{$comment_uid}">
|
||||
<i class="fa fa-comment-o fa-lg fa-fw" aria-hidden="true"></i>
|
||||
의견달기
|
||||
</button>
|
||||
<button class="btn btn-link btn-sm muted-link js-like pr-0 {$comment_getIsLiked}"
|
||||
data-kcact="like"
|
||||
data-type="comment"
|
||||
data-entry="{$comment_uid}"
|
||||
data-effect="animated bounceIn delay-1"
|
||||
data-role="comment-isLiked-{$comment_uid}">
|
||||
<i class="fa fa-thumbs-o-up fa-lg fa-fw" aria-hidden="true"></i>
|
||||
좋아요
|
||||
</button>
|
||||
<a href="#modal_reaction" class="badge badge-light"
|
||||
data-toggle="modal"
|
||||
data-type="comment"
|
||||
data-count="{$comment_like_total}"
|
||||
data-entry="{$comment_uid}"
|
||||
data-role="comment-likeTotal-{$comment_uid}" title="좋아요한 사람">
|
||||
{$comment_like_total}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<section>
|
||||
<div class="my-2" data-role="oneline-input-wrapper-{$comment_uid}"> <!-- 한줄의견 등록폼 -->
|
||||
<form class="input-group">
|
||||
<input type="text" class="form-control" data-role="oneline-input-{$comment_uid}"><!-- 주의 : comment_uid 가 들어가야 함 -->
|
||||
<div class="input-group-append">
|
||||
<button class="btn btn-light" type="submit"
|
||||
title="의견추가"
|
||||
data-kcact="regis"
|
||||
data-type="oneline"
|
||||
data-parent="{$comment_uid}"
|
||||
data-effect="animated fadeInUp"
|
||||
data-grant="{$grant_uid}">
|
||||
<i class="fa fa-paper-plane fa-lg" aria-hidden="true"></i>
|
||||
</button>
|
||||
</div>
|
||||
</form><!-- /.input-group -->
|
||||
</div>
|
||||
|
||||
<ul class="list-group my-2" data-role="oneline-container-{$comment_uid}">
|
||||
{$oneline_rows} <!-- 한줄의견 리스트 -->
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
|
||||
</div>
|
||||
</li>
|
||||
@@ -0,0 +1,48 @@
|
||||
<!-- 참조사항
|
||||
1. 등록폼에 등록자 아바타가 필요한 경우 : <img src="{$login_user_pic}">
|
||||
2. data-*="*" 필수
|
||||
-->
|
||||
<div class="card mb-4" data-role="comment-input-wrapper">
|
||||
|
||||
<textarea class="form-control border-0" name="content" rows="1" id="meta-description-content" data-role="comment-input"></textarea>
|
||||
|
||||
<div class="card-footer p-2">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<small>글자수 <strong class="text-danger" data-role="show-inputLength">0</strong> / <span data-role="show-textLimit"><!-- 옵션에서 정한 값--></span></small>
|
||||
<button type="button" class="btn btn-light" data-role="open-emoticon" hidden>
|
||||
<i class="fa fa-smile-o fa-lg" aria-hidden="true"></i>
|
||||
</button>
|
||||
<button type="button" class="btn btn btn-outline-primary cmt-post ml-1 align-self-end"
|
||||
data-kcact="regis"
|
||||
data-type="comment"
|
||||
data-effect="animated fadeInUp"
|
||||
data-parent="{$comment_parent}">등록</button>
|
||||
</div><!-- /.d-flex -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
// 입력창 자동 리사이즈
|
||||
autosize($('#commentting-container textarea'));
|
||||
|
||||
var textarea_container = $('[data-role="comment-input-wrapper"]')
|
||||
var textarea = $('#meta-description-content');
|
||||
|
||||
textarea.focus(function(){
|
||||
textarea_container.addClass('active')
|
||||
});
|
||||
textarea.blur(function(){
|
||||
setTimeout(function(){
|
||||
textarea_container.removeClass('active')
|
||||
}, 200);
|
||||
});
|
||||
|
||||
// 댓글이 등록된 후에
|
||||
$('#commentting-container').on('saved.rb.comment',function(){
|
||||
textarea.removeAttr("style");
|
||||
})
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
@@ -0,0 +1 @@
|
||||
<img src="{$emoticon_src}" style="width:50px"/>
|
||||
@@ -0,0 +1 @@
|
||||
|
||||
@@ -0,0 +1,21 @@
|
||||
<li class="list-group-item flex-column align-items-start p-0 border-left-0 rounded-0 list-group-item-light" data-role="oneline-item" data-uid="{$oneline_uid}" data-type="oneline" data-hidden="{$oneline_getHidden}">
|
||||
<div data-role="oneline-origin-content-{$oneline_uid}" class="d-none">{$oneline_content}</div>
|
||||
<blockquote class="py-2">
|
||||
<div class="d-flex w-100 justify-content-between align-items-center">
|
||||
<span>
|
||||
<span data-role="oneline-hidden" class="badge"><i class="fa fa-lock fa-lg" aria-hidden="true"></i></span>
|
||||
<cite>{$oneline_user_name}</cite>
|
||||
<time class="small text-muted ml-2" data-role="oneline-time-wrapper-{$oneline_uid}">
|
||||
{$oneline_regis_time}
|
||||
</time>
|
||||
<small class="ml-1 {$oneline_getNew}"></small><!-- 24시간이내 new 출력 -->
|
||||
</span>
|
||||
<span>
|
||||
{$btn_showHideMenu} <!-- 메뉴 출력/숨기 버튼 btn_showHideMenu.html : 권한이 있는 경우(로그인,작성자,관리자) 에만 노출됨 -->
|
||||
</span>
|
||||
</div>
|
||||
<article class="mb-0" data-role="oneline-content-editable-{$oneline_uid}">{$oneline_content}</article>
|
||||
{$btn_editMod}
|
||||
<!-- <a data-kcact="like" data-type="oneline" data-entry="{$oneline_uid}">좋아요(<span data-role="oneline-likeTotal-{$oneline_uid}">{$oneline_like_total}</span>)</a> -->
|
||||
</blockquote>
|
||||
</li>
|
||||
@@ -0,0 +1,22 @@
|
||||
<li class="list-group-item flex-column align-items-start p-0 border-left-0 rounded-0 list-group-item-light" data-role="oneline-item" data-uid="{$oneline_uid}" data-type="oneline" data-hidden="{$oneline_getHidden}">
|
||||
<div data-role="oneline-origin-content-{$oneline_uid}" class="d-none">{$oneline_content}</div>
|
||||
<blockquote class="py-2">
|
||||
<div class="d-flex w-100 justify-content-between align-items-center">
|
||||
<span>
|
||||
<cite>{$oneline_user_name}</cite>
|
||||
<time class="small text-muted ml-2" data-role="oneline-time-wrapper-{$oneline_uid}">
|
||||
{$oneline_regis_time}
|
||||
</time>
|
||||
<small class="ml-1 {$oneline_getNew}"></small><!-- 24시간이내 new 출력 -->
|
||||
</span>
|
||||
<span>
|
||||
{$btn_showHideMenu} <!-- 메뉴 출력/숨기 버튼 btn_showHideMenu.html : 권한이 있는 경우(로그인,작성자,관리자) 에만 노출됨 -->
|
||||
</span>
|
||||
</div>
|
||||
<article class="mb-0" data-role="oneline-content-editable-{$oneline_uid}">
|
||||
<div class="text-center text-muted border p-4 my-2"><i class="fa fa-lock fa-fw" aria-hidden="true"></i> 비밀글</div>
|
||||
</article>
|
||||
{$btn_editMod}
|
||||
<button class="btn btn-sm btn-link text-reset" data-kcact="like" data-type="oneline" data-entry="{$oneline_uid}">좋아요 <span class="badge badge-light" data-role="oneline-likeTotal-{$oneline_uid}">{$oneline_like_total}</span></button>
|
||||
</blockquote>
|
||||
</li>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
1
modules/comment/themes/_desktop/bs4-classic/name.txt
Normal file
1
modules/comment/themes/_desktop/bs4-classic/name.txt
Normal file
@@ -0,0 +1 @@
|
||||
부트스트랩4 기본형 댓글
|
||||
21
modules/comment/themes/_desktop/bs4-default/LICENSE
Normal file
21
modules/comment/themes/_desktop/bs4-default/LICENSE
Normal file
@@ -0,0 +1,21 @@
|
||||
The RBL License
|
||||
|
||||
Copyright (c) 2011-2018 Redblock, Inc.
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in
|
||||
all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
||||
THE SOFTWARE.
|
||||
17
modules/comment/themes/_desktop/bs4-default/README.md
Normal file
17
modules/comment/themes/_desktop/bs4-default/README.md
Normal file
@@ -0,0 +1,17 @@
|
||||
|
||||
# 부트스트랩 4 댓글 기본형 테마
|
||||
|
||||
안녕하세요. 감사합니다.
|
||||
|
||||
## 주요기능
|
||||
- Automated website building technology
|
||||
- Powerful content managing system
|
||||
- Multiple virtual site system
|
||||
- Unlimited extension
|
||||
- Multi Screen implementations
|
||||
|
||||
## 서버 요구사항
|
||||
- PHP version 5.2.x
|
||||
- MYSQL version 3.23.x or greater (recommend MYSQL >= 5.x)
|
||||
- GD Library
|
||||
- ICONV
|
||||
317
modules/comment/themes/_desktop/bs4-default/css/style.css
Normal file
317
modules/comment/themes/_desktop/bs4-default/css/style.css
Normal file
@@ -0,0 +1,317 @@
|
||||
@charset "utf-8";
|
||||
.hidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
[data-role="comment-container"] [data-role="comment-item"]:focus,
|
||||
[data-role="comment-container"] [data-role="oneline-item"]:focus {
|
||||
background-color: #F5FFFE !important;
|
||||
}
|
||||
|
||||
[data-role="comment-item"],
|
||||
[data-role="comment-item"] .markdown-body {
|
||||
font-size: 13px;
|
||||
word-break: break-all;
|
||||
}
|
||||
[data-role="comment-item"].highlight,
|
||||
[data-role="oneline-item"].highlight {
|
||||
padding: 15px;
|
||||
background-color: #F9F9F3
|
||||
}
|
||||
[data-role="comment-item"] [data-role="anchor-link"] {
|
||||
visibility: hidden;
|
||||
}
|
||||
[data-role="comment-item"]:hover [data-role="anchor-link"] {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
[data-role="oneline-item"],
|
||||
[data-role="oneline-item"].markdown-body {
|
||||
font-size: 12px
|
||||
}
|
||||
[data-role="oneline-item"] [data-role="anchor-link"] {
|
||||
visibility: hidden;
|
||||
}
|
||||
[data-role="oneline-item"]:hover [data-role="anchor-link"] {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
[data-role="oneline-item"] blockquote {
|
||||
margin-bottom: 0;
|
||||
padding: 0 1em;
|
||||
color: #6a737d;
|
||||
border-left: 0.25em solid #dfe2e5;
|
||||
}
|
||||
|
||||
[data-role="comment-item"] figure.image img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
[data-role="comment-item"] [data-role="comment-hidden"],
|
||||
[data-role="oneline-item"] [data-role="oneline-hidden"] {
|
||||
display: none
|
||||
}
|
||||
[data-role="comment-item"][data-hidden="true"] [data-role="comment-hidden"] {
|
||||
display: inline-block;
|
||||
}
|
||||
[data-role="oneline-item"][data-hidden="true"] [data-role="oneline-hidden"] {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.js-like.active {
|
||||
color: #007bff !important
|
||||
}
|
||||
|
||||
.js-like.active::after {
|
||||
content: ' 취소'
|
||||
}
|
||||
|
||||
.js-new.active::before {
|
||||
padding-left: 3px;
|
||||
content: 'new';
|
||||
color: red;
|
||||
font-size: 80%
|
||||
}
|
||||
|
||||
.rb-comments-write .card textarea {
|
||||
height: 34px;
|
||||
background-color: #fafbfc;
|
||||
-webkit-transition: height 1s;
|
||||
/* For Safari 3.1 to 6.0 */
|
||||
transition: height 1s;
|
||||
transition-delay: 1s;
|
||||
-webkit-transition-delay: 1s;
|
||||
}
|
||||
|
||||
.rb-comments-write .card.active textarea {
|
||||
min-height: 70px !important;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
[data-role="commentWrite-container"] .card-header,
|
||||
[data-role="commentWrite-container"] .card-footer,
|
||||
.rb-oneline-write .card .card-header,
|
||||
.rb-oneline-write .card .card-footer {
|
||||
display: none
|
||||
}
|
||||
|
||||
[data-role="commentWrite-container"].active .card-header,
|
||||
[data-role="commentWrite-container"].active .card-footer,
|
||||
.rb-oneline-write .card.active .card-header,
|
||||
.rb-oneline-write .card.active .card-footer {
|
||||
display: block
|
||||
}
|
||||
|
||||
.rb-comments-write .active .ck-editor__editable_inline {
|
||||
min-height: 120px;
|
||||
}
|
||||
|
||||
.media[data-role="comment-item"].border-bottom {
|
||||
border-bottom: 1px dotted #dee2e6 !important;
|
||||
}
|
||||
|
||||
.list-group-item[data-role="oneline-item"] {
|
||||
border-style: dotted;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
[data-role="comment-main"] .anchorjs-link {
|
||||
font-size: 25px !important
|
||||
}
|
||||
[data-role="comment-main"] .anchorjs-link:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.list-group-item[data-role="oneline-item"] .anchorjs-link{
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 20px;
|
||||
margin-top: -7px;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
background-color: #fafbfc;
|
||||
}
|
||||
|
||||
.list-group:empty {
|
||||
margin-top: 0 !important;
|
||||
margin-bottom: 0 !important
|
||||
}
|
||||
|
||||
.flex-column-reverse .list-group-item:last-child {
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
|
||||
/* notify */
|
||||
|
||||
#commentting-container,
|
||||
[data-role=comment-container],
|
||||
[data-role=moreBtn-container] {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#comment-notify {
|
||||
visibility: hidden;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
bottom: 30px;
|
||||
top: auto
|
||||
}
|
||||
|
||||
#comment-notify .comment-notify-msg {
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
background-color: #333;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
border-radius: 5px;
|
||||
padding: 12px 6px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#comment-notify.active {
|
||||
visibility: visible;
|
||||
-webkit-animation: fadein 0.5s, fadeout 0.5s 1.1s;
|
||||
animation: fadein 0.5s, fadeout 0.5s 1.1s;
|
||||
}
|
||||
|
||||
@-webkit-keyframes fadein {
|
||||
from {
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
bottom: 30px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadein {
|
||||
from {
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
bottom: 30px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes fadeout {
|
||||
from {
|
||||
bottom: 30px;
|
||||
opacity: 1;
|
||||
}
|
||||
to {
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadeout {
|
||||
from {
|
||||
bottom: 30px;
|
||||
opacity: 1;
|
||||
}
|
||||
to {
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* notify */
|
||||
|
||||
/* attach trigger */
|
||||
|
||||
#commentting-container .comment-attach {
|
||||
position: relative;
|
||||
display: block;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
padding: 8px 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#commentting-container span.comment-attach input[type='file'] {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: 0;
|
||||
right: -9px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
opacity: 0;
|
||||
font-size: 0;
|
||||
width: 180%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* emoticon */
|
||||
|
||||
#commentting-container .emoticon-wrapper {
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
padding: 15px 5px;
|
||||
}
|
||||
|
||||
#commentting-container .emoticon-wrapper ul {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#commentting-container .emoticon-wrapper li {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
text-align: center;
|
||||
width: 12.5%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#commentting-container .emoticon-wrapper li img {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
[data-role|=oneline-input-wrapper],
|
||||
[data-role|=comment-modify-btn-wrapper],
|
||||
[data-role|=oneline-modify-btn-wrapper] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* loader */
|
||||
|
||||
#comment-spinner-wrap {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.comment-top5p {
|
||||
top: 5%;
|
||||
}
|
||||
|
||||
.comment-bottom5p {
|
||||
bottom: 5%;
|
||||
}
|
||||
|
||||
.ck-editor__editable.ck-blurred {
|
||||
border : 1px solid #ccc
|
||||
}
|
||||
|
||||
.ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused {
|
||||
outline: none;
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
figure.ck.ck-placeholder:before,
|
||||
.ck figure.ck-placeholder:before {
|
||||
content: none;
|
||||
}
|
||||
|
||||
.ck.ck-toolbar {
|
||||
border: 0;
|
||||
background-color: transparent
|
||||
}
|
||||
@@ -0,0 +1,4 @@
|
||||
<div data-role="{$entry_type}-modify-btn-wrapper-{$uid}" class="my-2">
|
||||
<button class="btn btn-light btn-sm" data-toggle="cancel-edit" data-type="{$entry_type}" data-uid="{$uid}">수정취소</button>
|
||||
<button class="btn btn-primary btn-sm" data-kcact="edit" data-type="{$entry_type}" data-uid="{$uid}" data-parent="{$parent}">수정완료</button>
|
||||
</div>
|
||||
@@ -0,0 +1,12 @@
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-link btn-sm dropdown-toggle" type="button" data-toggle="dropdown" data-role="showHide-menu" data-type="{$entry_type}">
|
||||
</button>
|
||||
<div class="dropdown-menu dropdown-menu-right" data-role="menu-container-{$entry_type}">
|
||||
<button class="dropdown-item" data-toggle="edit" data-type="{$entry_type}" data-uid="{$uid}">
|
||||
<i class="fa fa-edit"></i> 수정
|
||||
</button>
|
||||
<button class="dropdown-item" data-kcact="delete" data-type="{$entry_type}" data-uid="{$uid}" data-parent="{$entry_parent}">
|
||||
<i class="fa fa-trash-o"></i> 삭제
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,57 @@
|
||||
<!-- 공통 사항 data-* ="*" 과 {$*} 는 수정 금지 -->
|
||||
<header class="d-flex justify-content-start" data-role="header-container">
|
||||
{$comment_header} <!-- 댓글 header : comment_header.html -->
|
||||
</header>
|
||||
<div class="rb-comments-write rb-article mb-4" data-role="commentWrite-container"> <!-- 댓글 입렵부 : comment_write.html -->
|
||||
{$comment_write}
|
||||
</div>
|
||||
<main data-role="comment-main">
|
||||
|
||||
<div data-role="comment-filter">
|
||||
<nav class="d-flex">
|
||||
<div class="btn-group btn-group-sm btn-group-toggle" data-toggle="buttons" role="group">
|
||||
<label class="btn btn-light active" data-kcact="changeSort" data-sort="uid" data-orderby="asc">
|
||||
<input type="radio" name="changeSort" id="sort_uid_asc" autocomplete="off" checked> 최신순
|
||||
</label>
|
||||
<label class="btn btn-light" data-kcact="changeSort" data-sort="uid" data-orderby="desc">
|
||||
<input type="radio" name="changeSort" id="sort_uid_desc" autocomplete="off"> 과거순
|
||||
</label>
|
||||
<label class="btn btn-light" data-kcact="changeSort" data-sort="likes" data-orderby="desc">
|
||||
<input type="radio" name="changeSort" id="sort_likes_desc" autocomplete="off"> 추천순
|
||||
</label>
|
||||
</div>
|
||||
<button type="button" class="btn btn-light btn-sm d-print-none ml-auto" role="button" data-kcact="reload" data-toggle="tooltip" title="새로고침">
|
||||
<i class="fa fa-refresh" aria-hidden="true"></i>
|
||||
</button>
|
||||
</nav>
|
||||
<hr>
|
||||
</div>
|
||||
|
||||
<ul class="list-unstyled" data-role="comment-container"> <!-- 댓글 출력부 : comment_row.html -->
|
||||
{$comment_rows}
|
||||
</ul>
|
||||
<div data-role="btnMore-container"> <!-- 더보기 버튼 -->
|
||||
<a class="btn btn-block btn-light" data-role="trigger-getMoreComment">더보기</a>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<div class="d-none animated fadeIn" data-role="comment-none">
|
||||
<div class="d-flex justify-content-center align-items-center" style="height: 30vh;">
|
||||
<div class="text-muted text-center">
|
||||
<div class="display-2 mb-3">
|
||||
<i class="fa fa-comment-o" aria-hidden="true"></i>
|
||||
</div>
|
||||
<button type="button" class="btn btn-link text-muted js-comment-focus">첫번째 댓글을 남겨주세요.</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
|
||||
jQuery(function($) {
|
||||
$('[data-toggle="tooltip"]').tooltip()
|
||||
});
|
||||
|
||||
</script>
|
||||
@@ -0,0 +1,4 @@
|
||||
<h4 class="h6 mb-3">
|
||||
댓글
|
||||
<span data-role="total_comment">{$comment_total}</span>
|
||||
</h4>
|
||||
@@ -0,0 +1,83 @@
|
||||
<li class="media border-bottom mb-3 p-2" id="CMT-{$comment_uid}" data-role="comment-item" data-uid="{$comment_uid}" data-page="{$comment_page}" data-totalPage="{$total_page}" data-type="comment" data-hidden="{$comment_getHidden}" data-notice="{$comment_getNoitce}">
|
||||
<img class="mr-3 border rounded-circle" src="{$comment_user_pic}" alt="아바타" width="50">
|
||||
<div class="media-body">
|
||||
<div class="d-flex w-100 justify-content-between align-items-center">
|
||||
<span>
|
||||
<span data-role="comment-hidden" class="badge"><i class="fa fa-lock fa-lg" aria-hidden="true"></i></span>
|
||||
<strong class="mr-2">{$comment_user_name}</strong>
|
||||
<i class="fa fa-clock-o" aria-hidden="true"></i>
|
||||
<time data-role="comment-time-wrapper-{$comment_uid}">{$comment_regis_time}</time>
|
||||
<small class="ml-1 {$comment_getNew}"></small><!-- 24시간이내 new 출력 -->
|
||||
</span>
|
||||
<span>
|
||||
{$btn_showHideMenu} <!-- 메뉴 출력/숨기 버튼 btn_showHideMenu.html : 권한이 있는 경우(로그인,작성자,관리자) 에만 노출됨 -->
|
||||
<a class="text-reset" data-role="anchor-link" href="#CMT-{$comment_uid}">
|
||||
<i class="fa fa-hashtag" aria-hidden="true"></i>
|
||||
</a>
|
||||
</span>
|
||||
</div><!-- /.d-flex -->
|
||||
<div class="rb-article">
|
||||
<article data-role="comment-origin-content-{$comment_uid}">{$comment_content}</article>
|
||||
<div data-role="{$entry_type}-modify-btn-wrapper-{$uid}" class="toolbar-container" data-item="comment"></div>
|
||||
<article style="display:none" data-role="comment-content-editable-{$comment_uid}">{$comment_content}</article>
|
||||
</div>
|
||||
{$btn_editMod} <!-- 수정 모드시 취소/완료 버튼 btn_ediMod.html -->
|
||||
|
||||
<div class="mb-2">
|
||||
<button class="btn btn-link btn-sm add-comment px-0 muted-link" data-role="toggle-oneline-input" data-parent="{$comment_uid}">
|
||||
<i class="fa fa-comment-o fa-lg fa-fw" aria-hidden="true"></i>
|
||||
의견달기
|
||||
</button>
|
||||
<button class="btn btn-link btn-sm muted-link js-like pr-0 {$comment_getIsLiked}"
|
||||
data-kcact="like"
|
||||
data-type="comment"
|
||||
data-entry="{$comment_uid}"
|
||||
data-effect="animated bounceIn delay-1"
|
||||
data-role="comment-isLiked-{$comment_uid}">
|
||||
<i class="fa fa-thumbs-o-up fa-lg fa-fw" aria-hidden="true"></i>
|
||||
좋아요
|
||||
</button>
|
||||
<a href="#modal_reaction" class="badge badge-light"
|
||||
data-toggle="modal"
|
||||
data-type="comment"
|
||||
data-count="{$comment_like_total}"
|
||||
data-entry="{$comment_uid}"
|
||||
data-role="comment-likeTotal-{$comment_uid}" title="좋아요한 사람">
|
||||
{$comment_like_total}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<section class="pl-5">
|
||||
<div class="rb-oneline-write"> <!-- 한줄의견 등록폼 -->
|
||||
|
||||
<div class="card my-3 shadow-sm" data-role="oneline-input-wrapper-{$comment_uid}">
|
||||
<section class="w-100">
|
||||
<div data-role="editor">
|
||||
<div data-role="oneline-input-{$comment_uid}" class="border-0"></div>
|
||||
</div>
|
||||
</section>
|
||||
<div class="card-footer p-0 d-flex justify-content-between align-items-center">
|
||||
<div class="toolbar-container align-self-end"></div>
|
||||
<button class="btn btn-link" type="submit"
|
||||
title="의견추가"
|
||||
data-kcact="regis"
|
||||
data-type="oneline"
|
||||
data-parent="{$comment_uid}"
|
||||
data-effect="animated fadeInUp"
|
||||
data-grant="{$grant_uid}">
|
||||
등록
|
||||
</button>
|
||||
</div><!-- /.d-flex -->
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<ul class="list-group my-2" data-role="oneline-container-{$comment_uid}">
|
||||
{$oneline_rows} <!-- 한줄의견 리스트 -->
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
|
||||
</div>
|
||||
</li>
|
||||
@@ -0,0 +1,84 @@
|
||||
<li class="media border-bottom mb-3" id="CMT-{$comment_uid}" data-role="comment-item" data-uid="{$comment_uid}" data-page="{$comment_page}" data-totalPage="{$total_page}" data-type="comment" data-hidden="{$comment_getHidden}" data-notice="{$comment_getNoitce}">
|
||||
<img class="mr-3 border rounded-circle" src="{$comment_user_pic}" alt="아바타" width="50">
|
||||
<div class="media-body">
|
||||
<div class="d-flex w-100 justify-content-between align-items-center">
|
||||
<span>
|
||||
<strong class="mr-2">{$comment_user_name}</strong>
|
||||
<i class="fa fa-clock-o" aria-hidden="true"></i>
|
||||
<time data-role="comment-time-wrapper-{$comment_uid}">{$comment_regis_time}</time>
|
||||
<small class="ml-1 {$comment_getNew}"></small><!-- 24시간이내 new 출력 -->
|
||||
</span>
|
||||
<span>
|
||||
{$btn_showHideMenu} <!-- 메뉴 출력/숨기 버튼 btn_showHideMenu.html : 권한이 있는 경우(로그인,작성자,관리자) 에만 노출됨 -->
|
||||
<a class="text-reset" data-role="anchor-link" href="#CMT-{$comment_uid}">
|
||||
<i class="fa fa-hashtag" aria-hidden="true"></i>
|
||||
</a>
|
||||
</span>
|
||||
</div><!-- /.d-flex -->
|
||||
<div class="rb-article">
|
||||
|
||||
<article data-role="comment-content-editable-{$comment_uid}">
|
||||
<div class="text-center text-muted bg-light p-4 my-2"><i class="fa fa-lock fa-fw" aria-hidden="true"></i> 비밀글</div>
|
||||
</article>
|
||||
|
||||
</div>
|
||||
{$btn_editMod} <!-- 수정 모드시 취소/완료 버튼 btn_ediMod.html -->
|
||||
|
||||
<div class="mb-2">
|
||||
<button class="btn btn-link btn-sm add-comment px-0 muted-link" data-role="toggle-oneline-input" data-parent="{$comment_uid}">
|
||||
<i class="fa fa-comment-o fa-lg fa-fw" aria-hidden="true"></i>
|
||||
의견달기
|
||||
</button>
|
||||
<button class="btn btn-link btn-sm muted-link js-like pr-0 {$comment_getIsLiked}"
|
||||
data-kcact="like"
|
||||
data-type="comment"
|
||||
data-entry="{$comment_uid}"
|
||||
data-effect="animated bounceIn delay-1"
|
||||
data-role="comment-isLiked-{$comment_uid}">
|
||||
<i class="fa fa-thumbs-o-up fa-lg fa-fw" aria-hidden="true"></i>
|
||||
좋아요
|
||||
</button>
|
||||
<a href="#modal_reaction" class="badge badge-light"
|
||||
data-toggle="modal"
|
||||
data-type="comment"
|
||||
data-count="{$comment_like_total}"
|
||||
data-entry="{$comment_uid}"
|
||||
data-role="comment-likeTotal-{$comment_uid}" title="좋아요한 사람">
|
||||
{$comment_like_total}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<section class="pl-5">
|
||||
<div class="rb-oneline-write"> <!-- 한줄의견 등록폼 -->
|
||||
|
||||
<div class="card my-3 shadow-sm" data-role="oneline-input-wrapper-{$comment_uid}">
|
||||
<section class="w-100">
|
||||
<div data-role="editor">
|
||||
<div data-role="oneline-input-{$comment_uid}" class="border-0"></div>
|
||||
</div>
|
||||
</section>
|
||||
<div class="card-footer p-0 d-flex justify-content-between align-items-center">
|
||||
<div class="toolbar-container align-self-end"></div>
|
||||
<button class="btn btn-link" type="submit"
|
||||
title="의견추가"
|
||||
data-kcact="regis"
|
||||
data-type="oneline"
|
||||
data-parent="{$comment_uid}"
|
||||
data-effect="animated fadeInUp"
|
||||
data-grant="{$grant_uid}">
|
||||
등록
|
||||
</button>
|
||||
</div><!-- /.d-flex -->
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<ul class="list-group my-2" data-role="oneline-container-{$comment_uid}">
|
||||
{$oneline_rows} <!-- 한줄의견 리스트 -->
|
||||
</ul>
|
||||
</section>
|
||||
|
||||
|
||||
</div>
|
||||
</li>
|
||||
@@ -0,0 +1,30 @@
|
||||
<!-- 참조사항
|
||||
1. 등록폼에 등록자 아바타가 필요한 경우 : <img src="{$login_user_pic}">
|
||||
2. data-*="*" 필수
|
||||
-->
|
||||
<div class="card shadow-sm mb-4" data-role="comment-input-wrapper">
|
||||
|
||||
<div class="card-header py-0 pr-0">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<span class="text-muted">{$login_user_nic}</span>
|
||||
<div class="toolbar-container"></div>
|
||||
</div><!-- /.d-flex -->
|
||||
</div>
|
||||
|
||||
<section>
|
||||
<div data-role="editor">
|
||||
<div data-role="comment-input" class="border-0"></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="card-footer bg-white p-2">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<div class=""></div>
|
||||
<button type="button" class="btn btn btn-link cmt-post ml-1 align-self-end"
|
||||
data-kcact="regis"
|
||||
data-type="comment"
|
||||
data-effect="animated fadeInUp"
|
||||
data-parent="{$comment_parent}">등록</button>
|
||||
</div><!-- /.d-flex -->
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1 @@
|
||||
<img src="{$emoticon_src}" style="width:50px"/>
|
||||
@@ -0,0 +1 @@
|
||||
|
||||
@@ -0,0 +1,26 @@
|
||||
<li class="list-group-item flex-column align-items-start p-0 border-left-0 rounded-0 list-group-item-light" data-role="oneline-item" id="OLN-{$oneline_uid}" data-uid="{$oneline_uid}" data-type="oneline" data-hidden="{$oneline_getHidden}">
|
||||
<span></span>
|
||||
<blockquote class="py-2">
|
||||
<div class="d-flex w-100 justify-content-between align-items-center">
|
||||
<span>
|
||||
<span data-role="oneline-hidden" class="badge"><i class="fa fa-lock fa-lg" aria-hidden="true"></i></span>
|
||||
<cite>{$oneline_user_name}</cite>
|
||||
<time class="small text-muted ml-2" data-role="oneline-time-wrapper-{$oneline_uid}">
|
||||
{$oneline_regis_time}
|
||||
</time>
|
||||
<small class="ml-1 {$oneline_getNew}"></small><!-- 24시간이내 new 출력 -->
|
||||
</span>
|
||||
<span>
|
||||
{$btn_showHideMenu} <!-- 메뉴 출력/숨기 버튼 btn_showHideMenu.html : 권한이 있는 경우(로그인,작성자,관리자) 에만 노출됨 -->
|
||||
<a class="text-reset" data-role="anchor-link" href="#OLN-{$oneline_uid}">
|
||||
<i class="fa fa-hashtag" aria-hidden="true"></i>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
<article class="mb-0" data-role="oneline-origin-content-{$oneline_uid}">{$oneline_content}</article>
|
||||
<div data-role="{$entry_type}-modify-btn-wrapper-{$uid}" class="toolbar-container" data-item="oneline"></div>
|
||||
<article class="mb-0 bg-white" data-role="oneline-content-editable-{$oneline_uid}" style="display:none" >{$oneline_content}</article>
|
||||
{$btn_editMod}
|
||||
<button class="btn btn-sm btn-link text-reset" data-kcact="like" data-type="oneline" data-entry="{$oneline_uid}">좋아요 <span class="badge badge-light" data-role="oneline-likeTotal-{$oneline_uid}">{$oneline_like_total}</span></button>
|
||||
</blockquote>
|
||||
</li>
|
||||
@@ -0,0 +1,29 @@
|
||||
<li class="list-group-item flex-column align-items-start p-0 border-left-0 rounded-0 list-group-item-light" data-role="oneline-item" id="OLN-{$oneline_uid}" data-uid="{$oneline_uid}" data-type="oneline" data-hidden="{$oneline_getHidden}">
|
||||
<span></span>
|
||||
<blockquote class="py-2">
|
||||
<div class="d-flex w-100 justify-content-between align-items-center">
|
||||
<span>
|
||||
<cite>{$oneline_user_name}</cite>
|
||||
<time class="small text-muted ml-2" data-role="oneline-time-wrapper-{$oneline_uid}">
|
||||
{$oneline_regis_time}
|
||||
</time>
|
||||
<small class="ml-1 {$oneline_getNew}"></small><!-- 24시간이내 new 출력 -->
|
||||
</span>
|
||||
<span>
|
||||
{$btn_showHideMenu} <!-- 메뉴 출력/숨기 버튼 btn_showHideMenu.html : 권한이 있는 경우(로그인,작성자,관리자) 에만 노출됨 -->
|
||||
<a class="text-reset" data-role="anchor-link" href="#OLN-{$oneline_uid}">
|
||||
<i class="fa fa-hashtag" aria-hidden="true"></i>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<article class="mb-0" data-role="oneline-origin-content-{$oneline_uid}">
|
||||
<div class="text-center text-muted border p-4 my-2"><i class="fa fa-lock fa-fw" aria-hidden="true"></i> 비밀글</div>
|
||||
</article>
|
||||
|
||||
<div data-role="{$entry_type}-modify-btn-wrapper-{$uid}" class="toolbar-container" data-item="oneline"></div>
|
||||
<article class="mb-0 bg-white" data-role="oneline-content-editable-{$oneline_uid}" style="display:none" >{$oneline_content}</article>
|
||||
{$btn_editMod}
|
||||
<button class="btn btn-sm btn-link text-reset" data-kcact="like" data-type="oneline" data-entry="{$oneline_uid}">좋아요 <span class="badge badge-light" data-role="oneline-likeTotal-{$oneline_uid}">{$oneline_like_total}</span></button>
|
||||
</blockquote>
|
||||
</li>
|
||||
@@ -0,0 +1 @@
|
||||
라벨
|
||||
@@ -0,0 +1 @@
|
||||
메뉴
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
1
modules/comment/themes/_desktop/bs4-default/name.txt
Normal file
1
modules/comment/themes/_desktop/bs4-default/name.txt
Normal file
@@ -0,0 +1 @@
|
||||
부트스트랩4 ckeditor5 inline 댓글
|
||||
21
modules/comment/themes/_desktop/bs4-modal/LICENSE
Normal file
21
modules/comment/themes/_desktop/bs4-modal/LICENSE
Normal file
@@ -0,0 +1,21 @@
|
||||
The RBL License
|
||||
|
||||
Copyright (c) 2011-2018 Redblock, Inc.
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in
|
||||
all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
||||
THE SOFTWARE.
|
||||
17
modules/comment/themes/_desktop/bs4-modal/README.md
Normal file
17
modules/comment/themes/_desktop/bs4-modal/README.md
Normal file
@@ -0,0 +1,17 @@
|
||||
|
||||
# 부트스트랩 4 댓글 기본형 테마
|
||||
|
||||
안녕하세요. 감사합니다.
|
||||
|
||||
## 주요기능
|
||||
- Automated website building technology
|
||||
- Powerful content managing system
|
||||
- Multiple virtual site system
|
||||
- Unlimited extension
|
||||
- Multi Screen implementations
|
||||
|
||||
## 서버 요구사항
|
||||
- PHP version 5.2.x
|
||||
- MYSQL version 3.23.x or greater (recommend MYSQL >= 5.x)
|
||||
- GD Library
|
||||
- ICONV
|
||||
0
modules/comment/themes/_desktop/bs4-modal/_var.php
Normal file
0
modules/comment/themes/_desktop/bs4-modal/_var.php
Normal file
368
modules/comment/themes/_desktop/bs4-modal/css/style.css
Normal file
368
modules/comment/themes/_desktop/bs4-modal/css/style.css
Normal file
@@ -0,0 +1,368 @@
|
||||
@charset "utf-8";
|
||||
.hidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
[data-role="comment-container"] [data-role="comment-item"]:focus,
|
||||
[data-role="comment-container"] [data-role="oneline-item"]:focus {
|
||||
background-color: #F5FFFE !important;
|
||||
}
|
||||
|
||||
[data-role="comment-item"],
|
||||
[data-role="comment-item"] .markdown-body {
|
||||
font-size: 13px;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
[data-role="oneline-item"],
|
||||
[data-role="oneline-item"].markdown-body {
|
||||
font-size: 12px
|
||||
}
|
||||
|
||||
[data-role="comment-item"] .ck-editor__editable,
|
||||
[data-role="oneline-item"] .ck-editor__editable {
|
||||
border: 0.0625rem solid #dee2e6
|
||||
}
|
||||
|
||||
[data-role="comment-item"] .ck-editor__editable.ck-focused,
|
||||
[data-role="oneline-item"] .ck-editor__editable.ck-focused {
|
||||
border: 0.0625rem solid #007bff !important;
|
||||
box-shadow: none !important
|
||||
}
|
||||
|
||||
[data-role="oneline-item"] blockquote {
|
||||
margin-bottom: 0;
|
||||
padding: 0 1em;
|
||||
color: #6a737d;
|
||||
border-left: 0.25em solid #dfe2e5;
|
||||
}
|
||||
|
||||
[data-role="comment-item"] figure.media oembed .media .align-self-center img {
|
||||
width: 155px
|
||||
}
|
||||
[data-role="comment-item"] [data-role="comment-hidden"],
|
||||
[data-role="oneline-item"] [data-role="oneline-hidden"] {
|
||||
display: none
|
||||
}
|
||||
[data-role="comment-item"][data-hidden="true"] [data-role="comment-hidden"] {
|
||||
display: inline-block;
|
||||
}
|
||||
[data-role="oneline-item"][data-hidden="true"] [data-role="oneline-hidden"] {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.js-like.active {
|
||||
color: #007bff !important
|
||||
}
|
||||
|
||||
.js-like.active::after {
|
||||
content: ' 취소'
|
||||
}
|
||||
|
||||
.btn-link.muted-link:active,
|
||||
.btn-link.muted-link:focus,
|
||||
.btn-link.muted-link.focus {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.btn-link.muted-link.active {
|
||||
color: #007bff !important
|
||||
}
|
||||
|
||||
.js-new.active::before {
|
||||
padding-left: 3px;
|
||||
content: 'new';
|
||||
color: red;
|
||||
font-size: 80%
|
||||
}
|
||||
|
||||
[data-role="comment-main"] .timeline-vscroll {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
max-height: calc(100vh - 14.3rem);
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.rb-comments-write {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: auto;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.rb-comments-write .card .card-footer {
|
||||
display: none
|
||||
}
|
||||
|
||||
.rb-comments-write .card.active .card-footer {
|
||||
/* display: block */
|
||||
}
|
||||
.media[data-role="comment-item"] {
|
||||
min-width: 100% !important;
|
||||
}
|
||||
.media[data-role="comment-item"].border-bottom {
|
||||
border-bottom: 1px dotted #dee2e6 !important;
|
||||
}
|
||||
.media[data-role="comment-item"].border-bottom:last-child {
|
||||
border-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.list-group-item[data-role="oneline-item"] {
|
||||
border-style: dotted;
|
||||
}
|
||||
|
||||
.rb-comments-write {
|
||||
background-color: #fff
|
||||
}
|
||||
|
||||
.rb-comments-write .form-control {
|
||||
max-height: 250px;
|
||||
background-color: transparent;
|
||||
resize: none;
|
||||
-webkit-transition: height 1s;
|
||||
transition: height 1s;
|
||||
transition-delay: 1s;
|
||||
-webkit-transition-delay: 1s;
|
||||
}
|
||||
|
||||
.rb-comments-write .input-group-text {
|
||||
border: 0
|
||||
}
|
||||
|
||||
.rb-comments-write .form-control:focus {
|
||||
color: #495057;
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
outline: 0;
|
||||
box-shadow: none
|
||||
}
|
||||
|
||||
[data-role="comment-input-wrapper"] .js-submit .fa {
|
||||
display: inline-block;
|
||||
margin-top: -3px;
|
||||
font-size: 20px;
|
||||
color: #0084FF;
|
||||
}
|
||||
|
||||
.form-control {
|
||||
background-color: #fafbfc;
|
||||
}
|
||||
|
||||
.list-group:empty {
|
||||
margin-top: 0 !important;
|
||||
margin-bottom: 0 !important
|
||||
}
|
||||
|
||||
.flex-column-reverse .list-group-item:last-child {
|
||||
margin-bottom: -1px;
|
||||
}
|
||||
|
||||
/* notify */
|
||||
|
||||
#commentting-container,
|
||||
[data-role=comment-container],
|
||||
[data-role=moreBtn-container] {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#comment-notify {
|
||||
visibility: hidden;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
bottom: 30px;
|
||||
top: auto
|
||||
}
|
||||
|
||||
#comment-notify .comment-notify-msg {
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
background-color: #333;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
border-radius: 5px;
|
||||
padding: 12px 6px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#comment-notify.active {
|
||||
visibility: visible;
|
||||
-webkit-animation: fadein 0.5s, fadeout 0.5s 1.1s;
|
||||
animation: fadein 0.5s, fadeout 0.5s 1.1s;
|
||||
}
|
||||
|
||||
@-webkit-keyframes fadein {
|
||||
from {
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
bottom: 30px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadein {
|
||||
from {
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
bottom: 30px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes fadeout {
|
||||
from {
|
||||
bottom: 30px;
|
||||
opacity: 1;
|
||||
}
|
||||
to {
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadeout {
|
||||
from {
|
||||
bottom: 30px;
|
||||
opacity: 1;
|
||||
}
|
||||
to {
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* notify */
|
||||
|
||||
/* attach trigger */
|
||||
|
||||
#commentting-container .comment-attach {
|
||||
position: relative;
|
||||
display: block;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
padding: 8px 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#commentting-container span.comment-attach input[type='file'] {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: 0;
|
||||
right: -9px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
opacity: 0;
|
||||
font-size: 0;
|
||||
width: 180%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* emoticon */
|
||||
|
||||
#commentting-container .emoticon-wrapper {
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
padding: 15px 5px;
|
||||
}
|
||||
|
||||
#commentting-container .emoticon-wrapper ul {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#commentting-container .emoticon-wrapper li {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
text-align: center;
|
||||
width: 12.5%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#commentting-container .emoticon-wrapper li img {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
[data-role|=oneline-input-wrapper],
|
||||
[data-role|=comment-modify-btn-wrapper],
|
||||
[data-role|=oneline-modify-btn-wrapper] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* loader */
|
||||
|
||||
#comment-spinner-wrap {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
.comment-top5p {
|
||||
top: 5%;
|
||||
}
|
||||
|
||||
.comment-bottom5p {
|
||||
bottom: 5%;
|
||||
}
|
||||
|
||||
[data-role="comment-input"] {
|
||||
overflow: auto;
|
||||
-ms-overflow-style: -ms-autohiding-scrollbar;
|
||||
}
|
||||
|
||||
.pswp .ck.ck-editor__editable_inline>:first-child,
|
||||
.modal .ck.ck-editor__editable_inline>:first-child {
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.pswp .ck.ck-editor__editable_inline>:last-child,
|
||||
.modal .ck.ck-editor__editable_inline>:last-child {
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
.ck-editor__editable.ck-blurred {
|
||||
border : 1px solid #ccc
|
||||
}
|
||||
|
||||
.ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused {
|
||||
outline: none;
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
.ck.ck-block-toolbar-button,
|
||||
.ck.ck-balloon-panel {
|
||||
z-index: 1060
|
||||
}
|
||||
|
||||
.ck.ck-block-toolbar-button {
|
||||
margin-left: 10px;
|
||||
background-color: #e6e6e6
|
||||
}
|
||||
.ck.ck-balloon-panel {
|
||||
z-index: 999999;
|
||||
}
|
||||
|
||||
figure.ck.ck-placeholder:before,
|
||||
.ck figure.ck-placeholder:before {
|
||||
content: none;
|
||||
}
|
||||
|
||||
[data-role="comment-input-wrapper"] [data-role="comment-input"] {
|
||||
max-width: 460px
|
||||
}
|
||||
|
||||
.ck.ck-toolbar {
|
||||
background: #fff;
|
||||
padding: 0;
|
||||
border: none;
|
||||
}
|
||||
@@ -0,0 +1,9 @@
|
||||
<div data-role="{$entry_type}-modify-btn-wrapper-{$uid}">
|
||||
<div class="d-flex justify-content-between my-2">
|
||||
<div>
|
||||
<button class="btn btn-light btn-sm" data-toggle="cancel-edit" data-type="{$entry_type}" data-uid="{$uid}">수정취소</button>
|
||||
<button class="btn btn-primary btn-sm" data-kcact="edit" data-type="{$entry_type}" data-uid="{$uid}" data-parent="{$parent}">수정완료</button>
|
||||
</div>
|
||||
<div class="toolbar-container"></div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,12 @@
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-link btn-sm dropdown-toggle" type="button" data-toggle="dropdown" data-role="showHide-menu" data-type="{$entry_type}">
|
||||
</button>
|
||||
<div class="dropdown-menu dropdown-menu-right" data-role="menu-container-{$entry_type}">
|
||||
<button class="dropdown-item" data-toggle="edit" data-type="{$entry_type}" data-uid="{$uid}">
|
||||
<i class="fa fa-edit"></i> 수정
|
||||
</button>
|
||||
<button class="dropdown-item" data-kcact="delete" data-type="{$entry_type}" data-uid="{$uid}" data-parent="{$entry_parent}">
|
||||
<i class="fa fa-trash-o"></i> 삭제
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,57 @@
|
||||
<!-- 공통 사항 data-* ="*" 과 {$*} 는 수정 금지 -->
|
||||
<header class="d-flex justify-content-start px-3" data-role="header-container">
|
||||
{$comment_header} <!-- 댓글 header : comment_header.html -->
|
||||
</header>
|
||||
|
||||
<main data-role="comment-main">
|
||||
<nav class="d-flex align-items-center px-3">
|
||||
<div class="btn-group btn-group-sm btn-group-toggle" data-toggle="buttons" role="group">
|
||||
<label class="btn btn-link muted-link active" data-kcact="changeSort" data-sort="uid" data-orderby="asc">
|
||||
<input type="radio" name="changeSort" id="sort_uid_asc" autocomplete="off" checked> 최신순
|
||||
</label>
|
||||
<label class="btn btn-link muted-link" data-kcact="changeSort" data-sort="uid" data-orderby="desc">
|
||||
<input type="radio" name="changeSort" id="sort_uid_desc" autocomplete="off"> 과거순
|
||||
</label>
|
||||
<label class="btn btn-link muted-link" data-kcact="changeSort" data-sort="likes" data-orderby="desc">
|
||||
<input type="radio" name="changeSort" id="sort_likes_desc" autocomplete="off"> 추천순
|
||||
</label>
|
||||
</div>
|
||||
<button type="button" class="btn btn-link muted-link btn-sm d-print-none ml-auto" role="button" data-kcact="reload" data-toggle="tooltip" title="새로고침">
|
||||
<i class="fa fa-refresh" aria-hidden="true"></i>
|
||||
</button>
|
||||
</nav>
|
||||
|
||||
<div class="timeline-vscroll border-top pb-3">
|
||||
<ul class="list-unstyled mb-0" data-role="comment-container"> <!-- 댓글 출력부 : comment_row.html -->
|
||||
{$comment_rows}
|
||||
</ul>
|
||||
<div data-role="btnMore-container"> <!-- 더보기 버튼 -->
|
||||
<div class="p-3">
|
||||
<a class="btn btn-block btn-light" data-role="trigger-getMoreComment">더보기</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</main>
|
||||
|
||||
<div class="d-none animated fadeIn" data-role="comment-none">
|
||||
<div class="d-flex justify-content-center align-items-center">
|
||||
<div class="text-muted text-center">
|
||||
<div class="display-2 mb-3">
|
||||
<i class="fa fa-comment-o" aria-hidden="true"></i>
|
||||
</div>
|
||||
<button type="button" class="btn btn-link text-muted js-comment-focus">첫번째 댓글을 남겨주세요.</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="rb-comments-write border-top py-1 px-2" data-role="commentWrite-container"> <!-- 댓글 입렵부 : comment_write.html -->
|
||||
{$comment_write}
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
$('[data-toggle="tooltip"]').tooltip()
|
||||
|
||||
</script>
|
||||
@@ -0,0 +1 @@
|
||||
<span class="d-none" data-role="show-totalRow">{$comment_total}</span>
|
||||
@@ -0,0 +1,74 @@
|
||||
<li class="media border-bottom p-3 bg-white" data-role="comment-item" id="CMT-{$comment_uid}" data-uid="{$comment_uid}" data-page="{$comment_page}" data-totalPage="{$total_page}" data-type="comment" data-hidden="{$comment_getHidden}" data-notice="{$comment_getNoitce}">
|
||||
<img class="mr-3 border rounded-circle" src="{$comment_user_pic}" alt="아바타" style="width:38px" data-toggle="popover" data-content="{$comment_user_name}" role="button">
|
||||
<div class="media-body">
|
||||
<div class="d-flex w-100 justify-content-between align-items-center">
|
||||
<span>
|
||||
<span data-role="comment-hidden" class="badge"><i class="fa fa-lock fa-lg" aria-hidden="true"></i></span>
|
||||
<strong class="mr-2" data-toggle="popover" data-content="{$comment_user_name}" role="button">{$comment_user_name}</strong>
|
||||
<i class="fa fa-clock-o" aria-hidden="true"></i>
|
||||
<time data-role="comment-time-wrapper-{$comment_uid}">{$comment_regis_time}</time>
|
||||
<small class="ml-1 {$comment_getNew}"></small><!-- 24시간이내 new 출력 -->
|
||||
</span>
|
||||
<span>
|
||||
{$btn_showHideMenu} <!-- 메뉴 출력/숨기 버튼 btn_showHideMenu.html : 권한이 있는 경우(로그인,작성자,관리자) 에만 노출됨 -->
|
||||
</span>
|
||||
</div><!-- /.d-flex -->
|
||||
<div class="rb-article">
|
||||
<article data-role="comment-origin-content-{$comment_uid}">{$comment_content}</article>
|
||||
<article class="border" style="display:none" data-role="comment-content-editable-{$comment_uid}">{$comment_content}</article>
|
||||
</div>
|
||||
{$btn_editMod} <!-- 수정 모드시 취소/완료 버튼 btn_ediMod.html -->
|
||||
|
||||
<div class="mt-1">
|
||||
<button class="btn btn-link btn-sm add-comment px-0 muted-link" data-role="toggle-oneline-input" data-parent="{$comment_uid}">
|
||||
<i class="fa fa-comment-o fa-fw" aria-hidden="true"></i>
|
||||
의견달기
|
||||
</button>
|
||||
<button class="btn btn-link btn-sm muted-link js-like pr-0 {$comment_getIsLiked}"
|
||||
data-kcact="like"
|
||||
data-type="comment"
|
||||
data-entry="{$comment_uid}"
|
||||
data-effect="animated bounceIn delay-1"
|
||||
data-role="comment-isLiked-{$comment_uid}">
|
||||
<i class="fa fa-thumbs-o-up fa-fw" aria-hidden="true"></i>
|
||||
좋아요
|
||||
</button>
|
||||
<a href="#modal_reaction" class="badge badge-light"
|
||||
data-toggle="modal"
|
||||
data-type="comment"
|
||||
data-count="{$comment_like_total}"
|
||||
data-entry="{$comment_uid}"
|
||||
data-role="comment-likeTotal-{$comment_uid}" title="좋아요한 사람">
|
||||
{$comment_like_total}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<section>
|
||||
<div class="my-2" data-role="oneline-input-wrapper-{$comment_uid}"> <!-- 한줄의견 등록폼 -->
|
||||
<div class="d-flex justify-content-between align-items-end">
|
||||
<section class="w-100 align-self-center border">
|
||||
<div data-role="editor">
|
||||
<div data-role="oneline-input-{$comment_uid}" class="py-1 border-0"></div>
|
||||
</div>
|
||||
</section>
|
||||
<div class="d-flex">
|
||||
<div class="toolbar-container"></div>
|
||||
<button class="btn btn-light ml-1" type="submit"
|
||||
title="의견추가"
|
||||
data-kcact="regis"
|
||||
data-type="oneline"
|
||||
data-parent="{$comment_uid}"
|
||||
data-effect="animated fadeInUp"
|
||||
data-grant="{$grant_uid}">
|
||||
등록
|
||||
</button>
|
||||
</div>
|
||||
</div><!-- /.d-flex -->
|
||||
</div>
|
||||
|
||||
<ul class="list-group" data-role="oneline-container-{$comment_uid}">
|
||||
{$oneline_rows} <!-- 한줄의견 리스트 -->
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
</li>
|
||||
@@ -0,0 +1,74 @@
|
||||
<li class="media border-bottom p-3 bg-white" data-role="comment-item" id="CMT-{$comment_uid}" data-uid="{$comment_uid}" data-page="{$comment_page}" data-totalPage="{$total_page}" data-type="comment" data-hidden="{$comment_getHidden}" data-notice="{$comment_getNoitce}">
|
||||
<img class="mr-3 border rounded-circle" src="{$comment_user_pic}" alt="아바타" style="width:38px" data-toggle="popover" data-content="{$comment_user_name}" role="button">
|
||||
<div class="media-body">
|
||||
<div class="d-flex w-100 justify-content-between align-items-center">
|
||||
<span>
|
||||
<strong class="mr-2" data-toggle="popover" data-content="{$comment_user_name}" role="button">{$comment_user_name}</strong>
|
||||
<i class="fa fa-clock-o" aria-hidden="true"></i>
|
||||
<time data-role="comment-time-wrapper-{$comment_uid}">{$comment_regis_time}</time>
|
||||
<small class="ml-1 {$comment_getNew}"></small><!-- 24시간이내 new 출력 -->
|
||||
</span>
|
||||
<span>
|
||||
{$btn_showHideMenu} <!-- 메뉴 출력/숨기 버튼 btn_showHideMenu.html : 권한이 있는 경우(로그인,작성자,관리자) 에만 노출됨 -->
|
||||
</span>
|
||||
</div><!-- /.d-flex -->
|
||||
<div class="rb-article">
|
||||
<article data-role="comment-content-editable-{$comment_uid}">
|
||||
<div class="text-center text-muted bg-light p-4 my-2"><i class="fa fa-lock fa-fw" aria-hidden="true"></i> 비밀글</div>
|
||||
</article>
|
||||
</div>
|
||||
{$btn_editMod} <!-- 수정 모드시 취소/완료 버튼 btn_ediMod.html -->
|
||||
|
||||
<div class="mt-1">
|
||||
<button class="btn btn-link btn-sm add-comment px-0 muted-link" data-role="toggle-oneline-input" data-parent="{$comment_uid}">
|
||||
<i class="fa fa-comment-o fa-fw" aria-hidden="true"></i>
|
||||
의견달기
|
||||
</button>
|
||||
<button class="btn btn-link btn-sm muted-link js-like pr-0 {$comment_getIsLiked}"
|
||||
data-kcact="like"
|
||||
data-type="comment"
|
||||
data-entry="{$comment_uid}"
|
||||
data-effect="animated bounceIn delay-1"
|
||||
data-role="comment-isLiked-{$comment_uid}">
|
||||
<i class="fa fa-thumbs-o-up fa-fw" aria-hidden="true"></i>
|
||||
좋아요
|
||||
</button>
|
||||
<a href="#modal_reaction" class="badge badge-light"
|
||||
data-toggle="modal"
|
||||
data-type="comment"
|
||||
data-count="{$comment_like_total}"
|
||||
data-entry="{$comment_uid}"
|
||||
data-role="comment-likeTotal-{$comment_uid}" title="좋아요한 사람">
|
||||
{$comment_like_total}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<section>
|
||||
<div class="my-2" data-role="oneline-input-wrapper-{$comment_uid}"> <!-- 한줄의견 등록폼 -->
|
||||
<div class="d-flex justify-content-between align-items-end">
|
||||
<section class="w-100 align-self-center border">
|
||||
<div data-role="editor">
|
||||
<div data-role="oneline-input-{$comment_uid}" class="py-1 border-0"></div>
|
||||
</div>
|
||||
</section>
|
||||
<div class="d-flex">
|
||||
<div class="toolbar-container"></div>
|
||||
<button class="btn btn-light ml-1" type="submit"
|
||||
title="의견추가"
|
||||
data-kcact="regis"
|
||||
data-type="oneline"
|
||||
data-parent="{$comment_uid}"
|
||||
data-effect="animated fadeInUp"
|
||||
data-grant="{$grant_uid}">
|
||||
등록
|
||||
</button>
|
||||
</div>
|
||||
</div><!-- /.d-flex -->
|
||||
</div>
|
||||
|
||||
<ul class="list-group" data-role="oneline-container-{$comment_uid}">
|
||||
{$oneline_rows} <!-- 한줄의견 리스트 -->
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
</li>
|
||||
@@ -0,0 +1,62 @@
|
||||
<!-- 참조사항
|
||||
1. 등록폼에 등록자 아바타가 필요한 경우 : <img src="{$login_user_pic}">
|
||||
2. data-*="*" 필수
|
||||
-->
|
||||
|
||||
<div class="d-flex border-0 rounded-0 bg-faded align-items-end" data-role="comment-input-wrapper">
|
||||
<div class="border-0">
|
||||
<span class="input-group-text p-1 bg-transparent">
|
||||
<img src="{$login_user_pic}" width="28" class="rounded-circle border">
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<section class="w-100 mb-1">
|
||||
<div data-role="editor">
|
||||
<div data-role="comment-input" id="meta-description-content" class="border-0"></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="d-flex ml-auto">
|
||||
<div class="toolbar-container"></div>
|
||||
<button type="button" class="btn btn-link ml-1 js-submit "
|
||||
data-kcact="regis"
|
||||
data-type="comment"
|
||||
data-effect="animated fadeInUp"
|
||||
data-parent="{$comment_parent}">
|
||||
<i class="fa fa-paper-plane" aria-hidden="true"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
$('[data-role="commentWrite-container"] textarea').on('keyup', function(event) {
|
||||
var writeLine = $('[data-role="commentWrite-container"]')
|
||||
writeLine.find('.js-submit').addClass('d-none').removeClass("animated bounceIn delay-3");
|
||||
|
||||
if ($(this).val().length >= 1) {
|
||||
writeLine.find('.js-submit').removeClass('d-none').addClass("animated bounceIn delay-3");
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
var textarea_container = $('[data-role="comment-input-wrapper"]')
|
||||
var textarea = $('#meta-description-content');
|
||||
|
||||
textarea.focus(function(){
|
||||
textarea_container.addClass('active')
|
||||
});
|
||||
textarea.blur(function(){
|
||||
setTimeout(function(){
|
||||
textarea_container.removeClass('active')
|
||||
}, 200);
|
||||
});
|
||||
|
||||
// 댓글이 등록된 후에
|
||||
$('#commentting-container').on('saved.rb.comment',function(){
|
||||
textarea.removeAttr("style");
|
||||
})
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
@@ -0,0 +1 @@
|
||||
<img src="{$emoticon_src}" style="width:50px"/>
|
||||
@@ -0,0 +1 @@
|
||||
|
||||
@@ -0,0 +1,22 @@
|
||||
<li class="list-group-item flex-column align-items-start p-0 border-left-0 rounded-0 list-group-item-light" data-role="oneline-item" id="OLN-{$oneline_uid}" data-uid="{$oneline_uid}" data-type="oneline" data-hidden="{$oneline_getHidden}">
|
||||
<blockquote class="py-2">
|
||||
<div class="d-flex w-100 justify-content-between align-items-center">
|
||||
<span>
|
||||
<span data-role="oneline-hidden" class="badge"><i class="fa fa-lock fa-lg" aria-hidden="true"></i></span>
|
||||
<cite data-toggle="popover" data-content="{$oneline_user_name}" role="button">{$oneline_user_name}</cite>
|
||||
<time class="small text-muted ml-2" data-role="oneline-time-wrapper-{$oneline_uid}">
|
||||
{$oneline_regis_time}
|
||||
</time>
|
||||
<small class="ml-1 {$oneline_getNew}"></small><!-- 24시간이내 new 출력 -->
|
||||
</span>
|
||||
<span>
|
||||
{$btn_showHideMenu} <!-- 메뉴 출력/숨기 버튼 btn_showHideMenu.html : 권한이 있는 경우(로그인,작성자,관리자) 에만 노출됨 -->
|
||||
</span>
|
||||
</div>
|
||||
<article class="mb-0" data-role="oneline-origin-content-{$oneline_uid}">{$oneline_content}</article>
|
||||
<article class="mb-0 bg-white" data-role="oneline-content-editable-{$oneline_uid}" style="display:none" >{$oneline_content}</article>
|
||||
|
||||
{$btn_editMod}
|
||||
<button class="btn btn-sm btn-link text-reset" data-kcact="like" data-type="oneline" data-entry="{$oneline_uid}">좋아요 <span class="badge badge-light" data-role="oneline-likeTotal-{$oneline_uid}">{$oneline_like_total}</span></button>
|
||||
</blockquote>
|
||||
</li>
|
||||
@@ -0,0 +1,23 @@
|
||||
<li class="list-group-item flex-column align-items-start p-0 border-left-0 rounded-0 list-group-item-light" data-role="oneline-item" id="OLN-{$oneline_uid}" data-uid="{$oneline_uid}" data-type="oneline" data-hidden="{$oneline_getHidden}">
|
||||
<blockquote class="py-2">
|
||||
<div class="d-flex w-100 justify-content-between align-items-center">
|
||||
<span>
|
||||
<cite data-toggle="popover" data-content="{$oneline_user_name}" role="button">{$oneline_user_name}</cite>
|
||||
<time class="small text-muted ml-2" data-role="oneline-time-wrapper-{$oneline_uid}">
|
||||
{$oneline_regis_time}
|
||||
</time>
|
||||
<small class="ml-1 {$oneline_getNew}"></small><!-- 24시간이내 new 출력 -->
|
||||
</span>
|
||||
<span>
|
||||
{$btn_showHideMenu} <!-- 메뉴 출력/숨기 버튼 btn_showHideMenu.html : 권한이 있는 경우(로그인,작성자,관리자) 에만 노출됨 -->
|
||||
</span>
|
||||
</div>
|
||||
<article class="mb-0" data-role="oneline-origin-content-{$oneline_uid}">
|
||||
<div class="text-center text-muted border p-4 my-2"><i class="fa fa-lock fa-fw" aria-hidden="true"></i> 비밀글</div>
|
||||
</article>
|
||||
<article class="mb-0 bg-white" data-role="oneline-content-editable-{$oneline_uid}" style="display:none" >{$oneline_content}</article>
|
||||
|
||||
{$btn_editMod}
|
||||
<button class="btn btn-sm btn-link text-reset" data-kcact="like" data-type="oneline" data-entry="{$oneline_uid}">좋아요 <span class="badge badge-light" data-role="oneline-likeTotal-{$oneline_uid}">{$oneline_like_total}</span></button>
|
||||
</blockquote>
|
||||
</li>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
1
modules/comment/themes/_desktop/bs4-modal/name.txt
Normal file
1
modules/comment/themes/_desktop/bs4-modal/name.txt
Normal file
@@ -0,0 +1 @@
|
||||
부트스트랩4 기본형 댓글
|
||||
21
modules/comment/themes/_mobile/rc-default/LICENSE
Normal file
21
modules/comment/themes/_mobile/rc-default/LICENSE
Normal file
@@ -0,0 +1,21 @@
|
||||
The RBL License
|
||||
|
||||
Copyright (c) 2011-2018 Redblock, Inc.
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in
|
||||
all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
||||
THE SOFTWARE.
|
||||
17
modules/comment/themes/_mobile/rc-default/README.md
Normal file
17
modules/comment/themes/_mobile/rc-default/README.md
Normal file
@@ -0,0 +1,17 @@
|
||||
|
||||
# 알씨 모바일 댓글 기본형 테마
|
||||
|
||||
안녕하세요. 감사합니다.
|
||||
|
||||
## 주요기능
|
||||
- Automated website building technology
|
||||
- Powerful content managing system
|
||||
- Multiple virtual site system
|
||||
- Unlimited extension
|
||||
- Multi Screen implementations
|
||||
|
||||
## 서버 요구사항
|
||||
- PHP version 5.2.x
|
||||
- MYSQL version 3.23.x or greater (recommend MYSQL >= 5.x)
|
||||
- GD Library
|
||||
- ICONV
|
||||
0
modules/comment/themes/_mobile/rc-default/_var.php
Normal file
0
modules/comment/themes/_mobile/rc-default/_var.php
Normal file
296
modules/comment/themes/_mobile/rc-default/component.js
Normal file
296
modules/comment/themes/_mobile/rc-default/component.js
Normal file
@@ -0,0 +1,296 @@
|
||||
// 댓글
|
||||
|
||||
var popup_comment_mypost = $('#popup-comment-mypost');
|
||||
var sheet_comment_online = $('#sheet-comment-online'); //답글(oneline)보기
|
||||
var sheet_comment_write = $('#sheet-comment-write');
|
||||
|
||||
|
||||
//댓글쓰기 컴포넌트가 호출
|
||||
$(document).on('click','[data-role="comment_box"] [data-toggle="commentWrite"]',function(){
|
||||
if (memberid) {
|
||||
var type = $(this).attr('data-type');
|
||||
var parent = $(this).attr('data-parent');
|
||||
var uid = $(this).attr('data-uid');
|
||||
var act = $(this).attr('data-act');
|
||||
sheet_comment_write.find('[data-kcact="regis"]').attr('data-type',type).attr('data-parent',parent).attr('data-act',act);
|
||||
setTimeout(function(){sheet_comment_write.sheet();}, 10);
|
||||
} else {
|
||||
$('#modal-login').modal();
|
||||
}
|
||||
return false;
|
||||
});
|
||||
|
||||
$(document).on('click','[data-role="comment_box"] [data-role="toggle-oneline-input"]',function(){
|
||||
if (memberid) {
|
||||
var type = $(this).attr('data-type');
|
||||
var parent = $(this).attr('data-parent');
|
||||
var uid = $(this).attr('data-uid');
|
||||
var act = $(this).attr('data-act');
|
||||
sheet_comment_write.find('[data-kcact="regis"]').attr('data-type',type).attr('data-parent',parent).attr('data-act',act);
|
||||
setTimeout(function(){sheet_comment_write.sheet();}, 10);
|
||||
} else {
|
||||
$('#modal-login').modal();
|
||||
}
|
||||
return false;
|
||||
});
|
||||
|
||||
$(document).on('click','.sheet [data-role="toggle-oneline-input"]',function(){
|
||||
if (memberid) {
|
||||
$(document).find('[data-role="comment_box"] [data-role="toggle-oneline-input"]').click();
|
||||
} else {
|
||||
$('#modal-login').modal();
|
||||
}
|
||||
return false;
|
||||
});
|
||||
|
||||
|
||||
$(document).on('click','#popup-comment-mypost .table-view-cell a',function(event){
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
var button = $(this);
|
||||
var uid = button.attr('data-uid');
|
||||
var type = button.attr('data-type');
|
||||
var parent = button.attr('data-parent');
|
||||
var toggle = button.attr('data-toggle');
|
||||
var kcact = button.attr('data-kcact');
|
||||
var act = button.attr('data-act');
|
||||
var hidden = button.attr('data-hidden');
|
||||
|
||||
history.back() // popup 닫기
|
||||
|
||||
// console.log(toggle)
|
||||
setTimeout(function() {
|
||||
if (toggle) {
|
||||
if (act=='edit') {
|
||||
console.log('댓글 수정모드');
|
||||
var content = $('[data-role="comment_box"]').find('[data-role="'+type+'-origin-content-'+uid+'"]').html();
|
||||
$('[data-role="comment_box"]').find('[data-toggle="edit"][data-type="'+type+'"][data-uid="'+uid+'"]').click();
|
||||
sheet_comment_write.sheet();
|
||||
setTimeout(function(){
|
||||
sheet_comment_write.attr('data-uid',uid).attr('data-type',type);
|
||||
InserHTMLtoEditor(editor_sheet,content);
|
||||
sheet_comment_write.find('[data-kcact="regis"]').attr('data-type',type).attr('data-uid',uid).attr('data-act',act).attr('data-hidden',hidden);;
|
||||
if(hidden=='true') {
|
||||
sheet_comment_write.find('[data-role="comment-hidden"]').addClass('active');
|
||||
}
|
||||
}, 10);
|
||||
|
||||
} else {
|
||||
$(document).find('[data-role="comment_box"] [data-role="'+type+'-item"][data-uid="'+uid+'"] [data-toggle="'+toggle+'"]').click()
|
||||
}
|
||||
|
||||
} else {
|
||||
$(document).find('[data-role="comment_box"] [data-role="menu-container-'+type+'"] [data-uid="'+uid+'"][data-kcact="'+kcact+'"]').click()
|
||||
}
|
||||
}, 100);
|
||||
});
|
||||
|
||||
|
||||
//댓글 저장버튼 클릭
|
||||
sheet_comment_write.find('[data-kcact="regis"]').click(function(event) {
|
||||
|
||||
if (!$(this).hasClass("active")) {
|
||||
$.notify({message: '내용을 입력해주세요.'},{type: 'default'});
|
||||
editor_sheet.editing.view.focus();
|
||||
return false
|
||||
}
|
||||
|
||||
sheet_comment_write.find('fieldset').prop('disabled', true);
|
||||
$(this).addClass('fa-spin');
|
||||
|
||||
var type = $(this).attr('data-type');
|
||||
var parent = $(this).attr('data-parent');
|
||||
var uid = $(this).attr('data-uid');
|
||||
var act = $(this).attr('data-act');
|
||||
var hidden = $(this).attr('data-hidden');
|
||||
var content = editor_sheet.getData();
|
||||
|
||||
setTimeout(function(){
|
||||
|
||||
if (type=='comment' && act=='regis') {
|
||||
const commentRegisEditor = document.querySelector( '[data-role="comment_box"] .ck-editor__editable' );
|
||||
const commentRegisEditorInstance = commentRegisEditor.ckeditorInstance;
|
||||
commentRegisEditorInstance.setData(content);
|
||||
$('[data-role="comment_box"] [data-role="comment-input-wrapper"]').find('[data-kcact="regis"]').attr('data-hidden',hidden).click();
|
||||
}
|
||||
|
||||
if (type=='oneline' && act=='regis') {
|
||||
const onelineRegisEditor = document.querySelector( '[data-role="oneline-input-wrapper-'+parent+'"] .ck-editor__editable' );
|
||||
const onelineRegisEditorInstance = onelineRegisEditor.ckeditorInstance;
|
||||
onelineRegisEditorInstance.setData(content);
|
||||
$('[data-role="oneline-input-wrapper-'+parent+'"]').find('[data-kcact="regis"]').attr('data-hidden',hidden).click();
|
||||
}
|
||||
|
||||
if (type=='comment' && act=='edit') {
|
||||
|
||||
console.log('comment 수정 실행')
|
||||
const commentRegisEditor = document.querySelector( '[data-role="comment_box"] [data-role="comment-item"] .ck-editor__editable' );
|
||||
const commentRegisEditorInstance = commentRegisEditor.ckeditorInstance;
|
||||
commentRegisEditorInstance.setData(content);
|
||||
$('[data-role="comment_box"]').find('[data-kcact="edit"][data-uid="'+uid+'"]').attr('data-hidden',hidden).click();
|
||||
}
|
||||
|
||||
if (type=='oneline' && act=='edit') {
|
||||
|
||||
console.log('oneline 수정 실행')
|
||||
const commentRegisEditor = document.querySelector( '[data-role="comment_box"] [data-role="oneline-item"][data-uid="'+uid+'"] .ck-editor__editable' );
|
||||
const commentRegisEditorInstance = commentRegisEditor.ckeditorInstance;
|
||||
commentRegisEditorInstance.setData(content);
|
||||
$('[data-role="comment_box"]').find('[data-kcact="edit"][data-type="oneline"][data-uid="'+uid+'"]').attr('data-hidden',hidden).click();
|
||||
}
|
||||
}, 600);
|
||||
|
||||
});
|
||||
|
||||
//댓글쓰기 컴포넌트가 호출될때
|
||||
sheet_comment_write.on('shown.rc.sheet', function (e) {
|
||||
setTimeout(function(){
|
||||
DecoupledEditor
|
||||
.create( document.querySelector('#sheet-comment-write [data-role="comment-input"]'),{
|
||||
placeholder: '공개 댓글 추가...',
|
||||
toolbar: [ 'bold','italic','bulletedList','numberedList','blockQuote','imageUpload','|','undo','redo'],
|
||||
language: 'ko',
|
||||
extraPlugins: [rbUploadAdapterPlugin],
|
||||
mediaEmbed: {
|
||||
extraProviders: [
|
||||
{
|
||||
name: 'other',
|
||||
url: /^([a-zA-Z0-9_\-]+)\.([a-zA-Z0-9_\-]+)\.([a-zA-Z0-9_\-]+)/
|
||||
},
|
||||
{
|
||||
name: 'another',
|
||||
url: /^([a-zA-Z0-9_\-]+)\.([a-zA-Z0-9_\-]+)/
|
||||
}
|
||||
]
|
||||
},
|
||||
typing: {
|
||||
transformations: {
|
||||
include: [
|
||||
// Use only the 'quotes' and 'typography' groups.
|
||||
'quotes',
|
||||
'typography',
|
||||
|
||||
// Plus, some custom transformation.
|
||||
{ from: '->', to: '→' },
|
||||
{ from: ':)', to: '🙂' },
|
||||
{ from: ':+1:', to: '👍' },
|
||||
{ from: ':tada:', to: '🎉' },
|
||||
],
|
||||
}
|
||||
},
|
||||
removePlugins: [ 'WordCount' ],
|
||||
image: {}
|
||||
} )
|
||||
.then( newEditor => {
|
||||
editor_sheet = newEditor;
|
||||
console.log('editor_sheet init');
|
||||
editor_sheet.editing.view.focus();
|
||||
sheet_comment_write.find('.toolbar-container').html(editor_sheet.ui.view.toolbar.element)
|
||||
$('[data-role="commentWrite-container"]').removeClass('active');
|
||||
sheet_comment_write.find('[data-placeholder]').addClass('ck-placeholder');
|
||||
|
||||
editor_sheet.editing.view.document.on( 'change:isFocused', ( evt, name, value ) => {
|
||||
if (value) {
|
||||
console.log('editor_comment focus');
|
||||
$('[data-role="commentWrite-container"]').addClass('active');
|
||||
} else {
|
||||
console.log('editor_comment blur');
|
||||
}
|
||||
} );
|
||||
|
||||
editor_sheet.model.document.on( 'change:data', () => {
|
||||
var content = editor_sheet.getData();
|
||||
if (content) {
|
||||
sheet_comment_write.find('[data-kcact="regis"]').addClass('active');
|
||||
$('[data-role="commentWrite-container"]').addClass('active');
|
||||
sheet_comment_write.find('[data-placeholder]').removeClass('ck-placeholder');
|
||||
} else {
|
||||
sheet_comment_write.find('[data-kcact="regis"]').removeClass('active');
|
||||
sheet_comment_write.find('[data-placeholder]').addClass('ck-placeholder');
|
||||
}
|
||||
} );
|
||||
|
||||
})
|
||||
.catch( error => {
|
||||
console.error( error );
|
||||
} );
|
||||
|
||||
$('[data-role="comment-box"] [data-role="commentWrite-container"]').css('opacity','.2');
|
||||
|
||||
sheet_comment_write.find('[data-role="comment-hidden"]').off('changed.rc.switch').on('changed.rc.switch', function () {
|
||||
if ($(this).hasClass("active")) {
|
||||
console.log('비밀글 ON')
|
||||
sheet_comment_write.find('[data-kcact="regis"]').attr('data-hidden','true');
|
||||
} else {
|
||||
console.log('비밀글 OFF')
|
||||
sheet_comment_write.find('[data-kcact="regis"]').attr('data-hidden','false');
|
||||
}
|
||||
})
|
||||
}, 200);
|
||||
})
|
||||
|
||||
sheet_comment_write.on('hidden.rc.sheet', function (e) {
|
||||
|
||||
editor_sheet.setData('');
|
||||
console.log('editor_sheet empty')
|
||||
editor_sheet.destroy();
|
||||
console.log('editor_sheet destroy')
|
||||
sheet_comment_write.find('[data-kcact="regis"]').removeClass('active');
|
||||
sheet_comment_write.find('fieldset').prop('disabled', false);
|
||||
sheet_comment_write.find('[data-kcact="regis"]').removeClass('fa-spin').attr('data-type','').attr('data-parent','').attr('data-act','').attr('data-hidden','');
|
||||
$('[data-role="comment-box"] [data-role="commentWrite-container"]').css('opacity','1')
|
||||
$('#sheet-comment-write-toolbar').collapse('hide');
|
||||
|
||||
// 비밀글 옵션 초기화
|
||||
sheet_comment_write.find('[data-role="comment-hidden"]').removeClass('active');
|
||||
sheet_comment_write.find('[data-role="comment-hidden"] .switch-handle').removeAttr('style');
|
||||
|
||||
var uid = sheet_comment_write.attr('data-uid');
|
||||
var type = sheet_comment_write.attr('data-type');
|
||||
|
||||
sheet_comment_write.removeAttr('data-uid').removeAttr('data-type')
|
||||
|
||||
if (uid && type) {
|
||||
$('body').removeClass('comment-editmod');
|
||||
console.log(type+' 수정모드 해제')
|
||||
}
|
||||
|
||||
const onelineRegisEditor = document.querySelector( '[data-role="comment-item"] .ck-editor__editable' );
|
||||
if (onelineRegisEditor) {
|
||||
const onelineRegisEditorInstance = onelineRegisEditor.ckeditorInstance;
|
||||
onelineRegisEditorInstance.destroy();
|
||||
}
|
||||
})
|
||||
|
||||
popup_comment_mypost.on('show.rc.popup', function (e) {
|
||||
var button = $(e.relatedTarget);
|
||||
var uid = button.attr('data-uid');
|
||||
var type = button.attr('data-type');
|
||||
var parent = button.attr('data-parent');
|
||||
var notice = button.closest('[data-role="'+type+'-item"]').attr('data-notice');
|
||||
var hidden = button.closest('[data-role="'+type+'-item"]').attr('data-hidden');
|
||||
var popup = $(this);
|
||||
|
||||
popup.find('[data-role="comment_box"]').removeClass('d-none');
|
||||
if (type=='oneline') popup.find('[data-role="comment_box"]').addClass('d-none');
|
||||
|
||||
if (notice=="true") popup.find('[data-kcact="notice"] span').text('해제')
|
||||
else popup.find('[data-kcact="notice"] span').text('')
|
||||
|
||||
if (hidden=="true") popup.find('[data-act="edit"]').attr('data-hidden','true');
|
||||
else popup.find('[data-act="edit"]').attr('data-hidden','false');
|
||||
|
||||
popup.find('.table-view-cell a').attr('data-uid',uid);
|
||||
popup.find('.table-view-cell a').attr('data-type',type)
|
||||
})
|
||||
|
||||
// 답글(oneline)보기
|
||||
sheet_comment_online.on('show.rc.sheet', function(event) {
|
||||
var sheet = $(this);
|
||||
var button = $(event.relatedTarget);
|
||||
var top = button.closest('.content').css('padding-top');
|
||||
var comment_item = button.closest('[data-role="comment-item"]').clone().wrapAll("<div/>").parent().html();
|
||||
sheet.css('top',top);
|
||||
sheet.find('[data-role="list"]').loader({ position: 'inside' });
|
||||
setTimeout(function(){ sheet.find('[data-role="list"]').html(comment_item); }, 300);
|
||||
})
|
||||
82
modules/comment/themes/_mobile/rc-default/component.php
Normal file
82
modules/comment/themes/_mobile/rc-default/component.php
Normal file
@@ -0,0 +1,82 @@
|
||||
<!-- Sheet : 답글(oneline)보기 -->
|
||||
<div id="sheet-comment-online" class="sheet">
|
||||
<header class="bar bar-nav bar-light bg-white" data-history="back" >
|
||||
<a class="icon icon-close pull-right px-2" role="button"></a>
|
||||
<h1 class="title title-left px-3">답글</h1>
|
||||
</header>
|
||||
<main class="pb-0" data-role="comment">
|
||||
<ul class="media-list mt-3 mb-0" data-role="list"></ul>
|
||||
</main>
|
||||
</div>
|
||||
|
||||
<!-- Sheet : 신규 댓글작성 -->
|
||||
<div id="sheet-comment-write" class="sheet">
|
||||
<fieldset data-role="commentWrite-container">
|
||||
<div data-role="comment-input-wrapper">
|
||||
<ul class="table-view mb-0 collapse" id="sheet-comment-write-toolbar">
|
||||
<li class="table-view-cell text-muted bg-faded">
|
||||
비밀글
|
||||
<small class="ml-1">운영자에게만 공개</small>
|
||||
<div data-toggle="switch" data-role="comment-hidden" class="switch">
|
||||
<div class="switch-handle"></div>
|
||||
</div>
|
||||
</li>
|
||||
<li class="table-view-cell py-0 px-2 bg-faded">
|
||||
<div class="toolbar-container align-self-end"></div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="d-flex border-0 rounded-0 align-items-center" data-role="form">
|
||||
<img class="img-circle bg-faded ml-3" data-role="avatar" src="<?php echo getAvatarSrc($my['uid'],'100') ?>" style="width:2.25rem;height:2.25rem">
|
||||
<section class="w-100">
|
||||
<div data-role="editor">
|
||||
<div data-role="comment-input" id="meta-description-content" class="border-0"></div>
|
||||
</div>
|
||||
</section>
|
||||
<button class="btn btn-link align-self-end" type="submit" data-kcact="regis">
|
||||
<span class="not-loading">
|
||||
<i class="material-icons">send</i>
|
||||
</span>
|
||||
<span class="is-loading">
|
||||
<div class="spinner-border spinner-border-sm" role="status">
|
||||
<span class="sr-only">Loading...</span>
|
||||
</div>
|
||||
</span>
|
||||
</button>
|
||||
<button class="btn btn-link align-self-end" type="button" data-toggle="collapse" data-target="#sheet-comment-write-toolbar">
|
||||
<i class="material-icons">more_vert</i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
</div>
|
||||
|
||||
<!-- Popup : 댓글관리 -->
|
||||
<div id="popup-comment-mypost" class="popup zoom">
|
||||
<div class="popup-content">
|
||||
<div class="content" style="min-height: 5rem;">
|
||||
<ul class="table-view table-view-full mt-0 text-xs-center">
|
||||
<li class="table-view-cell">
|
||||
<a data-toggle="commentWrite" data-act="edit">수정하기</a>
|
||||
</li>
|
||||
<li class="table-view-cell">
|
||||
<a data-kcact="delete">삭제하기</a>
|
||||
</li>
|
||||
|
||||
<li class="table-view-cell" data-role="comment">
|
||||
<a data-kcact="notice">상단고정 <span></span></a>
|
||||
</li>
|
||||
|
||||
<li class="table-view-cell d-none">
|
||||
<a data-kcact="report">신고하기</a>
|
||||
</li>
|
||||
<li class="table-view-cell" data-role="comment">
|
||||
<a data-toggle="commentWrite">댓글 답글쓰기</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<script src="/modules/comment/lib/Rb.comment.js"></script>
|
||||
<script src="/modules/comment/themes/<?php echo $d['comment']['skin_mobile'] ?>/component.js<?php echo $g['wcache']?>" ></script>
|
||||
384
modules/comment/themes/_mobile/rc-default/css/style.css
Normal file
384
modules/comment/themes/_mobile/rc-default/css/style.css
Normal file
@@ -0,0 +1,384 @@
|
||||
|
||||
.hidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.comment-editmod .bar-nav {
|
||||
display: none
|
||||
}
|
||||
|
||||
.rb-commentting header h1 {
|
||||
line-height: 30px
|
||||
}
|
||||
|
||||
[data-role="comment-notice-container"] > li,
|
||||
[data-role="comment-container"] > li {
|
||||
margin-top: -1px;
|
||||
padding: 1rem 0.625rem;
|
||||
border-top: 1px solid #eee;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
[data-role="comment-container"] [data-role="comment-item"]:focus,
|
||||
[data-role="comment-container"] [data-role="oneline-item"]:focus {
|
||||
background-color: #F5FFFE !important;
|
||||
}
|
||||
|
||||
[data-role="comment-container"] .media-body {
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
[data-role="comment-container"] > .media:first-child {
|
||||
border-bottom: 0
|
||||
}
|
||||
|
||||
[data-role="commentWrite-container"] .ck-editor__editable {
|
||||
max-height: 13.7rem;
|
||||
overflow: auto
|
||||
}
|
||||
|
||||
[data-role="comment-item"] [data-role="comment-hidden"],
|
||||
[data-role="oneline-item"] [data-role="oneline-hidden"] {
|
||||
display: none
|
||||
}
|
||||
[data-role="comment-item"][data-hidden="true"] [data-role="comment-hidden"] {
|
||||
display: inline-block;
|
||||
}
|
||||
[data-role="oneline-item"][data-hidden="true"] [data-role="oneline-hidden"] {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.sheet [data-role="commentWrite-container"] [data-role="form"] .btn{
|
||||
padding-top: .8rem;
|
||||
padding-bottom: .8rem;
|
||||
padding-left: .5rem;
|
||||
padding-right: .5rem;
|
||||
font-size: 1.3rem;
|
||||
color: #999
|
||||
}
|
||||
.sheet [data-role="commentWrite-container"] .ck.ck-icon {
|
||||
font-size: .85rem;
|
||||
margin-bottom: .36rem;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.sheet [data-role="commentWrite-container"] [data-kcact="regis"].active {
|
||||
color: #0275d8;
|
||||
}
|
||||
|
||||
.sheet [data-role="commentWrite-container"] .toolbar-container,
|
||||
.sheet [data-role="commentWrite-container"] [data-kcact="regis"],
|
||||
.sheet [data-role="commentWrite-container"] [data-toggle="collapse"] {
|
||||
visibility: hidden
|
||||
}
|
||||
.sheet [data-role="commentWrite-container"].active .toolbar-container,
|
||||
.sheet [data-role="commentWrite-container"].active [data-kcact="regis"],
|
||||
.sheet [data-role="commentWrite-container"].active [data-toggle="collapse"] {
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
.sheet .fa-paper-plane:before {
|
||||
content: "\f1d8";
|
||||
}
|
||||
|
||||
.sheet fieldset:disabled .fa-paper-plane:before {
|
||||
content: "\f110";
|
||||
}
|
||||
.sheet fieldset:disabled .ck-content p {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.media-list > .media .media {
|
||||
margin-top: .5rem;
|
||||
}
|
||||
.media-list .media-list {
|
||||
margin: 10px 0 0 -20px;
|
||||
padding: 2px 20px;
|
||||
display: none
|
||||
}
|
||||
.media-list hr {
|
||||
display: none
|
||||
}
|
||||
|
||||
.media-list .media-list:empty {
|
||||
margin: 0
|
||||
}
|
||||
.media-list .ico-replay {
|
||||
margin-top: -2px;
|
||||
margin-right: 3px
|
||||
}
|
||||
.media-list .ico-replay::before {
|
||||
display: inline-block;
|
||||
width: 13px;
|
||||
height: 10px;
|
||||
margin: 4px 4px 0 1px;
|
||||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAABkCAMAAACvvNBNAAAAclBMVEVMaXEtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUtlvUAAAAtlvXBtxldAAAAJHRSTlMAlgoDD071ePxpN7FZvfDjLRxb/gEGpEL5hxUkyNvqeXyAwuvQ8jQMAAAAqElEQVR42u2R1w7CMAxFu/feu4ze//9FWlRaWlwkBC9IPi+2cpzYSYTPUZwjk7rQaZNk8ENalfAC2pgoctqoRhzRxtKWERxlY+oO4pz2cKUnU7Ww5TkP/Sl/IDVo1srAW04QZBttRfcV0dW7aWHeEx2a9XJHQx1DFI9hz2kqz4tp88rS5Op4KDdr62hAlpDPI13gpkf/elYEhmGYXzAMrL5XO94phvlnbrKzELi3OthbAAAAAElFTkSuQmCC) 0 -30px no-repeat;
|
||||
background-size: 13px 50px;
|
||||
vertical-align: top;
|
||||
content: '';
|
||||
}
|
||||
.rb-commentting .btn-secondary.active {
|
||||
color: red
|
||||
}
|
||||
|
||||
/* notify */
|
||||
#commentting-container, [data-role=comment-container], [data-role=moreBtn-container] {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#comment-notify {
|
||||
visibility: hidden;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
bottom: 30px;
|
||||
top: auto
|
||||
}
|
||||
|
||||
#comment-notify .comment-notify-msg {
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
background-color: #333;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
border-radius: 5px;
|
||||
padding:12px 6px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
#comment-notify.active {
|
||||
visibility: visible;
|
||||
-webkit-animation: fadein 0.5s, fadeout 0.5s 1.1s;
|
||||
animation: fadein 0.5s, fadeout 0.5s 1.1s;
|
||||
}
|
||||
|
||||
@-webkit-keyframes fadein {
|
||||
from {bottom: 0; opacity: 0;}
|
||||
to {bottom: 30px; opacity: 1;}
|
||||
}
|
||||
|
||||
@keyframes fadein {
|
||||
from {bottom: 0; opacity: 0;}
|
||||
to {bottom: 30px; opacity: 1;}
|
||||
}
|
||||
|
||||
@-webkit-keyframes fadeout {
|
||||
from {bottom: 30px; opacity: 1;}
|
||||
to {bottom: 0; opacity: 0;}
|
||||
}
|
||||
|
||||
@keyframes fadeout {
|
||||
from {bottom: 30px; opacity: 1;}
|
||||
to {bottom: 0; opacity: 0;}
|
||||
}
|
||||
|
||||
/* notify */
|
||||
|
||||
/* attach trigger */
|
||||
#commentting-container .comment-attach {
|
||||
position: relative;
|
||||
display: block;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
padding: 8px 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#commentting-container span.comment-attach input[type='file'] {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: 0;
|
||||
right: -9px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
opacity: 0;
|
||||
font-size: 0;
|
||||
width: 180%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* emoticon */
|
||||
#commentting-container .emoticon-wrapper {
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
padding: 15px 5px;
|
||||
}
|
||||
#commentting-container .emoticon-wrapper ul {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
}
|
||||
#commentting-container .emoticon-wrapper li {
|
||||
display: inline-block;
|
||||
float: left;
|
||||
text-align: center;
|
||||
width: 12.5%;
|
||||
cursor: pointer;
|
||||
}
|
||||
#commentting-container .emoticon-wrapper li img {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
[data-role|=oneline-input-wrapper], [data-role|=comment-modify-btn-wrapper], [data-role|=oneline-modify-btn-wrapper], [data-role|=menu-container] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
/* Comment Intro */
|
||||
|
||||
/* Comment Input */
|
||||
|
||||
|
||||
.rb-comments-write .card {
|
||||
display: none;
|
||||
}
|
||||
.rb-comments-write .active .card {
|
||||
display: block;
|
||||
}
|
||||
.rb-comments-write .active .comment-input-tmp {
|
||||
display: none
|
||||
}
|
||||
|
||||
.rb-comments-write .card-header {
|
||||
font-size: 1rem
|
||||
}
|
||||
.rb-comments-write .card-footer {
|
||||
height: inherit;
|
||||
padding: .35rem .35rem .25rem .5rem;
|
||||
line-height: 2rem
|
||||
}
|
||||
.rb-comments-write .card textarea {
|
||||
border: none
|
||||
}
|
||||
|
||||
/* loader */
|
||||
#comment-spinner-wrap {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
}
|
||||
.comment-top5p {
|
||||
top: 5%;
|
||||
}
|
||||
.comment-bottom5p {
|
||||
bottom: 5%;
|
||||
}
|
||||
|
||||
|
||||
.bar-footer.rb-comments-write {
|
||||
min-height: 44px;
|
||||
height: auto;
|
||||
padding: 0;
|
||||
border-top: 1px solid #ccc
|
||||
}
|
||||
|
||||
.rb-comments-write .input-group {
|
||||
position: relative;
|
||||
margin-bottom: 0;
|
||||
padding: 3px 40px 0 10px;
|
||||
}
|
||||
.rb-comments-write .input-group textarea {
|
||||
width: 100%;
|
||||
background-color: transparent;
|
||||
border-bottom: none;
|
||||
margin-bottom: 0;
|
||||
border: none;
|
||||
resize: none;
|
||||
border: none;
|
||||
-webkit-resize: none;
|
||||
max-height: 120px !important;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
outline: none;
|
||||
}
|
||||
.rb-comments-write .rb-submit {
|
||||
|
||||
}
|
||||
.rb-comments-write .btn-link {
|
||||
padding: .5rem 1rem .7rem .4rem;
|
||||
color: #666;
|
||||
line-height: 1rem;
|
||||
}
|
||||
.rb-comments-write .rb-submit .fa {
|
||||
display: inline-block;
|
||||
margin-top: -3px;
|
||||
font-size: 25px;
|
||||
color: #0084FF;
|
||||
}
|
||||
.rb-comments-write .ck.ck-editor__editable_inline>:first-child {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0
|
||||
}
|
||||
.rb-comments-write .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused {
|
||||
outline: none;
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
[data-role="commentWrite-container"] .ck.ck-toolbar,
|
||||
[data-role="comment-item"] .ck.ck-toolbar {
|
||||
border: 0;
|
||||
background-color: transparent
|
||||
}
|
||||
|
||||
[data-role="comment-item"] .ck.ck-icon {
|
||||
font-size: .7rem;
|
||||
}
|
||||
|
||||
|
||||
[data-role="comment-box"].edit_mod .content {
|
||||
top: 0;
|
||||
padding-top: 0
|
||||
}
|
||||
|
||||
.anchor-link::before,
|
||||
[data-role="anchor-link"]::before {
|
||||
position: relative;
|
||||
display: block;
|
||||
content: " ";
|
||||
margin-top: -50px;
|
||||
height: 50px;
|
||||
visibility: hidden;
|
||||
}
|
||||
.sheet .ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused {
|
||||
outline: none;
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.sheet .ck.ck-editor__editable_inline>:first-child {
|
||||
margin-top: .5rem;
|
||||
}
|
||||
.sheet .ck.ck-editor__editable_inline>:last-child {
|
||||
margin-bottom: .5rem;
|
||||
}
|
||||
.sheet .ck.ck-editor__editable_inline> p {
|
||||
margin-bottom: 0;
|
||||
line-height: 1.3
|
||||
}
|
||||
|
||||
|
||||
.ck.ck-placeholder:before,
|
||||
.ck .ck-placeholder:before {
|
||||
content: attr(data-placeholder);
|
||||
pointer-events: none;
|
||||
cursor: text;
|
||||
color: var(--ck-color-engine-placeholder-text);
|
||||
}
|
||||
|
||||
/* sheet */
|
||||
.sheet .media-list .media-list {
|
||||
display: block;
|
||||
}
|
||||
.sheet [data-toggle="sheet"] {
|
||||
display: none
|
||||
}
|
||||
.sheet .media-list .media-list {
|
||||
margin: 10px 0 0 -65px;
|
||||
padding-left: 25px
|
||||
}
|
||||
.sheet .media-list hr {
|
||||
display: block;
|
||||
margin: 20px -10px 20px -65px;
|
||||
}
|
||||
@@ -0,0 +1,7 @@
|
||||
<div class="d-none">
|
||||
<div data-role="{$entry_type}-modify-btn-wrapper-{$uid}">
|
||||
<button class="btn btn-secondary btn-lg" data-toggle="cancel-edit" data-type="{$entry_type}" data-uid="{$uid}">수정취소</button>
|
||||
<button class="btn btn-primary btn-lg" data-kcact="edit" data-type="{$entry_type}" data-uid="{$uid}" data-parent="{$parent}">수정완료</button>
|
||||
</div>
|
||||
<div class="toolbar-container" data-role="{$entry_type}-modify-btn-wrapper-{$uid}"></div>
|
||||
</div>
|
||||
@@ -0,0 +1,37 @@
|
||||
<div class="pt-2 bg-white">
|
||||
|
||||
<!-- 공통 사항 data-* ="*" 과 {$*} 는 수정 금지 -->
|
||||
<section data-role="comment-box">
|
||||
|
||||
<main data-role="comment-main">
|
||||
|
||||
<header data-role="header-container" class="content-padded">
|
||||
{$comment_header} <!-- 댓글 header : comment_header.html -->
|
||||
</header>
|
||||
|
||||
<div class="rb-comments-write content-padded" data-role="commentWrite-container"> <!-- 댓글 입렵부 : comment_write.html -->
|
||||
{$comment_write}
|
||||
</div>
|
||||
|
||||
<ul class="media-list my-0" data-role="comment-notice-container"> <!-- 공지(고정)댓글 출력부 : comment_row.html -->
|
||||
{$comment_rows_notice}
|
||||
</ul>
|
||||
|
||||
<ul class="media-list mb-0" data-role="comment-container"> <!-- 댓글 출력부 : comment_row.html -->
|
||||
{$comment_rows}
|
||||
</ul>
|
||||
<div data-role="btnMore-container" class="content-padded"> <!-- 더보기 버튼 -->
|
||||
<a class="btn btn-secondary btn-block" data-role="trigger-getMoreComment">더보기</a>
|
||||
</div>
|
||||
|
||||
</main>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
|
||||
<script>
|
||||
$('[data-toggle="buttons"] .nav-link').tap(function(){
|
||||
$('[data-toggle="buttons"] .nav-link').removeClass('active')
|
||||
$(this).addClass('active')
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,21 @@
|
||||
<h1 class="d-flex justify-content-between align-items-center px-2">
|
||||
|
||||
<div class="h6 mb-0">
|
||||
댓글 <span class="ml-1 text-muted" data-role="total_comment">{$comment_total}</span>
|
||||
<span class="d-none" data-role="show-totalRow">{$comment_total}</span>
|
||||
</div>
|
||||
|
||||
<div data-role="comment-filter">
|
||||
<div class="d-flex">
|
||||
<nav class="nav nav-control text-muted" data-toggle="buttons" style="width:9.375rem">
|
||||
<a class="nav-link active" role="button" data-kcact="changeSort" data-sort="uid" data-orderby="asc">최신순</a>
|
||||
<a class="nav-link" role="button" data-kcact="changeSort" data-sort="likes" data-orderby="desc">추천순</a>
|
||||
<a class="nav-link" role="button" data-kcact="changeSort" data-sort="uid" data-orderby="desc">과거순</a>
|
||||
</nav>
|
||||
<button type="button" class="btn btn-secondary btn-sm ml-2 text-muted" role="button" data-kcact="reload" title="새로고침">
|
||||
<i class="fa fa-refresh fa-lg" aria-hidden="true"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</h1>
|
||||
@@ -0,0 +1,96 @@
|
||||
<li data-role="comment-item"
|
||||
data-uid="{$comment_uid}"
|
||||
data-page="{$comment_page}"
|
||||
data-totalPage="{$total_page}"
|
||||
data-type="comment" data-hidden="{$comment_getHidden}" data-notice="{$comment_getNoitce}">
|
||||
<span id="CMT-{$comment_uid}" data-role="anchor-link"></span>
|
||||
<div class="media my-0 mx-1">
|
||||
|
||||
<a class="mr-3"
|
||||
data-toggle="sheet"
|
||||
href="#sheet-member-profile"
|
||||
data-nic="{$comment_user_nic}"
|
||||
data-url="{$comment_user_url}"
|
||||
data-avatar="{$comment_user_pic}"
|
||||
data-mbruid="{$comment_user_uid}">
|
||||
<img class="border rounded-circle" src="{$comment_user_pic}" alt="아바타" style="width:2.5rem;height:2.5rem">
|
||||
</a>
|
||||
|
||||
<div class="media-body">
|
||||
|
||||
<h4 class="media-heading h6 d-flex align-items-center">
|
||||
<span data-role="comment-hidden" class="badge badge-default badge-inverted"><i class="fa fa-lock" aria-hidden="true"></i></span>
|
||||
<small class="text-muted">{$comment_user_name}</small>
|
||||
|
||||
<time class="ml-2 small text-muted" data-role="comment-time-wrapper-{$comment_uid}" datetime="{$comment_regis_ago}" data-plugin="timeago">
|
||||
{$comment_regis_time}
|
||||
</time>
|
||||
<small class="ml-2 {$comment_getNew}"></small><!-- 24시간이내 new 출력 -->
|
||||
|
||||
<div class="ml-auto">
|
||||
<span class="badge badge-primary badge-inverted {$comment_getIsNoitce}"><i class="fa fa-thumb-tack fa-fw" aria-hidden="true"></i> 고정</span>
|
||||
</div>
|
||||
</h4>
|
||||
|
||||
<article class="mb-2" data-role="comment-origin-content-{$comment_uid}">{$comment_content}</article>
|
||||
<article class="mb-2 border" style="display:none" data-role="comment-content-editable-{$comment_uid}">{$comment_content}</article>
|
||||
|
||||
<div class="d-flex justify-content-between align-items-center">{$btn_editMod} <!-- 수정 모드시 취소/완료 버튼 btn_ediMod.html --></div>
|
||||
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="">
|
||||
<button class="btn btn-link btn-sm muted-link {$comment_getIsLiked}" style="margin-left:-0.5rem"
|
||||
data-kcact="like"
|
||||
data-type="comment"
|
||||
data-entry="{$comment_uid}"
|
||||
data-effect="animated bounceIn delay-1"
|
||||
data-role="comment-isLiked-{$comment_uid}">
|
||||
<i class="material-icons f16 align-middle">thumb_up</i>
|
||||
<span class="ml-1" data-role="comment-likeTotal-{$comment_uid}">{$comment_like_total}</span>
|
||||
</button>
|
||||
<button class="btn btn-link btn-sm muted-link {$comment_getIsDisLiked}"
|
||||
data-kcact="dislike"
|
||||
data-type="comment"
|
||||
data-entry="{$comment_uid}"
|
||||
data-effect="animated bounceIn delay-1"
|
||||
data-role="comment-isDisLiked-{$comment_uid}">
|
||||
<i class="material-icons f16 align-middle">thumb_down</i>
|
||||
<span class="ml-1" data-role="comment-dislikeTotal-{$comment_uid}">{$comment_dislike_total}</span>
|
||||
</button>
|
||||
|
||||
<button type="button" class="btn btn-link muted-link btn-sm add-comment"
|
||||
data-role="toggle-oneline-input"
|
||||
data-type="oneline"
|
||||
data-act="regis" data-parent="{$comment_uid}">
|
||||
<i class="material-icons f16 align-middle">comment</i>
|
||||
<span class="ml-1" data-role="comment-onelineNum-{$comment_uid}">{$comment_oneline_num}</span>
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="ml-auto">
|
||||
{$my_menu} <!-- 수정 모드시 취소/완료 버튼 btn_ediMod.html : 수정권한이 있는 경우에만 노출됨 -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="d-none" data-role="oneline-input-wrapper-{$comment_uid}"> <!-- 한줄의견 등록폼 -->
|
||||
<form class="input-group">
|
||||
<input type="text" class="form-control" data-role="oneline-input-{$comment_uid}"> <!-- 주의 : comment_uid 가 들어가야 함 -->
|
||||
<span class="input-group-btn">
|
||||
<button type="submit" class="btn btn-secondary btn-sm" data-kcact="regis" data-type="oneline" data-parent="{$comment_uid}" data-grant="{$grant_uid}">
|
||||
답글쓰기
|
||||
</button>
|
||||
</span>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{$oneline_button} <!-- 한줄의견 보기 버튼 -->
|
||||
<hr>
|
||||
<div class="media-list flex-column pr-0 mb-3" data-role="oneline-container-{$comment_uid}">
|
||||
<!-- 한줄의견 리스트 -->
|
||||
{$oneline_rows}
|
||||
</div>
|
||||
</div><!-- /.media-body -->
|
||||
</div><!-- /.media -->
|
||||
</li>
|
||||
@@ -0,0 +1,57 @@
|
||||
<li data-role="comment-item" data-uid="{$comment_uid}" data-page="{$comment_page}" data-totalPage="{$total_page}" data-type="comment" data-hidden="{$comment_getHidden}" data-notice="{$comment_getNoitce}">
|
||||
<span id="CMT-{$comment_uid}" data-role="anchor-link"></span>
|
||||
<div class="media">
|
||||
<img class="mr-3 border rounded-circle" src="{$comment_user_pic}" alt="아바타" style="width:2.25rem;height:2.25rem">
|
||||
<div class="media-body">
|
||||
|
||||
<h4 class="media-heading h6 d-flex align-items-center">
|
||||
<span class="badge badge-default badge-inverted">{$comment_user_name}</span>
|
||||
<time class="pl-1 badge badge-default badge-inverted" data-role="comment-time-wrapper-{$comment_uid}" datetime="{$comment_regis_ago}" data-plugin="timeago">
|
||||
{$comment_regis_time}
|
||||
</time>
|
||||
<small class="ml-1 {$comment_getNew}"></small><!-- 24시간이내 new 출력 -->
|
||||
<span class="badge badge-primary badge-inverted ml-auto {$comment_getIsNoitce}"><i class="fa fa-thumb-tack fa-fw" aria-hidden="true"></i> 고정</span>
|
||||
</h4>
|
||||
|
||||
<article data-role="comment-content-editable-{$comment_uid}">
|
||||
<div class="text-xs-center text-muted bg-faded p-4 my-2 mr-2 small"><i class="fa fa-lock fa-fw" aria-hidden="true"></i> 비밀글</div>
|
||||
</article>
|
||||
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="">
|
||||
<button type="button" class="btn btn-secondary btn-sm add-comment" data-role="toggle-oneline-input" data-toggle="commentWrite" data-type="oneline" data-act="regis" data-parent="{$comment_uid}">답글</button>
|
||||
<button class="btn btn-secondary btn-sm {$comment_getIsLiked}"
|
||||
data-kcact="like"
|
||||
data-type="comment"
|
||||
data-entry="{$comment_uid}"
|
||||
data-effect="animated bounceIn delay-1"
|
||||
data-role="comment-isLiked-{$comment_uid}">
|
||||
<i class="fa fa-thumbs-o-up" aria-hidden="true"></i>
|
||||
<span class="badge badge-inverted" data-role="comment-likeTotal-{$comment_uid}">{$comment_like_total}</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="ml-auto">
|
||||
{$my_menu} <!-- 수정 모드시 취소/완료 버튼 btn_ediMod.html : 수정권한이 있는 경우에만 노출됨 -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="d-none" data-role="oneline-input-wrapper-{$comment_uid}"> <!-- 한줄의견 등록폼 -->
|
||||
<form class="input-group">
|
||||
<input type="text" data-role="oneline-input-{$comment_uid}"> <!-- 주의 : comment_uid 가 들어가야 함 -->
|
||||
<span class="input-group-btn">
|
||||
<button type="submit" class="btn btn-secondary btn-sm" data-kcact="regis" data-type="oneline" data-parent="{$comment_uid}" data-grant="{$grant_uid}" data-effect="animated fadeInUp">
|
||||
답글쓰기
|
||||
</button>
|
||||
</span>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="media-list flex-column pr-0 mt-3" data-role="oneline-container-{$comment_uid}">
|
||||
<!-- 한줄의견 리스트 -->
|
||||
{$oneline_rows}
|
||||
</div>
|
||||
</div><!-- /.media-body -->
|
||||
</div><!-- /.media -->
|
||||
</li>
|
||||
@@ -0,0 +1,19 @@
|
||||
<!-- 참조사항
|
||||
1. 등록폼에 등록자 아바타가 필요한 경우 : <img src="{$login_user_pic}">
|
||||
2. data-*="*" 필수
|
||||
-->
|
||||
<button type="button" class="btn btn-secondary btn-block text-xs-left border-0 px-2 my-0" data-toggle="commentWrite" data-type="comment" data-act="regis" data-parent="{$comment_parent}" data-uid="{$uid}">
|
||||
<div class="media w-100 align-items-center">
|
||||
<img class="media-object pull-left img-circle mr-3" src="{$login_user_pic}" alt="{$login_user_nic}" style="width:2.25rem;height:2.25rem">
|
||||
<div class="media-body text-muted">
|
||||
공개 댓글 추가...
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
|
||||
<div data-role="comment-input-wrapper" class="d-none">
|
||||
<div data-role="comment-input"></div>
|
||||
<button type="submit" data-kcact="regis" data-type="comment" data-parent="{$comment_parent}" data-effect="animated fadeIn">
|
||||
등록
|
||||
</button>
|
||||
</div>
|
||||
13
modules/comment/themes/_mobile/rc-default/html/my_menu.html
Normal file
13
modules/comment/themes/_mobile/rc-default/html/my_menu.html
Normal file
@@ -0,0 +1,13 @@
|
||||
<a type="button" role="button" class="btn btn-link muted-link"
|
||||
data-toggle="popup" href="#popup-comment-mypost"
|
||||
data-type="{$entry_type}"
|
||||
data-uid="{$uid}"
|
||||
data-notice="{$uid}"
|
||||
data-parent="{$entry_parent}" tabindex="-1">
|
||||
<i class="material-icons f16">more_vert</i>
|
||||
</a>
|
||||
<div class="d-none" data-role="menu-container-{$entry_type}">
|
||||
<a href="#" data-toggle="edit" data-type="{$entry_type}" data-uid="{$uid}">수정</a>
|
||||
<a href="#" data-kcact="delete" data-type="{$entry_type}" data-uid="{$uid}" data-parent="{$entry_parent}">삭제</a>
|
||||
<a href="#" data-kcact="notice" data-type="{$entry_type}" data-uid="{$uid}" data-parent="{$entry_parent}">고정</a>
|
||||
</div>
|
||||
@@ -0,0 +1,5 @@
|
||||
<a href="#sheet-comment-online" class="btn btn-link mt-3" style="margin-left: -0.6rem"
|
||||
data-toggle="sheet"
|
||||
data-uid="{$comment_uid}">
|
||||
답글 <span data-role="oneline_num">{$oneline_num}<span>개 보기
|
||||
</a>
|
||||
@@ -0,0 +1,31 @@
|
||||
<div class="media mb-2" data-role="oneline-item" data-uid="{$oneline_uid}" data-type="oneline" data-hidden="{$oneline_getHidden}">
|
||||
<img class="mr-3 border rounded-circle" src="{$oneline_user_pic}" alt="아바타" style="width:1.5rem;height:1.5rem">
|
||||
<div class="media-body">
|
||||
<div id="OLN-{$oneline_uid}"></div>
|
||||
<!-- <a data-kcact="like" data-type="oneline" data-entry="{$oneline_uid}">좋아요(<span data-role="oneline-likeTotal-{$oneline_uid}">{$oneline_like_total}</span>)</a> -->
|
||||
|
||||
<div class="media-heading h6 d-flex align-items-center">
|
||||
<span data-role="oneline-hidden" class="badge badge-default badge-inverted"><i class="fa fa-lock" aria-hidden="true"></i></span>
|
||||
<span class="badge badge-default badge-inverted">{$oneline_user_name}</span>
|
||||
<time class="pl-1 badge badge-default badge-inverted" data-role="oneline-time-wrapper-{$oneline_uid}" datetime="{$oneline_regis_ago}" data-plugin="timeago">
|
||||
{$oneline_regis_time}
|
||||
</time>
|
||||
<small class="ml-1 {$oneline_getNew}"></small><!-- 24시간이내 new 출력 -->
|
||||
</div>
|
||||
|
||||
<div class="d-flex justify-content-between">
|
||||
|
||||
<article data-role="oneline-origin-content-{$oneline_uid}">{$oneline_content}</article>
|
||||
<article style="display:none" data-role="oneline-content-editable-{$oneline_uid}">{$oneline_content}</article>
|
||||
|
||||
<div class="ml-auto">
|
||||
{$btn_showHideMenu} <!-- 메뉴 출력/숨기 버튼 btn_showHideMenu.html : 권한이 있는 경우(로그인,작성자,관리자) 에만 노출됨 -->
|
||||
{$my_menu} <!-- 수정 모드시 취소/완료 버튼 btn_ediMod.html : 수정권한이 있는 경우에만 노출됨 -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="">
|
||||
{$btn_editMod}
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,21 @@
|
||||
<div class="media mb-2" data-role="oneline-item" data-uid="{$oneline_uid}" data-type="oneline" data-hidden="{$oneline_getHidden}">
|
||||
<img class="mr-3 border rounded-circle" src="{$oneline_user_pic}" alt="아바타" style="width:1.5rem;height:1.5rem">
|
||||
<div class="media-body">
|
||||
<div id="OLN-{$oneline_uid}"></div>
|
||||
<!-- <a data-kcact="like" data-type="oneline" data-entry="{$oneline_uid}">좋아요(<span data-role="oneline-likeTotal-{$oneline_uid}">{$oneline_like_total}</span>)</a> -->
|
||||
|
||||
<div class="media-heading h6 d-flex align-items-center">
|
||||
<span class="badge badge-default badge-inverted">{$oneline_user_name}</span>
|
||||
<time class="pl-1 badge badge-default badge-inverted" data-role="oneline-time-wrapper-{$oneline_uid}" datetime="{$oneline_regis_ago}" data-plugin="timeago">
|
||||
{$oneline_regis_time}
|
||||
</time>
|
||||
<small class="ml-1 {$oneline_getNew}"></small><!-- 24시간이내 new 출력 -->
|
||||
</div>
|
||||
|
||||
<div class="mr-1">
|
||||
<article data-role="oneline-content-editable-{$oneline_uid}">
|
||||
<div class="text-xs-center text-muted bg-faded p-3 my-2 mr-2 small"><i class="fa fa-lock fa-fw" aria-hidden="true"></i> 비밀글</div>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user