fix design details in comments sidebar
This commit is contained in:
parent
ce0604bd06
commit
efd1cf57da
|
@ -8,13 +8,35 @@
|
|||
*
|
||||
*/
|
||||
|
||||
#commentsTabView .emptycontent {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
#commentsTabView .newCommentForm {
|
||||
position: relative;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
#commentsTabView .newCommentForm .message {
|
||||
width: 90%;
|
||||
resize: vertical;
|
||||
width: 76%;
|
||||
margin-left: 32px;
|
||||
padding-right: 30px;
|
||||
}
|
||||
|
||||
#commentsTabView .newCommentForm .submit {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 30px;
|
||||
margin: 0;
|
||||
padding: 9px;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
opacity: .3;
|
||||
}
|
||||
#commentsTabView .newCommentForm .submit:hover,
|
||||
#commentsTabView .newCommentForm .submit:focus {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#commentsTabView .newCommentForm .submitLoading {
|
||||
|
@ -22,23 +44,20 @@
|
|||
}
|
||||
|
||||
#commentsTabView .comment {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
#commentsTabView .comment .avatar {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
line-height: 28px;
|
||||
}
|
||||
|
||||
#commentsTabView .comment {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
}
|
||||
|
||||
#commentsTabView .comment.collapsed .message {
|
||||
white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
|
||||
white-space: -webkit-pre-wrap; /*Chrome & Safari */
|
||||
white-space: -webkit-pre-wrap; /*Chrome & Safari */
|
||||
white-space: -pre-wrap; /* Opera 4-6 */
|
||||
white-space: -o-pre-wrap; /* Opera 7 */
|
||||
white-space: pre-wrap; /* css-3 */
|
||||
|
@ -80,17 +99,24 @@
|
|||
}
|
||||
|
||||
#commentsTabView .comment .authorRow {
|
||||
margin-bottom: 5px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#commentsTabView .comment .author {
|
||||
font-weight: bold;
|
||||
#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 .message {
|
||||
padding-left: 40px;
|
||||
}
|
||||
|
||||
#commentsTabView .comment .action {
|
||||
|
|
|
@ -14,7 +14,8 @@
|
|||
var TEMPLATE =
|
||||
'<ul class="comments">' +
|
||||
'</ul>' +
|
||||
'<div class="empty hidden">{{emptyResultLabel}}</div>' +
|
||||
'<div class="emptycontent hidden"><div class="icon-comment"></div>' +
|
||||
'<p>{{emptyResultLabel}}</p></div>' +
|
||||
'<input type="button" class="showMore hidden" value="{{moreLabel}}"' +
|
||||
' name="show-more" id="show-more" />' +
|
||||
'<div class="loading hidden" style="height: 50px"></div>';
|
||||
|
@ -31,8 +32,8 @@
|
|||
'{{/if}}' +
|
||||
' </div>' +
|
||||
' <form class="newCommentForm">' +
|
||||
' <textarea class="message" placeholder="{{newMessagePlaceholder}}">{{{message}}}</textarea>' +
|
||||
' <input class="submit" type="submit" value="{{submitText}}" />' +
|
||||
' <input type="text" class="message" placeholder="{{newMessagePlaceholder}}" value="{{{message}}}"" />' +
|
||||
' <input class="submit icon-confirm" type="submit" value="" />' +
|
||||
'{{#if isEditMode}}' +
|
||||
' <input class="cancel" type="button" value="{{cancelText}}" />' +
|
||||
'{{/if}}' +
|
||||
|
@ -113,7 +114,7 @@
|
|||
avatarEnabled: this._avatarsEnabled,
|
||||
actorId: currentUser.uid,
|
||||
actorDisplayName: currentUser.displayName,
|
||||
newMessagePlaceholder: t('comments', 'Type in a new comment...'),
|
||||
newMessagePlaceholder: t('comments', 'New comment …'),
|
||||
deleteTooltip: t('comments', 'Delete comment'),
|
||||
submitText: t('comments', 'Post'),
|
||||
cancelText: t('comments', 'Cancel')
|
||||
|
@ -162,17 +163,17 @@
|
|||
|
||||
render: function() {
|
||||
this.$el.html(this.template({
|
||||
emptyResultLabel: t('comments', 'No other comments available'),
|
||||
moreLabel: t('comments', 'More comments...')
|
||||
emptyResultLabel: t('comments', 'No comments yet, start the conversation!'),
|
||||
moreLabel: t('comments', 'More comments …')
|
||||
}));
|
||||
this.$el.find('.comments').before(this.editCommentTemplate({}));
|
||||
this.$el.find('.has-tooltip').tooltip();
|
||||
this.$container = this.$el.find('ul.comments');
|
||||
if (this._avatarsEnabled) {
|
||||
this.$el.find('.avatar').avatar(OC.getCurrentUser().uid, 28);
|
||||
this.$el.find('.avatar').avatar(OC.getCurrentUser().uid, 32);
|
||||
}
|
||||
this.delegateEvents();
|
||||
this.$el.find('textarea').on('keydown input change', this._onTypeComment);
|
||||
this.$el.find('.message').on('keydown input change', this._onTypeComment);
|
||||
},
|
||||
|
||||
_formatItem: function(commentModel) {
|
||||
|
@ -200,7 +201,7 @@
|
|||
_onEndRequest: function(type) {
|
||||
var fileInfoModel = this.model;
|
||||
this._toggleLoading(false);
|
||||
this.$el.find('.empty').toggleClass('hidden', !!this.collection.length);
|
||||
this.$el.find('.emptycontent').toggleClass('hidden', !!this.collection.length);
|
||||
this.$el.find('.showMore').toggleClass('hidden', !this.collection.hasMoreResults());
|
||||
|
||||
if (type !== 'REPORT') {
|
||||
|
@ -238,7 +239,7 @@
|
|||
if(this._avatarsEnabled) {
|
||||
$el.find('.avatar').each(function() {
|
||||
var $this = $(this);
|
||||
$this.avatar($this.attr('data-username'), 28);
|
||||
$this.avatar($this.attr('data-username'), 32);
|
||||
});
|
||||
}
|
||||
},
|
||||
|
@ -360,7 +361,7 @@
|
|||
var currentUser = OC.getCurrentUser();
|
||||
var $submit = $form.find('.submit');
|
||||
var $loading = $form.find('.submitLoading');
|
||||
var $textArea = $form.find('textarea');
|
||||
var $textArea = $form.find('.message');
|
||||
var message = $textArea.val().trim();
|
||||
e.preventDefault();
|
||||
|
||||
|
@ -437,4 +438,3 @@
|
|||
|
||||
OCA.Comments.CommentsTabView = CommentsTabView;
|
||||
})(OC, OCA);
|
||||
|
||||
|
|
Loading…
Reference in New Issue