mirror of
https://github.com/nextcloud/server.git
synced 2026-02-28 12:30:40 -05:00
5e6d4ad27c
When a comment is being deleted the "disabled" class is added to the comment div, which causes it to look disabled. However, the input elements and the content editable div were not truly disabled, and thus it was still possible to interact with them. This commit ensures that they are properly disabled while the comment is being deleted. Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
187 lines
3.8 KiB
CSS
187 lines
3.8 KiB
CSS
/*
|
|
* Copyright (c) 2016
|
|
*
|
|
* This file is licensed under the Affero General Public License version 3
|
|
* or later.
|
|
*
|
|
* See the COPYING-README file.
|
|
*
|
|
*/
|
|
|
|
#commentsTabView .emptycontent {
|
|
margin-top: 0;
|
|
}
|
|
|
|
#commentsTabView .newCommentForm {
|
|
position: relative;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
#commentsTabView .newCommentForm .message {
|
|
width: calc(100% - 81px); /* 36 (left margin) + 30 (right padding) + 15 (right padding of surrounding box) */
|
|
margin-left: 36px;
|
|
padding-right: 30px;
|
|
display: block;
|
|
}
|
|
|
|
#commentsTabView .newCommentForm .submit {
|
|
position: absolute;
|
|
bottom: 0px;
|
|
right: 8px;
|
|
width: 30px;
|
|
margin: 0;
|
|
padding: 7px 9px;
|
|
background-color: transparent;
|
|
border: none;
|
|
opacity: .3;
|
|
}
|
|
#commentsTabView .newCommentForm .submit:not(:disabled):hover,
|
|
#commentsTabView .newCommentForm .submit:not(:disabled):focus {
|
|
opacity: 1;
|
|
}
|
|
|
|
#commentsTabView .newCommentForm .submitLoading {
|
|
background-position: left;
|
|
}
|
|
|
|
#commentsTabView .newCommentForm .cancel {
|
|
margin-right: 6px;
|
|
}
|
|
|
|
#commentsTabView .newCommentForm div.message {
|
|
resize: none;
|
|
}
|
|
|
|
#commentsTabView .newCommentForm div.message:empty:before {
|
|
content: attr(data-placeholder);
|
|
color: grey;
|
|
}
|
|
|
|
#commentsTabView .comment {
|
|
position: relative;
|
|
margin-bottom: 30px;
|
|
word-wrap: break-word;
|
|
overflow-wrap: break-word;
|
|
}
|
|
|
|
#commentsTabView .comment .avatar,
|
|
.atwho-view-ul * .avatar{
|
|
width: 32px;
|
|
height: 32px;
|
|
line-height: 32px;
|
|
}
|
|
|
|
#commentsTabView .comment .message .avatar,
|
|
.atwho-view-ul * .avatar
|
|
{
|
|
display: inline-block;
|
|
}
|
|
|
|
#activityTabView li.comment.collapsed .activitymessage,
|
|
#commentsTabView .comment.collapsed .message {
|
|
white-space: pre-wrap;
|
|
}
|
|
|
|
#activityTabView li.comment.collapsed .activitymessage,
|
|
#commentsTabView .comment.collapsed .message {
|
|
max-height: 70px;
|
|
overflow: hidden;
|
|
}
|
|
|
|
#activityTabView li.comment .message-overlay,
|
|
#commentsTabView .comment .message-overlay {
|
|
display: none;
|
|
}
|
|
|
|
#activityTabView li.comment.collapsed .message-overlay,
|
|
#commentsTabView .comment.collapsed .message-overlay {
|
|
display: block;
|
|
position: absolute;
|
|
z-index: 2;
|
|
height: 50px;
|
|
pointer-events: none;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background: -moz-linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1));
|
|
background: -webkit-linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1));
|
|
background: -o-linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1));
|
|
background: -ms-linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1));
|
|
background: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1));
|
|
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#00FFFFFF', endColorstr='#FFFFFFFF');
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
#commentsTabView .authorRow>div {
|
|
display: inline-block;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
#commentsTabView .authorRow>div.hidden {
|
|
display: none !important;
|
|
}
|
|
|
|
#commentsTabView .comments li .message .avatar-name-wrapper,
|
|
.atwho-view-ul * .avatar-name-wrapper,
|
|
#commentsTabView .comment .authorRow {
|
|
position: relative;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.atwho-view-ul * .avatar-name-wrapper {
|
|
white-space: nowrap;
|
|
}
|
|
|
|
#commentsTabView .comment .author,
|
|
#commentsTabView .comment .date {
|
|
opacity: .5;
|
|
}
|
|
#commentsTabView .comment .author {
|
|
margin-left: 5px;
|
|
}
|
|
#commentsTabView .comment .date {
|
|
position: absolute;
|
|
right: 0;
|
|
top: 5px;
|
|
}
|
|
|
|
#commentsTabView .comments li .message {
|
|
padding-left: 40px;
|
|
}
|
|
|
|
#commentsTabView .comment .action {
|
|
opacity: 0;
|
|
vertical-align: middle;
|
|
display: inline-block;
|
|
}
|
|
|
|
#commentsTabView .comment:hover .action {
|
|
opacity: 0.3;
|
|
}
|
|
|
|
#commentsTabView .comment .action:hover {
|
|
opacity: 1;
|
|
}
|
|
|
|
#commentsTabView .comment .action.delete {
|
|
position: absolute;
|
|
right: 0;
|
|
}
|
|
|
|
#commentsTabView .comment.disabled {
|
|
opacity: 0.3;
|
|
}
|
|
|
|
#commentsTabView .comment.disabled .action {
|
|
visibility: hidden;
|
|
}
|
|
|
|
#commentsTabView .message.error {
|
|
color: #e9322d;
|
|
border-color: #e9322d;
|
|
box-shadow: 0 0 6px #f8b9b7;
|
|
}
|
|
|
|
.app-files .action-comment {
|
|
padding: 16px 14px;
|
|
}
|