From 9cc5e9ea4d7f4efd3da66b5769269e0adbbf76aa Mon Sep 17 00:00:00 2001 From: Julia Svinareva Date: Thu, 5 Mar 2020 14:20:04 +0300 Subject: [PATCH 01/23] [de mobile] add comment, view comment --- .../mobile/lib/controller/Collaboration.js | 178 +++++++++++++++++- .../lib/template/Collaboration.template | 16 ++ apps/common/mobile/lib/view/Collaboration.js | 15 ++ .../resources/less/ios/_collaboration.less | 56 +++++- .../mobile/app/controller/DocumentHolder.js | 36 +++- .../mobile/resources/css/app-ios.css | 78 +++++++- .../mobile/resources/css/app-ios.css | 78 +++++++- .../mobile/resources/css/app-ios.css | 78 +++++++- 8 files changed, 505 insertions(+), 30 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index 4c80eff99..8b4c8bf87 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -679,6 +679,179 @@ define([ //Comments + showCommentModal: function() { + var me = this, + isAndroid = Framework7.prototype.device.android === true, + modalView, + appPrefix = !!window.DE ? DE : !!window.PE ? PE : SSE, + mainView = appPrefix.getController('Editor').getView('Editor').f7View; + + uiApp.closeModal(); + + if (Common.SharedSettings.get('phone')) { + modalView = $$(uiApp.pickerModal( + '
' + + this.getView('Common.Views.Collaboration').rootCommentLayout() + + '
' + )).on('opened', function () { + if (_.isFunction(me.api.asc_OnShowContextMenu)) { + me.api.asc_OnShowContextMenu() + } + }).on('close', function (e) { + mainView.showNavbar(); + }).on('closed', function () { + if (_.isFunction(me.api.asc_OnHideContextMenu)) { + me.api.asc_OnHideContextMenu() + } + }); + mainView.hideNavbar(); + } else { + } + + appPrefix.getController('Toolbar').getView('Toolbar').hideSearch(); + + //swipe modal window + me.swipeFull = false; + var $swipeContainer = $('.swipe-container'); + $swipeContainer.single('touchstart', _.bind(function(e){ + var touchobj = e.changedTouches[0]; + me.swipeStart = parseInt(touchobj.clientY); + e.preventDefault(); + }, me)); + $swipeContainer.single('touchend', _.bind(function (e) { + var touchobj = e.changedTouches[0]; + var swipeEnd = parseInt(touchobj.clientY); + var dist = swipeEnd - me.swipeStart; + if (dist > 20) { + if (me.swipeFull) { + $('.container-view-comment').css('height', '50%'); + me.swipeFull = false; + } else { + uiApp.closeModal(); + } + } else if (dist < 0) { + $('.container-view-comment').css('height', '100%'); + me.swipeFull = true; + } else { + $('.container-view-comment').css('height', '50%'); + } + }, me)); + }, + + showAddCommentModal: function() { + var me = this, + isAndroid = Framework7.prototype.device.android === true, + modalView, + appPrefix = !!window.DE ? DE : !!window.PE ? PE : SSE, + mainView = appPrefix.getController('Editor').getView('Editor').f7View; + + uiApp.closeModal(); + + var date = new Date(); + _.each(editUsers, function(item){ + if (item.asc_getIdOriginal() === _userId) { + me.currentUser = item; + } + }); + if (!me.currentUser) return; + var comment = { + time: date.getTime(), + date: me.dateToLocaleTimeString(date), + userid: _userId, + username: me.currentUser.asc_getUserName(), + usercolor: me.currentUser.asc_getColor() + }; + + if (Common.SharedSettings.get('phone')) { + modalView = $$(uiApp.pickerModal( + '
' + + '
' + + '
' + + '
' + (!isAndroid ? '' + me.textCancel + '' : '') + '
' + + '
' + me.textAddComment + '
' + + '
' + (!isAndroid ? '' + me.textDone + '' : '') + '
' + + '
' + + '
' + + '
' + + '
' + + '
' + + '
' + + '
' + comment.username + '
' + + '
' + comment.date + '
' + + '
' + + '
' + + '
' + + '
' + + '
' + + '
' + )).on('opened', function () { + if (_.isFunction(me.api.asc_OnShowContextMenu)) { + me.api.asc_OnShowContextMenu() + } + }).on('close', function (e) { + mainView.showNavbar(); + }).on('closed', function () { + if (_.isFunction(me.api.asc_OnHideContextMenu)) { + me.api.asc_OnHideContextMenu() + } + }); + mainView.hideNavbar(); + } else { + } + + _.delay(function(){ + $('#comment-text').focus(); + },200); + + appPrefix.getController('Toolbar').getView('Toolbar').hideSearch(); + + $('#add-comment').single('click', _.bind(me.onAddNewComment, me)); + }, + + onAddNewComment: function() { + var comment; + if (typeof Asc.asc_CCommentDataWord !== 'undefined') { + comment = new Asc.asc_CCommentDataWord(null); + } else { + comment = new Asc.asc_CCommentData(null); + } + + var textComment = $('#comment-text').val(); + + if (textComment.length > 0) { + comment.asc_putText(textComment); + comment.asc_putTime(this.utcDateToString(new Date())); + comment.asc_putOnlyOfficeTime(this.ooDateToString(new Date())); + comment.asc_putUserId(this.currentUser.asc_getIdOriginal()); + comment.asc_putUserName(this.currentUser.asc_getUserName()); + comment.asc_putSolved(false); + + if (!_.isUndefined(comment.asc_putDocumentFlag)) + comment.asc_putDocumentFlag(false); + + this.api.asc_addComment(comment); + + uiApp.closeModal(); + } + }, + + // utils + timeZoneOffsetInMs: (new Date()).getTimezoneOffset() * 60000, + utcDateToString: function (date) { + if (Object.prototype.toString.call(date) === '[object Date]') + return (date.getTime() - this.timeZoneOffsetInMs).toString(); + + return ''; + }, + ooDateToString: function (date) { + if (Object.prototype.toString.call(date) === '[object Date]') + return (date.getTime()).toString(); + + return ''; + }, + //end utils + + groupCollectionComments: [], collectionComments: [], groupCollectionFilter: [], @@ -953,7 +1126,10 @@ define([ textParaMoveTo: 'Moved:', textParaMoveFromUp: 'Moved Up:', textParaMoveFromDown: 'Moved Down:', - textEditUser: 'Document is currently being edited by several users.' + textEditUser: 'Document is currently being edited by several users.', + textAddComment: "Add Comment", + textCancel: "Cancel", + textDone: "Done" } })(), Common.Controllers.Collaboration || {})) diff --git a/apps/common/mobile/lib/template/Collaboration.template b/apps/common/mobile/lib/template/Collaboration.template index ec41861a4..fb6016c6f 100644 --- a/apps/common/mobile/lib/template/Collaboration.template +++ b/apps/common/mobile/lib/template/Collaboration.template @@ -236,4 +236,20 @@ + + +
+
+
+
+
+
+ Link 1 + Link 2 + Link 3 +
+
+
+ +
\ No newline at end of file diff --git a/apps/common/mobile/lib/view/Collaboration.js b/apps/common/mobile/lib/view/Collaboration.js index a9d54cd89..cbc70e452 100644 --- a/apps/common/mobile/lib/view/Collaboration.js +++ b/apps/common/mobile/lib/view/Collaboration.js @@ -123,6 +123,17 @@ define([ return ''; }, + rootCommentLayout: function() { + if (this.layout) { + var $layour = this.layout.find('#comment-view'), + isPhone = Common.SharedSettings.get('phone'); + + return $layour.html(); + } + + return ''; + }, + showPage: function(templateId, animate) { var me = this; var prefix = !!window.DE ? DE : !!window.PE ? PE : SSE; @@ -146,6 +157,10 @@ define([ } }, + renderViewComments: function(comments) { + + }, + renderComments: function (comments) { var $pageComments = $('.page-comments .page-content'); if (!comments) { diff --git a/apps/common/mobile/resources/less/ios/_collaboration.less b/apps/common/mobile/resources/less/ios/_collaboration.less index 37361bc8e..7c5468464 100644 --- a/apps/common/mobile/resources/less/ios/_collaboration.less +++ b/apps/common/mobile/resources/less/ios/_collaboration.less @@ -92,7 +92,7 @@ } //Comments -.page-comments { +.page-comments, .page-add-comment { .list-block .item-inner { display: block; padding: 16px 0; @@ -151,7 +151,61 @@ margin: 5px 0; font-size: 15px; } + + //add comment + .wrap-comment { + padding: 16px 16px 0 16px; + } + .comment-textarea { + margin-top: 10px; + background:transparent; + border:none; + outline:none; + width: 100%; + min-height: 200px; + } } .settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after { display: none; +} + +//view comment +.container-view-comment { + -webkit-transition: height 100ms; + transition: height 100ms; + background-color: #FFFFFF; + border-top-left-radius: 4px; + border-top-right-radius: 4px; + height: 50%; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); + .toolbar { + position: absolute; + } + .swipe-container { + display: flex; + justify-content: center; + height: 40px; + .icon-swipe { + margin-top: 8px; + width: 40px; + height: 4px; + background: rgba(0, 0, 0, 0.12); + border-radius: 2px; + } + } + .page-content { + padding: 0 16px 80px; + } +} + +.container-view-add-comment { + height: 100%; + .navbar { + a.link i + span { + margin-left: 0; + } + } + .page-add-comment { + background-color: #FFFFFF; + } } \ No newline at end of file diff --git a/apps/documenteditor/mobile/app/controller/DocumentHolder.js b/apps/documenteditor/mobile/app/controller/DocumentHolder.js index 7ceeca7d4..387396a65 100644 --- a/apps/documenteditor/mobile/app/controller/DocumentHolder.js +++ b/apps/documenteditor/mobile/app/controller/DocumentHolder.js @@ -60,6 +60,7 @@ define([ _isEdit = false, _canReview = false, _inRevisionChange = false, + _isComments = false, _menuPos = [], _timer = 0; @@ -95,6 +96,8 @@ define([ Common.NotificationCenter.on('api:disconnect', _.bind(me.onCoAuthoringDisconnect, me)); me.api.asc_registerCallback('asc_onCoAuthoringDisconnect', _.bind(me.onCoAuthoringDisconnect,me)); me.api.asc_registerCallback('asc_onShowRevisionsChange', _.bind(me.onApiShowChange, me)); + me.api.asc_registerCallback('asc_onShowComment', _.bind(me.onApiShowComment, me)); + me.api.asc_registerCallback('asc_onHideComment', _.bind(me.onApiHideComment, me)); me.api.asc_coAuthoringGetUsers(); }, @@ -157,6 +160,15 @@ define([ getCollaboration.showModal(); getCollaboration.getView('Common.Views.Collaboration').showPage('#reviewing-settings-view', false); getCollaboration.getView('Common.Views.Collaboration').showPage('#change-view', false); + } else if ('viewcomment' == eventName) { + var getCollaboration = DE.getController('Common.Controllers.Collaboration'); + getCollaboration.showCommentModal(); + } else if ('addcomment' == eventName) { + var getCollaboration = DE.getController('Common.Controllers.Collaboration'); + /*if (this.api && this.mode.canCoAuthoring && this.mode.canComments) { + + }*/ + getCollaboration.showAddCommentModal(); } else if ('showActionSheet' == eventName && _actionSheets.length > 0) { _.delay(function () { _.each(_actionSheets, function (action) { @@ -365,6 +377,14 @@ define([ _inRevisionChange = sdkchange && sdkchange.length>0; }, + onApiShowComment: function(comments) { + _isComments = comments && comments.length>0; + }, + + onApiHideComment: function() { + _isComments = false; + }, + // Internal _openLink: function(url) { @@ -513,6 +533,18 @@ define([ }); } } + + if (1/*_isComments*/) { + arrItems.push({ + caption: me.menuViewComment, + event: 'viewcomment' + }); + } + + arrItems.push({ + caption: me.menuAddComment, + event: 'addcomment' + }); } } @@ -559,7 +591,9 @@ define([ menuMerge: 'Merge Cells', menuSplit: 'Split Cell', menuDeleteTable: 'Delete Table', - menuReviewChange: 'Review Change' + menuReviewChange: 'Review Change', + menuViewComment: 'View Comment', + menuAddComment: 'Add Comment' } })(), DE.Controllers.DocumentHolder || {})) }); \ No newline at end of file diff --git a/apps/documenteditor/mobile/resources/css/app-ios.css b/apps/documenteditor/mobile/resources/css/app-ios.css index 974bae797..bd1719bc0 100644 --- a/apps/documenteditor/mobile/resources/css/app-ios.css +++ b/apps/documenteditor/mobile/resources/css/app-ios.css @@ -6479,15 +6479,18 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after #user-list ul:before { content: none; } -.page-comments .list-block .item-inner { +.page-comments .list-block .item-inner, +.page-add-comment .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; } -.page-comments p { +.page-comments p, +.page-add-comment p { margin: 0; } -.page-comments .user-name { +.page-comments .user-name, +.page-add-comment .user-name { font-size: 17px; line-height: 22px; color: #000000; @@ -6495,7 +6498,9 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after font-weight: bold; } .page-comments .comment-date, -.page-comments .reply-date { +.page-add-comment .comment-date, +.page-comments .reply-date, +.page-add-comment .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6503,7 +6508,9 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after margin-top: 0px; } .page-comments .comment-text, -.page-comments .reply-text { +.page-add-comment .comment-text, +.page-comments .reply-text, +.page-add-comment .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6511,13 +6518,16 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after max-width: 100%; padding-right: 15px; } -.page-comments .reply-item { +.page-comments .reply-item, +.page-add-comment .reply-item { margin-top: 15px; } -.page-comments .reply-item .user-name { +.page-comments .reply-item .user-name, +.page-add-comment .reply-item .user-name { padding-top: 16px; } -.page-comments .reply-item:before { +.page-comments .reply-item:before, +.page-add-comment .reply-item:before { content: ''; position: absolute; left: auto; @@ -6532,17 +6542,67 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%; } -.page-comments .comment-quote { +.page-comments .comment-quote, +.page-add-comment .comment-quote { color: #446995; border-left: 1px solid #446995; padding-left: 10px; margin: 5px 0; font-size: 15px; } +.page-comments .wrap-comment, +.page-add-comment .wrap-comment { + padding: 16px 16px 0 16px; +} +.page-comments .comment-textarea, +.page-add-comment .comment-textarea { + margin-top: 10px; + background: transparent; + border: none; + outline: none; + width: 100%; + min-height: 200px; +} .settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after { display: none; } +.container-view-comment { + -webkit-transition: height 100ms; + transition: height 100ms; + background-color: #FFFFFF; + border-top-left-radius: 4px; + border-top-right-radius: 4px; + height: 50%; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); +} +.container-view-comment .toolbar { + position: absolute; +} +.container-view-comment .swipe-container { + display: flex; + justify-content: center; + height: 40px; +} +.container-view-comment .swipe-container .icon-swipe { + margin-top: 8px; + width: 40px; + height: 4px; + background: rgba(0, 0, 0, 0.12); + border-radius: 2px; +} +.container-view-comment .page-content { + padding: 0 16px 80px; +} +.container-view-add-comment { + height: 100%; +} +.container-view-add-comment .navbar a.link i + span { + margin-left: 0; +} +.container-view-add-comment .page-add-comment { + background-color: #FFFFFF; +} .tablet .searchbar.document.replace .center .searchbar:first-child { margin-right: 10px; } diff --git a/apps/presentationeditor/mobile/resources/css/app-ios.css b/apps/presentationeditor/mobile/resources/css/app-ios.css index 856611ab1..fa01a7fef 100644 --- a/apps/presentationeditor/mobile/resources/css/app-ios.css +++ b/apps/presentationeditor/mobile/resources/css/app-ios.css @@ -6479,15 +6479,18 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after #user-list ul:before { content: none; } -.page-comments .list-block .item-inner { +.page-comments .list-block .item-inner, +.page-add-comment .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; } -.page-comments p { +.page-comments p, +.page-add-comment p { margin: 0; } -.page-comments .user-name { +.page-comments .user-name, +.page-add-comment .user-name { font-size: 17px; line-height: 22px; color: #000000; @@ -6495,7 +6498,9 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after font-weight: bold; } .page-comments .comment-date, -.page-comments .reply-date { +.page-add-comment .comment-date, +.page-comments .reply-date, +.page-add-comment .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6503,7 +6508,9 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after margin-top: 0px; } .page-comments .comment-text, -.page-comments .reply-text { +.page-add-comment .comment-text, +.page-comments .reply-text, +.page-add-comment .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6511,13 +6518,16 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after max-width: 100%; padding-right: 15px; } -.page-comments .reply-item { +.page-comments .reply-item, +.page-add-comment .reply-item { margin-top: 15px; } -.page-comments .reply-item .user-name { +.page-comments .reply-item .user-name, +.page-add-comment .reply-item .user-name { padding-top: 16px; } -.page-comments .reply-item:before { +.page-comments .reply-item:before, +.page-add-comment .reply-item:before { content: ''; position: absolute; left: auto; @@ -6532,17 +6542,67 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%; } -.page-comments .comment-quote { +.page-comments .comment-quote, +.page-add-comment .comment-quote { color: #aa5252; border-left: 1px solid #aa5252; padding-left: 10px; margin: 5px 0; font-size: 15px; } +.page-comments .wrap-comment, +.page-add-comment .wrap-comment { + padding: 16px 16px 0 16px; +} +.page-comments .comment-textarea, +.page-add-comment .comment-textarea { + margin-top: 10px; + background: transparent; + border: none; + outline: none; + width: 100%; + min-height: 200px; +} .settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after { display: none; } +.container-view-comment { + -webkit-transition: height 100ms; + transition: height 100ms; + background-color: #FFFFFF; + border-top-left-radius: 4px; + border-top-right-radius: 4px; + height: 50%; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); +} +.container-view-comment .toolbar { + position: absolute; +} +.container-view-comment .swipe-container { + display: flex; + justify-content: center; + height: 40px; +} +.container-view-comment .swipe-container .icon-swipe { + margin-top: 8px; + width: 40px; + height: 4px; + background: rgba(0, 0, 0, 0.12); + border-radius: 2px; +} +.container-view-comment .page-content { + padding: 0 16px 80px; +} +.container-view-add-comment { + height: 100%; +} +.container-view-add-comment .navbar a.link i + span { + margin-left: 0; +} +.container-view-add-comment .page-add-comment { + background-color: #FFFFFF; +} .tablet .searchbar.document.replace .center .searchbar:first-child { margin-right: 10px; } diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css index 1c04dcd53..96e6cb262 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css @@ -6479,15 +6479,18 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after #user-list ul:before { content: none; } -.page-comments .list-block .item-inner { +.page-comments .list-block .item-inner, +.page-add-comment .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; } -.page-comments p { +.page-comments p, +.page-add-comment p { margin: 0; } -.page-comments .user-name { +.page-comments .user-name, +.page-add-comment .user-name { font-size: 17px; line-height: 22px; color: #000000; @@ -6495,7 +6498,9 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after font-weight: bold; } .page-comments .comment-date, -.page-comments .reply-date { +.page-add-comment .comment-date, +.page-comments .reply-date, +.page-add-comment .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6503,7 +6508,9 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after margin-top: 0px; } .page-comments .comment-text, -.page-comments .reply-text { +.page-add-comment .comment-text, +.page-comments .reply-text, +.page-add-comment .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6511,13 +6518,16 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after max-width: 100%; padding-right: 15px; } -.page-comments .reply-item { +.page-comments .reply-item, +.page-add-comment .reply-item { margin-top: 15px; } -.page-comments .reply-item .user-name { +.page-comments .reply-item .user-name, +.page-add-comment .reply-item .user-name { padding-top: 16px; } -.page-comments .reply-item:before { +.page-comments .reply-item:before, +.page-add-comment .reply-item:before { content: ''; position: absolute; left: auto; @@ -6532,17 +6542,67 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%; } -.page-comments .comment-quote { +.page-comments .comment-quote, +.page-add-comment .comment-quote { color: #40865c; border-left: 1px solid #40865c; padding-left: 10px; margin: 5px 0; font-size: 15px; } +.page-comments .wrap-comment, +.page-add-comment .wrap-comment { + padding: 16px 16px 0 16px; +} +.page-comments .comment-textarea, +.page-add-comment .comment-textarea { + margin-top: 10px; + background: transparent; + border: none; + outline: none; + width: 100%; + min-height: 200px; +} .settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after { display: none; } +.container-view-comment { + -webkit-transition: height 100ms; + transition: height 100ms; + background-color: #FFFFFF; + border-top-left-radius: 4px; + border-top-right-radius: 4px; + height: 50%; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); +} +.container-view-comment .toolbar { + position: absolute; +} +.container-view-comment .swipe-container { + display: flex; + justify-content: center; + height: 40px; +} +.container-view-comment .swipe-container .icon-swipe { + margin-top: 8px; + width: 40px; + height: 4px; + background: rgba(0, 0, 0, 0.12); + border-radius: 2px; +} +.container-view-comment .page-content { + padding: 0 16px 80px; +} +.container-view-add-comment { + height: 100%; +} +.container-view-add-comment .navbar a.link i + span { + margin-left: 0; +} +.container-view-add-comment .page-add-comment { + background-color: #FFFFFF; +} i.icon.icon-search { width: 24px; height: 24px; From 9670353c3b684c0bc7bef36dfd2bed839c923172 Mon Sep 17 00:00:00 2001 From: Julia Svinareva Date: Sun, 15 Mar 2020 18:59:42 +0300 Subject: [PATCH 02/23] [de mobile] edit comment, delete comment, prev comment, next comment, add reply, edit reply, delete reply, resolve comment (ios) --- .../mobile/lib/controller/Collaboration.js | 569 +++++++++++++++++- .../lib/template/Collaboration.template | 16 - apps/common/mobile/lib/view/Collaboration.js | 59 +- .../resources/less/ios/_collaboration.less | 104 +++- .../mobile/app/controller/DocumentHolder.js | 2 +- .../mobile/resources/css/app-ios.css | 178 +++++- .../mobile/resources/less/ios/_icons.less | 17 + .../mobile/resources/css/app-ios.css | 163 ++++- .../mobile/resources/css/app-ios.css | 163 ++++- 9 files changed, 1184 insertions(+), 87 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index 8b4c8bf87..efd3be179 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -91,6 +91,8 @@ define([ this.api.asc_registerCallback('asc_onAddComments', _.bind(this.onApiAddComments, this)); this.api.asc_registerCallback('asc_onChangeCommentData', _.bind(this.onApiChangeCommentData, this)); this.api.asc_registerCallback('asc_onRemoveComment', _.bind(this.onApiRemoveComment, this)); + this.api.asc_registerCallback('asc_onRemoveComments', _.bind(this.onApiRemoveComments, this)); + this.api.asc_registerCallback('asc_onShowComment', _.bind(this.apiShowComments, this)); if (editor === 'DE') { this.api.asc_registerCallback('asc_onShowRevisionsChange', _.bind(this.changeReview, this)); } @@ -679,19 +681,80 @@ define([ //Comments + findComment: function(uid) { + var comment; + if (this.groupCollectionFilter.length !== 0) { + comment = me.findCommentInGroup(uid); + } else if (this.collectionComments.length !== 0) { + comment = _.findWhere(this.collectionComments, {uid: uid}); + } + return comment; + }, + + apiShowComments: function(uid) { + var comments, + me = this; + me.showComments = []; + if (this.groupCollectionFilter.length !== 0) { + comments = this.groupCollectionFilter; + _.each(uid, function (id) { + var comment = me.findCommentInGroup(uid); + if (comment) { + me.showComments.push(comment); + } + }); + } else if (this.collectionComments.length !== 0) { + comments = this.collectionComments; + _.each(uid, function (id) { + var comment = _.findWhere(comments, {uid: id}); + if (comment) { + me.showComments.push(comment); + } + }); + } + }, + + updateViewComment: function() { + DE.getController('Common.Controllers.Collaboration').getView('Common.Views.Collaboration').renderViewComments(this.showComments, this.indexCurrentComment); + $('.comment-menu').single('click', _.bind(this.initMenuComments, this)); + $('.reply-menu').single('click', _.bind(this.initReplyMenu, this)); + $('.comment-resolve').single('click', _.bind(this.onClickResolveComment, this)); + }, + showCommentModal: function() { var me = this, isAndroid = Framework7.prototype.device.android === true, - modalView, appPrefix = !!window.DE ? DE : !!window.PE ? PE : SSE, - mainView = appPrefix.getController('Editor').getView('Editor').f7View; + mainView = appPrefix.getController('Editor').getView('Editor').f7View, + viewCollaboration = appPrefix.getController('Common.Controllers.Collaboration').getView('Common.Views.Collaboration'); + + me.indexCurrentComment = 0; uiApp.closeModal(); if (Common.SharedSettings.get('phone')) { - modalView = $$(uiApp.pickerModal( + me.modalViewComment = $$(uiApp.pickerModal( '
' + - this.getView('Common.Views.Collaboration').rootCommentLayout() + + '
' + + '
' + + '
' + + '
' + + '
' + + '
' + + '' + me.textAddReply + '' + + '
' + + '
' + + '' + + '' + + '
' + + '
' + + '
' + + '
' + + '
' + + '
' + + '
' + + '
' + + '
'+ '
' )).on('opened', function () { if (_.isFunction(me.api.asc_OnShowContextMenu)) { @@ -710,6 +773,8 @@ define([ appPrefix.getController('Toolbar').getView('Toolbar').hideSearch(); + viewCollaboration.renderViewComments(me.showComments, me.indexCurrentComment); + //swipe modal window me.swipeFull = false; var $swipeContainer = $('.swipe-container'); @@ -736,6 +801,135 @@ define([ $('.container-view-comment').css('height', '50%'); } }, me)); + + $('.prev-comment').single('click', _.bind(me.onViewPrevComment, me)); + $('.next-comment').single('click', _.bind(me.onViewNextComment, me)); + $('.comment-menu').single('click', _.bind(me.initMenuComments, me)); + $('.add-reply').single('click', _.bind(me.onClickAddReply, me)); + $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); + $('.comment-resolve').single('click', _.bind(me.onClickResolveComment, me)); + }, + + onViewPrevComment: function() { + if (this.indexCurrentComment - 1 >= 0 && this.showComments.length > 0) { + this.indexCurrentComment -= 1; + DE.getController('Common.Controllers.Collaboration').getView('Common.Views.Collaboration').renderViewComments(this.showComments, this.indexCurrentComment); + $('.comment-menu').single('click', _.bind(this.initMenuComments, this)); + $('.reply-menu').single('click', _.bind(this.initReplyMenu, this)); + $('.comment-resolve').single('click', _.bind(this.onClickResolveComment, this)); + } + }, + + onViewNextComment: function() { + if (this.indexCurrentComment + 1 < this.showComments.length) { + this.indexCurrentComment += 1; + DE.getController('Common.Controllers.Collaboration').getView('Common.Views.Collaboration').renderViewComments(this.showComments, this.indexCurrentComment); + $('.comment-menu').single('click', _.bind(this.initMenuComments, this)); + $('.reply-menu').single('click', _.bind(this.initReplyMenu, this)); + $('.comment-resolve').single('click', _.bind(this.onClickResolveComment, this)); + } + }, + + onClickAddReply: function() { + var me = this; + if (this.indexCurrentComment > -1 && this.indexCurrentComment < this.showComments.length) { + var addReplyView, + comment = this.showComments[this.indexCurrentComment]; + if (Common.SharedSettings.get('phone')) { + addReplyView = uiApp.popup( + '
' + + '
' + + '
' + + '
' + '' + me.textCancel + ''+ '
' + + '
' + me.textAddReply + '
' + + '
' + '' + me.textDone + '' + '
' + + '
' + + '
' + + '
' + + '
' + comment.username + '
' + + '
' + comment.date + '
' + + '
' + + '
' + + '
' + ); + $('.popup').css('z-index', '20000'); + _.delay(function () { + var $textarea = $('.reply-textarea')[0]; + $textarea.focus(); + },100); + $('.done-reply').single('click', _.bind(function (uid) { + var reply = $('.reply-textarea')[0].value; + if (reply && reply.length > 0) { + this.addReply(uid, reply); + uiApp.closeModal($$(addReplyView)); + this.updateViewComment(this.showComments, this.indexCurrentComment); + } + }, me, comment.uid)); + } else { + + } + } + }, + + addReply: function(id, replyVal) { + if (replyVal.length > 0) { + var me = this, + reply = null, + addReply = null, + ascComment = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)), + comment = _.findWhere(this.collectionComments, {uid: id}); + + if (ascComment && comment) { + + ascComment.asc_putText(comment.comment); + ascComment.asc_putQuoteText(comment.quote); + ascComment.asc_putTime(me.utcDateToString(new Date(comment.time))); + ascComment.asc_putOnlyOfficeTime(me.ooDateToString(new Date(comment.time))); + ascComment.asc_putUserId(comment.userid); + ascComment.asc_putUserName(comment.username); + ascComment.asc_putSolved(comment.resolved); + ascComment.asc_putGuid(comment.guid); + + if (!_.isUndefined(ascComment.asc_putDocumentFlag)) { + ascComment.asc_putDocumentFlag(comment.unattached); + } + + reply = comment.replys; + if (reply && reply.length) { + reply.forEach(function (reply) { + + addReply = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)); + if (addReply) { + addReply.asc_putText(reply.reply); + addReply.asc_putTime(me.utcDateToString(new Date(reply.time))); + addReply.asc_putOnlyOfficeTime(me.ooDateToString(new Date(reply.time))); + addReply.asc_putUserId(reply.userid); + addReply.asc_putUserName(reply.username); + + ascComment.asc_addReply(addReply); + } + }); + } + + addReply = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)); + if (addReply) { + addReply.asc_putText(replyVal); + addReply.asc_putTime(me.utcDateToString(new Date())); + addReply.asc_putOnlyOfficeTime(me.ooDateToString(new Date())); + _.each(editUsers, function(item){ + if (item.asc_getIdOriginal() === _userId) { + me.currentUser = item; + } + }); + addReply.asc_putUserId(_userId); + addReply.asc_putUserName(me.currentUser.asc_getUserName()); + + ascComment.asc_addReply(addReply); + + me.api.asc_changeComment(id, ascComment); + } + } + } }, showAddCommentModal: function() { @@ -835,6 +1029,335 @@ define([ } }, + initMenuComments: function() { + var me = this; + _.delay(function () { + var _menuItems = []; + _menuItems.push({ + caption: me.textEdit, + event: 'edit' + }); + if (!me.showComments[me.indexCurrentComment].resolved) { + _menuItems.push({ + caption: me.textResolve, + event: 'resolve' + }); + } else { + _menuItems.push({ + caption: me.textReopen, + event: 'resolve' + }); + } + _menuItems.push({ + caption: me.textDeleteComment, + event: 'delete' + }); + _.each(_menuItems, function (item) { + item.text = item.caption; + item.onClick = function () { + me.onCommentMenuClick(item.event) + } + }); + + uiApp.actions([_menuItems, [ + { + text: me.textCancel, + bold: true + } + ]]); + }, 100); + }, + + initReplyMenu: function(event) { + var me = this; + var ind = $(event.currentTarget).parent().parent().data('ind'); + _.delay(function () { + var _menuItems = []; + _menuItems.push({ + caption: me.textEdit, + event: 'editreply' + }); + _menuItems.push({ + caption: me.textDeleteReply, + event: 'deletereply' + }); + _.each(_menuItems, function (item) { + item.text = item.caption; + item.onClick = function () { + me.onCommentMenuClick(item.event, ind); + } + }); + + uiApp.actions([_menuItems, [ + { + text: me.textCancel, + bold: true + } + ]]); + }, 100); + }, + + onCommentMenuClick: function(action, indReply) { + var me = this; + switch (action) { + case 'edit': me.showEditCommentModal(); break; + case 'resolve': me.onClickResolveComment(); break; + case 'delete': me.onDeleteComment(me.indexCurrentComment); break; + case 'editreply': me.showEditReplyModal(me.indexCurrentComment, indReply); break; + case 'deletereply': me.onDeleteReply(me.indexCurrentComment, indReply); break; + } + }, + + onChangeComment: function(comment) { + if (this.api) { + var ascComment, + me = this; + if (typeof Asc.asc_CCommentDataWord !== 'undefined') { + ascComment = new Asc.asc_CCommentDataWord(null); + } else { + ascComment = new Asc.asc_CCommentData(null); + } + + if (ascComment && comment) { + var uid = comment.uid; + ascComment.asc_putText(comment.comment); + ascComment.asc_putQuoteText(comment.quote); + ascComment.asc_putTime(me.utcDateToString(new Date(comment.time))); + ascComment.asc_putOnlyOfficeTime(me.ooDateToString(new Date(comment.time))); + ascComment.asc_putUserId(comment.userid); + ascComment.asc_putUserName(comment.username); + ascComment.asc_putSolved(!comment.resolved); + ascComment.asc_putGuid(comment.guid); + + if (!_.isUndefined(ascComment.asc_putDocumentFlag)) { + ascComment.asc_putDocumentFlag(comment.unattached); + } + + var reply = comment.replys; + if (reply && reply.length > 0) { + reply.forEach(function (reply) { + var addReply = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)); + if (addReply) { + addReply.asc_putText(reply.reply); + addReply.asc_putTime(me.utcDateToString(new Date(reply.time))); + addReply.asc_putOnlyOfficeTime(me.ooDateToString(new Date(reply.time))); + addReply.asc_putUserId(reply.userid); + addReply.asc_putUserName(reply.username); + + ascComment.asc_addReply(addReply); + } + }); + } + + this.api.asc_changeComment(uid, ascComment); + } + } + }, + + onDeleteComment: function(ind) { + if (this.api && !_.isUndefined(ind) && !_.isUndefined(this.showComments)) { + this.api.asc_removeComment(this.showComments[ind].uid); + if (this.showComments.length === 0) { + uiApp.closeModal(); + } else { + this.indexCurrentComment = this.indexCurrentComment - 1 > -1 ? this.indexCurrentComment - 1 : 0; + this.updateViewComment(); + } + } + }, + + onDeleteReply: function(indComment, indReply) { + if (!_.isUndefined(indComment) && !_.isUndefined(indReply)) { + var me = this, + replies = null, + addReply = null, + ascComment = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)), + comment = me.showComments[indComment]; + + if (ascComment && comment) { + var id = comment.uid; + ascComment.asc_putText(comment.comment); + ascComment.asc_putQuoteText(comment.quote); + ascComment.asc_putTime(me.utcDateToString(new Date(comment.time))); + ascComment.asc_putOnlyOfficeTime(me.ooDateToString(new Date(comment.time))); + ascComment.asc_putUserId(comment.userid); + ascComment.asc_putUserName(comment.username); + ascComment.asc_putSolved(comment.resolved); + ascComment.asc_putGuid(comment.guid); + + if (!_.isUndefined(ascComment.asc_putDocumentFlag)) { + ascComment.asc_putDocumentFlag(comment.unattached); + } + + replies = comment.replys; + if (replies && replies.length) { + replies.forEach(function (reply) { + if (reply.ind !== indReply) { + addReply = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)); + if (addReply) { + addReply.asc_putText(reply.reply); + addReply.asc_putTime(me.utcDateToString(new Date(reply.time))); + addReply.asc_putOnlyOfficeTime(me.ooDateToString(new Date(reply.time))); + addReply.asc_putUserId(reply.userid); + addReply.asc_putUserName(reply.username); + + ascComment.asc_addReply(addReply); + } + } + }); + } + + me.api.asc_changeComment(id, ascComment); + me.updateViewComment(); + } + } + }, + + showEditCommentModal: function() { + var me = this; + if (this.indexCurrentComment > -1 && this.indexCurrentComment < this.showComments.length) { + var comment = this.showComments[this.indexCurrentComment]; + if (Common.SharedSettings.get('phone')) { + me.editView = uiApp.popup( + '
' + + '
' + + '
' + + '
' + '' + me.textCancel + ''+ '
' + + '
' + me.textEditComment + '
' + + '
' + '' + me.textDone + '' + '
' + + '
' + + '
' + + '
' + + '
' + comment.username + '
' + + '
' + comment.date + '
' + + '
' + + '
' + + '
' + ); + $('.popup').css('z-index', '20000'); + _.delay(function () { + var $textarea = $('.comment-textarea')[0]; + $textarea.focus(); + $textarea.selectionStart = $textarea.value.length; + },100); + $('#edit-comment').single('click', _.bind(function (comment) { + var value = $('.comment-textarea')[0].value; + if (value && value.length > 0) { + comment.comment = value; + this.showComments[this.indexCurrentComment] = comment; + this.onChangeComment(comment); + uiApp.closeModal($$(me.editView)); + this.updateViewComment(); + } + }, me, comment)); + } else { + + } + } + }, + + showEditReplyModal: function(indComment, indReply) { + var me = this; + if (indComment > -1 && indComment < this.showComments.length) { + var editView, + comment, + replies, + reply; + this.showComments && (comment = this.showComments[indComment]); + comment && (replies = comment.replys); + replies && (reply = replies[indReply]); + if (reply) { + if (Common.SharedSettings.get('phone')) { + editView = uiApp.popup( + '
' + + '
' + + '
' + + '
' + '' + me.textCancel + '' + '
' + + '
' + me.textEditReply + '
' + + '
' + '' + me.textDone + '' + '
' + + '
' + + '
' + + '
' + + '
' + reply.username + '
' + + '
' + reply.date + '
' + + '
' + + '
' + + '
' + ); + $('.popup').css('z-index', '20000'); + _.delay(function () { + var $textarea = $('.reply-textarea')[0]; + $textarea.focus(); + $textarea.selectionStart = $textarea.value.length; + },100); + } + $('#edit-reply').single('click', _.bind(function (comment, indReply) { + var value = $('.reply-textarea')[0].value; + if (value && value.length > 0) { + comment.replys[indReply].reply = value; + this.onChangeComment(comment); + uiApp.closeModal($$(editView)); + this.updateViewComment(); + } + }, me, comment, indReply)); + } + } + }, + + onClickResolveComment: function() { + if (!_.isUndefined(this.indexCurrentComment) && !_.isUndefined(this.showComments)) { + var comment = this.showComments[this.indexCurrentComment]; + if (comment) { + if (this.resolveComment(comment.uid)) { + $('.comment-resolve .icon-resolve-comment').toggleClass('check'); + } + } + } + }, + + resolveComment: function (uid) { + var me = this, + reply = null, + addReply = null, + ascComment = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)), + comment = me.findComment(uid); + + if (ascComment && comment && me.api) { + ascComment.asc_putText(comment.comment); + ascComment.asc_putQuoteText(comment.quote); + ascComment.asc_putTime(me.utcDateToString(new Date(comment.time))); + ascComment.asc_putOnlyOfficeTime(me.ooDateToString(new Date(comment.time))); + ascComment.asc_putUserId(comment.userid); + ascComment.asc_putUserName(comment.username); + ascComment.asc_putSolved(!comment.resolved); + ascComment.asc_putGuid(comment.guid); + + if (!_.isUndefined(ascComment.asc_putDocumentFlag)) { + ascComment.asc_putDocumentFlag(comment.unattached); + } + + reply = comment.replys; + if (reply && reply.length) { + reply.forEach(function (reply) { + addReply = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)); + if (addReply) { + addReply.asc_putText(reply.reply); + addReply.asc_putTime(me.utcDateToString(new Date(reply.time))); + addReply.asc_putOnlyOfficeTime(me.ooDateToString(new Date(reply.time))); + addReply.asc_putUserId(reply.userid); + addReply.asc_putUserName(reply.username); + + ascComment.asc_addReply(addReply); + } + }); + } + + me.api.asc_changeComment(uid, ascComment); + return true; + } + return false; + }, + // utils timeZoneOffsetInMs: (new Date()).getTimezoneOffset() * 60000, utcDateToString: function (date) { @@ -874,6 +1397,7 @@ define([ var user = _.findWhere(editUsers, {idOriginal: data.asc_getReply(i).asc_getUserId()}); replies.push({ + ind : i, userid : data.asc_getReply(i).asc_getUserId(), username : data.asc_getReply(i).asc_getUserName(), usercolor : (user) ? user.asc_getColor() : null, @@ -950,6 +1474,7 @@ define([ user = _.findWhere(editUsers, {idOriginal: data.asc_getReply(i).asc_getUserId()}); replies.push({ + ind : i, userid : data.asc_getReply(i).asc_getUserId(), username : data.asc_getReply(i).asc_getUserName(), usercolor : (user) ? user.asc_getColor() : null, @@ -962,6 +1487,13 @@ define([ if($('.page-comments').length > 0) { this.initComments(); } + + if (this.showComments && this.showComments.length > 0) { + var showComment = _.findWhere(this.showComments, {uid: id}); + if (showComment) { + showComment = comment; + } + } } }, @@ -1016,7 +1548,7 @@ define([ } }, - onApiRemoveComment: function (id) { + onApiRemoveComment: function (id, silentUpdate) { function remove (collection, key) { if(collection instanceof Array) { var index = collection.indexOf(key); @@ -1025,7 +1557,7 @@ define([ } } } - if (this.groupCollectionComments) { + if (this.groupCollectionComments.length > 0) { for (var name in this.groupCollectionComments) { var store = this.groupCollectionComments[name], comment = _.findWhere(store, {uid: id}); @@ -1043,9 +1575,22 @@ define([ remove(this.collectionComments, comment); } } - if($('.page-comments').length > 0) { + if(!silentUpdate && $('.page-comments').length > 0) { this.initComments(); } + + if (this.showComments && this.showComments.length > 0) { + var removeComment = _.findWhere(this.showComments, {uid: id}); + if (removeComment) { + this.showComments = _.without(this.showComments, removeComment); + } + } + }, + + onApiRemoveComments: function(data) { + for (var i = 0; i < data.length; i++) { + this.onApiRemoveComment(data[i], true); + } }, onFilterChange: function (filter) { @@ -1129,7 +1674,15 @@ define([ textEditUser: 'Document is currently being edited by several users.', textAddComment: "Add Comment", textCancel: "Cancel", - textDone: "Done" + textDone: "Done", + textAddReply: "Add Reply", + textEdit: 'Edit', + textResolve: 'Resolve', + textDeleteComment: 'Delete comment', + textEditComment: 'Edit comment', + textDeleteReply: 'Delete reply', + textEditReply: 'Edit reply', + textReopen: 'Reopen' } })(), Common.Controllers.Collaboration || {})) diff --git a/apps/common/mobile/lib/template/Collaboration.template b/apps/common/mobile/lib/template/Collaboration.template index fb6016c6f..f418d24b5 100644 --- a/apps/common/mobile/lib/template/Collaboration.template +++ b/apps/common/mobile/lib/template/Collaboration.template @@ -237,19 +237,3 @@ - -
-
-
-
-
-
- Link 1 - Link 2 - Link 3 -
-
-
- -
-
\ No newline at end of file diff --git a/apps/common/mobile/lib/view/Collaboration.js b/apps/common/mobile/lib/view/Collaboration.js index cbc70e452..3765c858e 100644 --- a/apps/common/mobile/lib/view/Collaboration.js +++ b/apps/common/mobile/lib/view/Collaboration.js @@ -123,17 +123,6 @@ define([ return ''; }, - rootCommentLayout: function() { - if (this.layout) { - var $layour = this.layout.find('#comment-view'), - isPhone = Common.SharedSettings.get('phone'); - - return $layour.html(); - } - - return ''; - }, - showPage: function(templateId, animate) { var me = this; var prefix = !!window.DE ? DE : !!window.PE ? PE : SSE; @@ -157,8 +146,52 @@ define([ } }, - renderViewComments: function(comments) { + //Comments + renderViewComments: function(comments, indCurComment) { + if ($('.page-view-comments .page-content').length > 0) { + var template = ''; + if (comments && comments.length > 0) { + template = '
' + + '
    '; + var comment = comments[indCurComment]; + template += '
  • ' + + '
    ' + + '
    ' + + '

    ' + comment.username + '

    ' + + '

    ' + comment.date + '

    '; + if (comment.quote) template += '

    ' + comment.quote + '

    '; + template += '
    '; + template += '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    '; + + template += '

    ' + comment.comment + '

    '; + if (comment.replys.length > 0) { + template += '
      '; + _.each(comment.replys, function (reply) { + template += '
    • ' + + '
      ' + + '
      ' + + '

      ' + reply.username + '

      ' + + '

      ' + reply.date + '

      ' + + '
      ' + + '
      ' + + '
      ' + + '

      ' + reply.reply + '

      ' + + '
      • '; + }); + template += '
    ' + } + + template += '
    ' + + '
    • '; + template += '
'; + $('.page-view-comments .page-content').html(template); + } + } }, renderComments: function (comments) { @@ -205,7 +238,7 @@ define([ replys: comment.replys.length, })); }); - $listComments.html(items); + $listComments.html(items.join('')); } }, diff --git a/apps/common/mobile/resources/less/ios/_collaboration.less b/apps/common/mobile/resources/less/ios/_collaboration.less index 7c5468464..5fd698055 100644 --- a/apps/common/mobile/resources/less/ios/_collaboration.less +++ b/apps/common/mobile/resources/less/ios/_collaboration.less @@ -92,7 +92,7 @@ } //Comments -.page-comments, .page-add-comment { +.page-comments, .page-add-comment, .page-view-comments, .container-edit-comment, .container-add-reply { .list-block .item-inner { display: block; padding: 16px 0; @@ -100,6 +100,7 @@ } p { margin: 0; + word-break: break-word; } .user-name { font-size: 17px; @@ -125,8 +126,14 @@ } .reply-item { margin-top: 15px; + padding-right: 16px; + padding-top: 13px; + .header-reply { + display: flex; + justify-content: space-between; + } .user-name { - padding-top: 16px; + padding-top: 3px; } &:before { content: ''; @@ -152,23 +159,29 @@ font-size: 15px; } - //add comment .wrap-comment { padding: 16px 16px 0 16px; } - .comment-textarea { + .comment-textarea, .reply-textarea { margin-top: 10px; background:transparent; border:none; outline:none; width: 100%; min-height: 200px; + font-size: 15px; } } .settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after { display: none; } +.container-edit-comment { + .navbar { + background-color: #FFFFFF; + } +} + //view comment .container-view-comment { -webkit-transition: height 100ms; @@ -178,8 +191,52 @@ border-top-right-radius: 4px; height: 50%; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); + .page-view-comments { + background-color: #FFFFFF; + .list-block { + margin-bottom: 100px; + ul:before, ul:after { + content: none; + } + .item-inner { + padding: 0; + .header-comment { + display: flex; + justify-content: space-between; + padding-right: 16px; + .comment-right { + display: flex; + justify-content: space-between; + width: 70px; + } + } + } + } + + } .toolbar { position: absolute; + background-color: #FFFFFF; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); + &:before { + content: none; + } + .toolbar-inner { + display: flex; + justify-content: space-between; + padding: 0 16px; + .button-left { + min-width: 80px; + } + .button-right { + min-width: 62px; + display: flex; + justify-content: space-between; + a { + padding: 0 8px; + } + } + } } .swipe-container { display: flex; @@ -193,19 +250,52 @@ border-radius: 2px; } } - .page-content { - padding: 0 16px 80px; + .list-block { + margin-top: 0; } } .container-view-add-comment { height: 100%; .navbar { + background-color: #FFFFFF; a.link i + span { margin-left: 0; } } .page-add-comment { background-color: #FFFFFF; + .page-content { + padding: 0 16px 80px; + } } -} \ No newline at end of file +} + +.container-add-reply { + height: 100%; + .navbar { + background-color: #FFFFFF; + a.link i + span { + margin-left: 0; + } + } +} + +.icon-arrow-comment { + border: solid black; + border-width: 0 2px 2px 0; + border-color: @themeColor; + height: 12px; + width: 12px; + display: inline-block; + padding: 0; + &.right { + transform: rotate(-45deg); + -webkit-transform: rotate(-45deg); + } + + &.left { + transform: rotate(135deg); + -webkit-transform: rotate(135deg); + } +} diff --git a/apps/documenteditor/mobile/app/controller/DocumentHolder.js b/apps/documenteditor/mobile/app/controller/DocumentHolder.js index 387396a65..532a74301 100644 --- a/apps/documenteditor/mobile/app/controller/DocumentHolder.js +++ b/apps/documenteditor/mobile/app/controller/DocumentHolder.js @@ -534,7 +534,7 @@ define([ } } - if (1/*_isComments*/) { + if (_isComments) { arrItems.push({ caption: me.menuViewComment, event: 'viewcomment' diff --git a/apps/documenteditor/mobile/resources/css/app-ios.css b/apps/documenteditor/mobile/resources/css/app-ios.css index bd1719bc0..c5f043d0f 100644 --- a/apps/documenteditor/mobile/resources/css/app-ios.css +++ b/apps/documenteditor/mobile/resources/css/app-ios.css @@ -6480,17 +6480,27 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after content: none; } .page-comments .list-block .item-inner, -.page-add-comment .list-block .item-inner { +.page-add-comment .list-block .item-inner, +.page-view-comments .list-block .item-inner, +.container-edit-comment .list-block .item-inner, +.container-add-reply .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; } .page-comments p, -.page-add-comment p { +.page-add-comment p, +.page-view-comments p, +.container-edit-comment p, +.container-add-reply p { margin: 0; + word-break: break-word; } .page-comments .user-name, -.page-add-comment .user-name { +.page-add-comment .user-name, +.page-view-comments .user-name, +.container-edit-comment .user-name, +.container-add-reply .user-name { font-size: 17px; line-height: 22px; color: #000000; @@ -6499,8 +6509,14 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after } .page-comments .comment-date, .page-add-comment .comment-date, +.page-view-comments .comment-date, +.container-edit-comment .comment-date, +.container-add-reply .comment-date, .page-comments .reply-date, -.page-add-comment .reply-date { +.page-add-comment .reply-date, +.page-view-comments .reply-date, +.container-edit-comment .reply-date, +.container-add-reply .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6509,8 +6525,14 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after } .page-comments .comment-text, .page-add-comment .comment-text, +.page-view-comments .comment-text, +.container-edit-comment .comment-text, +.container-add-reply .comment-text, .page-comments .reply-text, -.page-add-comment .reply-text { +.page-add-comment .reply-text, +.page-view-comments .reply-text, +.container-edit-comment .reply-text, +.container-add-reply .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6519,15 +6541,34 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after padding-right: 15px; } .page-comments .reply-item, -.page-add-comment .reply-item { +.page-add-comment .reply-item, +.page-view-comments .reply-item, +.container-edit-comment .reply-item, +.container-add-reply .reply-item { margin-top: 15px; + padding-right: 16px; + padding-top: 13px; +} +.page-comments .reply-item .header-reply, +.page-add-comment .reply-item .header-reply, +.page-view-comments .reply-item .header-reply, +.container-edit-comment .reply-item .header-reply, +.container-add-reply .reply-item .header-reply { + display: flex; + justify-content: space-between; } .page-comments .reply-item .user-name, -.page-add-comment .reply-item .user-name { - padding-top: 16px; +.page-add-comment .reply-item .user-name, +.page-view-comments .reply-item .user-name, +.container-edit-comment .reply-item .user-name, +.container-add-reply .reply-item .user-name { + padding-top: 3px; } .page-comments .reply-item:before, -.page-add-comment .reply-item:before { +.page-add-comment .reply-item:before, +.page-view-comments .reply-item:before, +.container-edit-comment .reply-item:before, +.container-add-reply .reply-item:before { content: ''; position: absolute; left: auto; @@ -6543,7 +6584,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after transform-origin: 50% 100%; } .page-comments .comment-quote, -.page-add-comment .comment-quote { +.page-add-comment .comment-quote, +.page-view-comments .comment-quote, +.container-edit-comment .comment-quote, +.container-add-reply .comment-quote { color: #446995; border-left: 1px solid #446995; padding-left: 10px; @@ -6551,22 +6595,37 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after font-size: 15px; } .page-comments .wrap-comment, -.page-add-comment .wrap-comment { +.page-add-comment .wrap-comment, +.page-view-comments .wrap-comment, +.container-edit-comment .wrap-comment, +.container-add-reply .wrap-comment { padding: 16px 16px 0 16px; } .page-comments .comment-textarea, -.page-add-comment .comment-textarea { +.page-add-comment .comment-textarea, +.page-view-comments .comment-textarea, +.container-edit-comment .comment-textarea, +.container-add-reply .comment-textarea, +.page-comments .reply-textarea, +.page-add-comment .reply-textarea, +.page-view-comments .reply-textarea, +.container-edit-comment .reply-textarea, +.container-add-reply .reply-textarea { margin-top: 10px; background: transparent; border: none; outline: none; width: 100%; min-height: 200px; + font-size: 15px; } .settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after { display: none; } +.container-edit-comment .navbar { + background-color: #FFFFFF; +} .container-view-comment { -webkit-transition: height 100ms; transition: height 100ms; @@ -6576,8 +6635,52 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after height: 50%; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } +.container-view-comment .page-view-comments { + background-color: #FFFFFF; +} +.container-view-comment .page-view-comments .list-block { + margin-bottom: 100px; +} +.container-view-comment .page-view-comments .list-block ul:before, +.container-view-comment .page-view-comments .list-block ul:after { + content: none; +} +.container-view-comment .page-view-comments .list-block .item-inner { + padding: 0; +} +.container-view-comment .page-view-comments .list-block .item-inner .header-comment { + display: flex; + justify-content: space-between; + padding-right: 16px; +} +.container-view-comment .page-view-comments .list-block .item-inner .header-comment .comment-right { + display: flex; + justify-content: space-between; + width: 70px; +} .container-view-comment .toolbar { position: absolute; + background-color: #FFFFFF; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); +} +.container-view-comment .toolbar:before { + content: none; +} +.container-view-comment .toolbar .toolbar-inner { + display: flex; + justify-content: space-between; + padding: 0 16px; +} +.container-view-comment .toolbar .toolbar-inner .button-left { + min-width: 80px; +} +.container-view-comment .toolbar .toolbar-inner .button-right { + min-width: 62px; + display: flex; + justify-content: space-between; +} +.container-view-comment .toolbar .toolbar-inner .button-right a { + padding: 0 8px; } .container-view-comment .swipe-container { display: flex; @@ -6591,18 +6694,50 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after background: rgba(0, 0, 0, 0.12); border-radius: 2px; } -.container-view-comment .page-content { - padding: 0 16px 80px; +.container-view-comment .list-block { + margin-top: 0; } .container-view-add-comment { height: 100%; } +.container-view-add-comment .navbar { + background-color: #FFFFFF; +} .container-view-add-comment .navbar a.link i + span { margin-left: 0; } .container-view-add-comment .page-add-comment { background-color: #FFFFFF; } +.container-view-add-comment .page-add-comment .page-content { + padding: 0 16px 80px; +} +.container-add-reply { + height: 100%; +} +.container-add-reply .navbar { + background-color: #FFFFFF; +} +.container-add-reply .navbar a.link i + span { + margin-left: 0; +} +.icon-arrow-comment { + border: solid black; + border-width: 0 2px 2px 0; + border-color: #446995; + height: 12px; + width: 12px; + display: inline-block; + padding: 0; +} +.icon-arrow-comment.right { + transform: rotate(-45deg); + -webkit-transform: rotate(-45deg); +} +.icon-arrow-comment.left { + transform: rotate(135deg); + -webkit-transform: rotate(135deg); +} .tablet .searchbar.document.replace .center .searchbar:first-child { margin-right: 10px; } @@ -7144,6 +7279,21 @@ i.icon.icon-paste { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%202H0V20H9V24H24V7H19V2H14V3H18V7H9V19H1V3H5V2ZM10%208H23V23H10V8Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M5%200H14V5H5V0Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2012H12V11H21V12Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2016H12V15H21V16Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2020H12V19H21V20Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); } +i.icon.icon-menu-comment { + width: 30px; + height: 30px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2030%2030%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M10%2015C10%2016.6569%208.65685%2018%207%2018C5.34315%2018%204%2016.6569%204%2015C4%2013.3431%205.34315%2012%207%2012C8.65685%2012%2010%2013.3431%2010%2015ZM7%2016.7143C7.94677%2016.7143%208.71429%2015.9468%208.71429%2015C8.71429%2014.0532%207.94677%2013.2857%207%2013.2857C6.05323%2013.2857%205.28571%2014.0532%205.28571%2015C5.28571%2015.9468%206.05323%2016.7143%207%2016.7143Z%22%20fill%3D%22%23A3A3A3%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M18%2015C18%2016.6569%2016.6569%2018%2015%2018C13.3431%2018%2012%2016.6569%2012%2015C12%2013.3431%2013.3431%2012%2015%2012C16.6569%2012%2018%2013.3431%2018%2015ZM15%2016.7143C15.9468%2016.7143%2016.7143%2015.9468%2016.7143%2015C16.7143%2014.0532%2015.9468%2013.2857%2015%2013.2857C14.0532%2013.2857%2013.2857%2014.0532%2013.2857%2015C13.2857%2015.9468%2014.0532%2016.7143%2015%2016.7143Z%22%20fill%3D%22%23A3A3A3%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M26%2015C26%2016.6569%2024.6569%2018%2023%2018C21.3431%2018%2020%2016.6569%2020%2015C20%2013.3431%2021.3431%2012%2023%2012C24.6569%2012%2026%2013.3431%2026%2015ZM23%2016.7143C23.9468%2016.7143%2024.7143%2015.9468%2024.7143%2015C24.7143%2014.0532%2023.9468%2013.2857%2023%2013.2857C22.0532%2013.2857%2021.2857%2014.0532%2021.2857%2015C21.2857%2015.9468%2022.0532%2016.7143%2023%2016.7143Z%22%20fill%3D%22%23A3A3A3%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-resolve-comment { + width: 30px; + height: 30px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2030%2030%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M11.6195%2020.8555C11.8237%2021.0673%2012.1658%2021.0577%2012.358%2020.8349L22.516%209.05783C22.7843%208.74676%2022.7528%208.27781%2022.4453%208.00545C22.1315%207.72756%2021.651%207.7604%2021.3779%208.07839L12.3546%2018.587C12.1638%2018.8092%2011.8238%2018.8206%2011.6186%2018.6117L8.10643%2015.0366C7.81574%2014.7407%207.34084%2014.7345%207.04258%2015.0228C6.74283%2015.3125%206.73444%2015.7903%207.02383%2016.0904L11.6195%2020.8555Z%22%20fill%3D%22%23A3A3A3%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-resolve-comment.check { + width: 30px; + height: 30px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2030%2030%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M0%200H30V30H0V0Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M11.6195%2020.8555C11.8237%2021.0673%2012.1658%2021.0577%2012.358%2020.8349L22.516%209.05783C22.7843%208.74676%2022.7528%208.27781%2022.4453%208.00545V8.00545C22.1315%207.72756%2021.651%207.7604%2021.3779%208.07839L12.3546%2018.587C12.1638%2018.8092%2011.8238%2018.8206%2011.6186%2018.6117L8.10643%2015.0366C7.81575%2014.7407%207.34084%2014.7345%207.04258%2015.0228V15.0228C6.74283%2015.3125%206.73444%2015.7903%207.02383%2016.0904L11.6195%2020.8555Z%22%20fill%3D%22%235B9F27%22%2F%3E%3C%2Fsvg%3E"); +} .label-switch input[type="checkbox"]:checked + .checkbox { background: #446995; } diff --git a/apps/documenteditor/mobile/resources/less/ios/_icons.less b/apps/documenteditor/mobile/resources/less/ios/_icons.less index b5c848064..1fb110579 100644 --- a/apps/documenteditor/mobile/resources/less/ios/_icons.less +++ b/apps/documenteditor/mobile/resources/less/ios/_icons.less @@ -476,4 +476,21 @@ i.icon { height: 24px; .encoded-svg-background(''); } + + //comments + &.icon-menu-comment { + width: 30px; + height: 30px; + .encoded-svg-background(''); + } + &.icon-resolve-comment { + width: 30px; + height: 30px; + .encoded-svg-background(''); + } + &.icon-resolve-comment.check { + width: 30px; + height: 30px; + .encoded-svg-background(''); + } } \ No newline at end of file diff --git a/apps/presentationeditor/mobile/resources/css/app-ios.css b/apps/presentationeditor/mobile/resources/css/app-ios.css index fa01a7fef..3052c79ac 100644 --- a/apps/presentationeditor/mobile/resources/css/app-ios.css +++ b/apps/presentationeditor/mobile/resources/css/app-ios.css @@ -6480,17 +6480,27 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after content: none; } .page-comments .list-block .item-inner, -.page-add-comment .list-block .item-inner { +.page-add-comment .list-block .item-inner, +.page-view-comments .list-block .item-inner, +.container-edit-comment .list-block .item-inner, +.container-add-reply .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; } .page-comments p, -.page-add-comment p { +.page-add-comment p, +.page-view-comments p, +.container-edit-comment p, +.container-add-reply p { margin: 0; + word-break: break-word; } .page-comments .user-name, -.page-add-comment .user-name { +.page-add-comment .user-name, +.page-view-comments .user-name, +.container-edit-comment .user-name, +.container-add-reply .user-name { font-size: 17px; line-height: 22px; color: #000000; @@ -6499,8 +6509,14 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after } .page-comments .comment-date, .page-add-comment .comment-date, +.page-view-comments .comment-date, +.container-edit-comment .comment-date, +.container-add-reply .comment-date, .page-comments .reply-date, -.page-add-comment .reply-date { +.page-add-comment .reply-date, +.page-view-comments .reply-date, +.container-edit-comment .reply-date, +.container-add-reply .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6509,8 +6525,14 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after } .page-comments .comment-text, .page-add-comment .comment-text, +.page-view-comments .comment-text, +.container-edit-comment .comment-text, +.container-add-reply .comment-text, .page-comments .reply-text, -.page-add-comment .reply-text { +.page-add-comment .reply-text, +.page-view-comments .reply-text, +.container-edit-comment .reply-text, +.container-add-reply .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6519,15 +6541,34 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after padding-right: 15px; } .page-comments .reply-item, -.page-add-comment .reply-item { +.page-add-comment .reply-item, +.page-view-comments .reply-item, +.container-edit-comment .reply-item, +.container-add-reply .reply-item { margin-top: 15px; + padding-right: 16px; + padding-top: 13px; +} +.page-comments .reply-item .header-reply, +.page-add-comment .reply-item .header-reply, +.page-view-comments .reply-item .header-reply, +.container-edit-comment .reply-item .header-reply, +.container-add-reply .reply-item .header-reply { + display: flex; + justify-content: space-between; } .page-comments .reply-item .user-name, -.page-add-comment .reply-item .user-name { - padding-top: 16px; +.page-add-comment .reply-item .user-name, +.page-view-comments .reply-item .user-name, +.container-edit-comment .reply-item .user-name, +.container-add-reply .reply-item .user-name { + padding-top: 3px; } .page-comments .reply-item:before, -.page-add-comment .reply-item:before { +.page-add-comment .reply-item:before, +.page-view-comments .reply-item:before, +.container-edit-comment .reply-item:before, +.container-add-reply .reply-item:before { content: ''; position: absolute; left: auto; @@ -6543,7 +6584,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after transform-origin: 50% 100%; } .page-comments .comment-quote, -.page-add-comment .comment-quote { +.page-add-comment .comment-quote, +.page-view-comments .comment-quote, +.container-edit-comment .comment-quote, +.container-add-reply .comment-quote { color: #aa5252; border-left: 1px solid #aa5252; padding-left: 10px; @@ -6551,22 +6595,37 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after font-size: 15px; } .page-comments .wrap-comment, -.page-add-comment .wrap-comment { +.page-add-comment .wrap-comment, +.page-view-comments .wrap-comment, +.container-edit-comment .wrap-comment, +.container-add-reply .wrap-comment { padding: 16px 16px 0 16px; } .page-comments .comment-textarea, -.page-add-comment .comment-textarea { +.page-add-comment .comment-textarea, +.page-view-comments .comment-textarea, +.container-edit-comment .comment-textarea, +.container-add-reply .comment-textarea, +.page-comments .reply-textarea, +.page-add-comment .reply-textarea, +.page-view-comments .reply-textarea, +.container-edit-comment .reply-textarea, +.container-add-reply .reply-textarea { margin-top: 10px; background: transparent; border: none; outline: none; width: 100%; min-height: 200px; + font-size: 15px; } .settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after { display: none; } +.container-edit-comment .navbar { + background-color: #FFFFFF; +} .container-view-comment { -webkit-transition: height 100ms; transition: height 100ms; @@ -6576,8 +6635,52 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after height: 50%; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } +.container-view-comment .page-view-comments { + background-color: #FFFFFF; +} +.container-view-comment .page-view-comments .list-block { + margin-bottom: 100px; +} +.container-view-comment .page-view-comments .list-block ul:before, +.container-view-comment .page-view-comments .list-block ul:after { + content: none; +} +.container-view-comment .page-view-comments .list-block .item-inner { + padding: 0; +} +.container-view-comment .page-view-comments .list-block .item-inner .header-comment { + display: flex; + justify-content: space-between; + padding-right: 16px; +} +.container-view-comment .page-view-comments .list-block .item-inner .header-comment .comment-right { + display: flex; + justify-content: space-between; + width: 70px; +} .container-view-comment .toolbar { position: absolute; + background-color: #FFFFFF; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); +} +.container-view-comment .toolbar:before { + content: none; +} +.container-view-comment .toolbar .toolbar-inner { + display: flex; + justify-content: space-between; + padding: 0 16px; +} +.container-view-comment .toolbar .toolbar-inner .button-left { + min-width: 80px; +} +.container-view-comment .toolbar .toolbar-inner .button-right { + min-width: 62px; + display: flex; + justify-content: space-between; +} +.container-view-comment .toolbar .toolbar-inner .button-right a { + padding: 0 8px; } .container-view-comment .swipe-container { display: flex; @@ -6591,18 +6694,50 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after background: rgba(0, 0, 0, 0.12); border-radius: 2px; } -.container-view-comment .page-content { - padding: 0 16px 80px; +.container-view-comment .list-block { + margin-top: 0; } .container-view-add-comment { height: 100%; } +.container-view-add-comment .navbar { + background-color: #FFFFFF; +} .container-view-add-comment .navbar a.link i + span { margin-left: 0; } .container-view-add-comment .page-add-comment { background-color: #FFFFFF; } +.container-view-add-comment .page-add-comment .page-content { + padding: 0 16px 80px; +} +.container-add-reply { + height: 100%; +} +.container-add-reply .navbar { + background-color: #FFFFFF; +} +.container-add-reply .navbar a.link i + span { + margin-left: 0; +} +.icon-arrow-comment { + border: solid black; + border-width: 0 2px 2px 0; + border-color: #aa5252; + height: 12px; + width: 12px; + display: inline-block; + padding: 0; +} +.icon-arrow-comment.right { + transform: rotate(-45deg); + -webkit-transform: rotate(-45deg); +} +.icon-arrow-comment.left { + transform: rotate(135deg); + -webkit-transform: rotate(135deg); +} .tablet .searchbar.document.replace .center .searchbar:first-child { margin-right: 10px; } diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css index 96e6cb262..6d965e8e9 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css @@ -6480,17 +6480,27 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after content: none; } .page-comments .list-block .item-inner, -.page-add-comment .list-block .item-inner { +.page-add-comment .list-block .item-inner, +.page-view-comments .list-block .item-inner, +.container-edit-comment .list-block .item-inner, +.container-add-reply .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; } .page-comments p, -.page-add-comment p { +.page-add-comment p, +.page-view-comments p, +.container-edit-comment p, +.container-add-reply p { margin: 0; + word-break: break-word; } .page-comments .user-name, -.page-add-comment .user-name { +.page-add-comment .user-name, +.page-view-comments .user-name, +.container-edit-comment .user-name, +.container-add-reply .user-name { font-size: 17px; line-height: 22px; color: #000000; @@ -6499,8 +6509,14 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after } .page-comments .comment-date, .page-add-comment .comment-date, +.page-view-comments .comment-date, +.container-edit-comment .comment-date, +.container-add-reply .comment-date, .page-comments .reply-date, -.page-add-comment .reply-date { +.page-add-comment .reply-date, +.page-view-comments .reply-date, +.container-edit-comment .reply-date, +.container-add-reply .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6509,8 +6525,14 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after } .page-comments .comment-text, .page-add-comment .comment-text, +.page-view-comments .comment-text, +.container-edit-comment .comment-text, +.container-add-reply .comment-text, .page-comments .reply-text, -.page-add-comment .reply-text { +.page-add-comment .reply-text, +.page-view-comments .reply-text, +.container-edit-comment .reply-text, +.container-add-reply .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6519,15 +6541,34 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after padding-right: 15px; } .page-comments .reply-item, -.page-add-comment .reply-item { +.page-add-comment .reply-item, +.page-view-comments .reply-item, +.container-edit-comment .reply-item, +.container-add-reply .reply-item { margin-top: 15px; + padding-right: 16px; + padding-top: 13px; +} +.page-comments .reply-item .header-reply, +.page-add-comment .reply-item .header-reply, +.page-view-comments .reply-item .header-reply, +.container-edit-comment .reply-item .header-reply, +.container-add-reply .reply-item .header-reply { + display: flex; + justify-content: space-between; } .page-comments .reply-item .user-name, -.page-add-comment .reply-item .user-name { - padding-top: 16px; +.page-add-comment .reply-item .user-name, +.page-view-comments .reply-item .user-name, +.container-edit-comment .reply-item .user-name, +.container-add-reply .reply-item .user-name { + padding-top: 3px; } .page-comments .reply-item:before, -.page-add-comment .reply-item:before { +.page-add-comment .reply-item:before, +.page-view-comments .reply-item:before, +.container-edit-comment .reply-item:before, +.container-add-reply .reply-item:before { content: ''; position: absolute; left: auto; @@ -6543,7 +6584,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after transform-origin: 50% 100%; } .page-comments .comment-quote, -.page-add-comment .comment-quote { +.page-add-comment .comment-quote, +.page-view-comments .comment-quote, +.container-edit-comment .comment-quote, +.container-add-reply .comment-quote { color: #40865c; border-left: 1px solid #40865c; padding-left: 10px; @@ -6551,22 +6595,37 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after font-size: 15px; } .page-comments .wrap-comment, -.page-add-comment .wrap-comment { +.page-add-comment .wrap-comment, +.page-view-comments .wrap-comment, +.container-edit-comment .wrap-comment, +.container-add-reply .wrap-comment { padding: 16px 16px 0 16px; } .page-comments .comment-textarea, -.page-add-comment .comment-textarea { +.page-add-comment .comment-textarea, +.page-view-comments .comment-textarea, +.container-edit-comment .comment-textarea, +.container-add-reply .comment-textarea, +.page-comments .reply-textarea, +.page-add-comment .reply-textarea, +.page-view-comments .reply-textarea, +.container-edit-comment .reply-textarea, +.container-add-reply .reply-textarea { margin-top: 10px; background: transparent; border: none; outline: none; width: 100%; min-height: 200px; + font-size: 15px; } .settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after { display: none; } +.container-edit-comment .navbar { + background-color: #FFFFFF; +} .container-view-comment { -webkit-transition: height 100ms; transition: height 100ms; @@ -6576,8 +6635,52 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after height: 50%; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } +.container-view-comment .page-view-comments { + background-color: #FFFFFF; +} +.container-view-comment .page-view-comments .list-block { + margin-bottom: 100px; +} +.container-view-comment .page-view-comments .list-block ul:before, +.container-view-comment .page-view-comments .list-block ul:after { + content: none; +} +.container-view-comment .page-view-comments .list-block .item-inner { + padding: 0; +} +.container-view-comment .page-view-comments .list-block .item-inner .header-comment { + display: flex; + justify-content: space-between; + padding-right: 16px; +} +.container-view-comment .page-view-comments .list-block .item-inner .header-comment .comment-right { + display: flex; + justify-content: space-between; + width: 70px; +} .container-view-comment .toolbar { position: absolute; + background-color: #FFFFFF; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); +} +.container-view-comment .toolbar:before { + content: none; +} +.container-view-comment .toolbar .toolbar-inner { + display: flex; + justify-content: space-between; + padding: 0 16px; +} +.container-view-comment .toolbar .toolbar-inner .button-left { + min-width: 80px; +} +.container-view-comment .toolbar .toolbar-inner .button-right { + min-width: 62px; + display: flex; + justify-content: space-between; +} +.container-view-comment .toolbar .toolbar-inner .button-right a { + padding: 0 8px; } .container-view-comment .swipe-container { display: flex; @@ -6591,18 +6694,50 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after background: rgba(0, 0, 0, 0.12); border-radius: 2px; } -.container-view-comment .page-content { - padding: 0 16px 80px; +.container-view-comment .list-block { + margin-top: 0; } .container-view-add-comment { height: 100%; } +.container-view-add-comment .navbar { + background-color: #FFFFFF; +} .container-view-add-comment .navbar a.link i + span { margin-left: 0; } .container-view-add-comment .page-add-comment { background-color: #FFFFFF; } +.container-view-add-comment .page-add-comment .page-content { + padding: 0 16px 80px; +} +.container-add-reply { + height: 100%; +} +.container-add-reply .navbar { + background-color: #FFFFFF; +} +.container-add-reply .navbar a.link i + span { + margin-left: 0; +} +.icon-arrow-comment { + border: solid black; + border-width: 0 2px 2px 0; + border-color: #40865c; + height: 12px; + width: 12px; + display: inline-block; + padding: 0; +} +.icon-arrow-comment.right { + transform: rotate(-45deg); + -webkit-transform: rotate(-45deg); +} +.icon-arrow-comment.left { + transform: rotate(135deg); + -webkit-transform: rotate(135deg); +} i.icon.icon-search { width: 24px; height: 24px; From a98b2892bb300601e6548a67a44fe0a5d29556c9 Mon Sep 17 00:00:00 2001 From: Julia Svinareva Date: Thu, 19 Mar 2020 09:12:18 +0300 Subject: [PATCH 03/23] [de mobile] comments (add style for android) --- .../mobile/lib/controller/Collaboration.js | 159 ++++++-- apps/common/mobile/lib/view/Collaboration.js | 27 +- .../resources/less/ios/_collaboration.less | 12 +- .../less/material/_collaboration.less | 217 ++++++++++- .../mobile/resources/css/app-ios.css | 13 +- .../mobile/resources/css/app-material.css | 361 ++++++++++++++++-- .../mobile/resources/less/ios/_icons.less | 2 +- .../resources/less/material/_icons.less | 35 ++ .../mobile/resources/css/app-ios.css | 11 +- .../mobile/resources/css/app-material.css | 326 ++++++++++++++-- .../mobile/resources/css/app-ios.css | 11 +- .../mobile/resources/css/app-material.css | 326 ++++++++++++++-- 12 files changed, 1353 insertions(+), 147 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index efd3be179..4c53dd461 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -223,7 +223,7 @@ define([ editUsers = users; }, - initEditUsers: function() { + getUsersInfo: function() { var usersArray = []; _.each(editUsers, function(item){ var fio = item.asc_getUserName().split(' '); @@ -248,6 +248,11 @@ define([ } }); var userSort = _.chain(usersArray).groupBy('idOriginal').value(); + return userSort; + }, + + initEditUsers: function() { + var users = this.getUsersInfo(); var templateUserItem = _.template([ '<% _.each(users, function (user) { %>', '
  • ' + @@ -263,7 +268,7 @@ define([ this.textEditUser + '' + '
      ' + - templateUserItem({users: userSort}) + + templateUserItem({users: users}) + '
    '); $('#user-list').html(templateUserList()); }, @@ -680,6 +685,14 @@ define([ }, //Comments + getInitials: function(name) { + var fio = name.split(' '); + var initials = fio[0].substring(0, 1).toUpperCase(); + if (fio.length > 1) { + initials += fio[fio.length - 1].substring(0, 1).toUpperCase(); + } + return initials; + }, findComment: function(uid) { var comment; @@ -738,14 +751,14 @@ define([ '
    ' + '
    ' + '
    ' + - '
    ' + + '
    ' + '
    ' + '
    ' + '' + me.textAddReply + '' + '
    ' + '
    ' + - '' + - '' + + '' + + '' + '
    ' + '
    ' + '
    ' + @@ -781,25 +794,46 @@ define([ $swipeContainer.single('touchstart', _.bind(function(e){ var touchobj = e.changedTouches[0]; me.swipeStart = parseInt(touchobj.clientY); + me.swipeChange = parseInt(touchobj.clientY); + me.swipeHeight = parseInt($('.container-view-comment').css('height')); + e.preventDefault(); + }, me)); + $swipeContainer.single('touchmove', _.bind(function(e){ + var touchobj = e.changedTouches[0]; + var dist = parseInt(touchobj.clientY) - me.swipeStart; + var newHeight; + if (dist < 0) { + newHeight = '100%'; + me.swipeFull = true; + me.closeCommentPicker = false; + $('.container-view-comment').css('opacity', '1'); + } else if (dist < 100) { + newHeight = '50%'; + me.swipeFull = false; + me.closeCommentPicker = false; + $('.container-view-comment').css('opacity', '1'); + } else { + me.closeCommentPicker = true; + $('.container-view-comment').css('opacity', '0.6'); + } + $('.container-view-comment').css('height', newHeight); + me.swipeHeight = newHeight; e.preventDefault(); }, me)); $swipeContainer.single('touchend', _.bind(function (e) { var touchobj = e.changedTouches[0]; var swipeEnd = parseInt(touchobj.clientY); var dist = swipeEnd - me.swipeStart; - if (dist > 20) { - if (me.swipeFull) { + if (me.closeCommentPicker) { + uiApp.closeModal(); + } else if (me.swipeFull) { + if (dist > 20) { $('.container-view-comment').css('height', '50%'); - me.swipeFull = false; - } else { - uiApp.closeModal(); } - } else if (dist < 0) { - $('.container-view-comment').css('height', '100%'); - me.swipeFull = true; - } else { - $('.container-view-comment').css('height', '50%'); } + me.swipeHeight = undefined; + me.swipeChange = undefined; + me.closeCommentPicker = undefined; }, me)); $('.prev-comment').single('click', _.bind(me.onViewPrevComment, me)); @@ -808,6 +842,21 @@ define([ $('.add-reply').single('click', _.bind(me.onClickAddReply, me)); $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); $('.comment-resolve').single('click', _.bind(me.onClickResolveComment, me)); + + me.updateDisabledCommentArrow(); + }, + + updateDisabledCommentArrow: function() { + if (this.indexCurrentComment === 0) { + $('.prev-comment').addClass('disabled'); + } else { + $('.prev-comment').removeClass('disabled'); + } + if (this.indexCurrentComment + 1 === this.showComments.length) { + $('.next-comment').addClass('disabled'); + } else { + $('.next-comment').removeClass('disabled'); + } }, onViewPrevComment: function() { @@ -817,6 +866,7 @@ define([ $('.comment-menu').single('click', _.bind(this.initMenuComments, this)); $('.reply-menu').single('click', _.bind(this.initReplyMenu, this)); $('.comment-resolve').single('click', _.bind(this.onClickResolveComment, this)); + this.updateDisabledCommentArrow(); } }, @@ -827,11 +877,13 @@ define([ $('.comment-menu').single('click', _.bind(this.initMenuComments, this)); $('.reply-menu').single('click', _.bind(this.initReplyMenu, this)); $('.comment-resolve').single('click', _.bind(this.onClickResolveComment, this)); + this.updateDisabledCommentArrow(); } }, onClickAddReply: function() { var me = this; + var isAndroid = Framework7.prototype.device.android === true; if (this.indexCurrentComment > -1 && this.indexCurrentComment < this.showComments.length) { var addReplyView, comment = this.showComments[this.indexCurrentComment]; @@ -840,16 +892,24 @@ define([ '
    ' + '
    ' + '
    ' + - '
    ' + '' + me.textCancel + ''+ '
    ' + + '
    ' + (isAndroid ? '' : '' + me.textCancel + '') + '
    ' + '
    ' + me.textAddReply + '
    ' + - '
    ' + '' + me.textDone + '' + '
    ' + + '
    ' + (isAndroid ? '' : '' + me.textDone + '') + '
    ' + '
    ' + '
    ' + + '
    ' + + '
    ' + + '
    ' + '
    ' + + (isAndroid ? '
    ' + comment.userInitials + '
    ' : '') + '
    ' + comment.username + '
    ' + '
    ' + comment.date + '
    ' + + (isAndroid ? '
    ' : '') + '
    ' + '
    ' + + '
    ' + + '
    ' + + '
    ' + '
    ' ); $('.popup').css('z-index', '20000'); @@ -953,25 +1013,28 @@ define([ date: me.dateToLocaleTimeString(date), userid: _userId, username: me.currentUser.asc_getUserName(), - usercolor: me.currentUser.asc_getColor() + usercolor: me.currentUser.asc_getColor(), + userInitials: me.getInitials(me.currentUser.asc_getUserName()) }; if (Common.SharedSettings.get('phone')) { - modalView = $$(uiApp.pickerModal( - '
    ' + + modalView = $$(uiApp.popup( + '
    ' + '
    ' + '
    ' + - '
    ' + (!isAndroid ? '' + me.textCancel + '' : '') + '
    ' + + '
    ' + (!isAndroid ? '' + me.textCancel + '' : '') + '
    ' + '
    ' + me.textAddComment + '
    ' + - '
    ' + (!isAndroid ? '' + me.textDone + '' : '') + '
    ' + + '
    ' + (!isAndroid ? '' + me.textDone + '' : '') + '
    ' + '
    ' + '
    ' + '
    ' + '
    ' + '
    ' + '
    ' + + (isAndroid ? '
    ' + comment.userInitials + '
    ' : '') + '
    ' + comment.username + '
    ' + '
    ' + comment.date + '
    ' + + (isAndroid ? '
    ' : '') + '
    ' + '
    ' + '
    ' + @@ -1050,7 +1113,8 @@ define([ } _menuItems.push({ caption: me.textDeleteComment, - event: 'delete' + event: 'delete', + color: 'red' }); _.each(_menuItems, function (item) { item.text = item.caption; @@ -1079,7 +1143,8 @@ define([ }); _menuItems.push({ caption: me.textDeleteReply, - event: 'deletereply' + event: 'deletereply', + color: 'red' }); _.each(_menuItems, function (item) { item.text = item.caption; @@ -1214,7 +1279,8 @@ define([ }, showEditCommentModal: function() { - var me = this; + var me = this, + isAndroid = Framework7.prototype.device.android === true; if (this.indexCurrentComment > -1 && this.indexCurrentComment < this.showComments.length) { var comment = this.showComments[this.indexCurrentComment]; if (Common.SharedSettings.get('phone')) { @@ -1222,16 +1288,24 @@ define([ '
    ' + '
    ' + '
    ' + - '
    ' + '' + me.textCancel + ''+ '
    ' + + '
    ' + (isAndroid ? ' ' : '' + me.textCancel + '')+ '
    ' + '
    ' + me.textEditComment + '
    ' + - '
    ' + '' + me.textDone + '' + '
    ' + + '
    ' + (isAndroid ? '' : '' + me.textDone + '') + '
    ' + '
    ' + '
    ' + + '
    ' + + '
    ' + + '
    ' + '
    ' + + (isAndroid ? '
    ' + comment.userInitials + '
    ' : '') + '
    ' + comment.username + '
    ' + '
    ' + comment.date + '
    ' + + (isAndroid ? '
    ' : '') + '
    ' + '
    ' + + '
    ' + + '
    ' + + '
    ' + '
    ' ); $('.popup').css('z-index', '20000'); @@ -1263,6 +1337,7 @@ define([ comment, replies, reply; + var isAndroid = Framework7.prototype.device.android === true; this.showComments && (comment = this.showComments[indComment]); comment && (replies = comment.replys); replies && (reply = replies[indReply]); @@ -1272,16 +1347,24 @@ define([ '
    ' + '
    ' + '
    ' + - '
    ' + '' + me.textCancel + '' + '
    ' + + '
    ' + (isAndroid ? '' : '' + me.textCancel + '') + '
    ' + '
    ' + me.textEditReply + '
    ' + - '
    ' + '' + me.textDone + '' + '
    ' + + '
    ' + (isAndroid ? '' : '' + me.textDone + '') + '
    ' + '
    ' + '
    ' + + '
    ' + + '
    ' + + '
    ' + '
    ' + + (isAndroid ? '
    ' + comment.userInitials + '
    ' : '') + '
    ' + reply.username + '
    ' + '
    ' + reply.date + '
    ' + + (isAndroid ? '
    ' : '') + '
    ' + '
    ' + + '
    ' + + '
    ' + + '
    ' + '
    ' ); $('.popup').css('z-index', '20000'); @@ -1396,14 +1479,16 @@ define([ ((data.asc_getReply(i).asc_getTime() == '') ? new Date() : new Date(this.stringUtcToLocalDate(data.asc_getReply(i).asc_getTime()))); var user = _.findWhere(editUsers, {idOriginal: data.asc_getReply(i).asc_getUserId()}); + var username = data.asc_getReply(i).asc_getUserName(); replies.push({ ind : i, userid : data.asc_getReply(i).asc_getUserId(), - username : data.asc_getReply(i).asc_getUserName(), + username : username, usercolor : (user) ? user.asc_getColor() : null, date : this.dateToLocaleTimeString(date), reply : data.asc_getReply(i).asc_getText(), - time : date.getTime() + time : date.getTime(), + userInitials : this.getInitials(username) }); } } @@ -1415,10 +1500,11 @@ define([ ((data.asc_getTime() == '') ? new Date() : new Date(this.stringUtcToLocalDate(data.asc_getTime()))); var user = _.findWhere(editUsers, {idOriginal: data.asc_getUserId()}), groupname = id.substr(0, id.lastIndexOf('_')+1).match(/^(doc|sheet[0-9_]+)_/); + var username = data.asc_getUserName(); var comment = { uid : id, userid : data.asc_getUserId(), - username : data.asc_getUserName(), + username : username, usercolor : (user) ? user.asc_getColor() : null, date : this.dateToLocaleTimeString(date), quote : data.asc_getQuoteText(), @@ -1427,7 +1513,8 @@ define([ unattached : !_.isUndefined(data.asc_getDocumentFlag) ? data.asc_getDocumentFlag() : false, time : date.getTime(), replys : [], - groupName : (groupname && groupname.length>1) ? groupname[1] : null + groupName : (groupname && groupname.length>1) ? groupname[1] : null, + userInitials : this.getInitials(username) }; if (comment) { var replies = this.readSDKReplies(data); @@ -1473,14 +1560,16 @@ define([ ((data.asc_getReply(i).asc_getTime() == '') ? new Date() : new Date(this.stringUtcToLocalDate(data.asc_getReply(i).asc_getTime()))); user = _.findWhere(editUsers, {idOriginal: data.asc_getReply(i).asc_getUserId()}); + var username = data.asc_getReply(i).asc_getUserName(); replies.push({ ind : i, userid : data.asc_getReply(i).asc_getUserId(), - username : data.asc_getReply(i).asc_getUserName(), + username : username, usercolor : (user) ? user.asc_getColor() : null, date : me.dateToLocaleTimeString(dateReply), reply : data.asc_getReply(i).asc_getText(), - time : dateReply.getTime() + time : dateReply.getTime(), + userInitials : me.getInitials(username) }); } comment.replys = replies; diff --git a/apps/common/mobile/lib/view/Collaboration.js b/apps/common/mobile/lib/view/Collaboration.js index 3765c858e..d6ebec855 100644 --- a/apps/common/mobile/lib/view/Collaboration.js +++ b/apps/common/mobile/lib/view/Collaboration.js @@ -149,6 +149,7 @@ define([ //Comments renderViewComments: function(comments, indCurComment) { + var isAndroid = Framework7.prototype.device.android === true; if ($('.page-view-comments .page-content').length > 0) { var template = ''; if (comments && comments.length > 0) { @@ -157,10 +158,15 @@ define([ var comment = comments[indCurComment]; template += '
  • ' + '
    ' + - '
    ' + - '

    ' + comment.username + '

    ' + + '
    '; + if (isAndroid) { + template += '
    ' + comment.userInitials + '
    '; + } + template += '

    ' + comment.username + '

    ' + '

    ' + comment.date + '

    '; - if (comment.quote) template += '

    ' + comment.quote + '

    '; + if (isAndroid) { + template += '
    '; + } template += '
    '; template += '
    ' + '
    ' + @@ -168,17 +174,24 @@ define([ '
    ' + '
    '; + if (comment.quote) template += '

    ' + comment.quote + '

    '; template += '

    ' + comment.comment + '

    '; if (comment.replys.length > 0) { template += '
      '; _.each(comment.replys, function (reply) { template += '
    • ' + '
      ' + - '
      ' + - '

      ' + reply.username + '

      ' + + '
      '; + if (isAndroid) { + template += '
      ' + reply.userInitials + '
      ' + } + template += '

      ' + reply.username + '

      ' + '

      ' + reply.date + '

      ' + - '
      ' + - '
      ' + + '
      '; + if (isAndroid) { + template += '
      '; + } + template += '
      ' + '
      ' + '

      ' + reply.reply + '

      ' + '
      • '; diff --git a/apps/common/mobile/resources/less/ios/_collaboration.less b/apps/common/mobile/resources/less/ios/_collaboration.less index 5fd698055..68bebd264 100644 --- a/apps/common/mobile/resources/less/ios/_collaboration.less +++ b/apps/common/mobile/resources/less/ios/_collaboration.less @@ -180,12 +180,15 @@ .navbar { background-color: #FFFFFF; } + .page { + background-color: #FFFFFF; + } } //view comment .container-view-comment { -webkit-transition: height 100ms; - transition: height 100ms; + transition: height 120ms; background-color: #FFFFFF; border-top-left-radius: 4px; border-top-right-radius: 4px; @@ -279,6 +282,9 @@ margin-left: 0; } } + .page { + background-color: #FFFFFF; + } } .icon-arrow-comment { @@ -299,3 +305,7 @@ -webkit-transform: rotate(135deg); } } + +.actions-modal-button.color-red { + color: @red; +} diff --git a/apps/common/mobile/resources/less/material/_collaboration.less b/apps/common/mobile/resources/less/material/_collaboration.less index ea3cdf0f0..7760211d6 100644 --- a/apps/common/mobile/resources/less/material/_collaboration.less +++ b/apps/common/mobile/resources/less/material/_collaboration.less @@ -89,9 +89,8 @@ } } - //Comments -.page-comments { +.page-comments, .page-add-comment, .page-view-comments, .container-edit-comment, .container-add-reply { .list-block .item-inner { display: block; padding: 16px 0; @@ -99,13 +98,13 @@ } p { margin: 0; + word-break: break-word; } .user-name { - font-size: 17px; + font-size: 16px; line-height: 22px; color: #000000; margin: 0; - font-weight: bold; } .comment-date, .reply-date { font-size: 12px; @@ -123,24 +122,14 @@ padding-right: 15px; } .reply-item { - margin-top: 15px; - .user-name { - padding-top: 16px; + padding-right: 16px; + padding-top: 13px; + .header-reply { + display: flex; + justify-content: space-between; } - &:before { - content: ''; - position: absolute; - left: auto; - bottom: 0; - right: auto; - top: 0; - height: 1px; - width: 100%; - background-color: @listBlockBorderColor; - display: block; - z-index: 15; - -webkit-transform-origin: 50% 100%; - transform-origin: 50% 100%; + .user-name { + padding-top: 3px; } } .comment-quote { @@ -150,7 +139,193 @@ margin: 5px 0; font-size: 15px; } + + .wrap-comment { + padding: 16px 0 0 0; + } + .comment-textarea, .reply-textarea { + margin-top: 10px; + background:transparent; + border:none; + outline:none; + width: 100%; + min-height: 200px; + font-size: 15px; + } + + .header-comment { + display: flex; + justify-content: space-between; + padding-right: 16px; + margin-bottom: 13px; + .comment-right { + display: flex; + justify-content: space-between; + width: 70px; + } + .comment-left { + display: flex; + justify-content: space-between; + } + .initials-comment { + height: 40px; + width: 40px; + border-radius: 50px; + color: #FFFFFF; + display: flex; + justify-content: center; + align-items: center; + margin-right: 16px; + font-size: 18px; + } + } + .header-reply { + .reply-left { + display: flex; + justify-content: space-between; + align-items: flex-start; + } + .initials-reply { + width: 24px; + height: 24px; + color: #FFFFFF; + font-size: 11px; + display: flex; + justify-content: center; + align-items: center; + margin-right: 16px; + border-radius: 50px; + margin-top: 5px; + } + } } .settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after { display: none; +} + +.container-edit-comment { + .navbar { + background-color: #FFFFFF; + color: @themeColor; + } +} + +//view comment +.container-view-comment { + -webkit-transition: height 100ms; + transition: height 100ms; + background-color: #FFFFFF; + border-top-left-radius: 4px; + border-top-right-radius: 4px; + height: 50%; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); + .page-view-comments { + background-color: #FFFFFF; + .list-block { + margin-bottom: 120px; + ul:before, ul:after { + content: none; + } + .item-inner { + padding: 0; + } + } + + } + .toolbar { + position: absolute; + background-color: #FFFFFF; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); + &.toolbar-bottom { + top: auto; + } + &:before { + content: none; + } + a { + &.link { + color: @themeColor; + font-size: 16px; + } + } + .toolbar-inner { + display: flex; + justify-content: space-between; + padding: 0 16px; + .button-left { + min-width: 80px; + } + .button-right { + min-width: 62px; + display: flex; + justify-content: space-between; + a { + padding: 0 8px; + } + } + } + } + .swipe-container { + display: flex; + justify-content: center; + height: 40px; + .icon-swipe { + margin-top: 8px; + width: 40px; + height: 4px; + background: rgba(0, 0, 0, 0.12); + border-radius: 2px; + } + } + .list-block { + margin-top: 0; + } +} + +.container-view-add-comment, .container-edit-comment, .container-add-reply, container-edit-comment { + height: 100%; + .navbar { + background-color: #FFFFFF; + color: #000; + &:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #c4c4c4; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; + } + .navbar-inner { + justify-content: space-between; + } + a.link i + span { + margin-left: 0; + } + .center { + font-size: 18px; + } + .right { + margin-left: 0; + } + } + .page-add-comment { + background-color: #FFFFFF; + .page-content { + padding: 0 16px 80px; + } + } + .header-comment { + justify-content: flex-start; + } +} + +.actions-modal-button.color-red { + color: @red; } \ No newline at end of file diff --git a/apps/documenteditor/mobile/resources/css/app-ios.css b/apps/documenteditor/mobile/resources/css/app-ios.css index c5f043d0f..868b521d0 100644 --- a/apps/documenteditor/mobile/resources/css/app-ios.css +++ b/apps/documenteditor/mobile/resources/css/app-ios.css @@ -6626,9 +6626,12 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .navbar { background-color: #FFFFFF; } +.container-edit-comment .page { + background-color: #FFFFFF; +} .container-view-comment { -webkit-transition: height 100ms; - transition: height 100ms; + transition: height 120ms; background-color: #FFFFFF; border-top-left-radius: 4px; border-top-right-radius: 4px; @@ -6721,6 +6724,9 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-add-reply .navbar a.link i + span { margin-left: 0; } +.container-add-reply .page { + background-color: #FFFFFF; +} .icon-arrow-comment { border: solid black; border-width: 0 2px 2px 0; @@ -6738,6 +6744,9 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after transform: rotate(135deg); -webkit-transform: rotate(135deg); } +.actions-modal-button.color-red { + color: #ff3b30; +} .tablet .searchbar.document.replace .center .searchbar:first-child { margin-right: 10px; } @@ -7292,7 +7301,7 @@ i.icon.icon-resolve-comment { i.icon.icon-resolve-comment.check { width: 30px; height: 30px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2030%2030%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M0%200H30V30H0V0Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M11.6195%2020.8555C11.8237%2021.0673%2012.1658%2021.0577%2012.358%2020.8349L22.516%209.05783C22.7843%208.74676%2022.7528%208.27781%2022.4453%208.00545V8.00545C22.1315%207.72756%2021.651%207.7604%2021.3779%208.07839L12.3546%2018.587C12.1638%2018.8092%2011.8238%2018.8206%2011.6186%2018.6117L8.10643%2015.0366C7.81575%2014.7407%207.34084%2014.7345%207.04258%2015.0228V15.0228C6.74283%2015.3125%206.73444%2015.7903%207.02383%2016.0904L11.6195%2020.8555Z%22%20fill%3D%22%235B9F27%22%2F%3E%3C%2Fsvg%3E"); + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2030%2030%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M0%200H30V30H0V0Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M11.6195%2020.8555C11.8237%2021.0673%2012.1658%2021.0577%2012.358%2020.8349L22.516%209.05783C22.7843%208.74676%2022.7528%208.27781%2022.4453%208.00545V8.00545C22.1315%207.72756%2021.651%207.7604%2021.3779%208.07839L12.3546%2018.587C12.1638%2018.8092%2011.8238%2018.8206%2011.6186%2018.6117L8.10643%2015.0366C7.81575%2014.7407%207.34084%2014.7345%207.04258%2015.0228V15.0228C6.74283%2015.3125%206.73444%2015.7903%207.02383%2016.0904L11.6195%2020.8555Z%22%20fill%3D%22%234cd964%22%2F%3E%3C%2Fsvg%3E"); } .label-switch input[type="checkbox"]:checked + .checkbox { background: #446995; diff --git a/apps/documenteditor/mobile/resources/css/app-material.css b/apps/documenteditor/mobile/resources/css/app-material.css index 450682feb..ed009b11e 100644 --- a/apps/documenteditor/mobile/resources/css/app-material.css +++ b/apps/documenteditor/mobile/resources/css/app-material.css @@ -6064,23 +6064,43 @@ html.phone .document-menu .list-block .item-link { #user-list ul:before { content: none; } -.page-comments .list-block .item-inner { +.page-comments .list-block .item-inner, +.page-add-comment .list-block .item-inner, +.page-view-comments .list-block .item-inner, +.container-edit-comment .list-block .item-inner, +.container-add-reply .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; } -.page-comments p { +.page-comments p, +.page-add-comment p, +.page-view-comments p, +.container-edit-comment p, +.container-add-reply p { margin: 0; + word-break: break-word; } -.page-comments .user-name { - font-size: 17px; +.page-comments .user-name, +.page-add-comment .user-name, +.page-view-comments .user-name, +.container-edit-comment .user-name, +.container-add-reply .user-name { + font-size: 16px; line-height: 22px; color: #000000; margin: 0; - font-weight: bold; } .page-comments .comment-date, -.page-comments .reply-date { +.page-add-comment .comment-date, +.page-view-comments .comment-date, +.container-edit-comment .comment-date, +.container-add-reply .comment-date, +.page-comments .reply-date, +.page-add-comment .reply-date, +.page-view-comments .reply-date, +.container-edit-comment .reply-date, +.container-add-reply .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6088,7 +6108,15 @@ html.phone .document-menu .list-block .item-link { margin-top: 0px; } .page-comments .comment-text, -.page-comments .reply-text { +.page-add-comment .comment-text, +.page-view-comments .comment-text, +.container-edit-comment .comment-text, +.container-add-reply .comment-text, +.page-comments .reply-text, +.page-add-comment .reply-text, +.page-view-comments .reply-text, +.container-edit-comment .reply-text, +.container-add-reply .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6096,38 +6124,284 @@ html.phone .document-menu .list-block .item-link { max-width: 100%; padding-right: 15px; } -.page-comments .reply-item { - margin-top: 15px; +.page-comments .reply-item, +.page-add-comment .reply-item, +.page-view-comments .reply-item, +.container-edit-comment .reply-item, +.container-add-reply .reply-item { + padding-right: 16px; + padding-top: 13px; } -.page-comments .reply-item .user-name { - padding-top: 16px; +.page-comments .reply-item .header-reply, +.page-add-comment .reply-item .header-reply, +.page-view-comments .reply-item .header-reply, +.container-edit-comment .reply-item .header-reply, +.container-add-reply .reply-item .header-reply { + display: flex; + justify-content: space-between; } -.page-comments .reply-item:before { - content: ''; - position: absolute; - left: auto; - bottom: 0; - right: auto; - top: 0; - height: 1px; - width: 100%; - background-color: rgba(0, 0, 0, 0.12); - display: block; - z-index: 15; - -webkit-transform-origin: 50% 100%; - transform-origin: 50% 100%; +.page-comments .reply-item .user-name, +.page-add-comment .reply-item .user-name, +.page-view-comments .reply-item .user-name, +.container-edit-comment .reply-item .user-name, +.container-add-reply .reply-item .user-name { + padding-top: 3px; } -.page-comments .comment-quote { +.page-comments .comment-quote, +.page-add-comment .comment-quote, +.page-view-comments .comment-quote, +.container-edit-comment .comment-quote, +.container-add-reply .comment-quote { color: #446995; border-left: 1px solid #446995; padding-left: 10px; margin: 5px 0; font-size: 15px; } +.page-comments .wrap-comment, +.page-add-comment .wrap-comment, +.page-view-comments .wrap-comment, +.container-edit-comment .wrap-comment, +.container-add-reply .wrap-comment { + padding: 16px 0 0 0; +} +.page-comments .comment-textarea, +.page-add-comment .comment-textarea, +.page-view-comments .comment-textarea, +.container-edit-comment .comment-textarea, +.container-add-reply .comment-textarea, +.page-comments .reply-textarea, +.page-add-comment .reply-textarea, +.page-view-comments .reply-textarea, +.container-edit-comment .reply-textarea, +.container-add-reply .reply-textarea { + margin-top: 10px; + background: transparent; + border: none; + outline: none; + width: 100%; + min-height: 200px; + font-size: 15px; +} +.page-comments .header-comment, +.page-add-comment .header-comment, +.page-view-comments .header-comment, +.container-edit-comment .header-comment, +.container-add-reply .header-comment { + display: flex; + justify-content: space-between; + padding-right: 16px; + margin-bottom: 13px; +} +.page-comments .header-comment .comment-right, +.page-add-comment .header-comment .comment-right, +.page-view-comments .header-comment .comment-right, +.container-edit-comment .header-comment .comment-right, +.container-add-reply .header-comment .comment-right { + display: flex; + justify-content: space-between; + width: 70px; +} +.page-comments .header-comment .comment-left, +.page-add-comment .header-comment .comment-left, +.page-view-comments .header-comment .comment-left, +.container-edit-comment .header-comment .comment-left, +.container-add-reply .header-comment .comment-left { + display: flex; + justify-content: space-between; +} +.page-comments .header-comment .initials-comment, +.page-add-comment .header-comment .initials-comment, +.page-view-comments .header-comment .initials-comment, +.container-edit-comment .header-comment .initials-comment, +.container-add-reply .header-comment .initials-comment { + height: 40px; + width: 40px; + border-radius: 50px; + color: #FFFFFF; + display: flex; + justify-content: center; + align-items: center; + margin-right: 16px; + font-size: 18px; +} +.page-comments .header-reply .reply-left, +.page-add-comment .header-reply .reply-left, +.page-view-comments .header-reply .reply-left, +.container-edit-comment .header-reply .reply-left, +.container-add-reply .header-reply .reply-left { + display: flex; + justify-content: space-between; + align-items: flex-start; +} +.page-comments .header-reply .initials-reply, +.page-add-comment .header-reply .initials-reply, +.page-view-comments .header-reply .initials-reply, +.container-edit-comment .header-reply .initials-reply, +.container-add-reply .header-reply .initials-reply { + width: 24px; + height: 24px; + color: #FFFFFF; + font-size: 11px; + display: flex; + justify-content: center; + align-items: center; + margin-right: 16px; + border-radius: 50px; + margin-top: 5px; +} .settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after { display: none; } +.container-edit-comment .navbar { + background-color: #FFFFFF; + color: #446995; +} +.container-view-comment { + -webkit-transition: height 100ms; + transition: height 100ms; + background-color: #FFFFFF; + border-top-left-radius: 4px; + border-top-right-radius: 4px; + height: 50%; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); +} +.container-view-comment .page-view-comments { + background-color: #FFFFFF; +} +.container-view-comment .page-view-comments .list-block { + margin-bottom: 120px; +} +.container-view-comment .page-view-comments .list-block ul:before, +.container-view-comment .page-view-comments .list-block ul:after { + content: none; +} +.container-view-comment .page-view-comments .list-block .item-inner { + padding: 0; +} +.container-view-comment .toolbar { + position: absolute; + background-color: #FFFFFF; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); +} +.container-view-comment .toolbar.toolbar-bottom { + top: auto; +} +.container-view-comment .toolbar:before { + content: none; +} +.container-view-comment .toolbar a.link { + color: #446995; + font-size: 16px; +} +.container-view-comment .toolbar .toolbar-inner { + display: flex; + justify-content: space-between; + padding: 0 16px; +} +.container-view-comment .toolbar .toolbar-inner .button-left { + min-width: 80px; +} +.container-view-comment .toolbar .toolbar-inner .button-right { + min-width: 62px; + display: flex; + justify-content: space-between; +} +.container-view-comment .toolbar .toolbar-inner .button-right a { + padding: 0 8px; +} +.container-view-comment .swipe-container { + display: flex; + justify-content: center; + height: 40px; +} +.container-view-comment .swipe-container .icon-swipe { + margin-top: 8px; + width: 40px; + height: 4px; + background: rgba(0, 0, 0, 0.12); + border-radius: 2px; +} +.container-view-comment .list-block { + margin-top: 0; +} +.container-view-add-comment, +.container-edit-comment, +.container-add-reply, +container-edit-comment { + height: 100%; +} +.container-view-add-comment .navbar, +.container-edit-comment .navbar, +.container-add-reply .navbar, +container-edit-comment .navbar { + background-color: #FFFFFF; + color: #000; +} +.container-view-add-comment .navbar:after, +.container-edit-comment .navbar:after, +.container-add-reply .navbar:after, +container-edit-comment .navbar:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #c4c4c4; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +.container-view-add-comment .navbar .navbar-inner, +.container-edit-comment .navbar .navbar-inner, +.container-add-reply .navbar .navbar-inner, +container-edit-comment .navbar .navbar-inner { + justify-content: space-between; +} +.container-view-add-comment .navbar a.link i + span, +.container-edit-comment .navbar a.link i + span, +.container-add-reply .navbar a.link i + span, +container-edit-comment .navbar a.link i + span { + margin-left: 0; +} +.container-view-add-comment .navbar .center, +.container-edit-comment .navbar .center, +.container-add-reply .navbar .center, +container-edit-comment .navbar .center { + font-size: 18px; +} +.container-view-add-comment .navbar .right, +.container-edit-comment .navbar .right, +.container-add-reply .navbar .right, +container-edit-comment .navbar .right { + margin-left: 0; +} +.container-view-add-comment .page-add-comment, +.container-edit-comment .page-add-comment, +.container-add-reply .page-add-comment, +container-edit-comment .page-add-comment { + background-color: #FFFFFF; +} +.container-view-add-comment .page-add-comment .page-content, +.container-edit-comment .page-add-comment .page-content, +.container-add-reply .page-add-comment .page-content, +container-edit-comment .page-add-comment .page-content { + padding: 0 16px 80px; +} +.container-view-add-comment .header-comment, +.container-edit-comment .header-comment, +.container-add-reply .header-comment, +container-edit-comment .header-comment { + justify-content: flex-start; +} +.actions-modal-button.color-red { + color: #f44336; +} .tablet .searchbar.document.replace .center > .replace { display: flex; } @@ -6564,6 +6838,41 @@ i.icon.icon-paste { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%202H0V20H9V24H24V7H19V2H14V3H18V7H9V19H1V3H5V2ZM10%208H23V23H10V8Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20d%3D%22M5%200H14V5H5V0Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2012H12V11H21V12Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2016H12V15H21V16Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2020H12V19H21V20Z%22%20fill%3D%22black%22%2F%3E%3C%2Fsvg%3E"); } +i.icon.icon-menu-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M16.6047%2016.5848C17.0078%2016.1793%2017.4729%2015.9766%2018%2015.9766C18.5271%2015.9766%2018.9922%2016.1793%2019.3953%2016.5848C19.7984%2016.9903%2020%2017.4581%2020%2017.9883C20%2018.5185%2019.7984%2018.9864%2019.3953%2019.3918C18.9922%2019.7973%2018.5271%2020%2018%2020C17.4729%2020%2017.0078%2019.7973%2016.6047%2019.3918C16.2016%2018.9864%2016%2018.5185%2016%2017.9883C16%2017.4581%2016.2016%2016.9903%2016.6047%2016.5848ZM16.6047%2010.5965C17.0078%2010.191%2017.4729%209.9883%2018%209.9883C18.5271%209.9883%2018.9922%2010.191%2019.3953%2010.5965C19.7984%2011.0019%2020%2011.4698%2020%2012C20%2012.5302%2019.7984%2012.9981%2019.3953%2013.4035C18.9922%2013.809%2018.5271%2014.0117%2018%2014.0117C17.4729%2014.0117%2017.0078%2013.809%2016.6047%2013.4035C16.2016%2012.9981%2016%2012.5302%2016%2012C16%2011.4698%2016.2016%2011.0019%2016.6047%2010.5965ZM19.3953%207.4152C18.9922%207.82066%2018.5271%208.02339%2018%208.02339C17.4729%208.02339%2017.0078%207.82066%2016.6047%207.4152C16.2016%207.00975%2016%206.54191%2016%206.0117C16%205.48148%2016.2016%205.01365%2016.6047%204.60819C17.0078%204.20273%2017.4729%204%2018%204C18.5271%204%2018.9922%204.20273%2019.3953%204.60819C19.7984%205.01365%2020%205.48148%2020%206.0117C20%206.54191%2019.7984%207.00975%2019.3953%207.4152Z%22%20fill%3D%22black%22%20fill-opacity%3D%220.6%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-resolve-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9%2016.1719L19.5938%205.57812L21%206.98438L9%2018.9844L3.42188%2013.4062L4.82812%2012L9%2016.1719Z%22%20fill%3D%22black%22%20fill-opacity%3D%220.6%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-resolve-comment.check { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9%2016.1719L19.5938%205.57812L21%206.98438L9%2018.9844L3.42188%2013.4062L4.82812%2012L9%2016.1719Z%22%20fill%3D%22%2340865C%22%20fill-opacity%3D%220.6%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-arrow-comment.left { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M15.4219%207.40625L10.8281%2012L15.4219%2016.5938L14.0156%2018L8.01562%2012L14.0156%206L15.4219%207.40625Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-arrow-comment.right { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9.98438%206L15.9844%2012L9.98438%2018L8.57812%2016.5938L13.1719%2012L8.57812%207.40625L9.98438%206Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-close-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18.9844%206.42188L13.4062%2012L18.9844%2017.5781L17.5781%2018.9844L12%2013.4062L6.42188%2018.9844L5.01562%2017.5781L10.5938%2012L5.01562%206.42188L6.42188%205.01562L12%2010.5938L17.5781%205.01562L18.9844%206.42188Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-done-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9%2016.1719L19.5938%205.57812L21%206.98438L9%2018.9844L3.42188%2013.4062L4.82812%2012L9%2016.1719Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); +} .navbar i.icon.icon-undo { width: 22px; height: 22px; diff --git a/apps/documenteditor/mobile/resources/less/ios/_icons.less b/apps/documenteditor/mobile/resources/less/ios/_icons.less index 1fb110579..754b73559 100644 --- a/apps/documenteditor/mobile/resources/less/ios/_icons.less +++ b/apps/documenteditor/mobile/resources/less/ios/_icons.less @@ -491,6 +491,6 @@ i.icon { &.icon-resolve-comment.check { width: 30px; height: 30px; - .encoded-svg-background(''); + .encoded-svg-background(''); } } \ No newline at end of file diff --git a/apps/documenteditor/mobile/resources/less/material/_icons.less b/apps/documenteditor/mobile/resources/less/material/_icons.less index 681503ddb..4b5473bd6 100644 --- a/apps/documenteditor/mobile/resources/less/material/_icons.less +++ b/apps/documenteditor/mobile/resources/less/material/_icons.less @@ -404,6 +404,41 @@ i.icon { height: 24px; .encoded-svg-background(''); } + &.icon-menu-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-resolve-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-resolve-comment.check { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-arrow-comment.left { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-arrow-comment.right { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-close-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-done-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } } // Overwrite color for toolbar diff --git a/apps/presentationeditor/mobile/resources/css/app-ios.css b/apps/presentationeditor/mobile/resources/css/app-ios.css index 3052c79ac..bbbc0b1be 100644 --- a/apps/presentationeditor/mobile/resources/css/app-ios.css +++ b/apps/presentationeditor/mobile/resources/css/app-ios.css @@ -6626,9 +6626,12 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .navbar { background-color: #FFFFFF; } +.container-edit-comment .page { + background-color: #FFFFFF; +} .container-view-comment { -webkit-transition: height 100ms; - transition: height 100ms; + transition: height 120ms; background-color: #FFFFFF; border-top-left-radius: 4px; border-top-right-radius: 4px; @@ -6721,6 +6724,9 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-add-reply .navbar a.link i + span { margin-left: 0; } +.container-add-reply .page { + background-color: #FFFFFF; +} .icon-arrow-comment { border: solid black; border-width: 0 2px 2px 0; @@ -6738,6 +6744,9 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after transform: rotate(135deg); -webkit-transform: rotate(135deg); } +.actions-modal-button.color-red { + color: #ff3b30; +} .tablet .searchbar.document.replace .center .searchbar:first-child { margin-right: 10px; } diff --git a/apps/presentationeditor/mobile/resources/css/app-material.css b/apps/presentationeditor/mobile/resources/css/app-material.css index 3855bdd11..df2107b28 100644 --- a/apps/presentationeditor/mobile/resources/css/app-material.css +++ b/apps/presentationeditor/mobile/resources/css/app-material.css @@ -6064,23 +6064,43 @@ html.phone .document-menu .list-block .item-link { #user-list ul:before { content: none; } -.page-comments .list-block .item-inner { +.page-comments .list-block .item-inner, +.page-add-comment .list-block .item-inner, +.page-view-comments .list-block .item-inner, +.container-edit-comment .list-block .item-inner, +.container-add-reply .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; } -.page-comments p { +.page-comments p, +.page-add-comment p, +.page-view-comments p, +.container-edit-comment p, +.container-add-reply p { margin: 0; + word-break: break-word; } -.page-comments .user-name { - font-size: 17px; +.page-comments .user-name, +.page-add-comment .user-name, +.page-view-comments .user-name, +.container-edit-comment .user-name, +.container-add-reply .user-name { + font-size: 16px; line-height: 22px; color: #000000; margin: 0; - font-weight: bold; } .page-comments .comment-date, -.page-comments .reply-date { +.page-add-comment .comment-date, +.page-view-comments .comment-date, +.container-edit-comment .comment-date, +.container-add-reply .comment-date, +.page-comments .reply-date, +.page-add-comment .reply-date, +.page-view-comments .reply-date, +.container-edit-comment .reply-date, +.container-add-reply .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6088,7 +6108,15 @@ html.phone .document-menu .list-block .item-link { margin-top: 0px; } .page-comments .comment-text, -.page-comments .reply-text { +.page-add-comment .comment-text, +.page-view-comments .comment-text, +.container-edit-comment .comment-text, +.container-add-reply .comment-text, +.page-comments .reply-text, +.page-add-comment .reply-text, +.page-view-comments .reply-text, +.container-edit-comment .reply-text, +.container-add-reply .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6096,38 +6124,284 @@ html.phone .document-menu .list-block .item-link { max-width: 100%; padding-right: 15px; } -.page-comments .reply-item { - margin-top: 15px; +.page-comments .reply-item, +.page-add-comment .reply-item, +.page-view-comments .reply-item, +.container-edit-comment .reply-item, +.container-add-reply .reply-item { + padding-right: 16px; + padding-top: 13px; } -.page-comments .reply-item .user-name { - padding-top: 16px; +.page-comments .reply-item .header-reply, +.page-add-comment .reply-item .header-reply, +.page-view-comments .reply-item .header-reply, +.container-edit-comment .reply-item .header-reply, +.container-add-reply .reply-item .header-reply { + display: flex; + justify-content: space-between; } -.page-comments .reply-item:before { - content: ''; - position: absolute; - left: auto; - bottom: 0; - right: auto; - top: 0; - height: 1px; - width: 100%; - background-color: rgba(0, 0, 0, 0.12); - display: block; - z-index: 15; - -webkit-transform-origin: 50% 100%; - transform-origin: 50% 100%; +.page-comments .reply-item .user-name, +.page-add-comment .reply-item .user-name, +.page-view-comments .reply-item .user-name, +.container-edit-comment .reply-item .user-name, +.container-add-reply .reply-item .user-name { + padding-top: 3px; } -.page-comments .comment-quote { +.page-comments .comment-quote, +.page-add-comment .comment-quote, +.page-view-comments .comment-quote, +.container-edit-comment .comment-quote, +.container-add-reply .comment-quote { color: #aa5252; border-left: 1px solid #aa5252; padding-left: 10px; margin: 5px 0; font-size: 15px; } +.page-comments .wrap-comment, +.page-add-comment .wrap-comment, +.page-view-comments .wrap-comment, +.container-edit-comment .wrap-comment, +.container-add-reply .wrap-comment { + padding: 16px 0 0 0; +} +.page-comments .comment-textarea, +.page-add-comment .comment-textarea, +.page-view-comments .comment-textarea, +.container-edit-comment .comment-textarea, +.container-add-reply .comment-textarea, +.page-comments .reply-textarea, +.page-add-comment .reply-textarea, +.page-view-comments .reply-textarea, +.container-edit-comment .reply-textarea, +.container-add-reply .reply-textarea { + margin-top: 10px; + background: transparent; + border: none; + outline: none; + width: 100%; + min-height: 200px; + font-size: 15px; +} +.page-comments .header-comment, +.page-add-comment .header-comment, +.page-view-comments .header-comment, +.container-edit-comment .header-comment, +.container-add-reply .header-comment { + display: flex; + justify-content: space-between; + padding-right: 16px; + margin-bottom: 13px; +} +.page-comments .header-comment .comment-right, +.page-add-comment .header-comment .comment-right, +.page-view-comments .header-comment .comment-right, +.container-edit-comment .header-comment .comment-right, +.container-add-reply .header-comment .comment-right { + display: flex; + justify-content: space-between; + width: 70px; +} +.page-comments .header-comment .comment-left, +.page-add-comment .header-comment .comment-left, +.page-view-comments .header-comment .comment-left, +.container-edit-comment .header-comment .comment-left, +.container-add-reply .header-comment .comment-left { + display: flex; + justify-content: space-between; +} +.page-comments .header-comment .initials-comment, +.page-add-comment .header-comment .initials-comment, +.page-view-comments .header-comment .initials-comment, +.container-edit-comment .header-comment .initials-comment, +.container-add-reply .header-comment .initials-comment { + height: 40px; + width: 40px; + border-radius: 50px; + color: #FFFFFF; + display: flex; + justify-content: center; + align-items: center; + margin-right: 16px; + font-size: 18px; +} +.page-comments .header-reply .reply-left, +.page-add-comment .header-reply .reply-left, +.page-view-comments .header-reply .reply-left, +.container-edit-comment .header-reply .reply-left, +.container-add-reply .header-reply .reply-left { + display: flex; + justify-content: space-between; + align-items: flex-start; +} +.page-comments .header-reply .initials-reply, +.page-add-comment .header-reply .initials-reply, +.page-view-comments .header-reply .initials-reply, +.container-edit-comment .header-reply .initials-reply, +.container-add-reply .header-reply .initials-reply { + width: 24px; + height: 24px; + color: #FFFFFF; + font-size: 11px; + display: flex; + justify-content: center; + align-items: center; + margin-right: 16px; + border-radius: 50px; + margin-top: 5px; +} .settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after { display: none; } +.container-edit-comment .navbar { + background-color: #FFFFFF; + color: #aa5252; +} +.container-view-comment { + -webkit-transition: height 100ms; + transition: height 100ms; + background-color: #FFFFFF; + border-top-left-radius: 4px; + border-top-right-radius: 4px; + height: 50%; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); +} +.container-view-comment .page-view-comments { + background-color: #FFFFFF; +} +.container-view-comment .page-view-comments .list-block { + margin-bottom: 120px; +} +.container-view-comment .page-view-comments .list-block ul:before, +.container-view-comment .page-view-comments .list-block ul:after { + content: none; +} +.container-view-comment .page-view-comments .list-block .item-inner { + padding: 0; +} +.container-view-comment .toolbar { + position: absolute; + background-color: #FFFFFF; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); +} +.container-view-comment .toolbar.toolbar-bottom { + top: auto; +} +.container-view-comment .toolbar:before { + content: none; +} +.container-view-comment .toolbar a.link { + color: #aa5252; + font-size: 16px; +} +.container-view-comment .toolbar .toolbar-inner { + display: flex; + justify-content: space-between; + padding: 0 16px; +} +.container-view-comment .toolbar .toolbar-inner .button-left { + min-width: 80px; +} +.container-view-comment .toolbar .toolbar-inner .button-right { + min-width: 62px; + display: flex; + justify-content: space-between; +} +.container-view-comment .toolbar .toolbar-inner .button-right a { + padding: 0 8px; +} +.container-view-comment .swipe-container { + display: flex; + justify-content: center; + height: 40px; +} +.container-view-comment .swipe-container .icon-swipe { + margin-top: 8px; + width: 40px; + height: 4px; + background: rgba(0, 0, 0, 0.12); + border-radius: 2px; +} +.container-view-comment .list-block { + margin-top: 0; +} +.container-view-add-comment, +.container-edit-comment, +.container-add-reply, +container-edit-comment { + height: 100%; +} +.container-view-add-comment .navbar, +.container-edit-comment .navbar, +.container-add-reply .navbar, +container-edit-comment .navbar { + background-color: #FFFFFF; + color: #000; +} +.container-view-add-comment .navbar:after, +.container-edit-comment .navbar:after, +.container-add-reply .navbar:after, +container-edit-comment .navbar:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #c4c4c4; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +.container-view-add-comment .navbar .navbar-inner, +.container-edit-comment .navbar .navbar-inner, +.container-add-reply .navbar .navbar-inner, +container-edit-comment .navbar .navbar-inner { + justify-content: space-between; +} +.container-view-add-comment .navbar a.link i + span, +.container-edit-comment .navbar a.link i + span, +.container-add-reply .navbar a.link i + span, +container-edit-comment .navbar a.link i + span { + margin-left: 0; +} +.container-view-add-comment .navbar .center, +.container-edit-comment .navbar .center, +.container-add-reply .navbar .center, +container-edit-comment .navbar .center { + font-size: 18px; +} +.container-view-add-comment .navbar .right, +.container-edit-comment .navbar .right, +.container-add-reply .navbar .right, +container-edit-comment .navbar .right { + margin-left: 0; +} +.container-view-add-comment .page-add-comment, +.container-edit-comment .page-add-comment, +.container-add-reply .page-add-comment, +container-edit-comment .page-add-comment { + background-color: #FFFFFF; +} +.container-view-add-comment .page-add-comment .page-content, +.container-edit-comment .page-add-comment .page-content, +.container-add-reply .page-add-comment .page-content, +container-edit-comment .page-add-comment .page-content { + padding: 0 16px 80px; +} +.container-view-add-comment .header-comment, +.container-edit-comment .header-comment, +.container-add-reply .header-comment, +container-edit-comment .header-comment { + justify-content: flex-start; +} +.actions-modal-button.color-red { + color: #f44336; +} .tablet .searchbar.document.replace .center > .replace { display: flex; } diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css index 6d965e8e9..0c2270a0d 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css @@ -6626,9 +6626,12 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .navbar { background-color: #FFFFFF; } +.container-edit-comment .page { + background-color: #FFFFFF; +} .container-view-comment { -webkit-transition: height 100ms; - transition: height 100ms; + transition: height 120ms; background-color: #FFFFFF; border-top-left-radius: 4px; border-top-right-radius: 4px; @@ -6721,6 +6724,9 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-add-reply .navbar a.link i + span { margin-left: 0; } +.container-add-reply .page { + background-color: #FFFFFF; +} .icon-arrow-comment { border: solid black; border-width: 0 2px 2px 0; @@ -6738,6 +6744,9 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after transform: rotate(135deg); -webkit-transform: rotate(135deg); } +.actions-modal-button.color-red { + color: #ff3b30; +} i.icon.icon-search { width: 24px; height: 24px; diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-material.css b/apps/spreadsheeteditor/mobile/resources/css/app-material.css index db3b6425d..887889736 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-material.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-material.css @@ -6074,23 +6074,43 @@ html.phone .document-menu .list-block .item-link { #user-list ul:before { content: none; } -.page-comments .list-block .item-inner { +.page-comments .list-block .item-inner, +.page-add-comment .list-block .item-inner, +.page-view-comments .list-block .item-inner, +.container-edit-comment .list-block .item-inner, +.container-add-reply .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; } -.page-comments p { +.page-comments p, +.page-add-comment p, +.page-view-comments p, +.container-edit-comment p, +.container-add-reply p { margin: 0; + word-break: break-word; } -.page-comments .user-name { - font-size: 17px; +.page-comments .user-name, +.page-add-comment .user-name, +.page-view-comments .user-name, +.container-edit-comment .user-name, +.container-add-reply .user-name { + font-size: 16px; line-height: 22px; color: #000000; margin: 0; - font-weight: bold; } .page-comments .comment-date, -.page-comments .reply-date { +.page-add-comment .comment-date, +.page-view-comments .comment-date, +.container-edit-comment .comment-date, +.container-add-reply .comment-date, +.page-comments .reply-date, +.page-add-comment .reply-date, +.page-view-comments .reply-date, +.container-edit-comment .reply-date, +.container-add-reply .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6098,7 +6118,15 @@ html.phone .document-menu .list-block .item-link { margin-top: 0px; } .page-comments .comment-text, -.page-comments .reply-text { +.page-add-comment .comment-text, +.page-view-comments .comment-text, +.container-edit-comment .comment-text, +.container-add-reply .comment-text, +.page-comments .reply-text, +.page-add-comment .reply-text, +.page-view-comments .reply-text, +.container-edit-comment .reply-text, +.container-add-reply .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6106,38 +6134,284 @@ html.phone .document-menu .list-block .item-link { max-width: 100%; padding-right: 15px; } -.page-comments .reply-item { - margin-top: 15px; +.page-comments .reply-item, +.page-add-comment .reply-item, +.page-view-comments .reply-item, +.container-edit-comment .reply-item, +.container-add-reply .reply-item { + padding-right: 16px; + padding-top: 13px; } -.page-comments .reply-item .user-name { - padding-top: 16px; +.page-comments .reply-item .header-reply, +.page-add-comment .reply-item .header-reply, +.page-view-comments .reply-item .header-reply, +.container-edit-comment .reply-item .header-reply, +.container-add-reply .reply-item .header-reply { + display: flex; + justify-content: space-between; } -.page-comments .reply-item:before { - content: ''; - position: absolute; - left: auto; - bottom: 0; - right: auto; - top: 0; - height: 1px; - width: 100%; - background-color: rgba(0, 0, 0, 0.12); - display: block; - z-index: 15; - -webkit-transform-origin: 50% 100%; - transform-origin: 50% 100%; +.page-comments .reply-item .user-name, +.page-add-comment .reply-item .user-name, +.page-view-comments .reply-item .user-name, +.container-edit-comment .reply-item .user-name, +.container-add-reply .reply-item .user-name { + padding-top: 3px; } -.page-comments .comment-quote { +.page-comments .comment-quote, +.page-add-comment .comment-quote, +.page-view-comments .comment-quote, +.container-edit-comment .comment-quote, +.container-add-reply .comment-quote { color: #40865c; border-left: 1px solid #40865c; padding-left: 10px; margin: 5px 0; font-size: 15px; } +.page-comments .wrap-comment, +.page-add-comment .wrap-comment, +.page-view-comments .wrap-comment, +.container-edit-comment .wrap-comment, +.container-add-reply .wrap-comment { + padding: 16px 0 0 0; +} +.page-comments .comment-textarea, +.page-add-comment .comment-textarea, +.page-view-comments .comment-textarea, +.container-edit-comment .comment-textarea, +.container-add-reply .comment-textarea, +.page-comments .reply-textarea, +.page-add-comment .reply-textarea, +.page-view-comments .reply-textarea, +.container-edit-comment .reply-textarea, +.container-add-reply .reply-textarea { + margin-top: 10px; + background: transparent; + border: none; + outline: none; + width: 100%; + min-height: 200px; + font-size: 15px; +} +.page-comments .header-comment, +.page-add-comment .header-comment, +.page-view-comments .header-comment, +.container-edit-comment .header-comment, +.container-add-reply .header-comment { + display: flex; + justify-content: space-between; + padding-right: 16px; + margin-bottom: 13px; +} +.page-comments .header-comment .comment-right, +.page-add-comment .header-comment .comment-right, +.page-view-comments .header-comment .comment-right, +.container-edit-comment .header-comment .comment-right, +.container-add-reply .header-comment .comment-right { + display: flex; + justify-content: space-between; + width: 70px; +} +.page-comments .header-comment .comment-left, +.page-add-comment .header-comment .comment-left, +.page-view-comments .header-comment .comment-left, +.container-edit-comment .header-comment .comment-left, +.container-add-reply .header-comment .comment-left { + display: flex; + justify-content: space-between; +} +.page-comments .header-comment .initials-comment, +.page-add-comment .header-comment .initials-comment, +.page-view-comments .header-comment .initials-comment, +.container-edit-comment .header-comment .initials-comment, +.container-add-reply .header-comment .initials-comment { + height: 40px; + width: 40px; + border-radius: 50px; + color: #FFFFFF; + display: flex; + justify-content: center; + align-items: center; + margin-right: 16px; + font-size: 18px; +} +.page-comments .header-reply .reply-left, +.page-add-comment .header-reply .reply-left, +.page-view-comments .header-reply .reply-left, +.container-edit-comment .header-reply .reply-left, +.container-add-reply .header-reply .reply-left { + display: flex; + justify-content: space-between; + align-items: flex-start; +} +.page-comments .header-reply .initials-reply, +.page-add-comment .header-reply .initials-reply, +.page-view-comments .header-reply .initials-reply, +.container-edit-comment .header-reply .initials-reply, +.container-add-reply .header-reply .initials-reply { + width: 24px; + height: 24px; + color: #FFFFFF; + font-size: 11px; + display: flex; + justify-content: center; + align-items: center; + margin-right: 16px; + border-radius: 50px; + margin-top: 5px; +} .settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after { display: none; } +.container-edit-comment .navbar { + background-color: #FFFFFF; + color: #40865c; +} +.container-view-comment { + -webkit-transition: height 100ms; + transition: height 100ms; + background-color: #FFFFFF; + border-top-left-radius: 4px; + border-top-right-radius: 4px; + height: 50%; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); +} +.container-view-comment .page-view-comments { + background-color: #FFFFFF; +} +.container-view-comment .page-view-comments .list-block { + margin-bottom: 120px; +} +.container-view-comment .page-view-comments .list-block ul:before, +.container-view-comment .page-view-comments .list-block ul:after { + content: none; +} +.container-view-comment .page-view-comments .list-block .item-inner { + padding: 0; +} +.container-view-comment .toolbar { + position: absolute; + background-color: #FFFFFF; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); +} +.container-view-comment .toolbar.toolbar-bottom { + top: auto; +} +.container-view-comment .toolbar:before { + content: none; +} +.container-view-comment .toolbar a.link { + color: #40865c; + font-size: 16px; +} +.container-view-comment .toolbar .toolbar-inner { + display: flex; + justify-content: space-between; + padding: 0 16px; +} +.container-view-comment .toolbar .toolbar-inner .button-left { + min-width: 80px; +} +.container-view-comment .toolbar .toolbar-inner .button-right { + min-width: 62px; + display: flex; + justify-content: space-between; +} +.container-view-comment .toolbar .toolbar-inner .button-right a { + padding: 0 8px; +} +.container-view-comment .swipe-container { + display: flex; + justify-content: center; + height: 40px; +} +.container-view-comment .swipe-container .icon-swipe { + margin-top: 8px; + width: 40px; + height: 4px; + background: rgba(0, 0, 0, 0.12); + border-radius: 2px; +} +.container-view-comment .list-block { + margin-top: 0; +} +.container-view-add-comment, +.container-edit-comment, +.container-add-reply, +container-edit-comment { + height: 100%; +} +.container-view-add-comment .navbar, +.container-edit-comment .navbar, +.container-add-reply .navbar, +container-edit-comment .navbar { + background-color: #FFFFFF; + color: #000; +} +.container-view-add-comment .navbar:after, +.container-edit-comment .navbar:after, +.container-add-reply .navbar:after, +container-edit-comment .navbar:after { + content: ''; + position: absolute; + left: 0; + bottom: 0; + right: auto; + top: auto; + height: 1px; + width: 100%; + background-color: #c4c4c4; + display: block; + z-index: 15; + -webkit-transform-origin: 50% 100%; + transform-origin: 50% 100%; +} +.container-view-add-comment .navbar .navbar-inner, +.container-edit-comment .navbar .navbar-inner, +.container-add-reply .navbar .navbar-inner, +container-edit-comment .navbar .navbar-inner { + justify-content: space-between; +} +.container-view-add-comment .navbar a.link i + span, +.container-edit-comment .navbar a.link i + span, +.container-add-reply .navbar a.link i + span, +container-edit-comment .navbar a.link i + span { + margin-left: 0; +} +.container-view-add-comment .navbar .center, +.container-edit-comment .navbar .center, +.container-add-reply .navbar .center, +container-edit-comment .navbar .center { + font-size: 18px; +} +.container-view-add-comment .navbar .right, +.container-edit-comment .navbar .right, +.container-add-reply .navbar .right, +container-edit-comment .navbar .right { + margin-left: 0; +} +.container-view-add-comment .page-add-comment, +.container-edit-comment .page-add-comment, +.container-add-reply .page-add-comment, +container-edit-comment .page-add-comment { + background-color: #FFFFFF; +} +.container-view-add-comment .page-add-comment .page-content, +.container-edit-comment .page-add-comment .page-content, +.container-add-reply .page-add-comment .page-content, +container-edit-comment .page-add-comment .page-content { + padding: 0 16px 80px; +} +.container-view-add-comment .header-comment, +.container-edit-comment .header-comment, +.container-add-reply .header-comment, +container-edit-comment .header-comment { + justify-content: flex-start; +} +.actions-modal-button.color-red { + color: #f44336; +} .tablet .searchbar.document.replace .center > .replace { display: flex; } From 9621eab6b6ce50f74251c03b17c20f5be74ed096 Mon Sep 17 00:00:00 2001 From: Julia Svinareva Date: Mon, 23 Mar 2020 17:33:41 +0300 Subject: [PATCH 04/23] [de mobile] Add, view comment, add reply for iPad --- .../mobile/lib/controller/Collaboration.js | 349 +++++++++++------- apps/common/mobile/lib/view/Collaboration.js | 7 +- .../resources/less/ios/_collaboration.less | 94 +++-- .../mobile/resources/css/app-ios.css | 174 ++++++--- .../mobile/resources/css/app-material.css | 4 +- .../mobile/resources/less/ios/_icons.less | 4 +- .../resources/less/material/_icons.less | 4 +- .../mobile/resources/css/app-ios.css | 168 ++++++--- .../mobile/resources/css/app-ios.css | 168 ++++++--- 9 files changed, 642 insertions(+), 330 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index 4c53dd461..052aae316 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -748,26 +748,26 @@ define([ if (Common.SharedSettings.get('phone')) { me.modalViewComment = $$(uiApp.pickerModal( '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '' + me.textAddReply + '' + - '
      ' + - '
      ' + - '' + - '' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      '+ + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '' + me.textAddReply + '' + + '
      ' + + '
      ' + + '' + + '' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + '
      ' )).on('opened', function () { if (_.isFunction(me.api.asc_OnShowContextMenu)) { @@ -782,112 +782,139 @@ define([ }); mainView.hideNavbar(); } else { + me.modalViewComment = uiApp.popover( + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '' + me.textAddReply + '' + + '
      ' + + '
      ' + + '' + + '' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ' + + '
      ', + $$('#toolbar-collaboration') + ); } appPrefix.getController('Toolbar').getView('Toolbar').hideSearch(); - viewCollaboration.renderViewComments(me.showComments, me.indexCurrentComment); + _.delay(function () { + viewCollaboration.renderViewComments(me.showComments, me.indexCurrentComment); + $('.prev-comment').single('click', _.bind(me.onViewPrevComment, me)); + $('.next-comment').single('click', _.bind(me.onViewNextComment, me)); + $('.comment-menu').single('click', _.bind(me.initMenuComments, me)); + $('.add-reply').single('click', _.bind(me.onClickAddReply, me)); + $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); + $('.comment-resolve').single('click', _.bind(me.onClickResolveComment, me)); + + if (me.showComments.length === 1) { + $('.prev-comment, .next-comment').addClass('disabled'); + } + }, 300); //swipe modal window - me.swipeFull = false; - var $swipeContainer = $('.swipe-container'); - $swipeContainer.single('touchstart', _.bind(function(e){ - var touchobj = e.changedTouches[0]; - me.swipeStart = parseInt(touchobj.clientY); - me.swipeChange = parseInt(touchobj.clientY); - me.swipeHeight = parseInt($('.container-view-comment').css('height')); - e.preventDefault(); - }, me)); - $swipeContainer.single('touchmove', _.bind(function(e){ - var touchobj = e.changedTouches[0]; - var dist = parseInt(touchobj.clientY) - me.swipeStart; - var newHeight; - if (dist < 0) { - newHeight = '100%'; - me.swipeFull = true; - me.closeCommentPicker = false; - $('.container-view-comment').css('opacity', '1'); - } else if (dist < 100) { - newHeight = '50%'; - me.swipeFull = false; - me.closeCommentPicker = false; - $('.container-view-comment').css('opacity', '1'); - } else { - me.closeCommentPicker = true; - $('.container-view-comment').css('opacity', '0.6'); - } - $('.container-view-comment').css('height', newHeight); - me.swipeHeight = newHeight; - e.preventDefault(); - }, me)); - $swipeContainer.single('touchend', _.bind(function (e) { - var touchobj = e.changedTouches[0]; - var swipeEnd = parseInt(touchobj.clientY); - var dist = swipeEnd - me.swipeStart; - if (me.closeCommentPicker) { - uiApp.closeModal(); - } else if (me.swipeFull) { - if (dist > 20) { - $('.container-view-comment').css('height', '50%'); + if ($('.swipe-container').length > 0) { + me.swipeFull = false; + var $swipeContainer = $('.swipe-container'); + $swipeContainer.single('touchstart', _.bind(function (e) { + var touchobj = e.changedTouches[0]; + me.swipeStart = parseInt(touchobj.clientY); + me.swipeChange = parseInt(touchobj.clientY); + me.swipeHeight = parseInt($('.container-view-comment').css('height')); + e.preventDefault(); + }, me)); + $swipeContainer.single('touchmove', _.bind(function (e) { + var touchobj = e.changedTouches[0]; + var dist = parseInt(touchobj.clientY) - me.swipeStart; + var newHeight; + if (dist < 0) { + newHeight = '100%'; + me.swipeFull = true; + me.closeCommentPicker = false; + $('.container-view-comment').css('opacity', '1'); + } else if (dist < 100) { + newHeight = '50%'; + me.swipeFull = false; + me.closeCommentPicker = false; + $('.container-view-comment').css('opacity', '1'); + } else { + me.closeCommentPicker = true; + $('.container-view-comment').css('opacity', '0.6'); } - } - me.swipeHeight = undefined; - me.swipeChange = undefined; - me.closeCommentPicker = undefined; - }, me)); - - $('.prev-comment').single('click', _.bind(me.onViewPrevComment, me)); - $('.next-comment').single('click', _.bind(me.onViewNextComment, me)); - $('.comment-menu').single('click', _.bind(me.initMenuComments, me)); - $('.add-reply').single('click', _.bind(me.onClickAddReply, me)); - $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); - $('.comment-resolve').single('click', _.bind(me.onClickResolveComment, me)); - - me.updateDisabledCommentArrow(); - }, - - updateDisabledCommentArrow: function() { - if (this.indexCurrentComment === 0) { - $('.prev-comment').addClass('disabled'); - } else { - $('.prev-comment').removeClass('disabled'); - } - if (this.indexCurrentComment + 1 === this.showComments.length) { - $('.next-comment').addClass('disabled'); - } else { - $('.next-comment').removeClass('disabled'); + $('.container-view-comment').css('height', newHeight); + me.swipeHeight = newHeight; + e.preventDefault(); + }, me)); + $swipeContainer.single('touchend', _.bind(function (e) { + var touchobj = e.changedTouches[0]; + var swipeEnd = parseInt(touchobj.clientY); + var dist = swipeEnd - me.swipeStart; + if (me.closeCommentPicker) { + uiApp.closeModal(); + me.modalViewComment.remove(); + } else if (me.swipeFull) { + if (dist > 20) { + $('.container-view-comment').css('height', '50%'); + } + } + me.swipeHeight = undefined; + me.swipeChange = undefined; + me.closeCommentPicker = undefined; + }, me)); } }, onViewPrevComment: function() { - if (this.indexCurrentComment - 1 >= 0 && this.showComments.length > 0) { - this.indexCurrentComment -= 1; - DE.getController('Common.Controllers.Collaboration').getView('Common.Views.Collaboration').renderViewComments(this.showComments, this.indexCurrentComment); - $('.comment-menu').single('click', _.bind(this.initMenuComments, this)); - $('.reply-menu').single('click', _.bind(this.initReplyMenu, this)); - $('.comment-resolve').single('click', _.bind(this.onClickResolveComment, this)); - this.updateDisabledCommentArrow(); + if (this.showComments.length > 0) { + if (this.indexCurrentComment - 1 < 0) { + this.indexCurrentComment = this.showComments.length - 1; + } else { + this.indexCurrentComment -= 1; + } + var me = this; + DE.getController('Common.Controllers.Collaboration').getView('Common.Views.Collaboration').renderViewComments(me.showComments, me.indexCurrentComment); + _.defer(function () { + $('.comment-menu').single('click', _.bind(me.initMenuComments, me)); + $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); + $('.comment-resolve').single('click', _.bind(me.onClickResolveComment, me)); + }); } }, onViewNextComment: function() { - if (this.indexCurrentComment + 1 < this.showComments.length) { - this.indexCurrentComment += 1; - DE.getController('Common.Controllers.Collaboration').getView('Common.Views.Collaboration').renderViewComments(this.showComments, this.indexCurrentComment); - $('.comment-menu').single('click', _.bind(this.initMenuComments, this)); - $('.reply-menu').single('click', _.bind(this.initReplyMenu, this)); - $('.comment-resolve').single('click', _.bind(this.onClickResolveComment, this)); - this.updateDisabledCommentArrow(); + if (this.showComments.length > 0) { + if (this.indexCurrentComment + 1 === this.showComments.length) { + this.indexCurrentComment = 0; + } else { + this.indexCurrentComment += 1; + } + var me = this; + DE.getController('Common.Controllers.Collaboration').getView('Common.Views.Collaboration').renderViewComments(me.showComments, me.indexCurrentComment); + _.defer(function () { + $('.comment-menu').single('click', _.bind(me.initMenuComments, me)); + $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); + $('.comment-resolve').single('click', _.bind(me.onClickResolveComment, me)); + }); } }, onClickAddReply: function() { var me = this; - var isAndroid = Framework7.prototype.device.android === true; + var isAndroid = Framework7.prototype.device.android === true, + phone = Common.SharedSettings.get('phone'); if (this.indexCurrentComment > -1 && this.indexCurrentComment < this.showComments.length) { var addReplyView, comment = this.showComments[this.indexCurrentComment]; - if (Common.SharedSettings.get('phone')) { + if (phone) { addReplyView = uiApp.popup( '
      ' + '
      ' + @@ -913,21 +940,36 @@ define([ '
      ' ); $('.popup').css('z-index', '20000'); - _.delay(function () { - var $textarea = $('.reply-textarea')[0]; - $textarea.focus(); - },100); - $('.done-reply').single('click', _.bind(function (uid) { - var reply = $('.reply-textarea')[0].value; - if (reply && reply.length > 0) { - this.addReply(uid, reply); - uiApp.closeModal($$(addReplyView)); - this.updateViewComment(this.showComments, this.indexCurrentComment); - } - }, me, comment.uid)); } else { - + $('.container-view-comment .toolbar').find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'none'); + var template = _.template('' + me.textDone + ''); + $('.container-view-comment .button-right').append(template); + template = _.template('' + me.textCancel + ''); + $('.container-view-comment .button-left').append(template); + template = _.template('
      '); + $('.view-comment .page-content').append(template); } + $('.done-reply').single('click', _.bind(function (uid) { + var reply = $('.reply-textarea')[0].value; + var $viewComment = $('.container-view-comment'); + if (reply && reply.length > 0) { + this.addReply(uid, reply); + uiApp.closeModal($$(addReplyView)); + this.updateViewComment(this.showComments, this.indexCurrentComment); + if (!phone) { + $viewComment.find('a.done-reply, a.cancel-reply').css('display', 'none'); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + } + } + }, me, comment.uid)); + $('.cancel-reply').single('click', _.bind(function () { + var $viewComment = $('.container-view-comment'); + if ($viewComment.find('.block-reply').length > 0) { + $viewComment.find('.block-reply').remove(); + } + $viewComment.find('a.done-reply, a.cancel-reply').css('display', 'none'); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + }, me)); } }, @@ -1028,14 +1070,14 @@ define([ '
      ' + '
    ' + '
    ' + - '
    ' + + '
    ' + '
    ' + '
    ' + (isAndroid ? '
    ' + comment.userInitials + '
    ' : '') + '
    ' + comment.username + '
    ' + '
    ' + comment.date + '
    ' + (isAndroid ? '
    ' : '') + - '
    ' + + '
    ' + '
    ' + '
    ' + '
    ' + @@ -1054,15 +1096,39 @@ define([ }); mainView.hideNavbar(); } else { + modalView = uiApp.popover( + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '' + me.textCancel + '' + + '
    ' + + '
    ' + + '' + me.textAddComment + '' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + (isAndroid ? '
    ' + comment.userInitials + '
    ' : '') + + '
    ' + comment.username + '
    ' + + '
    ' + comment.date + '
    ' + + (isAndroid ? '
    ' : '') + + '
    ' + + '
    ' + + '
    ' + + '
    ', + $$('#context-menu-target') + ); } - _.delay(function(){ - $('#comment-text').focus(); - },200); - appPrefix.getController('Toolbar').getView('Toolbar').hideSearch(); $('#add-comment').single('click', _.bind(me.onAddNewComment, me)); + + _.defer(function(){ + $('#comment-text').focus(); + }); }, onAddNewComment: function() { @@ -1165,7 +1231,7 @@ define([ onCommentMenuClick: function(action, indReply) { var me = this; switch (action) { - case 'edit': me.showEditCommentModal(); break; + case 'edit': me.showEditComment(); break; case 'resolve': me.onClickResolveComment(); break; case 'delete': me.onDeleteComment(me.indexCurrentComment); break; case 'editreply': me.showEditReplyModal(me.indexCurrentComment, indReply); break; @@ -1278,7 +1344,7 @@ define([ } }, - showEditCommentModal: function() { + showEditComment: function() { var me = this, isAndroid = Framework7.prototype.device.android === true; if (this.indexCurrentComment > -1 && this.indexCurrentComment < this.showComments.length) { @@ -1294,7 +1360,7 @@ define([ '
    ' + '
    ' + '
    ' + - '
    ' + + '
    ' + '
    ' + '
    ' + (isAndroid ? '
    ' + comment.userInitials + '
    ' : '') + @@ -1314,19 +1380,28 @@ define([ $textarea.focus(); $textarea.selectionStart = $textarea.value.length; },100); - $('#edit-comment').single('click', _.bind(function (comment) { - var value = $('.comment-textarea')[0].value; - if (value && value.length > 0) { - comment.comment = value; - this.showComments[this.indexCurrentComment] = comment; - this.onChangeComment(comment); - uiApp.closeModal($$(me.editView)); - this.updateViewComment(); - } - }, me, comment)); } else { - + var $viewComment = $('.container-view-comment'); + var oldComment = $viewComment.find('.comment-text span').text(); + $viewComment.find('.comment-text span').css('display', 'none'); + var template = _.template(''); + $viewComment.find('.comment-text').append(template); + $viewComment('.toolbar').find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'none'); + template = _.template('' + me.textDone + ''); + $viewComment('.button-right').append(template); + template = _.template('' + me.textCancel + ''); + $viewComment('.button-left').append(template); } + $('#edit-comment').single('click', _.bind(function (comment) { + var value = $('#comment-text')[0].value; + if (value && value.length > 0) { + comment.comment = value; + this.showComments[this.indexCurrentComment] = comment; + this.onChangeComment(comment); + uiApp.closeModal($$(me.editView)); + this.updateViewComment(); + } + }, me, comment)); } }, @@ -1353,7 +1428,7 @@ define([ '
    ' + '
    ' + '
    ' + - '
    ' + + '
    ' + '
    ' + '
    ' + (isAndroid ? '
    ' + comment.userInitials + '
    ' : '') + diff --git a/apps/common/mobile/lib/view/Collaboration.js b/apps/common/mobile/lib/view/Collaboration.js index d6ebec855..b202b6633 100644 --- a/apps/common/mobile/lib/view/Collaboration.js +++ b/apps/common/mobile/lib/view/Collaboration.js @@ -150,7 +150,7 @@ define([ renderViewComments: function(comments, indCurComment) { var isAndroid = Framework7.prototype.device.android === true; - if ($('.page-view-comments .page-content').length > 0) { + if ($('.view-comment .page-content').length > 0) { var template = ''; if (comments && comments.length > 0) { template = '
    ' + @@ -175,7 +175,7 @@ define([ '
    '; if (comment.quote) template += '

    ' + comment.quote + '

    '; - template += '

    ' + comment.comment + '

    '; + template += '
    ' + comment.comment + '
    '; if (comment.replys.length > 0) { template += '
      '; _.each(comment.replys, function (reply) { @@ -202,9 +202,10 @@ define([ template += '
    ' + '
    • '; template += ''; - $('.page-view-comments .page-content').html(template); + $('.view-comment .page-content').html(template); } } + Common.Utils.addScrollIfNeed('.view-comment.page', '.view-comment .page-content'); }, renderComments: function (comments) { diff --git a/apps/common/mobile/resources/less/ios/_collaboration.less b/apps/common/mobile/resources/less/ios/_collaboration.less index 68bebd264..e97323e6f 100644 --- a/apps/common/mobile/resources/less/ios/_collaboration.less +++ b/apps/common/mobile/resources/less/ios/_collaboration.less @@ -92,7 +92,7 @@ } //Comments -.page-comments, .page-add-comment, .page-view-comments, .container-edit-comment, .container-add-reply { +.page-comments, .add-comment, .page-view-comments, .container-edit-comment, .container-add-reply, .view-comment { .list-block .item-inner { display: block; padding: 16px 0; @@ -194,7 +194,7 @@ border-top-right-radius: 4px; height: 50%; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); - .page-view-comments { + .page-view-comments, .view-comment { background-color: #FFFFFF; .list-block { margin-bottom: 100px; @@ -236,7 +236,7 @@ display: flex; justify-content: space-between; a { - padding: 0 8px; + padding: 0 12px; } } } @@ -256,6 +256,52 @@ .list-block { margin-top: 0; } + &.popover { + border-radius: 4px; + min-height: 170px; + height: 400px; + max-height: 600px; + + .toolbar { + border-radius: 0 0 4px 4px; + .toolbar-inner { + padding-right: 0; + } + } + + .page { + border-radius: 13px; + .page-content { + padding: 16px; + padding-bottom: 80px; + + .list-block { + margin-bottom: 0px; + + .item-content { + padding-left: 0; + + .header-comment, .reply-item { + padding-right: 0; + } + } + } + + .block-reply { + width: 260px; + margin-top: 10px; + .reply-textarea { + min-height: 70px; + width: 260px; + border: 1px solid #c4c4c4; + border-radius: 13px; + padding: 5px; + } + } + } + } + + } } .container-view-add-comment { @@ -266,13 +312,34 @@ margin-left: 0; } } - .page-add-comment { + .page { background-color: #FFFFFF; .page-content { padding: 0 16px 80px; } } } +.popover { + &.add-comment { + .toolbar { + border-radius: 0 0 13px 13px; + } + .toolbar-bottom { + position: absolute; + bottom: 0; + } + .wrap-comment { + padding-bottom: 55px; + } + .comment-textarea { + border: 1px solid #c4c4c4; + border-radius: 5px; + min-height: 150px; + max-height: 300px; + width: 280px; + } + } +} .container-add-reply { height: 100%; @@ -287,25 +354,6 @@ } } -.icon-arrow-comment { - border: solid black; - border-width: 0 2px 2px 0; - border-color: @themeColor; - height: 12px; - width: 12px; - display: inline-block; - padding: 0; - &.right { - transform: rotate(-45deg); - -webkit-transform: rotate(-45deg); - } - - &.left { - transform: rotate(135deg); - -webkit-transform: rotate(135deg); - } -} - .actions-modal-button.color-red { color: @red; } diff --git a/apps/documenteditor/mobile/resources/css/app-ios.css b/apps/documenteditor/mobile/resources/css/app-ios.css index 868b521d0..094b9e1bc 100644 --- a/apps/documenteditor/mobile/resources/css/app-ios.css +++ b/apps/documenteditor/mobile/resources/css/app-ios.css @@ -6480,27 +6480,30 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after content: none; } .page-comments .list-block .item-inner, -.page-add-comment .list-block .item-inner, +.add-comment .list-block .item-inner, .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, -.container-add-reply .list-block .item-inner { +.container-add-reply .list-block .item-inner, +.view-comment .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; } .page-comments p, -.page-add-comment p, +.add-comment p, .page-view-comments p, .container-edit-comment p, -.container-add-reply p { +.container-add-reply p, +.view-comment p { margin: 0; word-break: break-word; } .page-comments .user-name, -.page-add-comment .user-name, +.add-comment .user-name, .page-view-comments .user-name, .container-edit-comment .user-name, -.container-add-reply .user-name { +.container-add-reply .user-name, +.view-comment .user-name { font-size: 17px; line-height: 22px; color: #000000; @@ -6508,15 +6511,17 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after font-weight: bold; } .page-comments .comment-date, -.page-add-comment .comment-date, +.add-comment .comment-date, .page-view-comments .comment-date, .container-edit-comment .comment-date, .container-add-reply .comment-date, +.view-comment .comment-date, .page-comments .reply-date, -.page-add-comment .reply-date, +.add-comment .reply-date, .page-view-comments .reply-date, .container-edit-comment .reply-date, -.container-add-reply .reply-date { +.container-add-reply .reply-date, +.view-comment .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6524,15 +6529,17 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after margin-top: 0px; } .page-comments .comment-text, -.page-add-comment .comment-text, +.add-comment .comment-text, .page-view-comments .comment-text, .container-edit-comment .comment-text, .container-add-reply .comment-text, +.view-comment .comment-text, .page-comments .reply-text, -.page-add-comment .reply-text, +.add-comment .reply-text, .page-view-comments .reply-text, .container-edit-comment .reply-text, -.container-add-reply .reply-text { +.container-add-reply .reply-text, +.view-comment .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6541,34 +6548,38 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after padding-right: 15px; } .page-comments .reply-item, -.page-add-comment .reply-item, +.add-comment .reply-item, .page-view-comments .reply-item, .container-edit-comment .reply-item, -.container-add-reply .reply-item { +.container-add-reply .reply-item, +.view-comment .reply-item { margin-top: 15px; padding-right: 16px; padding-top: 13px; } .page-comments .reply-item .header-reply, -.page-add-comment .reply-item .header-reply, +.add-comment .reply-item .header-reply, .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, -.container-add-reply .reply-item .header-reply { +.container-add-reply .reply-item .header-reply, +.view-comment .reply-item .header-reply { display: flex; justify-content: space-between; } .page-comments .reply-item .user-name, -.page-add-comment .reply-item .user-name, +.add-comment .reply-item .user-name, .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, -.container-add-reply .reply-item .user-name { +.container-add-reply .reply-item .user-name, +.view-comment .reply-item .user-name { padding-top: 3px; } .page-comments .reply-item:before, -.page-add-comment .reply-item:before, +.add-comment .reply-item:before, .page-view-comments .reply-item:before, .container-edit-comment .reply-item:before, -.container-add-reply .reply-item:before { +.container-add-reply .reply-item:before, +.view-comment .reply-item:before { content: ''; position: absolute; left: auto; @@ -6584,10 +6595,11 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after transform-origin: 50% 100%; } .page-comments .comment-quote, -.page-add-comment .comment-quote, +.add-comment .comment-quote, .page-view-comments .comment-quote, .container-edit-comment .comment-quote, -.container-add-reply .comment-quote { +.container-add-reply .comment-quote, +.view-comment .comment-quote { color: #446995; border-left: 1px solid #446995; padding-left: 10px; @@ -6595,22 +6607,25 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after font-size: 15px; } .page-comments .wrap-comment, -.page-add-comment .wrap-comment, +.add-comment .wrap-comment, .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, -.container-add-reply .wrap-comment { +.container-add-reply .wrap-comment, +.view-comment .wrap-comment { padding: 16px 16px 0 16px; } .page-comments .comment-textarea, -.page-add-comment .comment-textarea, +.add-comment .comment-textarea, .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, +.view-comment .comment-textarea, .page-comments .reply-textarea, -.page-add-comment .reply-textarea, +.add-comment .reply-textarea, .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, -.container-add-reply .reply-textarea { +.container-add-reply .reply-textarea, +.view-comment .reply-textarea { margin-top: 10px; background: transparent; border: none; @@ -6638,25 +6653,32 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after height: 50%; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } -.container-view-comment .page-view-comments { +.container-view-comment .page-view-comments, +.container-view-comment .view-comment { background-color: #FFFFFF; } -.container-view-comment .page-view-comments .list-block { +.container-view-comment .page-view-comments .list-block, +.container-view-comment .view-comment .list-block { margin-bottom: 100px; } .container-view-comment .page-view-comments .list-block ul:before, -.container-view-comment .page-view-comments .list-block ul:after { +.container-view-comment .view-comment .list-block ul:before, +.container-view-comment .page-view-comments .list-block ul:after, +.container-view-comment .view-comment .list-block ul:after { content: none; } -.container-view-comment .page-view-comments .list-block .item-inner { +.container-view-comment .page-view-comments .list-block .item-inner, +.container-view-comment .view-comment .list-block .item-inner { padding: 0; } -.container-view-comment .page-view-comments .list-block .item-inner .header-comment { +.container-view-comment .page-view-comments .list-block .item-inner .header-comment, +.container-view-comment .view-comment .list-block .item-inner .header-comment { display: flex; justify-content: space-between; padding-right: 16px; } -.container-view-comment .page-view-comments .list-block .item-inner .header-comment .comment-right { +.container-view-comment .page-view-comments .list-block .item-inner .header-comment .comment-right, +.container-view-comment .view-comment .list-block .item-inner .header-comment .comment-right { display: flex; justify-content: space-between; width: 70px; @@ -6683,7 +6705,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after justify-content: space-between; } .container-view-comment .toolbar .toolbar-inner .button-right a { - padding: 0 8px; + padding: 0 12px; } .container-view-comment .swipe-container { display: flex; @@ -6700,6 +6722,46 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-comment .list-block { margin-top: 0; } +.container-view-comment.popover { + border-radius: 4px; + min-height: 170px; + height: 400px; + max-height: 600px; +} +.container-view-comment.popover .toolbar { + border-radius: 0 0 4px 4px; +} +.container-view-comment.popover .toolbar .toolbar-inner { + padding-right: 0; +} +.container-view-comment.popover .page { + border-radius: 13px; +} +.container-view-comment.popover .page .page-content { + padding: 16px; + padding-bottom: 80px; +} +.container-view-comment.popover .page .page-content .list-block { + margin-bottom: 0px; +} +.container-view-comment.popover .page .page-content .list-block .item-content { + padding-left: 0; +} +.container-view-comment.popover .page .page-content .list-block .item-content .header-comment, +.container-view-comment.popover .page .page-content .list-block .item-content .reply-item { + padding-right: 0; +} +.container-view-comment.popover .page .page-content .block-reply { + width: 260px; + margin-top: 10px; +} +.container-view-comment.popover .page .page-content .block-reply .reply-textarea { + min-height: 70px; + width: 260px; + border: 1px solid #c4c4c4; + border-radius: 13px; + padding: 5px; +} .container-view-add-comment { height: 100%; } @@ -6709,12 +6771,29 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-add-comment .navbar a.link i + span { margin-left: 0; } -.container-view-add-comment .page-add-comment { +.container-view-add-comment .page { background-color: #FFFFFF; } -.container-view-add-comment .page-add-comment .page-content { +.container-view-add-comment .page .page-content { padding: 0 16px 80px; } +.popover.add-comment .toolbar { + border-radius: 0 0 13px 13px; +} +.popover.add-comment .toolbar-bottom { + position: absolute; + bottom: 0; +} +.popover.add-comment .wrap-comment { + padding-bottom: 55px; +} +.popover.add-comment .comment-textarea { + border: 1px solid #c4c4c4; + border-radius: 5px; + min-height: 150px; + max-height: 300px; + width: 280px; +} .container-add-reply { height: 100%; } @@ -6727,23 +6806,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-add-reply .page { background-color: #FFFFFF; } -.icon-arrow-comment { - border: solid black; - border-width: 0 2px 2px 0; - border-color: #446995; - height: 12px; - width: 12px; - display: inline-block; - padding: 0; -} -.icon-arrow-comment.right { - transform: rotate(-45deg); - -webkit-transform: rotate(-45deg); -} -.icon-arrow-comment.left { - transform: rotate(135deg); - -webkit-transform: rotate(135deg); -} .actions-modal-button.color-red { color: #ff3b30; } @@ -6975,12 +7037,14 @@ i.icon.icon-in-indent { background-color: #446995; -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%23446995%22%3E%3Cg%3E%3Cpath%20d%3D%22M1%2C20v-1h21v1H1z%20M12%2C16H1v-1h11V16z%20M12%2C12H1v-1h11V12z%20M12%2C8H1V7h11V8z%20M21%2C11.2l0.2%2C0.3L21%2C11.8L16.7%2C16L16%2C15.3l3.8-3.8L16%2C7.7L16.7%2C7L21%2C11.2z%20M22%2C4H1V3h21V4z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); } -i.icon.icon-prev { +i.icon.icon-prev, +i.icon.icon-prev-comment { width: 22px; height: 22px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%23446995%22%3E%3Cg%3E%3Cpath%20d%3D%22M16%2C20.5L15%2C21.5L4.5%2C11l0%2C0l0%2C0L15%2C0.5L16%2C1.5L6.6%2C11L16%2C20.5z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); } -i.icon.icon-next { +i.icon.icon-next, +i.icon.icon-next-comment { width: 22px; height: 22px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%23446995%22%3E%3Cg%3E%3Cpath%20d%3D%22M15.5%2C11L6%2C1.5l1.1-1.1L17.5%2C11l0%2C0l0%2C0L7.1%2C21.5L6%2C20.5L15.5%2C11z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); diff --git a/apps/documenteditor/mobile/resources/css/app-material.css b/apps/documenteditor/mobile/resources/css/app-material.css index ed009b11e..6d5966cac 100644 --- a/apps/documenteditor/mobile/resources/css/app-material.css +++ b/apps/documenteditor/mobile/resources/css/app-material.css @@ -6853,12 +6853,12 @@ i.icon.icon-resolve-comment.check { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9%2016.1719L19.5938%205.57812L21%206.98438L9%2018.9844L3.42188%2013.4062L4.82812%2012L9%2016.1719Z%22%20fill%3D%22%2340865C%22%20fill-opacity%3D%220.6%22%2F%3E%3C%2Fsvg%3E"); } -i.icon.icon-arrow-comment.left { +i.icon.icon-prev-comment { width: 24px; height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M15.4219%207.40625L10.8281%2012L15.4219%2016.5938L14.0156%2018L8.01562%2012L14.0156%206L15.4219%207.40625Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); } -i.icon.icon-arrow-comment.right { +i.icon.icon-next-comment { width: 24px; height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9.98438%206L15.9844%2012L9.98438%2018L8.57812%2016.5938L13.1719%2012L8.57812%207.40625L9.98438%206Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); diff --git a/apps/documenteditor/mobile/resources/less/ios/_icons.less b/apps/documenteditor/mobile/resources/less/ios/_icons.less index 754b73559..45534e386 100644 --- a/apps/documenteditor/mobile/resources/less/ios/_icons.less +++ b/apps/documenteditor/mobile/resources/less/ios/_icons.less @@ -150,12 +150,12 @@ i.icon { height: 22px; .encoded-svg-mask(''); } - &.icon-prev { + &.icon-prev, &.icon-prev-comment { width: 22px; height: 22px; .encoded-svg-background(''); } - &.icon-next { + &.icon-next, &.icon-next-comment { width: 22px; height: 22px; .encoded-svg-background(''); diff --git a/apps/documenteditor/mobile/resources/less/material/_icons.less b/apps/documenteditor/mobile/resources/less/material/_icons.less index 4b5473bd6..40b21197f 100644 --- a/apps/documenteditor/mobile/resources/less/material/_icons.less +++ b/apps/documenteditor/mobile/resources/less/material/_icons.less @@ -419,12 +419,12 @@ i.icon { height: 24px; .encoded-svg-background(''); } - &.icon-arrow-comment.left { + &.icon-prev-comment { width: 24px; height: 24px; .encoded-svg-background(''); } - &.icon-arrow-comment.right { + &.icon-next-comment { width: 24px; height: 24px; .encoded-svg-background(''); diff --git a/apps/presentationeditor/mobile/resources/css/app-ios.css b/apps/presentationeditor/mobile/resources/css/app-ios.css index bbbc0b1be..b7e956d4e 100644 --- a/apps/presentationeditor/mobile/resources/css/app-ios.css +++ b/apps/presentationeditor/mobile/resources/css/app-ios.css @@ -6480,27 +6480,30 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after content: none; } .page-comments .list-block .item-inner, -.page-add-comment .list-block .item-inner, +.add-comment .list-block .item-inner, .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, -.container-add-reply .list-block .item-inner { +.container-add-reply .list-block .item-inner, +.view-comment .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; } .page-comments p, -.page-add-comment p, +.add-comment p, .page-view-comments p, .container-edit-comment p, -.container-add-reply p { +.container-add-reply p, +.view-comment p { margin: 0; word-break: break-word; } .page-comments .user-name, -.page-add-comment .user-name, +.add-comment .user-name, .page-view-comments .user-name, .container-edit-comment .user-name, -.container-add-reply .user-name { +.container-add-reply .user-name, +.view-comment .user-name { font-size: 17px; line-height: 22px; color: #000000; @@ -6508,15 +6511,17 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after font-weight: bold; } .page-comments .comment-date, -.page-add-comment .comment-date, +.add-comment .comment-date, .page-view-comments .comment-date, .container-edit-comment .comment-date, .container-add-reply .comment-date, +.view-comment .comment-date, .page-comments .reply-date, -.page-add-comment .reply-date, +.add-comment .reply-date, .page-view-comments .reply-date, .container-edit-comment .reply-date, -.container-add-reply .reply-date { +.container-add-reply .reply-date, +.view-comment .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6524,15 +6529,17 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after margin-top: 0px; } .page-comments .comment-text, -.page-add-comment .comment-text, +.add-comment .comment-text, .page-view-comments .comment-text, .container-edit-comment .comment-text, .container-add-reply .comment-text, +.view-comment .comment-text, .page-comments .reply-text, -.page-add-comment .reply-text, +.add-comment .reply-text, .page-view-comments .reply-text, .container-edit-comment .reply-text, -.container-add-reply .reply-text { +.container-add-reply .reply-text, +.view-comment .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6541,34 +6548,38 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after padding-right: 15px; } .page-comments .reply-item, -.page-add-comment .reply-item, +.add-comment .reply-item, .page-view-comments .reply-item, .container-edit-comment .reply-item, -.container-add-reply .reply-item { +.container-add-reply .reply-item, +.view-comment .reply-item { margin-top: 15px; padding-right: 16px; padding-top: 13px; } .page-comments .reply-item .header-reply, -.page-add-comment .reply-item .header-reply, +.add-comment .reply-item .header-reply, .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, -.container-add-reply .reply-item .header-reply { +.container-add-reply .reply-item .header-reply, +.view-comment .reply-item .header-reply { display: flex; justify-content: space-between; } .page-comments .reply-item .user-name, -.page-add-comment .reply-item .user-name, +.add-comment .reply-item .user-name, .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, -.container-add-reply .reply-item .user-name { +.container-add-reply .reply-item .user-name, +.view-comment .reply-item .user-name { padding-top: 3px; } .page-comments .reply-item:before, -.page-add-comment .reply-item:before, +.add-comment .reply-item:before, .page-view-comments .reply-item:before, .container-edit-comment .reply-item:before, -.container-add-reply .reply-item:before { +.container-add-reply .reply-item:before, +.view-comment .reply-item:before { content: ''; position: absolute; left: auto; @@ -6584,10 +6595,11 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after transform-origin: 50% 100%; } .page-comments .comment-quote, -.page-add-comment .comment-quote, +.add-comment .comment-quote, .page-view-comments .comment-quote, .container-edit-comment .comment-quote, -.container-add-reply .comment-quote { +.container-add-reply .comment-quote, +.view-comment .comment-quote { color: #aa5252; border-left: 1px solid #aa5252; padding-left: 10px; @@ -6595,22 +6607,25 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after font-size: 15px; } .page-comments .wrap-comment, -.page-add-comment .wrap-comment, +.add-comment .wrap-comment, .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, -.container-add-reply .wrap-comment { +.container-add-reply .wrap-comment, +.view-comment .wrap-comment { padding: 16px 16px 0 16px; } .page-comments .comment-textarea, -.page-add-comment .comment-textarea, +.add-comment .comment-textarea, .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, +.view-comment .comment-textarea, .page-comments .reply-textarea, -.page-add-comment .reply-textarea, +.add-comment .reply-textarea, .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, -.container-add-reply .reply-textarea { +.container-add-reply .reply-textarea, +.view-comment .reply-textarea { margin-top: 10px; background: transparent; border: none; @@ -6638,25 +6653,32 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after height: 50%; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } -.container-view-comment .page-view-comments { +.container-view-comment .page-view-comments, +.container-view-comment .view-comment { background-color: #FFFFFF; } -.container-view-comment .page-view-comments .list-block { +.container-view-comment .page-view-comments .list-block, +.container-view-comment .view-comment .list-block { margin-bottom: 100px; } .container-view-comment .page-view-comments .list-block ul:before, -.container-view-comment .page-view-comments .list-block ul:after { +.container-view-comment .view-comment .list-block ul:before, +.container-view-comment .page-view-comments .list-block ul:after, +.container-view-comment .view-comment .list-block ul:after { content: none; } -.container-view-comment .page-view-comments .list-block .item-inner { +.container-view-comment .page-view-comments .list-block .item-inner, +.container-view-comment .view-comment .list-block .item-inner { padding: 0; } -.container-view-comment .page-view-comments .list-block .item-inner .header-comment { +.container-view-comment .page-view-comments .list-block .item-inner .header-comment, +.container-view-comment .view-comment .list-block .item-inner .header-comment { display: flex; justify-content: space-between; padding-right: 16px; } -.container-view-comment .page-view-comments .list-block .item-inner .header-comment .comment-right { +.container-view-comment .page-view-comments .list-block .item-inner .header-comment .comment-right, +.container-view-comment .view-comment .list-block .item-inner .header-comment .comment-right { display: flex; justify-content: space-between; width: 70px; @@ -6683,7 +6705,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after justify-content: space-between; } .container-view-comment .toolbar .toolbar-inner .button-right a { - padding: 0 8px; + padding: 0 12px; } .container-view-comment .swipe-container { display: flex; @@ -6700,6 +6722,46 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-comment .list-block { margin-top: 0; } +.container-view-comment.popover { + border-radius: 4px; + min-height: 170px; + height: 400px; + max-height: 600px; +} +.container-view-comment.popover .toolbar { + border-radius: 0 0 4px 4px; +} +.container-view-comment.popover .toolbar .toolbar-inner { + padding-right: 0; +} +.container-view-comment.popover .page { + border-radius: 13px; +} +.container-view-comment.popover .page .page-content { + padding: 16px; + padding-bottom: 80px; +} +.container-view-comment.popover .page .page-content .list-block { + margin-bottom: 0px; +} +.container-view-comment.popover .page .page-content .list-block .item-content { + padding-left: 0; +} +.container-view-comment.popover .page .page-content .list-block .item-content .header-comment, +.container-view-comment.popover .page .page-content .list-block .item-content .reply-item { + padding-right: 0; +} +.container-view-comment.popover .page .page-content .block-reply { + width: 260px; + margin-top: 10px; +} +.container-view-comment.popover .page .page-content .block-reply .reply-textarea { + min-height: 70px; + width: 260px; + border: 1px solid #c4c4c4; + border-radius: 13px; + padding: 5px; +} .container-view-add-comment { height: 100%; } @@ -6709,12 +6771,29 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-add-comment .navbar a.link i + span { margin-left: 0; } -.container-view-add-comment .page-add-comment { +.container-view-add-comment .page { background-color: #FFFFFF; } -.container-view-add-comment .page-add-comment .page-content { +.container-view-add-comment .page .page-content { padding: 0 16px 80px; } +.popover.add-comment .toolbar { + border-radius: 0 0 13px 13px; +} +.popover.add-comment .toolbar-bottom { + position: absolute; + bottom: 0; +} +.popover.add-comment .wrap-comment { + padding-bottom: 55px; +} +.popover.add-comment .comment-textarea { + border: 1px solid #c4c4c4; + border-radius: 5px; + min-height: 150px; + max-height: 300px; + width: 280px; +} .container-add-reply { height: 100%; } @@ -6727,23 +6806,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-add-reply .page { background-color: #FFFFFF; } -.icon-arrow-comment { - border: solid black; - border-width: 0 2px 2px 0; - border-color: #aa5252; - height: 12px; - width: 12px; - display: inline-block; - padding: 0; -} -.icon-arrow-comment.right { - transform: rotate(-45deg); - -webkit-transform: rotate(-45deg); -} -.icon-arrow-comment.left { - transform: rotate(135deg); - -webkit-transform: rotate(135deg); -} .actions-modal-button.color-red { color: #ff3b30; } diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css index 0c2270a0d..f34a059de 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css @@ -6480,27 +6480,30 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after content: none; } .page-comments .list-block .item-inner, -.page-add-comment .list-block .item-inner, +.add-comment .list-block .item-inner, .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, -.container-add-reply .list-block .item-inner { +.container-add-reply .list-block .item-inner, +.view-comment .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; } .page-comments p, -.page-add-comment p, +.add-comment p, .page-view-comments p, .container-edit-comment p, -.container-add-reply p { +.container-add-reply p, +.view-comment p { margin: 0; word-break: break-word; } .page-comments .user-name, -.page-add-comment .user-name, +.add-comment .user-name, .page-view-comments .user-name, .container-edit-comment .user-name, -.container-add-reply .user-name { +.container-add-reply .user-name, +.view-comment .user-name { font-size: 17px; line-height: 22px; color: #000000; @@ -6508,15 +6511,17 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after font-weight: bold; } .page-comments .comment-date, -.page-add-comment .comment-date, +.add-comment .comment-date, .page-view-comments .comment-date, .container-edit-comment .comment-date, .container-add-reply .comment-date, +.view-comment .comment-date, .page-comments .reply-date, -.page-add-comment .reply-date, +.add-comment .reply-date, .page-view-comments .reply-date, .container-edit-comment .reply-date, -.container-add-reply .reply-date { +.container-add-reply .reply-date, +.view-comment .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6524,15 +6529,17 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after margin-top: 0px; } .page-comments .comment-text, -.page-add-comment .comment-text, +.add-comment .comment-text, .page-view-comments .comment-text, .container-edit-comment .comment-text, .container-add-reply .comment-text, +.view-comment .comment-text, .page-comments .reply-text, -.page-add-comment .reply-text, +.add-comment .reply-text, .page-view-comments .reply-text, .container-edit-comment .reply-text, -.container-add-reply .reply-text { +.container-add-reply .reply-text, +.view-comment .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6541,34 +6548,38 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after padding-right: 15px; } .page-comments .reply-item, -.page-add-comment .reply-item, +.add-comment .reply-item, .page-view-comments .reply-item, .container-edit-comment .reply-item, -.container-add-reply .reply-item { +.container-add-reply .reply-item, +.view-comment .reply-item { margin-top: 15px; padding-right: 16px; padding-top: 13px; } .page-comments .reply-item .header-reply, -.page-add-comment .reply-item .header-reply, +.add-comment .reply-item .header-reply, .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, -.container-add-reply .reply-item .header-reply { +.container-add-reply .reply-item .header-reply, +.view-comment .reply-item .header-reply { display: flex; justify-content: space-between; } .page-comments .reply-item .user-name, -.page-add-comment .reply-item .user-name, +.add-comment .reply-item .user-name, .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, -.container-add-reply .reply-item .user-name { +.container-add-reply .reply-item .user-name, +.view-comment .reply-item .user-name { padding-top: 3px; } .page-comments .reply-item:before, -.page-add-comment .reply-item:before, +.add-comment .reply-item:before, .page-view-comments .reply-item:before, .container-edit-comment .reply-item:before, -.container-add-reply .reply-item:before { +.container-add-reply .reply-item:before, +.view-comment .reply-item:before { content: ''; position: absolute; left: auto; @@ -6584,10 +6595,11 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after transform-origin: 50% 100%; } .page-comments .comment-quote, -.page-add-comment .comment-quote, +.add-comment .comment-quote, .page-view-comments .comment-quote, .container-edit-comment .comment-quote, -.container-add-reply .comment-quote { +.container-add-reply .comment-quote, +.view-comment .comment-quote { color: #40865c; border-left: 1px solid #40865c; padding-left: 10px; @@ -6595,22 +6607,25 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after font-size: 15px; } .page-comments .wrap-comment, -.page-add-comment .wrap-comment, +.add-comment .wrap-comment, .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, -.container-add-reply .wrap-comment { +.container-add-reply .wrap-comment, +.view-comment .wrap-comment { padding: 16px 16px 0 16px; } .page-comments .comment-textarea, -.page-add-comment .comment-textarea, +.add-comment .comment-textarea, .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, +.view-comment .comment-textarea, .page-comments .reply-textarea, -.page-add-comment .reply-textarea, +.add-comment .reply-textarea, .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, -.container-add-reply .reply-textarea { +.container-add-reply .reply-textarea, +.view-comment .reply-textarea { margin-top: 10px; background: transparent; border: none; @@ -6638,25 +6653,32 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after height: 50%; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } -.container-view-comment .page-view-comments { +.container-view-comment .page-view-comments, +.container-view-comment .view-comment { background-color: #FFFFFF; } -.container-view-comment .page-view-comments .list-block { +.container-view-comment .page-view-comments .list-block, +.container-view-comment .view-comment .list-block { margin-bottom: 100px; } .container-view-comment .page-view-comments .list-block ul:before, -.container-view-comment .page-view-comments .list-block ul:after { +.container-view-comment .view-comment .list-block ul:before, +.container-view-comment .page-view-comments .list-block ul:after, +.container-view-comment .view-comment .list-block ul:after { content: none; } -.container-view-comment .page-view-comments .list-block .item-inner { +.container-view-comment .page-view-comments .list-block .item-inner, +.container-view-comment .view-comment .list-block .item-inner { padding: 0; } -.container-view-comment .page-view-comments .list-block .item-inner .header-comment { +.container-view-comment .page-view-comments .list-block .item-inner .header-comment, +.container-view-comment .view-comment .list-block .item-inner .header-comment { display: flex; justify-content: space-between; padding-right: 16px; } -.container-view-comment .page-view-comments .list-block .item-inner .header-comment .comment-right { +.container-view-comment .page-view-comments .list-block .item-inner .header-comment .comment-right, +.container-view-comment .view-comment .list-block .item-inner .header-comment .comment-right { display: flex; justify-content: space-between; width: 70px; @@ -6683,7 +6705,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after justify-content: space-between; } .container-view-comment .toolbar .toolbar-inner .button-right a { - padding: 0 8px; + padding: 0 12px; } .container-view-comment .swipe-container { display: flex; @@ -6700,6 +6722,46 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-comment .list-block { margin-top: 0; } +.container-view-comment.popover { + border-radius: 4px; + min-height: 170px; + height: 400px; + max-height: 600px; +} +.container-view-comment.popover .toolbar { + border-radius: 0 0 4px 4px; +} +.container-view-comment.popover .toolbar .toolbar-inner { + padding-right: 0; +} +.container-view-comment.popover .page { + border-radius: 13px; +} +.container-view-comment.popover .page .page-content { + padding: 16px; + padding-bottom: 80px; +} +.container-view-comment.popover .page .page-content .list-block { + margin-bottom: 0px; +} +.container-view-comment.popover .page .page-content .list-block .item-content { + padding-left: 0; +} +.container-view-comment.popover .page .page-content .list-block .item-content .header-comment, +.container-view-comment.popover .page .page-content .list-block .item-content .reply-item { + padding-right: 0; +} +.container-view-comment.popover .page .page-content .block-reply { + width: 260px; + margin-top: 10px; +} +.container-view-comment.popover .page .page-content .block-reply .reply-textarea { + min-height: 70px; + width: 260px; + border: 1px solid #c4c4c4; + border-radius: 13px; + padding: 5px; +} .container-view-add-comment { height: 100%; } @@ -6709,12 +6771,29 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-add-comment .navbar a.link i + span { margin-left: 0; } -.container-view-add-comment .page-add-comment { +.container-view-add-comment .page { background-color: #FFFFFF; } -.container-view-add-comment .page-add-comment .page-content { +.container-view-add-comment .page .page-content { padding: 0 16px 80px; } +.popover.add-comment .toolbar { + border-radius: 0 0 13px 13px; +} +.popover.add-comment .toolbar-bottom { + position: absolute; + bottom: 0; +} +.popover.add-comment .wrap-comment { + padding-bottom: 55px; +} +.popover.add-comment .comment-textarea { + border: 1px solid #c4c4c4; + border-radius: 5px; + min-height: 150px; + max-height: 300px; + width: 280px; +} .container-add-reply { height: 100%; } @@ -6727,23 +6806,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-add-reply .page { background-color: #FFFFFF; } -.icon-arrow-comment { - border: solid black; - border-width: 0 2px 2px 0; - border-color: #40865c; - height: 12px; - width: 12px; - display: inline-block; - padding: 0; -} -.icon-arrow-comment.right { - transform: rotate(-45deg); - -webkit-transform: rotate(-45deg); -} -.icon-arrow-comment.left { - transform: rotate(135deg); - -webkit-transform: rotate(135deg); -} .actions-modal-button.color-red { color: #ff3b30; } From cc94f8bd3c14dcc4cce5d94fd997217b776aea6a Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Wed, 25 Mar 2020 15:23:46 +0300 Subject: [PATCH 05/23] [de mobile] fix bug with overlay, add: edit comment, edit reply for iPad --- .../mobile/lib/controller/Collaboration.js | 220 ++++++++++++------ .../resources/less/ios/_collaboration.less | 53 ++++- .../mobile/resources/css/app-ios.css | 50 +++- .../mobile/resources/css/app-ios.css | 50 +++- .../mobile/resources/css/app-ios.css | 50 +++- 5 files changed, 315 insertions(+), 108 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index 052aae316..39afe7302 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -738,8 +738,7 @@ define([ var me = this, isAndroid = Framework7.prototype.device.android === true, appPrefix = !!window.DE ? DE : !!window.PE ? PE : SSE, - mainView = appPrefix.getController('Editor').getView('Editor').f7View, - viewCollaboration = appPrefix.getController('Common.Controllers.Collaboration').getView('Common.Views.Collaboration'); + mainView = appPrefix.getController('Editor').getView('Editor').f7View; me.indexCurrentComment = 0; @@ -804,23 +803,20 @@ define([ $$('#toolbar-collaboration') ); } + me.getView('Common.Views.Collaboration').renderViewComments(me.showComments, me.indexCurrentComment); + $('.prev-comment').single('click', _.bind(me.onViewPrevComment, me)); + $('.next-comment').single('click', _.bind(me.onViewNextComment, me)); + $('.comment-menu').single('click', _.bind(me.initMenuComments, me)); + $('.add-reply').single('click', _.bind(me.onClickAddReply, me)); + $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); + $('.comment-resolve').single('click', _.bind(me.onClickResolveComment, me)); + + if (me.showComments.length === 1) { + $('.prev-comment, .next-comment').addClass('disabled'); + } appPrefix.getController('Toolbar').getView('Toolbar').hideSearch(); - _.delay(function () { - viewCollaboration.renderViewComments(me.showComments, me.indexCurrentComment); - $('.prev-comment').single('click', _.bind(me.onViewPrevComment, me)); - $('.next-comment').single('click', _.bind(me.onViewNextComment, me)); - $('.comment-menu').single('click', _.bind(me.initMenuComments, me)); - $('.add-reply').single('click', _.bind(me.onClickAddReply, me)); - $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); - $('.comment-resolve').single('click', _.bind(me.onClickResolveComment, me)); - - if (me.showComments.length === 1) { - $('.prev-comment, .next-comment').addClass('disabled'); - } - }, 300); - //swipe modal window if ($('.swipe-container').length > 0) { me.swipeFull = false; @@ -1118,7 +1114,7 @@ define([ '' + '' + '', - $$('#context-menu-target') + $$('#toolbar-collaboration') ); } @@ -1159,43 +1155,48 @@ define([ }, initMenuComments: function() { - var me = this; - _.delay(function () { - var _menuItems = []; - _menuItems.push({ - caption: me.textEdit, - event: 'edit' - }); - if (!me.showComments[me.indexCurrentComment].resolved) { + if ($('.actions-modal').length === 0) { + var me = this; + _.delay(function () { + var _menuItems = []; _menuItems.push({ - caption: me.textResolve, - event: 'resolve' + caption: me.textEdit, + event: 'edit' }); - } else { - _menuItems.push({ - caption: me.textReopen, - event: 'resolve' - }); - } - _menuItems.push({ - caption: me.textDeleteComment, - event: 'delete', - color: 'red' - }); - _.each(_menuItems, function (item) { - item.text = item.caption; - item.onClick = function () { - me.onCommentMenuClick(item.event) + if (!me.showComments[me.indexCurrentComment].resolved) { + _menuItems.push({ + caption: me.textResolve, + event: 'resolve' + }); + } else { + _menuItems.push({ + caption: me.textReopen, + event: 'resolve' + }); } - }); + _menuItems.push({ + caption: me.textDeleteComment, + event: 'delete', + color: 'red' + }); + _.each(_menuItems, function (item) { + item.text = item.caption; + item.onClick = function () { + me.onCommentMenuClick(item.event) + } + }); - uiApp.actions([_menuItems, [ - { - text: me.textCancel, - bold: true - } - ]]); - }, 100); + me.menuComments = uiApp.actions([_menuItems, [ + { + text: me.textCancel, + bold: true, + onClick: function () { + me.onCommentMenuClick(); + } + } + ]]); + }, 100); + } }, initReplyMenu: function(event) { @@ -1218,11 +1219,13 @@ define([ me.onCommentMenuClick(item.event, ind); } }); - uiApp.actions([_menuItems, [ { text: me.textCancel, - bold: true + bold: true, + onClick: function () { + me.onCommentMenuClick(); + } } ]]); }, 100); @@ -1230,12 +1233,38 @@ define([ onCommentMenuClick: function(action, indReply) { var me = this; + function addOverlay () { + if (!Common.SharedSettings.get('phone')) { + var $overlay = $('.modal-overlay'); + if (!$overlay.hasClass('modal-overlay-visible')) { + $overlay.addClass('modal-overlay-visible') + } + } + } switch (action) { - case 'edit': me.showEditComment(); break; - case 'resolve': me.onClickResolveComment(); break; - case 'delete': me.onDeleteComment(me.indexCurrentComment); break; - case 'editreply': me.showEditReplyModal(me.indexCurrentComment, indReply); break; - case 'deletereply': me.onDeleteReply(me.indexCurrentComment, indReply); break; + case 'edit': + addOverlay(); + me.showEditComment(); + break; + case 'resolve': + addOverlay(); + me.onClickResolveComment(); + break; + case 'delete': + addOverlay(); + me.onDeleteComment(me.indexCurrentComment); + break; + case 'editreply': + addOverlay(); + me.showEditReplyModal(me.indexCurrentComment, indReply); + break; + case 'deletereply': + addOverlay(); + me.onDeleteReply(me.indexCurrentComment, indReply); + break; + default: + addOverlay(); + break; } }, @@ -1381,16 +1410,24 @@ define([ $textarea.selectionStart = $textarea.value.length; },100); } else { - var $viewComment = $('.container-view-comment'); - var oldComment = $viewComment.find('.comment-text span').text(); - $viewComment.find('.comment-text span').css('display', 'none'); - var template = _.template(''); - $viewComment.find('.comment-text').append(template); - $viewComment('.toolbar').find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'none'); - template = _.template('' + me.textDone + ''); - $viewComment('.button-right').append(template); - template = _.template('' + me.textCancel + ''); - $viewComment('.button-left').append(template); + if ($('.comment-textarea').length === 0) { + var $viewComment = $('.container-view-comment'); + var oldComment = $viewComment.find('.comment-text span').text(); + $viewComment.find('.comment-text span').css('display', 'none'); + var template = _.template(''); + $viewComment.find('.comment-text').append(template); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'none'); + template = _.template('' + me.textDone + ''); + $viewComment.find('.button-right').append(template); + template = _.template('' + me.textCancel + ''); + $viewComment.find('.button-left').append(template); + + _.delay(function () { + var $textarea = $viewComment.find('.comment-textarea')[0]; + $textarea.focus(); + $textarea.selectionStart = $textarea.value.length; + }, 50); + } } $('#edit-comment').single('click', _.bind(function (comment) { var value = $('#comment-text')[0].value; @@ -1398,10 +1435,22 @@ define([ comment.comment = value; this.showComments[this.indexCurrentComment] = comment; this.onChangeComment(comment); - uiApp.closeModal($$(me.editView)); + if (Common.SharedSettings.get('phone')) { + uiApp.closeModal($$(me.editView)); + } else { + var $viewComment = $('.container-view-comment'); + $viewComment.find('a.done-reply, a.cancel-reply').remove(); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + } this.updateViewComment(); } }, me, comment)); + $('.cancel-reply').single('click', _.bind(function () { + var $viewComment = $('.container-view-comment'); + $viewComment.find('a.done-reply, a.cancel-reply, .comment-textarea').remove(); + $viewComment.find('.comment-text span').css('display', 'block'); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + }, me)); } }, @@ -1435,7 +1484,7 @@ define([ '
    ' + reply.username + '
    ' + '
    ' + reply.date + '
    ' + (isAndroid ? '' : '') + - '
    ' + + '
    ' + '' + '' + '' + @@ -1444,20 +1493,47 @@ define([ ); $('.popup').css('z-index', '20000'); _.delay(function () { - var $textarea = $('.reply-textarea')[0]; + var $textarea = $('.edit-reply-textarea')[0]; $textarea.focus(); $textarea.selectionStart = $textarea.value.length; },100); + } else { + var $reply = $('.reply-item[data-ind=' + indReply + ']'); + var $viewComment = $('.container-view-comment'); + $reply.find('.reply-text').css('display', 'none'); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'none'); + var template = _.template(''); + $reply.append(template); + template = _.template('' + me.textDone + ''); + $viewComment.find('.button-right').append(template); + template = _.template('' + me.textCancel + ''); + $viewComment.find('.button-left').append(template); + + _.delay(function () { + var $textarea = $viewComment.find('.edit-reply-textarea')[0]; + $textarea.focus(); + $textarea.selectionStart = $textarea.value.length; + }, 50); } $('#edit-reply').single('click', _.bind(function (comment, indReply) { - var value = $('.reply-textarea')[0].value; + var value = $('.edit-reply-textarea')[0].value; if (value && value.length > 0) { comment.replys[indReply].reply = value; this.onChangeComment(comment); - uiApp.closeModal($$(editView)); + if (Common.SharedSettings.get('phone')) { + uiApp.closeModal($$(editView)); + } else { + $viewComment.find('a.done-reply, a.cancel-reply').remove(); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + } this.updateViewComment(); } }, me, comment, indReply)); + $('.cancel-reply').single('click', _.bind(function () { + $viewComment.find('a.done-reply, a.cancel-reply, .edit-reply-textarea').remove(); + $reply.find('.reply-text').css('display', 'block'); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + }, me)); } } }, diff --git a/apps/common/mobile/resources/less/ios/_collaboration.less b/apps/common/mobile/resources/less/ios/_collaboration.less index e97323e6f..9ac262f3b 100644 --- a/apps/common/mobile/resources/less/ios/_collaboration.less +++ b/apps/common/mobile/resources/less/ios/_collaboration.less @@ -193,7 +193,10 @@ border-top-left-radius: 4px; border-top-right-radius: 4px; height: 50%; - box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12); + .pages { + background-color: #FFFFFF; + } .page-view-comments, .view-comment { background-color: #FFFFFF; .list-block { @@ -288,16 +291,37 @@ } .block-reply { - width: 260px; margin-top: 10px; .reply-textarea { min-height: 70px; - width: 260px; + width: 278px; border: 1px solid #c4c4c4; - border-radius: 13px; + border-radius: 6px; padding: 5px; } } + + .edit-reply-textarea { + min-height: 60px; + width: 100%; + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 5px; + height: 60px; + margin-top: 10px; + } + + .comment-text { + padding-right: 0; + + .comment-textarea { + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 8px; + min-height: 80px; + height: 80px; + } + } } } @@ -321,20 +345,31 @@ } .popover { &.add-comment { - .toolbar { - border-radius: 0 0 13px 13px; - } .toolbar-bottom { position: absolute; bottom: 0; } + .toolbar { + position: absolute; + background-color: #FFFFFF; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); + border-radius: 0 0 13px 13px; + &:before { + content: none; + } + .toolbar-inner { + display: flex; + justify-content: space-between; + padding: 0 16px; + } + } .wrap-comment { - padding-bottom: 55px; + padding-bottom: 80px; } .comment-textarea { border: 1px solid #c4c4c4; border-radius: 5px; - min-height: 150px; + min-height: 80px; max-height: 300px; width: 280px; } diff --git a/apps/documenteditor/mobile/resources/css/app-ios.css b/apps/documenteditor/mobile/resources/css/app-ios.css index 094b9e1bc..fbf79fe47 100644 --- a/apps/documenteditor/mobile/resources/css/app-ios.css +++ b/apps/documenteditor/mobile/resources/css/app-ios.css @@ -6651,7 +6651,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after border-top-left-radius: 4px; border-top-right-radius: 4px; height: 50%; - box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12); +} +.container-view-comment .pages { + background-color: #FFFFFF; } .container-view-comment .page-view-comments, .container-view-comment .view-comment { @@ -6752,16 +6755,34 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after padding-right: 0; } .container-view-comment.popover .page .page-content .block-reply { - width: 260px; margin-top: 10px; } .container-view-comment.popover .page .page-content .block-reply .reply-textarea { min-height: 70px; - width: 260px; + width: 278px; border: 1px solid #c4c4c4; - border-radius: 13px; + border-radius: 6px; padding: 5px; } +.container-view-comment.popover .page .page-content .edit-reply-textarea { + min-height: 60px; + width: 100%; + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 5px; + height: 60px; + margin-top: 10px; +} +.container-view-comment.popover .page .page-content .comment-text { + padding-right: 0; +} +.container-view-comment.popover .page .page-content .comment-text .comment-textarea { + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 8px; + min-height: 80px; + height: 80px; +} .container-view-add-comment { height: 100%; } @@ -6777,20 +6798,31 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-add-comment .page .page-content { padding: 0 16px 80px; } -.popover.add-comment .toolbar { - border-radius: 0 0 13px 13px; -} .popover.add-comment .toolbar-bottom { position: absolute; bottom: 0; } +.popover.add-comment .toolbar { + position: absolute; + background-color: #FFFFFF; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); + border-radius: 0 0 13px 13px; +} +.popover.add-comment .toolbar:before { + content: none; +} +.popover.add-comment .toolbar .toolbar-inner { + display: flex; + justify-content: space-between; + padding: 0 16px; +} .popover.add-comment .wrap-comment { - padding-bottom: 55px; + padding-bottom: 80px; } .popover.add-comment .comment-textarea { border: 1px solid #c4c4c4; border-radius: 5px; - min-height: 150px; + min-height: 80px; max-height: 300px; width: 280px; } diff --git a/apps/presentationeditor/mobile/resources/css/app-ios.css b/apps/presentationeditor/mobile/resources/css/app-ios.css index b7e956d4e..3ace1ab66 100644 --- a/apps/presentationeditor/mobile/resources/css/app-ios.css +++ b/apps/presentationeditor/mobile/resources/css/app-ios.css @@ -6651,7 +6651,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after border-top-left-radius: 4px; border-top-right-radius: 4px; height: 50%; - box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12); +} +.container-view-comment .pages { + background-color: #FFFFFF; } .container-view-comment .page-view-comments, .container-view-comment .view-comment { @@ -6752,16 +6755,34 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after padding-right: 0; } .container-view-comment.popover .page .page-content .block-reply { - width: 260px; margin-top: 10px; } .container-view-comment.popover .page .page-content .block-reply .reply-textarea { min-height: 70px; - width: 260px; + width: 278px; border: 1px solid #c4c4c4; - border-radius: 13px; + border-radius: 6px; padding: 5px; } +.container-view-comment.popover .page .page-content .edit-reply-textarea { + min-height: 60px; + width: 100%; + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 5px; + height: 60px; + margin-top: 10px; +} +.container-view-comment.popover .page .page-content .comment-text { + padding-right: 0; +} +.container-view-comment.popover .page .page-content .comment-text .comment-textarea { + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 8px; + min-height: 80px; + height: 80px; +} .container-view-add-comment { height: 100%; } @@ -6777,20 +6798,31 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-add-comment .page .page-content { padding: 0 16px 80px; } -.popover.add-comment .toolbar { - border-radius: 0 0 13px 13px; -} .popover.add-comment .toolbar-bottom { position: absolute; bottom: 0; } +.popover.add-comment .toolbar { + position: absolute; + background-color: #FFFFFF; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); + border-radius: 0 0 13px 13px; +} +.popover.add-comment .toolbar:before { + content: none; +} +.popover.add-comment .toolbar .toolbar-inner { + display: flex; + justify-content: space-between; + padding: 0 16px; +} .popover.add-comment .wrap-comment { - padding-bottom: 55px; + padding-bottom: 80px; } .popover.add-comment .comment-textarea { border: 1px solid #c4c4c4; border-radius: 5px; - min-height: 150px; + min-height: 80px; max-height: 300px; width: 280px; } diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css index f34a059de..1389f301e 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css @@ -6651,7 +6651,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after border-top-left-radius: 4px; border-top-right-radius: 4px; height: 50%; - box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12); +} +.container-view-comment .pages { + background-color: #FFFFFF; } .container-view-comment .page-view-comments, .container-view-comment .view-comment { @@ -6752,16 +6755,34 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after padding-right: 0; } .container-view-comment.popover .page .page-content .block-reply { - width: 260px; margin-top: 10px; } .container-view-comment.popover .page .page-content .block-reply .reply-textarea { min-height: 70px; - width: 260px; + width: 278px; border: 1px solid #c4c4c4; - border-radius: 13px; + border-radius: 6px; padding: 5px; } +.container-view-comment.popover .page .page-content .edit-reply-textarea { + min-height: 60px; + width: 100%; + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 5px; + height: 60px; + margin-top: 10px; +} +.container-view-comment.popover .page .page-content .comment-text { + padding-right: 0; +} +.container-view-comment.popover .page .page-content .comment-text .comment-textarea { + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 8px; + min-height: 80px; + height: 80px; +} .container-view-add-comment { height: 100%; } @@ -6777,20 +6798,31 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-add-comment .page .page-content { padding: 0 16px 80px; } -.popover.add-comment .toolbar { - border-radius: 0 0 13px 13px; -} .popover.add-comment .toolbar-bottom { position: absolute; bottom: 0; } +.popover.add-comment .toolbar { + position: absolute; + background-color: #FFFFFF; + box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); + border-radius: 0 0 13px 13px; +} +.popover.add-comment .toolbar:before { + content: none; +} +.popover.add-comment .toolbar .toolbar-inner { + display: flex; + justify-content: space-between; + padding: 0 16px; +} .popover.add-comment .wrap-comment { - padding-bottom: 55px; + padding-bottom: 80px; } .popover.add-comment .comment-textarea { border: 1px solid #c4c4c4; border-radius: 5px; - min-height: 150px; + min-height: 80px; max-height: 300px; width: 280px; } From 23f6028575cb71c276eb597302a0d4e3ae12e59c Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Mon, 30 Mar 2020 19:52:13 +0300 Subject: [PATCH 06/23] [de mobile] add comment move to add other --- .../mobile/lib/controller/Collaboration.js | 133 ++++-------------- .../resources/less/ios/_collaboration.less | 73 ++++------ .../less/material/_collaboration.less | 33 ++++- .../mobile/app/controller/DocumentHolder.js | 8 +- .../mobile/app/controller/add/AddOther.js | 17 +++ .../mobile/app/template/AddOther.template | 30 ++++ .../mobile/app/view/add/AddOther.js | 27 +++- .../mobile/resources/css/app-ios.css | 66 ++++----- .../mobile/resources/css/app-material.css | 52 +++++-- .../mobile/resources/less/ios/_icons.less | 5 + .../resources/less/material/_icons.less | 10 ++ .../mobile/resources/css/app-ios.css | 61 ++++---- .../mobile/resources/css/app-material.css | 42 ++++-- .../mobile/resources/css/app-ios.css | 61 ++++---- .../mobile/resources/css/app-material.css | 42 ++++-- 15 files changed, 375 insertions(+), 285 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index 39afe7302..af364fbdd 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -685,6 +685,32 @@ define([ }, //Comments + getCurrentUser: function () { + var me = this; + _.each(editUsers, function(item){ + if (item.asc_getIdOriginal() === _userId) { + me.currentUser = item; + } + }); + return me.currentUser; + }, + + getCommentInfo: function () { + this.getCurrentUser(); + if (this.currentUser) { + var date = new Date(); + var comment = { + time: date.getTime(), + date: this.dateToLocaleTimeString(date), + userid: _userId, + username: this.currentUser.asc_getUserName(), + usercolor: this.currentUser.asc_getColor(), + userInitials: this.getInitials(this.currentUser.asc_getUserName()) + }; + return comment; + } + }, + getInitials: function(name) { var fio = name.split(' '); var initials = fio[0].substring(0, 1).toUpperCase(); @@ -1014,11 +1040,7 @@ define([ addReply.asc_putText(replyVal); addReply.asc_putTime(me.utcDateToString(new Date())); addReply.asc_putOnlyOfficeTime(me.ooDateToString(new Date())); - _.each(editUsers, function(item){ - if (item.asc_getIdOriginal() === _userId) { - me.currentUser = item; - } - }); + me.getCurrentUser(); addReply.asc_putUserId(_userId); addReply.asc_putUserName(me.currentUser.asc_getUserName()); @@ -1030,104 +1052,7 @@ define([ } }, - showAddCommentModal: function() { - var me = this, - isAndroid = Framework7.prototype.device.android === true, - modalView, - appPrefix = !!window.DE ? DE : !!window.PE ? PE : SSE, - mainView = appPrefix.getController('Editor').getView('Editor').f7View; - - uiApp.closeModal(); - - var date = new Date(); - _.each(editUsers, function(item){ - if (item.asc_getIdOriginal() === _userId) { - me.currentUser = item; - } - }); - if (!me.currentUser) return; - var comment = { - time: date.getTime(), - date: me.dateToLocaleTimeString(date), - userid: _userId, - username: me.currentUser.asc_getUserName(), - usercolor: me.currentUser.asc_getColor(), - userInitials: me.getInitials(me.currentUser.asc_getUserName()) - }; - - if (Common.SharedSettings.get('phone')) { - modalView = $$(uiApp.popup( - '
    ' + - '
    ' + - '
    ' + - '
    ' + (!isAndroid ? '' + me.textCancel + '' : '') + '
    ' + - '
    ' + me.textAddComment + '
    ' + - '
    ' + (!isAndroid ? '' + me.textDone + '' : '') + '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + - (isAndroid ? '
    ' + comment.userInitials + '
    ' : '') + - '
    ' + comment.username + '
    ' + - '
    ' + comment.date + '
    ' + - (isAndroid ? '
    ' : '') + - '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' - )).on('opened', function () { - if (_.isFunction(me.api.asc_OnShowContextMenu)) { - me.api.asc_OnShowContextMenu() - } - }).on('close', function (e) { - mainView.showNavbar(); - }).on('closed', function () { - if (_.isFunction(me.api.asc_OnHideContextMenu)) { - me.api.asc_OnHideContextMenu() - } - }); - mainView.hideNavbar(); - } else { - modalView = uiApp.popover( - '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + - '' + me.textCancel + '' + - '
    ' + - '
    ' + - '' + me.textAddComment + '' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + - (isAndroid ? '
    ' + comment.userInitials + '
    ' : '') + - '
    ' + comment.username + '
    ' + - '
    ' + comment.date + '
    ' + - (isAndroid ? '
    ' : '') + - '
    ' + - '
    ' + - '
    ' + - '
    ', - $$('#toolbar-collaboration') - ); - } - - appPrefix.getController('Toolbar').getView('Toolbar').hideSearch(); - - $('#add-comment').single('click', _.bind(me.onAddNewComment, me)); - - _.defer(function(){ - $('#comment-text').focus(); - }); - }, - - onAddNewComment: function() { + onAddNewComment: function(value) { var comment; if (typeof Asc.asc_CCommentDataWord !== 'undefined') { comment = new Asc.asc_CCommentDataWord(null); @@ -1135,7 +1060,7 @@ define([ comment = new Asc.asc_CCommentData(null); } - var textComment = $('#comment-text').val(); + var textComment = value; if (textComment.length > 0) { comment.asc_putText(textComment); diff --git a/apps/common/mobile/resources/less/ios/_collaboration.less b/apps/common/mobile/resources/less/ios/_collaboration.less index 9ac262f3b..5afebdaaa 100644 --- a/apps/common/mobile/resources/less/ios/_collaboration.less +++ b/apps/common/mobile/resources/less/ios/_collaboration.less @@ -102,6 +102,9 @@ margin: 0; word-break: break-word; } + .list-reply { + padding-left: 32px; + } .user-name { font-size: 17px; line-height: 22px; @@ -328,54 +331,36 @@ } } -.container-view-add-comment { - height: 100%; - .navbar { - background-color: #FFFFFF; - a.link i + span { - margin-left: 0; +#done-comment { + color: @themeColor; +} +.page-add-comment { + background-color: #FFFFFF; + .wrap-comment { + padding: 16px 16px 0 16px; + .header-comment { + justify-content: flex-start; } - } - .page { - background-color: #FFFFFF; - .page-content { - padding: 0 16px 80px; + .user-name { + font-weight: bold; + } + .comment-date { + font-size: 12px; + color: #6d6d72; + } + .wrap-textarea { + margin-top: 16px; + padding-right: 6px; + .comment-textarea { + border: 1px solid #c4c4c4; + margin-top: 0; + min-height: 100px; + border-radius: 4px; + width: 100%; + } } } } -.popover { - &.add-comment { - .toolbar-bottom { - position: absolute; - bottom: 0; - } - .toolbar { - position: absolute; - background-color: #FFFFFF; - box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); - border-radius: 0 0 13px 13px; - &:before { - content: none; - } - .toolbar-inner { - display: flex; - justify-content: space-between; - padding: 0 16px; - } - } - .wrap-comment { - padding-bottom: 80px; - } - .comment-textarea { - border: 1px solid #c4c4c4; - border-radius: 5px; - min-height: 80px; - max-height: 300px; - width: 280px; - } - } -} - .container-add-reply { height: 100%; .navbar { diff --git a/apps/common/mobile/resources/less/material/_collaboration.less b/apps/common/mobile/resources/less/material/_collaboration.less index 7760211d6..18f1c2cc0 100644 --- a/apps/common/mobile/resources/less/material/_collaboration.less +++ b/apps/common/mobile/resources/less/material/_collaboration.less @@ -100,6 +100,9 @@ margin: 0; word-break: break-word; } + .list-reply { + padding-left: 32px; + } .user-name { font-size: 16px; line-height: 22px; @@ -282,7 +285,35 @@ } } -.container-view-add-comment, .container-edit-comment, .container-add-reply, container-edit-comment { +#done-comment { + padding: 0 16px; +} +.page-add-comment { + .wrap-comment { + padding: 16px 16px 0 16px; + .header-comment { + justify-content: flex-start; + } + .user-name { + font-weight: bold; + } + .comment-date { + font-size: 12px; + color: #6d6d72; + } + .wrap-textarea { + padding-right: 6px; + .comment-textarea { + border: 1px solid #c4c4c4; + margin-top: 0; + min-height: 100px; + border-radius: 4px; + } + } + } +} + +.container-edit-comment, .container-add-reply, container-edit-comment { height: 100%; .navbar { background-color: #FFFFFF; diff --git a/apps/documenteditor/mobile/app/controller/DocumentHolder.js b/apps/documenteditor/mobile/app/controller/DocumentHolder.js index 532a74301..d82fec29f 100644 --- a/apps/documenteditor/mobile/app/controller/DocumentHolder.js +++ b/apps/documenteditor/mobile/app/controller/DocumentHolder.js @@ -164,11 +164,9 @@ define([ var getCollaboration = DE.getController('Common.Controllers.Collaboration'); getCollaboration.showCommentModal(); } else if ('addcomment' == eventName) { - var getCollaboration = DE.getController('Common.Controllers.Collaboration'); - /*if (this.api && this.mode.canCoAuthoring && this.mode.canComments) { - - }*/ - getCollaboration.showAddCommentModal(); + _view.hideMenu(); + DE.getController('AddContainer').showModal(); + DE.getController('AddOther').getView('AddOther').showPageComment(false); } else if ('showActionSheet' == eventName && _actionSheets.length > 0) { _.delay(function () { _.each(_actionSheets, function (action) { diff --git a/apps/documenteditor/mobile/app/controller/add/AddOther.js b/apps/documenteditor/mobile/app/controller/add/AddOther.js index 8b14782a0..09a3681e1 100644 --- a/apps/documenteditor/mobile/app/controller/add/AddOther.js +++ b/apps/documenteditor/mobile/app/controller/add/AddOther.js @@ -111,10 +111,27 @@ define([ } } else if (pageId == '#addother-insert-footnote') { me.initInsertFootnote(); + } else if (pageId === "#addother-insert-comment") { + me.initInsertComment(); } }, // Handlers + initInsertComment: function () { + var comment = DE.getController('Common.Controllers.Collaboration').getCommentInfo(); + if (comment) { + this.getView('AddOther').renderComment(comment); + $('#done-comment').single('click', _.bind(this.onDoneComment, this)); + } + }, + + onDoneComment: function() { + var value = $('#comment-text').val(); + if (value.length > 0) { + DE.getController('Common.Controllers.Collaboration').onAddNewComment(value); + DE.getController('AddContainer').hideModal(); + } + }, initInsertFootnote: function () { var me = this, diff --git a/apps/documenteditor/mobile/app/template/AddOther.template b/apps/documenteditor/mobile/app/template/AddOther.template index 76c91c506..d4b9d19f6 100644 --- a/apps/documenteditor/mobile/app/template/AddOther.template +++ b/apps/documenteditor/mobile/app/template/AddOther.template @@ -74,6 +74,18 @@ +
  • + +
    +
    + +
    +
    +
    <%= scope.textComment %>
    +
    +
    +     +
    • @@ -324,4 +336,22 @@ + + + + \ No newline at end of file diff --git a/apps/documenteditor/mobile/app/view/add/AddOther.js b/apps/documenteditor/mobile/app/view/add/AddOther.js index c5c1afd41..76bfaeb07 100644 --- a/apps/documenteditor/mobile/app/view/add/AddOther.js +++ b/apps/documenteditor/mobile/app/view/add/AddOther.js @@ -70,6 +70,7 @@ define([ $('#add-other-link').single('click', _.bind(me.showLink, me)); $('#add-other-pagenumber').single('click', _.bind(me.showPagePosition, me)); $('#add-other-footnote').single('click', _.bind(me.showPageFootnote, me)); + $('#add-other-comment').single('click', _.bind(me.showPageComment, me)); me.initControls(); }, @@ -143,6 +144,26 @@ define([ this.showPage('#addother-insert-footnote'); }, + showPageComment: function(animate) { + this.showPage('#addother-insert-comment', animate); + }, + + renderComment: function(comment) { + var $commentInfo = $('#comment-info'); + var template = [ + '<% if (android) { %>
    <%= comment.userInitials %>
    <% } %>', + '
    <%= comment.username %>
    ', + '
    <%= comment.date %>
    ', + '<% if (android) { %>
    <% } %>', + '
    ' + ].join(''); + var insert = _.template(template)({ + android: Framework7.prototype.device.android, + comment: comment + }); + $commentInfo.html(insert); + }, + renderNumFormat: function (dataFormat, selectFormat) { var $listFormat = $('#list-format-footnote ul'), items = []; @@ -221,8 +242,10 @@ define([ textInsertFootnote: 'Insert Footnote', textFormat: 'Format', textStartFrom: 'Start At', - textLocation: 'Location' - + textLocation: 'Location', + textComment: 'Comment', + textAddComment: 'Add Comment', + textDone: 'Done' } })(), DE.Views.AddOther || {})) diff --git a/apps/documenteditor/mobile/resources/css/app-ios.css b/apps/documenteditor/mobile/resources/css/app-ios.css index fbf79fe47..7bd3329a2 100644 --- a/apps/documenteditor/mobile/resources/css/app-ios.css +++ b/apps/documenteditor/mobile/resources/css/app-ios.css @@ -6498,6 +6498,14 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after margin: 0; word-break: break-word; } +.page-comments .list-reply, +.add-comment .list-reply, +.page-view-comments .list-reply, +.container-edit-comment .list-reply, +.container-add-reply .list-reply, +.view-comment .list-reply { + padding-left: 32px; +} .page-comments .user-name, .add-comment .user-name, .page-view-comments .user-name, @@ -6783,48 +6791,35 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after min-height: 80px; height: 80px; } -.container-view-add-comment { - height: 100%; +#done-comment { + color: #446995; } -.container-view-add-comment .navbar { +.page-add-comment { background-color: #FFFFFF; } -.container-view-add-comment .navbar a.link i + span { - margin-left: 0; +.page-add-comment .wrap-comment { + padding: 16px 16px 0 16px; } -.container-view-add-comment .page { - background-color: #FFFFFF; +.page-add-comment .wrap-comment .header-comment { + justify-content: flex-start; } -.container-view-add-comment .page .page-content { - padding: 0 16px 80px; +.page-add-comment .wrap-comment .user-name { + font-weight: bold; } -.popover.add-comment .toolbar-bottom { - position: absolute; - bottom: 0; +.page-add-comment .wrap-comment .comment-date { + font-size: 12px; + color: #6d6d72; } -.popover.add-comment .toolbar { - position: absolute; - background-color: #FFFFFF; - box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); - border-radius: 0 0 13px 13px; +.page-add-comment .wrap-comment .wrap-textarea { + margin-top: 16px; + padding-right: 6px; } -.popover.add-comment .toolbar:before { - content: none; -} -.popover.add-comment .toolbar .toolbar-inner { - display: flex; - justify-content: space-between; - padding: 0 16px; -} -.popover.add-comment .wrap-comment { - padding-bottom: 80px; -} -.popover.add-comment .comment-textarea { +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea { border: 1px solid #c4c4c4; - border-radius: 5px; - min-height: 80px; - max-height: 300px; - width: 280px; + margin-top: 0; + min-height: 100px; + border-radius: 4px; + width: 100%; } .container-add-reply { height: 100%; @@ -7399,6 +7394,11 @@ i.icon.icon-resolve-comment.check { height: 30px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2030%2030%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M0%200H30V30H0V0Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M11.6195%2020.8555C11.8237%2021.0673%2012.1658%2021.0577%2012.358%2020.8349L22.516%209.05783C22.7843%208.74676%2022.7528%208.27781%2022.4453%208.00545V8.00545C22.1315%207.72756%2021.651%207.7604%2021.3779%208.07839L12.3546%2018.587C12.1638%2018.8092%2011.8238%2018.8206%2011.6186%2018.6117L8.10643%2015.0366C7.81575%2014.7407%207.34084%2014.7345%207.04258%2015.0228V15.0228C6.74283%2015.3125%206.73444%2015.7903%207.02383%2016.0904L11.6195%2020.8555Z%22%20fill%3D%22%234cd964%22%2F%3E%3C%2Fsvg%3E"); } +i.icon.icon-insert-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20.1538%209.00708H11.8462C10.8266%209.00708%2010%209.83461%2010%2010.8554V15.1694C10%2016.1902%2010.8266%2017.0177%2011.8462%2017.0177H13.8329C13.9409%2017.0177%2014.0454%2017.0556%2014.1284%2017.1248L18.243%2020.392C18.5436%2020.6428%2019%2020.4288%2019%2020.037V17.4798C19%2017.2246%2019.2066%2017.0177%2019.4615%2017.0177H20.1538C21.1734%2017.0177%2022%2016.1902%2022%2015.1694V10.8554C22%209.83461%2021.1734%209.00708%2020.1538%209.00708ZM20%2010.0083C20.5523%2010.0083%2021%2010.4565%2021%2011.0095V15.0154C21%2015.5683%2020.5523%2016.0165%2020%2016.0165H18.0025L18%2018.8995C18%2019.2912%2018%2019%2018%2019L14.5%2016.0165H12C11.4477%2016.0165%2011%2015.5683%2011%2015.0154V11.0095C11%2010.4565%2011.4477%2010.0083%2012%2010.0083H20Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M14.5%203H4.5C3.18908%203%202%204.2153%202%205.50295V12.0346C2%2013.3222%203.18908%2014.013%204.5%2014.013H5.5C5.82773%2014.013%206%2014.1917%206%2014.5136V17.5183C6%2018.0125%206.6135%2018.3352%207%2018.0189L11%2014.9858V13.5L7%2016.5V13.0118H4.5C3.78992%2013.0118%203%2012.732%203%2012.0346V5.50295C3%204.80547%203.78992%204.00118%204.5%204.00118H14.5C15.2101%204.00118%2016%204.80547%2016%205.50295V8.0059H17V5.50295C17%204.2153%2015.8109%203%2014.5%203Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); +} .label-switch input[type="checkbox"]:checked + .checkbox { background: #446995; } diff --git a/apps/documenteditor/mobile/resources/css/app-material.css b/apps/documenteditor/mobile/resources/css/app-material.css index 6d5966cac..2d06856ad 100644 --- a/apps/documenteditor/mobile/resources/css/app-material.css +++ b/apps/documenteditor/mobile/resources/css/app-material.css @@ -6081,6 +6081,13 @@ html.phone .document-menu .list-block .item-link { margin: 0; word-break: break-word; } +.page-comments .list-reply, +.page-add-comment .list-reply, +.page-view-comments .list-reply, +.container-edit-comment .list-reply, +.container-add-reply .list-reply { + padding-left: 32px; +} .page-comments .user-name, .page-add-comment .user-name, .page-view-comments .user-name, @@ -6326,20 +6333,42 @@ html.phone .document-menu .list-block .item-link { .container-view-comment .list-block { margin-top: 0; } -.container-view-add-comment, +#done-comment { + padding: 0 16px; +} +.page-add-comment .wrap-comment { + padding: 16px 16px 0 16px; +} +.page-add-comment .wrap-comment .header-comment { + justify-content: flex-start; +} +.page-add-comment .wrap-comment .user-name { + font-weight: bold; +} +.page-add-comment .wrap-comment .comment-date { + font-size: 12px; + color: #6d6d72; +} +.page-add-comment .wrap-comment .wrap-textarea { + padding-right: 6px; +} +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea { + border: 1px solid #c4c4c4; + margin-top: 0; + min-height: 100px; + border-radius: 4px; +} .container-edit-comment, .container-add-reply, container-edit-comment { height: 100%; } -.container-view-add-comment .navbar, .container-edit-comment .navbar, .container-add-reply .navbar, container-edit-comment .navbar { background-color: #FFFFFF; color: #000; } -.container-view-add-comment .navbar:after, .container-edit-comment .navbar:after, .container-add-reply .navbar:after, container-edit-comment .navbar:after { @@ -6357,43 +6386,36 @@ container-edit-comment .navbar:after { -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%; } -.container-view-add-comment .navbar .navbar-inner, .container-edit-comment .navbar .navbar-inner, .container-add-reply .navbar .navbar-inner, container-edit-comment .navbar .navbar-inner { justify-content: space-between; } -.container-view-add-comment .navbar a.link i + span, .container-edit-comment .navbar a.link i + span, .container-add-reply .navbar a.link i + span, container-edit-comment .navbar a.link i + span { margin-left: 0; } -.container-view-add-comment .navbar .center, .container-edit-comment .navbar .center, .container-add-reply .navbar .center, container-edit-comment .navbar .center { font-size: 18px; } -.container-view-add-comment .navbar .right, .container-edit-comment .navbar .right, .container-add-reply .navbar .right, container-edit-comment .navbar .right { margin-left: 0; } -.container-view-add-comment .page-add-comment, .container-edit-comment .page-add-comment, .container-add-reply .page-add-comment, container-edit-comment .page-add-comment { background-color: #FFFFFF; } -.container-view-add-comment .page-add-comment .page-content, .container-edit-comment .page-add-comment .page-content, .container-add-reply .page-add-comment .page-content, container-edit-comment .page-add-comment .page-content { padding: 0 16px 80px; } -.container-view-add-comment .header-comment, .container-edit-comment .header-comment, .container-add-reply .header-comment, container-edit-comment .header-comment { @@ -6873,6 +6895,16 @@ i.icon.icon-done-comment { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9%2016.1719L19.5938%205.57812L21%206.98438L9%2018.9844L3.42188%2013.4062L4.82812%2012L9%2016.1719Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); } +i.icon.icon-insert-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20.1538%209.00708H11.8462C10.8266%209.00708%2010%209.83461%2010%2010.8554V15.1694C10%2016.1902%2010.8266%2017.0177%2011.8462%2017.0177H13.8329C13.9409%2017.0177%2014.0454%2017.0556%2014.1284%2017.1248L18.243%2020.392C18.5436%2020.6428%2019%2020.4288%2019%2020.037V17.4798C19%2017.2246%2019.2066%2017.0177%2019.4615%2017.0177H20.1538C21.1734%2017.0177%2022%2016.1902%2022%2015.1694V10.8554C22%209.83461%2021.1734%209.00708%2020.1538%209.00708ZM20%2010.0083C20.5523%2010.0083%2021%2010.4565%2021%2011.0095V15.0154C21%2015.5683%2020.5523%2016.0165%2020%2016.0165H18.0025L18%2018.8995C18%2019.2912%2018%2019%2018%2019L14.5%2016.0165H12C11.4477%2016.0165%2011%2015.5683%2011%2015.0154V11.0095C11%2010.4565%2011.4477%2010.0083%2012%2010.0083H20Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M14.5%203H4.5C3.18908%203%202%204.2153%202%205.50295V12.0346C2%2013.3222%203.18908%2014.013%204.5%2014.013H5.5C5.82773%2014.013%206%2014.1917%206%2014.5136V17.5183C6%2018.0125%206.6135%2018.3352%207%2018.0189L11%2014.9858V13.5L7%2016.5V13.0118H4.5C3.78992%2013.0118%203%2012.732%203%2012.0346V5.50295C3%204.80547%203.78992%204.00118%204.5%204.00118H14.5C15.2101%204.00118%2016%204.80547%2016%205.50295V8.0059H17V5.50295C17%204.2153%2015.8109%203%2014.5%203Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-done-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9%2016.1719L19.5938%205.57812L21%206.98438L9%2018.9844L3.42188%2013.4062L4.82812%2012L9%2016.1719Z%22%20fill%3D%22%23FFFFFF%22%2F%3E%3C%2Fsvg%3E"); +} .navbar i.icon.icon-undo { width: 22px; height: 22px; diff --git a/apps/documenteditor/mobile/resources/less/ios/_icons.less b/apps/documenteditor/mobile/resources/less/ios/_icons.less index 45534e386..d673cf708 100644 --- a/apps/documenteditor/mobile/resources/less/ios/_icons.less +++ b/apps/documenteditor/mobile/resources/less/ios/_icons.less @@ -493,4 +493,9 @@ i.icon { height: 30px; .encoded-svg-background(''); } + &.icon-insert-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } } \ No newline at end of file diff --git a/apps/documenteditor/mobile/resources/less/material/_icons.less b/apps/documenteditor/mobile/resources/less/material/_icons.less index 40b21197f..cc2d96f0f 100644 --- a/apps/documenteditor/mobile/resources/less/material/_icons.less +++ b/apps/documenteditor/mobile/resources/less/material/_icons.less @@ -439,6 +439,16 @@ i.icon { height: 24px; .encoded-svg-background(''); } + &.icon-insert-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-done-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } } // Overwrite color for toolbar diff --git a/apps/presentationeditor/mobile/resources/css/app-ios.css b/apps/presentationeditor/mobile/resources/css/app-ios.css index 3ace1ab66..9a561db39 100644 --- a/apps/presentationeditor/mobile/resources/css/app-ios.css +++ b/apps/presentationeditor/mobile/resources/css/app-ios.css @@ -6498,6 +6498,14 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after margin: 0; word-break: break-word; } +.page-comments .list-reply, +.add-comment .list-reply, +.page-view-comments .list-reply, +.container-edit-comment .list-reply, +.container-add-reply .list-reply, +.view-comment .list-reply { + padding-left: 32px; +} .page-comments .user-name, .add-comment .user-name, .page-view-comments .user-name, @@ -6783,48 +6791,35 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after min-height: 80px; height: 80px; } -.container-view-add-comment { - height: 100%; +#done-comment { + color: #aa5252; } -.container-view-add-comment .navbar { +.page-add-comment { background-color: #FFFFFF; } -.container-view-add-comment .navbar a.link i + span { - margin-left: 0; +.page-add-comment .wrap-comment { + padding: 16px 16px 0 16px; } -.container-view-add-comment .page { - background-color: #FFFFFF; +.page-add-comment .wrap-comment .header-comment { + justify-content: flex-start; } -.container-view-add-comment .page .page-content { - padding: 0 16px 80px; +.page-add-comment .wrap-comment .user-name { + font-weight: bold; } -.popover.add-comment .toolbar-bottom { - position: absolute; - bottom: 0; +.page-add-comment .wrap-comment .comment-date { + font-size: 12px; + color: #6d6d72; } -.popover.add-comment .toolbar { - position: absolute; - background-color: #FFFFFF; - box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); - border-radius: 0 0 13px 13px; +.page-add-comment .wrap-comment .wrap-textarea { + margin-top: 16px; + padding-right: 6px; } -.popover.add-comment .toolbar:before { - content: none; -} -.popover.add-comment .toolbar .toolbar-inner { - display: flex; - justify-content: space-between; - padding: 0 16px; -} -.popover.add-comment .wrap-comment { - padding-bottom: 80px; -} -.popover.add-comment .comment-textarea { +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea { border: 1px solid #c4c4c4; - border-radius: 5px; - min-height: 80px; - max-height: 300px; - width: 280px; + margin-top: 0; + min-height: 100px; + border-radius: 4px; + width: 100%; } .container-add-reply { height: 100%; diff --git a/apps/presentationeditor/mobile/resources/css/app-material.css b/apps/presentationeditor/mobile/resources/css/app-material.css index df2107b28..1e3d2c4fc 100644 --- a/apps/presentationeditor/mobile/resources/css/app-material.css +++ b/apps/presentationeditor/mobile/resources/css/app-material.css @@ -6081,6 +6081,13 @@ html.phone .document-menu .list-block .item-link { margin: 0; word-break: break-word; } +.page-comments .list-reply, +.page-add-comment .list-reply, +.page-view-comments .list-reply, +.container-edit-comment .list-reply, +.container-add-reply .list-reply { + padding-left: 32px; +} .page-comments .user-name, .page-add-comment .user-name, .page-view-comments .user-name, @@ -6326,20 +6333,42 @@ html.phone .document-menu .list-block .item-link { .container-view-comment .list-block { margin-top: 0; } -.container-view-add-comment, +#done-comment { + padding: 0 16px; +} +.page-add-comment .wrap-comment { + padding: 16px 16px 0 16px; +} +.page-add-comment .wrap-comment .header-comment { + justify-content: flex-start; +} +.page-add-comment .wrap-comment .user-name { + font-weight: bold; +} +.page-add-comment .wrap-comment .comment-date { + font-size: 12px; + color: #6d6d72; +} +.page-add-comment .wrap-comment .wrap-textarea { + padding-right: 6px; +} +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea { + border: 1px solid #c4c4c4; + margin-top: 0; + min-height: 100px; + border-radius: 4px; +} .container-edit-comment, .container-add-reply, container-edit-comment { height: 100%; } -.container-view-add-comment .navbar, .container-edit-comment .navbar, .container-add-reply .navbar, container-edit-comment .navbar { background-color: #FFFFFF; color: #000; } -.container-view-add-comment .navbar:after, .container-edit-comment .navbar:after, .container-add-reply .navbar:after, container-edit-comment .navbar:after { @@ -6357,43 +6386,36 @@ container-edit-comment .navbar:after { -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%; } -.container-view-add-comment .navbar .navbar-inner, .container-edit-comment .navbar .navbar-inner, .container-add-reply .navbar .navbar-inner, container-edit-comment .navbar .navbar-inner { justify-content: space-between; } -.container-view-add-comment .navbar a.link i + span, .container-edit-comment .navbar a.link i + span, .container-add-reply .navbar a.link i + span, container-edit-comment .navbar a.link i + span { margin-left: 0; } -.container-view-add-comment .navbar .center, .container-edit-comment .navbar .center, .container-add-reply .navbar .center, container-edit-comment .navbar .center { font-size: 18px; } -.container-view-add-comment .navbar .right, .container-edit-comment .navbar .right, .container-add-reply .navbar .right, container-edit-comment .navbar .right { margin-left: 0; } -.container-view-add-comment .page-add-comment, .container-edit-comment .page-add-comment, .container-add-reply .page-add-comment, container-edit-comment .page-add-comment { background-color: #FFFFFF; } -.container-view-add-comment .page-add-comment .page-content, .container-edit-comment .page-add-comment .page-content, .container-add-reply .page-add-comment .page-content, container-edit-comment .page-add-comment .page-content { padding: 0 16px 80px; } -.container-view-add-comment .header-comment, .container-edit-comment .header-comment, .container-add-reply .header-comment, container-edit-comment .header-comment { diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css index 1389f301e..5b03b9502 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css @@ -6498,6 +6498,14 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after margin: 0; word-break: break-word; } +.page-comments .list-reply, +.add-comment .list-reply, +.page-view-comments .list-reply, +.container-edit-comment .list-reply, +.container-add-reply .list-reply, +.view-comment .list-reply { + padding-left: 32px; +} .page-comments .user-name, .add-comment .user-name, .page-view-comments .user-name, @@ -6783,48 +6791,35 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after min-height: 80px; height: 80px; } -.container-view-add-comment { - height: 100%; +#done-comment { + color: #40865c; } -.container-view-add-comment .navbar { +.page-add-comment { background-color: #FFFFFF; } -.container-view-add-comment .navbar a.link i + span { - margin-left: 0; +.page-add-comment .wrap-comment { + padding: 16px 16px 0 16px; } -.container-view-add-comment .page { - background-color: #FFFFFF; +.page-add-comment .wrap-comment .header-comment { + justify-content: flex-start; } -.container-view-add-comment .page .page-content { - padding: 0 16px 80px; +.page-add-comment .wrap-comment .user-name { + font-weight: bold; } -.popover.add-comment .toolbar-bottom { - position: absolute; - bottom: 0; +.page-add-comment .wrap-comment .comment-date { + font-size: 12px; + color: #6d6d72; } -.popover.add-comment .toolbar { - position: absolute; - background-color: #FFFFFF; - box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); - border-radius: 0 0 13px 13px; +.page-add-comment .wrap-comment .wrap-textarea { + margin-top: 16px; + padding-right: 6px; } -.popover.add-comment .toolbar:before { - content: none; -} -.popover.add-comment .toolbar .toolbar-inner { - display: flex; - justify-content: space-between; - padding: 0 16px; -} -.popover.add-comment .wrap-comment { - padding-bottom: 80px; -} -.popover.add-comment .comment-textarea { +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea { border: 1px solid #c4c4c4; - border-radius: 5px; - min-height: 80px; - max-height: 300px; - width: 280px; + margin-top: 0; + min-height: 100px; + border-radius: 4px; + width: 100%; } .container-add-reply { height: 100%; diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-material.css b/apps/spreadsheeteditor/mobile/resources/css/app-material.css index 887889736..c887372bd 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-material.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-material.css @@ -6091,6 +6091,13 @@ html.phone .document-menu .list-block .item-link { margin: 0; word-break: break-word; } +.page-comments .list-reply, +.page-add-comment .list-reply, +.page-view-comments .list-reply, +.container-edit-comment .list-reply, +.container-add-reply .list-reply { + padding-left: 32px; +} .page-comments .user-name, .page-add-comment .user-name, .page-view-comments .user-name, @@ -6336,20 +6343,42 @@ html.phone .document-menu .list-block .item-link { .container-view-comment .list-block { margin-top: 0; } -.container-view-add-comment, +#done-comment { + padding: 0 16px; +} +.page-add-comment .wrap-comment { + padding: 16px 16px 0 16px; +} +.page-add-comment .wrap-comment .header-comment { + justify-content: flex-start; +} +.page-add-comment .wrap-comment .user-name { + font-weight: bold; +} +.page-add-comment .wrap-comment .comment-date { + font-size: 12px; + color: #6d6d72; +} +.page-add-comment .wrap-comment .wrap-textarea { + padding-right: 6px; +} +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea { + border: 1px solid #c4c4c4; + margin-top: 0; + min-height: 100px; + border-radius: 4px; +} .container-edit-comment, .container-add-reply, container-edit-comment { height: 100%; } -.container-view-add-comment .navbar, .container-edit-comment .navbar, .container-add-reply .navbar, container-edit-comment .navbar { background-color: #FFFFFF; color: #000; } -.container-view-add-comment .navbar:after, .container-edit-comment .navbar:after, .container-add-reply .navbar:after, container-edit-comment .navbar:after { @@ -6367,43 +6396,36 @@ container-edit-comment .navbar:after { -webkit-transform-origin: 50% 100%; transform-origin: 50% 100%; } -.container-view-add-comment .navbar .navbar-inner, .container-edit-comment .navbar .navbar-inner, .container-add-reply .navbar .navbar-inner, container-edit-comment .navbar .navbar-inner { justify-content: space-between; } -.container-view-add-comment .navbar a.link i + span, .container-edit-comment .navbar a.link i + span, .container-add-reply .navbar a.link i + span, container-edit-comment .navbar a.link i + span { margin-left: 0; } -.container-view-add-comment .navbar .center, .container-edit-comment .navbar .center, .container-add-reply .navbar .center, container-edit-comment .navbar .center { font-size: 18px; } -.container-view-add-comment .navbar .right, .container-edit-comment .navbar .right, .container-add-reply .navbar .right, container-edit-comment .navbar .right { margin-left: 0; } -.container-view-add-comment .page-add-comment, .container-edit-comment .page-add-comment, .container-add-reply .page-add-comment, container-edit-comment .page-add-comment { background-color: #FFFFFF; } -.container-view-add-comment .page-add-comment .page-content, .container-edit-comment .page-add-comment .page-content, .container-add-reply .page-add-comment .page-content, container-edit-comment .page-add-comment .page-content { padding: 0 16px 80px; } -.container-view-add-comment .header-comment, .container-edit-comment .header-comment, .container-add-reply .header-comment, container-edit-comment .header-comment { From 2422fab071a0fe0d8e2f31146c2a7edf0488439a Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Tue, 31 Mar 2020 20:14:05 +0300 Subject: [PATCH 07/23] [DE mobile] Add style of comments view for android --- .../mobile/lib/controller/Collaboration.js | 14 ++ .../resources/less/ios/_collaboration.less | 13 +- .../less/material/_collaboration.less | 88 ++++++++-- .../mobile/app/template/AddOther.template | 2 +- .../mobile/resources/css/app-ios.css | 19 ++- .../mobile/resources/css/app-material.css | 155 ++++++++++++++---- .../resources/less/material/_icons.less | 4 +- .../mobile/resources/css/app-ios.css | 19 ++- .../mobile/resources/css/app-material.css | 151 +++++++++++++---- .../mobile/resources/css/app-ios.css | 19 ++- .../mobile/resources/css/app-material.css | 151 +++++++++++++---- 11 files changed, 495 insertions(+), 140 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index af364fbdd..2de3c0ac9 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -828,6 +828,20 @@ define([ '', $$('#toolbar-collaboration') ); + this.picker = $$(me.modalViewComment); + var $overlay = $('.modal-overlay'); + + $$(this.picker).on('opened', function () { + $overlay.on('removeClass', function () { + if (!$overlay.hasClass('modal-overlay-visible')) { + $overlay.addClass('modal-overlay-visible') + } + }); + }).on('close', function () { + $overlay.off('removeClass'); + $overlay.removeClass('modal-overlay-visible'); + $('.popover').remove(); + }); } me.getView('Common.Views.Collaboration').renderViewComments(me.showComments, me.indexCurrentComment); $('.prev-comment').single('click', _.bind(me.onViewPrevComment, me)); diff --git a/apps/common/mobile/resources/less/ios/_collaboration.less b/apps/common/mobile/resources/less/ios/_collaboration.less index 5afebdaaa..076b1e2ac 100644 --- a/apps/common/mobile/resources/less/ios/_collaboration.less +++ b/apps/common/mobile/resources/less/ios/_collaboration.less @@ -103,7 +103,7 @@ word-break: break-word; } .list-reply { - padding-left: 32px; + padding-left: 26px; } .user-name { font-size: 17px; @@ -163,16 +163,17 @@ } .wrap-comment { - padding: 16px 16px 0 16px; + padding: 16px 24px 0 16px; } - .comment-textarea, .reply-textarea { + .comment-textarea, .reply-textarea, .edit-reply-textarea { margin-top: 10px; background:transparent; - border:none; outline:none; width: 100%; - min-height: 200px; font-size: 15px; + border: 1px solid #c4c4c4; + border-radius: 3px; + min-height: 100px; } } .settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after { @@ -337,7 +338,7 @@ .page-add-comment { background-color: #FFFFFF; .wrap-comment { - padding: 16px 16px 0 16px; + padding: 16px 24px 0 16px; .header-comment { justify-content: flex-start; } diff --git a/apps/common/mobile/resources/less/material/_collaboration.less b/apps/common/mobile/resources/less/material/_collaboration.less index 18f1c2cc0..231ced4b2 100644 --- a/apps/common/mobile/resources/less/material/_collaboration.less +++ b/apps/common/mobile/resources/less/material/_collaboration.less @@ -90,7 +90,7 @@ } //Comments -.page-comments, .page-add-comment, .page-view-comments, .container-edit-comment, .container-add-reply { +.page-comments, .page-add-comment, .page-view-comments, .container-edit-comment, .container-add-reply, .view-comment { .list-block .item-inner { display: block; padding: 16px 0; @@ -101,7 +101,7 @@ word-break: break-word; } .list-reply { - padding-left: 32px; + padding-left: 26px; } .user-name { font-size: 16px; @@ -144,23 +144,23 @@ } .wrap-comment { - padding: 16px 0 0 0; + padding: 16px 24px 0 16px; } - .comment-textarea, .reply-textarea { + .comment-textarea, .reply-textarea, .edit-reply-textarea { margin-top: 10px; background:transparent; - border:none; outline:none; width: 100%; - min-height: 200px; font-size: 15px; + border: 1px solid #c4c4c4; + border-radius: 3px; + min-height: 100px; } .header-comment { display: flex; justify-content: space-between; padding-right: 16px; - margin-bottom: 13px; .comment-right { display: flex; justify-content: space-between; @@ -222,7 +222,7 @@ border-top-right-radius: 4px; height: 50%; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); - .page-view-comments { + .page-view-comments, .view-comment { background-color: #FFFFFF; .list-block { margin-bottom: 120px; @@ -283,6 +283,73 @@ .list-block { margin-top: 0; } + &.popover { + border-radius: 4px; + min-height: 170px; + height: 400px; + max-height: 600px; + + .toolbar { + border-radius: 0 0 4px 4px; + .toolbar-inner { + padding-right: 0; + } + } + + .page { + border-radius: 13px; + .page-content { + padding: 16px; + padding-bottom: 80px; + + .list-block { + margin-bottom: 0px; + + .item-content { + padding-left: 0; + + .header-comment, .reply-item { + padding-right: 0; + } + } + } + + .block-reply { + margin-top: 10px; + .reply-textarea { + min-height: 70px; + width: 278px; + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 5px; + } + } + + .edit-reply-textarea { + min-height: 60px; + width: 100%; + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 5px; + height: 60px; + margin-top: 10px; + } + + .comment-text { + padding-right: 0; + + .comment-textarea { + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 8px; + min-height: 80px; + height: 80px; + } + } + } + } + + } } #done-comment { @@ -290,7 +357,7 @@ } .page-add-comment { .wrap-comment { - padding: 16px 16px 0 16px; + padding: 16px 24px 0 16px; .header-comment { justify-content: flex-start; } @@ -348,9 +415,6 @@ } .page-add-comment { background-color: #FFFFFF; - .page-content { - padding: 0 16px 80px; - } } .header-comment { justify-content: flex-start; diff --git a/apps/documenteditor/mobile/app/template/AddOther.template b/apps/documenteditor/mobile/app/template/AddOther.template index d4b9d19f6..ee5a922fb 100644 --- a/apps/documenteditor/mobile/app/template/AddOther.template +++ b/apps/documenteditor/mobile/app/template/AddOther.template @@ -344,7 +344,7 @@
    <% if (!android) { %><%= scope.textBack %><% } %>
    <%= scope.textAddComment %>
    -
    <% if (android) { %><% } else { %><%= scope.textDone %><% } %>
    +
    <% if (android) { %><% } else { %><%= scope.textDone %><% } %>
    diff --git a/apps/documenteditor/mobile/resources/css/app-ios.css b/apps/documenteditor/mobile/resources/css/app-ios.css index 7bd3329a2..3e3be5679 100644 --- a/apps/documenteditor/mobile/resources/css/app-ios.css +++ b/apps/documenteditor/mobile/resources/css/app-ios.css @@ -6504,7 +6504,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .list-reply, .container-add-reply .list-reply, .view-comment .list-reply { - padding-left: 32px; + padding-left: 26px; } .page-comments .user-name, .add-comment .user-name, @@ -6620,7 +6620,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .wrap-comment, .container-add-reply .wrap-comment, .view-comment .wrap-comment { - padding: 16px 16px 0 16px; + padding: 16px 24px 0 16px; } .page-comments .comment-textarea, .add-comment .comment-textarea, @@ -6633,14 +6633,21 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, -.view-comment .reply-textarea { +.view-comment .reply-textarea, +.page-comments .edit-reply-textarea, +.add-comment .edit-reply-textarea, +.page-view-comments .edit-reply-textarea, +.container-edit-comment .edit-reply-textarea, +.container-add-reply .edit-reply-textarea, +.view-comment .edit-reply-textarea { margin-top: 10px; background: transparent; - border: none; outline: none; width: 100%; - min-height: 200px; font-size: 15px; + border: 1px solid #c4c4c4; + border-radius: 3px; + min-height: 100px; } .settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after { @@ -6798,7 +6805,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after background-color: #FFFFFF; } .page-add-comment .wrap-comment { - padding: 16px 16px 0 16px; + padding: 16px 24px 0 16px; } .page-add-comment .wrap-comment .header-comment { justify-content: flex-start; diff --git a/apps/documenteditor/mobile/resources/css/app-material.css b/apps/documenteditor/mobile/resources/css/app-material.css index 2d06856ad..5193113d3 100644 --- a/apps/documenteditor/mobile/resources/css/app-material.css +++ b/apps/documenteditor/mobile/resources/css/app-material.css @@ -6068,7 +6068,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .list-block .item-inner, .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, -.container-add-reply .list-block .item-inner { +.container-add-reply .list-block .item-inner, +.view-comment .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; @@ -6077,7 +6078,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment p, .page-view-comments p, .container-edit-comment p, -.container-add-reply p { +.container-add-reply p, +.view-comment p { margin: 0; word-break: break-word; } @@ -6085,14 +6087,16 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .list-reply, .page-view-comments .list-reply, .container-edit-comment .list-reply, -.container-add-reply .list-reply { - padding-left: 32px; +.container-add-reply .list-reply, +.view-comment .list-reply { + padding-left: 26px; } .page-comments .user-name, .page-add-comment .user-name, .page-view-comments .user-name, .container-edit-comment .user-name, -.container-add-reply .user-name { +.container-add-reply .user-name, +.view-comment .user-name { font-size: 16px; line-height: 22px; color: #000000; @@ -6103,11 +6107,13 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-date, .container-edit-comment .comment-date, .container-add-reply .comment-date, +.view-comment .comment-date, .page-comments .reply-date, .page-add-comment .reply-date, .page-view-comments .reply-date, .container-edit-comment .reply-date, -.container-add-reply .reply-date { +.container-add-reply .reply-date, +.view-comment .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6119,11 +6125,13 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-text, .container-edit-comment .comment-text, .container-add-reply .comment-text, +.view-comment .comment-text, .page-comments .reply-text, .page-add-comment .reply-text, .page-view-comments .reply-text, .container-edit-comment .reply-text, -.container-add-reply .reply-text { +.container-add-reply .reply-text, +.view-comment .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6135,7 +6143,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .reply-item, .page-view-comments .reply-item, .container-edit-comment .reply-item, -.container-add-reply .reply-item { +.container-add-reply .reply-item, +.view-comment .reply-item { padding-right: 16px; padding-top: 13px; } @@ -6143,7 +6152,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .reply-item .header-reply, .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, -.container-add-reply .reply-item .header-reply { +.container-add-reply .reply-item .header-reply, +.view-comment .reply-item .header-reply { display: flex; justify-content: space-between; } @@ -6151,14 +6161,16 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .reply-item .user-name, .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, -.container-add-reply .reply-item .user-name { +.container-add-reply .reply-item .user-name, +.view-comment .reply-item .user-name { padding-top: 3px; } .page-comments .comment-quote, .page-add-comment .comment-quote, .page-view-comments .comment-quote, .container-edit-comment .comment-quote, -.container-add-reply .comment-quote { +.container-add-reply .comment-quote, +.view-comment .comment-quote { color: #446995; border-left: 1px solid #446995; padding-left: 10px; @@ -6169,42 +6181,53 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .wrap-comment, .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, -.container-add-reply .wrap-comment { - padding: 16px 0 0 0; +.container-add-reply .wrap-comment, +.view-comment .wrap-comment { + padding: 16px 24px 0 16px; } .page-comments .comment-textarea, .page-add-comment .comment-textarea, .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, +.view-comment .comment-textarea, .page-comments .reply-textarea, .page-add-comment .reply-textarea, .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, -.container-add-reply .reply-textarea { +.container-add-reply .reply-textarea, +.view-comment .reply-textarea, +.page-comments .edit-reply-textarea, +.page-add-comment .edit-reply-textarea, +.page-view-comments .edit-reply-textarea, +.container-edit-comment .edit-reply-textarea, +.container-add-reply .edit-reply-textarea, +.view-comment .edit-reply-textarea { margin-top: 10px; background: transparent; - border: none; outline: none; width: 100%; - min-height: 200px; font-size: 15px; + border: 1px solid #c4c4c4; + border-radius: 3px; + min-height: 100px; } .page-comments .header-comment, .page-add-comment .header-comment, .page-view-comments .header-comment, .container-edit-comment .header-comment, -.container-add-reply .header-comment { +.container-add-reply .header-comment, +.view-comment .header-comment { display: flex; justify-content: space-between; padding-right: 16px; - margin-bottom: 13px; } .page-comments .header-comment .comment-right, .page-add-comment .header-comment .comment-right, .page-view-comments .header-comment .comment-right, .container-edit-comment .header-comment .comment-right, -.container-add-reply .header-comment .comment-right { +.container-add-reply .header-comment .comment-right, +.view-comment .header-comment .comment-right { display: flex; justify-content: space-between; width: 70px; @@ -6213,7 +6236,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .header-comment .comment-left, .page-view-comments .header-comment .comment-left, .container-edit-comment .header-comment .comment-left, -.container-add-reply .header-comment .comment-left { +.container-add-reply .header-comment .comment-left, +.view-comment .header-comment .comment-left { display: flex; justify-content: space-between; } @@ -6221,7 +6245,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .header-comment .initials-comment, .page-view-comments .header-comment .initials-comment, .container-edit-comment .header-comment .initials-comment, -.container-add-reply .header-comment .initials-comment { +.container-add-reply .header-comment .initials-comment, +.view-comment .header-comment .initials-comment { height: 40px; width: 40px; border-radius: 50px; @@ -6236,7 +6261,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .header-reply .reply-left, .page-view-comments .header-reply .reply-left, .container-edit-comment .header-reply .reply-left, -.container-add-reply .header-reply .reply-left { +.container-add-reply .header-reply .reply-left, +.view-comment .header-reply .reply-left { display: flex; justify-content: space-between; align-items: flex-start; @@ -6245,7 +6271,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .header-reply .initials-reply, .page-view-comments .header-reply .initials-reply, .container-edit-comment .header-reply .initials-reply, -.container-add-reply .header-reply .initials-reply { +.container-add-reply .header-reply .initials-reply, +.view-comment .header-reply .initials-reply { width: 24px; height: 24px; color: #FFFFFF; @@ -6274,17 +6301,22 @@ html.phone .document-menu .list-block .item-link { height: 50%; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } -.container-view-comment .page-view-comments { +.container-view-comment .page-view-comments, +.container-view-comment .view-comment { background-color: #FFFFFF; } -.container-view-comment .page-view-comments .list-block { +.container-view-comment .page-view-comments .list-block, +.container-view-comment .view-comment .list-block { margin-bottom: 120px; } .container-view-comment .page-view-comments .list-block ul:before, -.container-view-comment .page-view-comments .list-block ul:after { +.container-view-comment .view-comment .list-block ul:before, +.container-view-comment .page-view-comments .list-block ul:after, +.container-view-comment .view-comment .list-block ul:after { content: none; } -.container-view-comment .page-view-comments .list-block .item-inner { +.container-view-comment .page-view-comments .list-block .item-inner, +.container-view-comment .view-comment .list-block .item-inner { padding: 0; } .container-view-comment .toolbar { @@ -6333,11 +6365,69 @@ html.phone .document-menu .list-block .item-link { .container-view-comment .list-block { margin-top: 0; } +.container-view-comment.popover { + border-radius: 4px; + min-height: 170px; + height: 400px; + max-height: 600px; +} +.container-view-comment.popover .toolbar { + border-radius: 0 0 4px 4px; +} +.container-view-comment.popover .toolbar .toolbar-inner { + padding-right: 0; +} +.container-view-comment.popover .page { + border-radius: 13px; +} +.container-view-comment.popover .page .page-content { + padding: 16px; + padding-bottom: 80px; +} +.container-view-comment.popover .page .page-content .list-block { + margin-bottom: 0px; +} +.container-view-comment.popover .page .page-content .list-block .item-content { + padding-left: 0; +} +.container-view-comment.popover .page .page-content .list-block .item-content .header-comment, +.container-view-comment.popover .page .page-content .list-block .item-content .reply-item { + padding-right: 0; +} +.container-view-comment.popover .page .page-content .block-reply { + margin-top: 10px; +} +.container-view-comment.popover .page .page-content .block-reply .reply-textarea { + min-height: 70px; + width: 278px; + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 5px; +} +.container-view-comment.popover .page .page-content .edit-reply-textarea { + min-height: 60px; + width: 100%; + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 5px; + height: 60px; + margin-top: 10px; +} +.container-view-comment.popover .page .page-content .comment-text { + padding-right: 0; +} +.container-view-comment.popover .page .page-content .comment-text .comment-textarea { + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 8px; + min-height: 80px; + height: 80px; +} #done-comment { padding: 0 16px; } .page-add-comment .wrap-comment { - padding: 16px 16px 0 16px; + padding: 16px 24px 0 16px; } .page-add-comment .wrap-comment .header-comment { justify-content: flex-start; @@ -6411,11 +6501,6 @@ container-edit-comment .navbar .right { container-edit-comment .page-add-comment { background-color: #FFFFFF; } -.container-edit-comment .page-add-comment .page-content, -.container-add-reply .page-add-comment .page-content, -container-edit-comment .page-add-comment .page-content { - padding: 0 16px 80px; -} .container-edit-comment .header-comment, .container-add-reply .header-comment, container-edit-comment .header-comment { @@ -6888,7 +6973,7 @@ i.icon.icon-next-comment { i.icon.icon-close-comment { width: 24px; height: 24px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18.9844%206.42188L13.4062%2012L18.9844%2017.5781L17.5781%2018.9844L12%2013.4062L6.42188%2018.9844L5.01562%2017.5781L10.5938%2012L5.01562%206.42188L6.42188%205.01562L12%2010.5938L17.5781%205.01562L18.9844%206.42188Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18.9844%206.42188L13.4062%2012L18.9844%2017.5781L17.5781%2018.9844L12%2013.4062L6.42188%2018.9844L5.01562%2017.5781L10.5938%2012L5.01562%206.42188L6.42188%205.01562L12%2010.5938L17.5781%205.01562L18.9844%206.42188Z%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%200.6)%22%2F%3E%3C%2Fsvg%3E"); } i.icon.icon-done-comment { width: 24px; @@ -6900,7 +6985,7 @@ i.icon.icon-insert-comment { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20.1538%209.00708H11.8462C10.8266%209.00708%2010%209.83461%2010%2010.8554V15.1694C10%2016.1902%2010.8266%2017.0177%2011.8462%2017.0177H13.8329C13.9409%2017.0177%2014.0454%2017.0556%2014.1284%2017.1248L18.243%2020.392C18.5436%2020.6428%2019%2020.4288%2019%2020.037V17.4798C19%2017.2246%2019.2066%2017.0177%2019.4615%2017.0177H20.1538C21.1734%2017.0177%2022%2016.1902%2022%2015.1694V10.8554C22%209.83461%2021.1734%209.00708%2020.1538%209.00708ZM20%2010.0083C20.5523%2010.0083%2021%2010.4565%2021%2011.0095V15.0154C21%2015.5683%2020.5523%2016.0165%2020%2016.0165H18.0025L18%2018.8995C18%2019.2912%2018%2019%2018%2019L14.5%2016.0165H12C11.4477%2016.0165%2011%2015.5683%2011%2015.0154V11.0095C11%2010.4565%2011.4477%2010.0083%2012%2010.0083H20Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M14.5%203H4.5C3.18908%203%202%204.2153%202%205.50295V12.0346C2%2013.3222%203.18908%2014.013%204.5%2014.013H5.5C5.82773%2014.013%206%2014.1917%206%2014.5136V17.5183C6%2018.0125%206.6135%2018.3352%207%2018.0189L11%2014.9858V13.5L7%2016.5V13.0118H4.5C3.78992%2013.0118%203%2012.732%203%2012.0346V5.50295C3%204.80547%203.78992%204.00118%204.5%204.00118H14.5C15.2101%204.00118%2016%204.80547%2016%205.50295V8.0059H17V5.50295C17%204.2153%2015.8109%203%2014.5%203Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); } -i.icon.icon-done-comment { +i.icon.icon-done-comment-white { width: 24px; height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9%2016.1719L19.5938%205.57812L21%206.98438L9%2018.9844L3.42188%2013.4062L4.82812%2012L9%2016.1719Z%22%20fill%3D%22%23FFFFFF%22%2F%3E%3C%2Fsvg%3E"); diff --git a/apps/documenteditor/mobile/resources/less/material/_icons.less b/apps/documenteditor/mobile/resources/less/material/_icons.less index cc2d96f0f..21f1d2b7c 100644 --- a/apps/documenteditor/mobile/resources/less/material/_icons.less +++ b/apps/documenteditor/mobile/resources/less/material/_icons.less @@ -432,7 +432,7 @@ i.icon { &.icon-close-comment { width: 24px; height: 24px; - .encoded-svg-background(''); + .encoded-svg-background(''); } &.icon-done-comment { width: 24px; @@ -444,7 +444,7 @@ i.icon { height: 24px; .encoded-svg-background(''); } - &.icon-done-comment { + &.icon-done-comment-white { width: 24px; height: 24px; .encoded-svg-background(''); diff --git a/apps/presentationeditor/mobile/resources/css/app-ios.css b/apps/presentationeditor/mobile/resources/css/app-ios.css index 9a561db39..8a92320f8 100644 --- a/apps/presentationeditor/mobile/resources/css/app-ios.css +++ b/apps/presentationeditor/mobile/resources/css/app-ios.css @@ -6504,7 +6504,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .list-reply, .container-add-reply .list-reply, .view-comment .list-reply { - padding-left: 32px; + padding-left: 26px; } .page-comments .user-name, .add-comment .user-name, @@ -6620,7 +6620,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .wrap-comment, .container-add-reply .wrap-comment, .view-comment .wrap-comment { - padding: 16px 16px 0 16px; + padding: 16px 24px 0 16px; } .page-comments .comment-textarea, .add-comment .comment-textarea, @@ -6633,14 +6633,21 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, -.view-comment .reply-textarea { +.view-comment .reply-textarea, +.page-comments .edit-reply-textarea, +.add-comment .edit-reply-textarea, +.page-view-comments .edit-reply-textarea, +.container-edit-comment .edit-reply-textarea, +.container-add-reply .edit-reply-textarea, +.view-comment .edit-reply-textarea { margin-top: 10px; background: transparent; - border: none; outline: none; width: 100%; - min-height: 200px; font-size: 15px; + border: 1px solid #c4c4c4; + border-radius: 3px; + min-height: 100px; } .settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after { @@ -6798,7 +6805,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after background-color: #FFFFFF; } .page-add-comment .wrap-comment { - padding: 16px 16px 0 16px; + padding: 16px 24px 0 16px; } .page-add-comment .wrap-comment .header-comment { justify-content: flex-start; diff --git a/apps/presentationeditor/mobile/resources/css/app-material.css b/apps/presentationeditor/mobile/resources/css/app-material.css index 1e3d2c4fc..8be55ee01 100644 --- a/apps/presentationeditor/mobile/resources/css/app-material.css +++ b/apps/presentationeditor/mobile/resources/css/app-material.css @@ -6068,7 +6068,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .list-block .item-inner, .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, -.container-add-reply .list-block .item-inner { +.container-add-reply .list-block .item-inner, +.view-comment .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; @@ -6077,7 +6078,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment p, .page-view-comments p, .container-edit-comment p, -.container-add-reply p { +.container-add-reply p, +.view-comment p { margin: 0; word-break: break-word; } @@ -6085,14 +6087,16 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .list-reply, .page-view-comments .list-reply, .container-edit-comment .list-reply, -.container-add-reply .list-reply { - padding-left: 32px; +.container-add-reply .list-reply, +.view-comment .list-reply { + padding-left: 26px; } .page-comments .user-name, .page-add-comment .user-name, .page-view-comments .user-name, .container-edit-comment .user-name, -.container-add-reply .user-name { +.container-add-reply .user-name, +.view-comment .user-name { font-size: 16px; line-height: 22px; color: #000000; @@ -6103,11 +6107,13 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-date, .container-edit-comment .comment-date, .container-add-reply .comment-date, +.view-comment .comment-date, .page-comments .reply-date, .page-add-comment .reply-date, .page-view-comments .reply-date, .container-edit-comment .reply-date, -.container-add-reply .reply-date { +.container-add-reply .reply-date, +.view-comment .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6119,11 +6125,13 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-text, .container-edit-comment .comment-text, .container-add-reply .comment-text, +.view-comment .comment-text, .page-comments .reply-text, .page-add-comment .reply-text, .page-view-comments .reply-text, .container-edit-comment .reply-text, -.container-add-reply .reply-text { +.container-add-reply .reply-text, +.view-comment .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6135,7 +6143,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .reply-item, .page-view-comments .reply-item, .container-edit-comment .reply-item, -.container-add-reply .reply-item { +.container-add-reply .reply-item, +.view-comment .reply-item { padding-right: 16px; padding-top: 13px; } @@ -6143,7 +6152,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .reply-item .header-reply, .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, -.container-add-reply .reply-item .header-reply { +.container-add-reply .reply-item .header-reply, +.view-comment .reply-item .header-reply { display: flex; justify-content: space-between; } @@ -6151,14 +6161,16 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .reply-item .user-name, .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, -.container-add-reply .reply-item .user-name { +.container-add-reply .reply-item .user-name, +.view-comment .reply-item .user-name { padding-top: 3px; } .page-comments .comment-quote, .page-add-comment .comment-quote, .page-view-comments .comment-quote, .container-edit-comment .comment-quote, -.container-add-reply .comment-quote { +.container-add-reply .comment-quote, +.view-comment .comment-quote { color: #aa5252; border-left: 1px solid #aa5252; padding-left: 10px; @@ -6169,42 +6181,53 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .wrap-comment, .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, -.container-add-reply .wrap-comment { - padding: 16px 0 0 0; +.container-add-reply .wrap-comment, +.view-comment .wrap-comment { + padding: 16px 24px 0 16px; } .page-comments .comment-textarea, .page-add-comment .comment-textarea, .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, +.view-comment .comment-textarea, .page-comments .reply-textarea, .page-add-comment .reply-textarea, .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, -.container-add-reply .reply-textarea { +.container-add-reply .reply-textarea, +.view-comment .reply-textarea, +.page-comments .edit-reply-textarea, +.page-add-comment .edit-reply-textarea, +.page-view-comments .edit-reply-textarea, +.container-edit-comment .edit-reply-textarea, +.container-add-reply .edit-reply-textarea, +.view-comment .edit-reply-textarea { margin-top: 10px; background: transparent; - border: none; outline: none; width: 100%; - min-height: 200px; font-size: 15px; + border: 1px solid #c4c4c4; + border-radius: 3px; + min-height: 100px; } .page-comments .header-comment, .page-add-comment .header-comment, .page-view-comments .header-comment, .container-edit-comment .header-comment, -.container-add-reply .header-comment { +.container-add-reply .header-comment, +.view-comment .header-comment { display: flex; justify-content: space-between; padding-right: 16px; - margin-bottom: 13px; } .page-comments .header-comment .comment-right, .page-add-comment .header-comment .comment-right, .page-view-comments .header-comment .comment-right, .container-edit-comment .header-comment .comment-right, -.container-add-reply .header-comment .comment-right { +.container-add-reply .header-comment .comment-right, +.view-comment .header-comment .comment-right { display: flex; justify-content: space-between; width: 70px; @@ -6213,7 +6236,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .header-comment .comment-left, .page-view-comments .header-comment .comment-left, .container-edit-comment .header-comment .comment-left, -.container-add-reply .header-comment .comment-left { +.container-add-reply .header-comment .comment-left, +.view-comment .header-comment .comment-left { display: flex; justify-content: space-between; } @@ -6221,7 +6245,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .header-comment .initials-comment, .page-view-comments .header-comment .initials-comment, .container-edit-comment .header-comment .initials-comment, -.container-add-reply .header-comment .initials-comment { +.container-add-reply .header-comment .initials-comment, +.view-comment .header-comment .initials-comment { height: 40px; width: 40px; border-radius: 50px; @@ -6236,7 +6261,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .header-reply .reply-left, .page-view-comments .header-reply .reply-left, .container-edit-comment .header-reply .reply-left, -.container-add-reply .header-reply .reply-left { +.container-add-reply .header-reply .reply-left, +.view-comment .header-reply .reply-left { display: flex; justify-content: space-between; align-items: flex-start; @@ -6245,7 +6271,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .header-reply .initials-reply, .page-view-comments .header-reply .initials-reply, .container-edit-comment .header-reply .initials-reply, -.container-add-reply .header-reply .initials-reply { +.container-add-reply .header-reply .initials-reply, +.view-comment .header-reply .initials-reply { width: 24px; height: 24px; color: #FFFFFF; @@ -6274,17 +6301,22 @@ html.phone .document-menu .list-block .item-link { height: 50%; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } -.container-view-comment .page-view-comments { +.container-view-comment .page-view-comments, +.container-view-comment .view-comment { background-color: #FFFFFF; } -.container-view-comment .page-view-comments .list-block { +.container-view-comment .page-view-comments .list-block, +.container-view-comment .view-comment .list-block { margin-bottom: 120px; } .container-view-comment .page-view-comments .list-block ul:before, -.container-view-comment .page-view-comments .list-block ul:after { +.container-view-comment .view-comment .list-block ul:before, +.container-view-comment .page-view-comments .list-block ul:after, +.container-view-comment .view-comment .list-block ul:after { content: none; } -.container-view-comment .page-view-comments .list-block .item-inner { +.container-view-comment .page-view-comments .list-block .item-inner, +.container-view-comment .view-comment .list-block .item-inner { padding: 0; } .container-view-comment .toolbar { @@ -6333,11 +6365,69 @@ html.phone .document-menu .list-block .item-link { .container-view-comment .list-block { margin-top: 0; } +.container-view-comment.popover { + border-radius: 4px; + min-height: 170px; + height: 400px; + max-height: 600px; +} +.container-view-comment.popover .toolbar { + border-radius: 0 0 4px 4px; +} +.container-view-comment.popover .toolbar .toolbar-inner { + padding-right: 0; +} +.container-view-comment.popover .page { + border-radius: 13px; +} +.container-view-comment.popover .page .page-content { + padding: 16px; + padding-bottom: 80px; +} +.container-view-comment.popover .page .page-content .list-block { + margin-bottom: 0px; +} +.container-view-comment.popover .page .page-content .list-block .item-content { + padding-left: 0; +} +.container-view-comment.popover .page .page-content .list-block .item-content .header-comment, +.container-view-comment.popover .page .page-content .list-block .item-content .reply-item { + padding-right: 0; +} +.container-view-comment.popover .page .page-content .block-reply { + margin-top: 10px; +} +.container-view-comment.popover .page .page-content .block-reply .reply-textarea { + min-height: 70px; + width: 278px; + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 5px; +} +.container-view-comment.popover .page .page-content .edit-reply-textarea { + min-height: 60px; + width: 100%; + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 5px; + height: 60px; + margin-top: 10px; +} +.container-view-comment.popover .page .page-content .comment-text { + padding-right: 0; +} +.container-view-comment.popover .page .page-content .comment-text .comment-textarea { + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 8px; + min-height: 80px; + height: 80px; +} #done-comment { padding: 0 16px; } .page-add-comment .wrap-comment { - padding: 16px 16px 0 16px; + padding: 16px 24px 0 16px; } .page-add-comment .wrap-comment .header-comment { justify-content: flex-start; @@ -6411,11 +6501,6 @@ container-edit-comment .navbar .right { container-edit-comment .page-add-comment { background-color: #FFFFFF; } -.container-edit-comment .page-add-comment .page-content, -.container-add-reply .page-add-comment .page-content, -container-edit-comment .page-add-comment .page-content { - padding: 0 16px 80px; -} .container-edit-comment .header-comment, .container-add-reply .header-comment, container-edit-comment .header-comment { diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css index 5b03b9502..97d206c9b 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css @@ -6504,7 +6504,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .list-reply, .container-add-reply .list-reply, .view-comment .list-reply { - padding-left: 32px; + padding-left: 26px; } .page-comments .user-name, .add-comment .user-name, @@ -6620,7 +6620,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .wrap-comment, .container-add-reply .wrap-comment, .view-comment .wrap-comment { - padding: 16px 16px 0 16px; + padding: 16px 24px 0 16px; } .page-comments .comment-textarea, .add-comment .comment-textarea, @@ -6633,14 +6633,21 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, -.view-comment .reply-textarea { +.view-comment .reply-textarea, +.page-comments .edit-reply-textarea, +.add-comment .edit-reply-textarea, +.page-view-comments .edit-reply-textarea, +.container-edit-comment .edit-reply-textarea, +.container-add-reply .edit-reply-textarea, +.view-comment .edit-reply-textarea { margin-top: 10px; background: transparent; - border: none; outline: none; width: 100%; - min-height: 200px; font-size: 15px; + border: 1px solid #c4c4c4; + border-radius: 3px; + min-height: 100px; } .settings.popup .list-block ul.list-reply:last-child:after, .settings.popover .list-block ul.list-reply:last-child:after { @@ -6798,7 +6805,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after background-color: #FFFFFF; } .page-add-comment .wrap-comment { - padding: 16px 16px 0 16px; + padding: 16px 24px 0 16px; } .page-add-comment .wrap-comment .header-comment { justify-content: flex-start; diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-material.css b/apps/spreadsheeteditor/mobile/resources/css/app-material.css index c887372bd..594d458e7 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-material.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-material.css @@ -6078,7 +6078,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .list-block .item-inner, .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, -.container-add-reply .list-block .item-inner { +.container-add-reply .list-block .item-inner, +.view-comment .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; @@ -6087,7 +6088,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment p, .page-view-comments p, .container-edit-comment p, -.container-add-reply p { +.container-add-reply p, +.view-comment p { margin: 0; word-break: break-word; } @@ -6095,14 +6097,16 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .list-reply, .page-view-comments .list-reply, .container-edit-comment .list-reply, -.container-add-reply .list-reply { - padding-left: 32px; +.container-add-reply .list-reply, +.view-comment .list-reply { + padding-left: 26px; } .page-comments .user-name, .page-add-comment .user-name, .page-view-comments .user-name, .container-edit-comment .user-name, -.container-add-reply .user-name { +.container-add-reply .user-name, +.view-comment .user-name { font-size: 16px; line-height: 22px; color: #000000; @@ -6113,11 +6117,13 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-date, .container-edit-comment .comment-date, .container-add-reply .comment-date, +.view-comment .comment-date, .page-comments .reply-date, .page-add-comment .reply-date, .page-view-comments .reply-date, .container-edit-comment .reply-date, -.container-add-reply .reply-date { +.container-add-reply .reply-date, +.view-comment .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6129,11 +6135,13 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-text, .container-edit-comment .comment-text, .container-add-reply .comment-text, +.view-comment .comment-text, .page-comments .reply-text, .page-add-comment .reply-text, .page-view-comments .reply-text, .container-edit-comment .reply-text, -.container-add-reply .reply-text { +.container-add-reply .reply-text, +.view-comment .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6145,7 +6153,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .reply-item, .page-view-comments .reply-item, .container-edit-comment .reply-item, -.container-add-reply .reply-item { +.container-add-reply .reply-item, +.view-comment .reply-item { padding-right: 16px; padding-top: 13px; } @@ -6153,7 +6162,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .reply-item .header-reply, .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, -.container-add-reply .reply-item .header-reply { +.container-add-reply .reply-item .header-reply, +.view-comment .reply-item .header-reply { display: flex; justify-content: space-between; } @@ -6161,14 +6171,16 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .reply-item .user-name, .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, -.container-add-reply .reply-item .user-name { +.container-add-reply .reply-item .user-name, +.view-comment .reply-item .user-name { padding-top: 3px; } .page-comments .comment-quote, .page-add-comment .comment-quote, .page-view-comments .comment-quote, .container-edit-comment .comment-quote, -.container-add-reply .comment-quote { +.container-add-reply .comment-quote, +.view-comment .comment-quote { color: #40865c; border-left: 1px solid #40865c; padding-left: 10px; @@ -6179,42 +6191,53 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .wrap-comment, .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, -.container-add-reply .wrap-comment { - padding: 16px 0 0 0; +.container-add-reply .wrap-comment, +.view-comment .wrap-comment { + padding: 16px 24px 0 16px; } .page-comments .comment-textarea, .page-add-comment .comment-textarea, .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, +.view-comment .comment-textarea, .page-comments .reply-textarea, .page-add-comment .reply-textarea, .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, -.container-add-reply .reply-textarea { +.container-add-reply .reply-textarea, +.view-comment .reply-textarea, +.page-comments .edit-reply-textarea, +.page-add-comment .edit-reply-textarea, +.page-view-comments .edit-reply-textarea, +.container-edit-comment .edit-reply-textarea, +.container-add-reply .edit-reply-textarea, +.view-comment .edit-reply-textarea { margin-top: 10px; background: transparent; - border: none; outline: none; width: 100%; - min-height: 200px; font-size: 15px; + border: 1px solid #c4c4c4; + border-radius: 3px; + min-height: 100px; } .page-comments .header-comment, .page-add-comment .header-comment, .page-view-comments .header-comment, .container-edit-comment .header-comment, -.container-add-reply .header-comment { +.container-add-reply .header-comment, +.view-comment .header-comment { display: flex; justify-content: space-between; padding-right: 16px; - margin-bottom: 13px; } .page-comments .header-comment .comment-right, .page-add-comment .header-comment .comment-right, .page-view-comments .header-comment .comment-right, .container-edit-comment .header-comment .comment-right, -.container-add-reply .header-comment .comment-right { +.container-add-reply .header-comment .comment-right, +.view-comment .header-comment .comment-right { display: flex; justify-content: space-between; width: 70px; @@ -6223,7 +6246,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .header-comment .comment-left, .page-view-comments .header-comment .comment-left, .container-edit-comment .header-comment .comment-left, -.container-add-reply .header-comment .comment-left { +.container-add-reply .header-comment .comment-left, +.view-comment .header-comment .comment-left { display: flex; justify-content: space-between; } @@ -6231,7 +6255,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .header-comment .initials-comment, .page-view-comments .header-comment .initials-comment, .container-edit-comment .header-comment .initials-comment, -.container-add-reply .header-comment .initials-comment { +.container-add-reply .header-comment .initials-comment, +.view-comment .header-comment .initials-comment { height: 40px; width: 40px; border-radius: 50px; @@ -6246,7 +6271,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .header-reply .reply-left, .page-view-comments .header-reply .reply-left, .container-edit-comment .header-reply .reply-left, -.container-add-reply .header-reply .reply-left { +.container-add-reply .header-reply .reply-left, +.view-comment .header-reply .reply-left { display: flex; justify-content: space-between; align-items: flex-start; @@ -6255,7 +6281,8 @@ html.phone .document-menu .list-block .item-link { .page-add-comment .header-reply .initials-reply, .page-view-comments .header-reply .initials-reply, .container-edit-comment .header-reply .initials-reply, -.container-add-reply .header-reply .initials-reply { +.container-add-reply .header-reply .initials-reply, +.view-comment .header-reply .initials-reply { width: 24px; height: 24px; color: #FFFFFF; @@ -6284,17 +6311,22 @@ html.phone .document-menu .list-block .item-link { height: 50%; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } -.container-view-comment .page-view-comments { +.container-view-comment .page-view-comments, +.container-view-comment .view-comment { background-color: #FFFFFF; } -.container-view-comment .page-view-comments .list-block { +.container-view-comment .page-view-comments .list-block, +.container-view-comment .view-comment .list-block { margin-bottom: 120px; } .container-view-comment .page-view-comments .list-block ul:before, -.container-view-comment .page-view-comments .list-block ul:after { +.container-view-comment .view-comment .list-block ul:before, +.container-view-comment .page-view-comments .list-block ul:after, +.container-view-comment .view-comment .list-block ul:after { content: none; } -.container-view-comment .page-view-comments .list-block .item-inner { +.container-view-comment .page-view-comments .list-block .item-inner, +.container-view-comment .view-comment .list-block .item-inner { padding: 0; } .container-view-comment .toolbar { @@ -6343,11 +6375,69 @@ html.phone .document-menu .list-block .item-link { .container-view-comment .list-block { margin-top: 0; } +.container-view-comment.popover { + border-radius: 4px; + min-height: 170px; + height: 400px; + max-height: 600px; +} +.container-view-comment.popover .toolbar { + border-radius: 0 0 4px 4px; +} +.container-view-comment.popover .toolbar .toolbar-inner { + padding-right: 0; +} +.container-view-comment.popover .page { + border-radius: 13px; +} +.container-view-comment.popover .page .page-content { + padding: 16px; + padding-bottom: 80px; +} +.container-view-comment.popover .page .page-content .list-block { + margin-bottom: 0px; +} +.container-view-comment.popover .page .page-content .list-block .item-content { + padding-left: 0; +} +.container-view-comment.popover .page .page-content .list-block .item-content .header-comment, +.container-view-comment.popover .page .page-content .list-block .item-content .reply-item { + padding-right: 0; +} +.container-view-comment.popover .page .page-content .block-reply { + margin-top: 10px; +} +.container-view-comment.popover .page .page-content .block-reply .reply-textarea { + min-height: 70px; + width: 278px; + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 5px; +} +.container-view-comment.popover .page .page-content .edit-reply-textarea { + min-height: 60px; + width: 100%; + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 5px; + height: 60px; + margin-top: 10px; +} +.container-view-comment.popover .page .page-content .comment-text { + padding-right: 0; +} +.container-view-comment.popover .page .page-content .comment-text .comment-textarea { + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 8px; + min-height: 80px; + height: 80px; +} #done-comment { padding: 0 16px; } .page-add-comment .wrap-comment { - padding: 16px 16px 0 16px; + padding: 16px 24px 0 16px; } .page-add-comment .wrap-comment .header-comment { justify-content: flex-start; @@ -6421,11 +6511,6 @@ container-edit-comment .navbar .right { container-edit-comment .page-add-comment { background-color: #FFFFFF; } -.container-edit-comment .page-add-comment .page-content, -.container-add-reply .page-add-comment .page-content, -container-edit-comment .page-add-comment .page-content { - padding: 0 16px 80px; -} .container-edit-comment .header-comment, .container-add-reply .header-comment, container-edit-comment .header-comment { From 218929dd3e1e0ebda6a1b3fc3579146f7849d561 Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Wed, 1 Apr 2020 20:34:51 +0300 Subject: [PATCH 08/23] [DE mobile] add edit comments into collaboration section --- .../mobile/lib/controller/Collaboration.js | 480 ++++++++++-------- .../lib/template/Collaboration.template | 54 ++ apps/common/mobile/lib/view/Collaboration.js | 73 ++- .../resources/less/ios/_collaboration.less | 46 +- .../less/material/_collaboration.less | 46 +- .../mobile/resources/css/app-ios.css | 166 ++++-- .../mobile/resources/css/app-material.css | 212 ++++++-- .../mobile/resources/css/app-ios.css | 166 ++++-- .../mobile/resources/css/app-material.css | 212 ++++++-- .../mobile/resources/css/app-ios.css | 166 ++++-- .../mobile/resources/css/app-material.css | 212 ++++++-- 11 files changed, 1376 insertions(+), 457 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index 2de3c0ac9..8767924b9 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -723,7 +723,7 @@ define([ findComment: function(uid) { var comment; if (this.groupCollectionFilter.length !== 0) { - comment = me.findCommentInGroup(uid); + comment = this.findCommentInGroup(uid); } else if (this.collectionComments.length !== 0) { comment = _.findWhere(this.collectionComments, {uid: uid}); } @@ -757,7 +757,7 @@ define([ DE.getController('Common.Controllers.Collaboration').getView('Common.Views.Collaboration').renderViewComments(this.showComments, this.indexCurrentComment); $('.comment-menu').single('click', _.bind(this.initMenuComments, this)); $('.reply-menu').single('click', _.bind(this.initReplyMenu, this)); - $('.comment-resolve').single('click', _.bind(this.onClickResolveComment, this)); + $('.comment-resolve').single('click', _.bind(this.onClickResolveComment, this, false)); }, showCommentModal: function() { @@ -847,9 +847,9 @@ define([ $('.prev-comment').single('click', _.bind(me.onViewPrevComment, me)); $('.next-comment').single('click', _.bind(me.onViewNextComment, me)); $('.comment-menu').single('click', _.bind(me.initMenuComments, me)); - $('.add-reply').single('click', _.bind(me.onClickAddReply, me)); + $('.add-reply').single('click', _.bind(me.onClickAddReply, me, false)); $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); - $('.comment-resolve').single('click', _.bind(me.onClickResolveComment, me)); + $('.comment-resolve').single('click', _.bind(me.onClickResolveComment, me, false)); if (me.showComments.length === 1) { $('.prev-comment, .next-comment').addClass('disabled'); @@ -921,7 +921,7 @@ define([ _.defer(function () { $('.comment-menu').single('click', _.bind(me.initMenuComments, me)); $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); - $('.comment-resolve').single('click', _.bind(me.onClickResolveComment, me)); + $('.comment-resolve').single('click', _.bind(me.onClickResolveComment, me, false)); }); } }, @@ -938,64 +938,84 @@ define([ _.defer(function () { $('.comment-menu').single('click', _.bind(me.initMenuComments, me)); $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); - $('.comment-resolve').single('click', _.bind(me.onClickResolveComment, me)); + $('.comment-resolve').single('click', _.bind(me.onClickResolveComment, me, false)); }); } }, - onClickAddReply: function() { + onClickAddReply: function(id) { var me = this; var isAndroid = Framework7.prototype.device.android === true, phone = Common.SharedSettings.get('phone'); - if (this.indexCurrentComment > -1 && this.indexCurrentComment < this.showComments.length) { - var addReplyView, - comment = this.showComments[this.indexCurrentComment]; - if (phone) { - addReplyView = uiApp.popup( - '
    ' + - '
    ' + - '
    ' + - '
    ' + (isAndroid ? '' : '' + me.textCancel + '') + '
    ' + - '
    ' + me.textAddReply + '
    ' + - '
    ' + (isAndroid ? '' : '' + me.textDone + '') + '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + - (isAndroid ? '
    ' + comment.userInitials + '
    ' : '') + - '
    ' + comment.username + '
    ' + - '
    ' + comment.date + '
    ' + - (isAndroid ? '
    ' : '') + - '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' - ); - $('.popup').css('z-index', '20000'); - } else { - $('.container-view-comment .toolbar').find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'none'); - var template = _.template('' + me.textDone + ''); - $('.container-view-comment .button-right').append(template); - template = _.template('' + me.textCancel + ''); - $('.container-view-comment .button-left').append(template); - template = _.template('
    '); - $('.view-comment .page-content').append(template); + var idComment; + if (!id) { + idComment = $('.view-comment').find('.comment').data('uid'); + } else { + idComment = id; + } + var comment = me.findComment(idComment); + me.getCurrentUser(); + var date = me.dateToLocaleTimeString(new Date()); + if (comment) { + var addReplyView; + if ($('.container-view-comment').length > 0) { + if (phone) { + addReplyView = uiApp.popup( + '
    ' + + '
    ' + + '
    ' + + '
    ' + (isAndroid ? '' : '' + me.textCancel + '') + '
    ' + + '
    ' + me.textAddReply + '
    ' + + '
    ' + (isAndroid ? '' : '' + me.textDone + '') + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + (isAndroid ? '
    ' + me.getInitials(me.currentUser.asc_getUserName()) + '
    ' : '') + + '
    ' + me.currentUser.asc_getUserName() + '
    ' + + '
    ' + date + '
    ' + + (isAndroid ? '
    ' : '') + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + ); + $('.popup').css('z-index', '20000'); + } else { + $('.container-view-comment .toolbar').find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'none'); + var template = _.template('' + me.textDone + ''); + $('.container-view-comment .button-right').append(template); + template = _.template('' + me.textCancel + ''); + $('.container-view-comment .button-left').append(template); + template = _.template('
    '); + $('.view-comment .page-content').append(template); + } + } else if ($('.container-collaboration').length > 0) { + me.getView('Common.Views.Collaboration').showPage('#comments-add-reply-view'); + var name = me.currentUser.asc_getUserName(), + color = me.currentUser.asc_getColor(); + me.getView('Common.Views.Collaboration').renderAddReply(name, color, me.getInitials(name), date); } $('.done-reply').single('click', _.bind(function (uid) { var reply = $('.reply-textarea')[0].value; - var $viewComment = $('.container-view-comment'); - if (reply && reply.length > 0) { - this.addReply(uid, reply); - uiApp.closeModal($$(addReplyView)); - this.updateViewComment(this.showComments, this.indexCurrentComment); - if (!phone) { - $viewComment.find('a.done-reply, a.cancel-reply').css('display', 'none'); - $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + if ($('.container-view-comment').length > 0) { + var $viewComment = $('.container-view-comment'); + if (reply && reply.length > 0) { + this.addReply(uid, reply); + uiApp.closeModal($$(addReplyView)); + this.updateViewComment(this.showComments, this.indexCurrentComment); + if (!phone) { + $viewComment.find('a.done-reply, a.cancel-reply').css('display', 'none'); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + } } + } else if ($('.container-collaboration').length > 0) { + this.addReply(uid, reply); + rootView.router.back(); } }, me, comment.uid)); $('.cancel-reply').single('click', _.bind(function () { @@ -1093,8 +1113,11 @@ define([ } }, - initMenuComments: function() { - if ($('.actions-modal').length === 0) { + initMenuComments: function(e) { + var $comment = $(e.currentTarget).closest('.comment'); + var idComment = $comment.data('uid'); + var comment = this.findComment(idComment); + if ($('.actions-modal').length === 0 && comment) { var me = this; _.delay(function () { var _menuItems = []; @@ -1102,7 +1125,7 @@ define([ caption: me.textEdit, event: 'edit' }); - if (!me.showComments[me.indexCurrentComment].resolved) { + if (!comment.resolved) { _menuItems.push({ caption: me.textResolve, event: 'resolve' @@ -1113,6 +1136,12 @@ define([ event: 'resolve' }); } + if ($('.container-collaboration').length > 0) { + _menuItems.push({ + caption: me.textAddReply, + event: 'addreply' + }); + } _menuItems.push({ caption: me.textDeleteComment, event: 'delete', @@ -1121,7 +1150,7 @@ define([ _.each(_menuItems, function (item) { item.text = item.caption; item.onClick = function () { - me.onCommentMenuClick(item.event) + me.onCommentMenuClick(item.event, idComment) } }); @@ -1141,6 +1170,7 @@ define([ initReplyMenu: function(event) { var me = this; var ind = $(event.currentTarget).parent().parent().data('ind'); + var idComment = $(event.currentTarget).closest('.comment').data('uid'); _.delay(function () { var _menuItems = []; _menuItems.push({ @@ -1155,7 +1185,7 @@ define([ _.each(_menuItems, function (item) { item.text = item.caption; item.onClick = function () { - me.onCommentMenuClick(item.event, ind); + me.onCommentMenuClick(item.event, idComment, ind); } }); uiApp.actions([_menuItems, [ @@ -1170,7 +1200,7 @@ define([ }, 100); }, - onCommentMenuClick: function(action, indReply) { + onCommentMenuClick: function(action, idComment, indReply) { var me = this; function addOverlay () { if (!Common.SharedSettings.get('phone')) { @@ -1183,24 +1213,27 @@ define([ switch (action) { case 'edit': addOverlay(); - me.showEditComment(); + me.showEditComment(idComment); break; case 'resolve': addOverlay(); - me.onClickResolveComment(); + me.onClickResolveComment(idComment); break; case 'delete': addOverlay(); - me.onDeleteComment(me.indexCurrentComment); + me.onDeleteComment(idComment); break; case 'editreply': addOverlay(); - me.showEditReplyModal(me.indexCurrentComment, indReply); + me.showEditReply(idComment, indReply); break; case 'deletereply': addOverlay(); - me.onDeleteReply(me.indexCurrentComment, indReply); + me.onDeleteReply(idComment, indReply); break; + case 'addreply': + addOverlay(); + me.onClickAddReply(idComment); default: addOverlay(); break; @@ -1249,29 +1282,34 @@ define([ } this.api.asc_changeComment(uid, ascComment); + return true; + } + } + return false; + }, + + onDeleteComment: function(uid) { + var comment = this.findComment(uid); + if (this.api && comment) { + this.api.asc_removeComment(uid); + if ($('.container-view-comment').length > 0) { + if (this.showComments.length === 0) { + uiApp.closeModal(); + } else { + this.indexCurrentComment = this.indexCurrentComment - 1 > -1 ? this.indexCurrentComment - 1 : 0; + this.updateViewComment(); + } } } }, - onDeleteComment: function(ind) { - if (this.api && !_.isUndefined(ind) && !_.isUndefined(this.showComments)) { - this.api.asc_removeComment(this.showComments[ind].uid); - if (this.showComments.length === 0) { - uiApp.closeModal(); - } else { - this.indexCurrentComment = this.indexCurrentComment - 1 > -1 ? this.indexCurrentComment - 1 : 0; - this.updateViewComment(); - } - } - }, - - onDeleteReply: function(indComment, indReply) { - if (!_.isUndefined(indComment) && !_.isUndefined(indReply)) { + onDeleteReply: function(idComment, indReply) { + if (!_.isUndefined(idComment) && !_.isUndefined(indReply)) { var me = this, replies = null, addReply = null, ascComment = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)), - comment = me.showComments[indComment]; + comment = me.findComment(idComment); if (ascComment && comment) { var id = comment.uid; @@ -1307,123 +1345,38 @@ define([ } me.api.asc_changeComment(id, ascComment); - me.updateViewComment(); + if($('.container-view-comment').length > 0) { + me.updateViewComment(); + } } } }, - showEditComment: function() { + showEditComment: function(idComment) { var me = this, isAndroid = Framework7.prototype.device.android === true; - if (this.indexCurrentComment > -1 && this.indexCurrentComment < this.showComments.length) { - var comment = this.showComments[this.indexCurrentComment]; - if (Common.SharedSettings.get('phone')) { - me.editView = uiApp.popup( - '
    ' + - '
    ' + - '
    ' + - '
    ' + (isAndroid ? ' ' : '' + me.textCancel + '')+ '
    ' + - '
    ' + me.textEditComment + '
    ' + - '
    ' + (isAndroid ? '' : '' + me.textDone + '') + '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + - (isAndroid ? '
    ' + comment.userInitials + '
    ' : '') + - '
    ' + comment.username + '
    ' + - '
    ' + comment.date + '
    ' + - (isAndroid ? '
    ' : '') + - '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' - ); - $('.popup').css('z-index', '20000'); - _.delay(function () { - var $textarea = $('.comment-textarea')[0]; - $textarea.focus(); - $textarea.selectionStart = $textarea.value.length; - },100); - } else { - if ($('.comment-textarea').length === 0) { - var $viewComment = $('.container-view-comment'); - var oldComment = $viewComment.find('.comment-text span').text(); - $viewComment.find('.comment-text span').css('display', 'none'); - var template = _.template(''); - $viewComment.find('.comment-text').append(template); - $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'none'); - template = _.template('' + me.textDone + ''); - $viewComment.find('.button-right').append(template); - template = _.template('' + me.textCancel + ''); - $viewComment.find('.button-left').append(template); - - _.delay(function () { - var $textarea = $viewComment.find('.comment-textarea')[0]; - $textarea.focus(); - $textarea.selectionStart = $textarea.value.length; - }, 50); - } - } - $('#edit-comment').single('click', _.bind(function (comment) { - var value = $('#comment-text')[0].value; - if (value && value.length > 0) { - comment.comment = value; - this.showComments[this.indexCurrentComment] = comment; - this.onChangeComment(comment); - if (Common.SharedSettings.get('phone')) { - uiApp.closeModal($$(me.editView)); - } else { - var $viewComment = $('.container-view-comment'); - $viewComment.find('a.done-reply, a.cancel-reply').remove(); - $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); - } - this.updateViewComment(); - } - }, me, comment)); - $('.cancel-reply').single('click', _.bind(function () { - var $viewComment = $('.container-view-comment'); - $viewComment.find('a.done-reply, a.cancel-reply, .comment-textarea').remove(); - $viewComment.find('.comment-text span').css('display', 'block'); - $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); - }, me)); - } - }, - - showEditReplyModal: function(indComment, indReply) { - var me = this; - if (indComment > -1 && indComment < this.showComments.length) { - var editView, - comment, - replies, - reply; - var isAndroid = Framework7.prototype.device.android === true; - this.showComments && (comment = this.showComments[indComment]); - comment && (replies = comment.replys); - replies && (reply = replies[indReply]); - if (reply) { + if (idComment) { + var comment = this.findComment(idComment); + if ($('.container-view-comment').length > 0) { if (Common.SharedSettings.get('phone')) { - editView = uiApp.popup( + me.editView = uiApp.popup( '
    ' + '
    ' + '
    ' + - '
    ' + (isAndroid ? '' : '' + me.textCancel + '') + '
    ' + - '
    ' + me.textEditReply + '
    ' + - '
    ' + (isAndroid ? '' : '' + me.textDone + '') + '
    ' + + '
    ' + (isAndroid ? ' ' : '' + me.textCancel + '') + '
    ' + + '
    ' + me.textEditComment + '
    ' + + '
    ' + (isAndroid ? '' : '' + me.textDone + '') + '
    ' + '
    ' + '
    ' + '
    ' + '
    ' + '
    ' + '
    ' + - (isAndroid ? '
    ' + comment.userInitials + '
    ' : '') + - '
    ' + reply.username + '
    ' + - '
    ' + reply.date + '
    ' + + (isAndroid ? '
    ' + comment.userInitials + '
    ' : '') + + '
    ' + comment.username + '
    ' + + '
    ' + comment.date + '
    ' + (isAndroid ? '
    ' : '') + - '
    ' + + '
    ' + '
    ' + '
    ' + '
    ' + @@ -1432,40 +1385,139 @@ define([ ); $('.popup').css('z-index', '20000'); _.delay(function () { - var $textarea = $('.edit-reply-textarea')[0]; + var $textarea = $('.comment-textarea')[0]; $textarea.focus(); $textarea.selectionStart = $textarea.value.length; - },100); + }, 100); } else { - var $reply = $('.reply-item[data-ind=' + indReply + ']'); - var $viewComment = $('.container-view-comment'); - $reply.find('.reply-text').css('display', 'none'); - $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'none'); - var template = _.template(''); - $reply.append(template); - template = _.template('' + me.textDone + ''); - $viewComment.find('.button-right').append(template); - template = _.template('' + me.textCancel + ''); - $viewComment.find('.button-left').append(template); - - _.delay(function () { - var $textarea = $viewComment.find('.edit-reply-textarea')[0]; - $textarea.focus(); - $textarea.selectionStart = $textarea.value.length; - }, 50); + if ($('.comment-textarea').length === 0) { + var $viewComment = $('.container-view-comment'); + var oldComment = $viewComment.find('.comment-text span').text(); + $viewComment.find('.comment-text span').css('display', 'none'); + var template = _.template(''); + $viewComment.find('.comment-text').append(template); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'none'); + template = _.template('' + me.textDone + ''); + $viewComment.find('.button-right').append(template); + template = _.template('' + me.textCancel + ''); + $viewComment.find('.button-left').append(template); + } } - $('#edit-reply').single('click', _.bind(function (comment, indReply) { - var value = $('.edit-reply-textarea')[0].value; - if (value && value.length > 0) { - comment.replys[indReply].reply = value; - this.onChangeComment(comment); + } else if ($('.container-collaboration').length > 0) { + this.getView('Common.Views.Collaboration').showPage('#comments-edit-view'); + this.getView('Common.Views.Collaboration').renderEditComment(comment); + } + _.defer(function () { + var $textarea = $('.comment-textarea')[0]; + $textarea.focus(); + $textarea.selectionStart = $textarea.value.length; + }); + $('#edit-comment').single('click', _.bind(function (comment) { + var value = $('#comment-text')[0].value; + if (value && value.length > 0) { + comment.comment = value; + if (!this.onChangeComment(comment)) return; + if ($('.container-view-comment').length > 0) { + this.showComments[this.indexCurrentComment] = comment; if (Common.SharedSettings.get('phone')) { - uiApp.closeModal($$(editView)); + uiApp.closeModal($$(me.editView)); } else { - $viewComment.find('a.done-reply, a.cancel-reply').remove(); + var $viewComment = $('.container-view-comment'); + $viewComment.find('a.done-edit-comment, a.cancel-edit-comment').remove(); $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); } this.updateViewComment(); + } else if ($('.container-collaboration').length > 0) { + rootView.router.back(); + } + } + }, me, comment)); + $('.cancel-edit-comment').single('click', _.bind(function () { + var $viewComment = $('.container-view-comment'); + $viewComment.find('a.done-edit-comment, a.cancel-edit-comment, .comment-textarea').remove(); + $viewComment.find('.comment-text span').css('display', 'block'); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + }, me)); + } + }, + + showEditReply: function(idComment, indReply) { + var me = this; + var comment = me.findComment(idComment); + if (comment) { + var editView, + replies, + reply; + var isAndroid = Framework7.prototype.device.android === true; + replies = comment.replys; + reply = replies[indReply]; + if (reply) { + if ($('.container-view-comment').length > 0) { + if (Common.SharedSettings.get('phone')) { + editView = uiApp.popup( + '
    ' + + '
    ' + + '
    ' + + '
    ' + (isAndroid ? '' : '' + me.textCancel + '') + '
    ' + + '
    ' + me.textEditReply + '
    ' + + '
    ' + (isAndroid ? '' : '' + me.textDone + '') + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + (isAndroid ? '
    ' + reply.userInitials + '
    ' : '') + + '
    ' + reply.username + '
    ' + + '
    ' + reply.date + '
    ' + + (isAndroid ? '
    ' : '') + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + ); + $('.popup').css('z-index', '20000'); + } else { + var $reply = $('.reply-item[data-ind=' + indReply + ']'); + var $viewComment = $('.container-view-comment'); + $reply.find('.reply-text').css('display', 'none'); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'none'); + var template = _.template(''); + $reply.append(template); + template = _.template('' + me.textDone + ''); + $viewComment.find('.button-right').append(template); + template = _.template('' + me.textCancel + ''); + $viewComment.find('.button-left').append(template); + } + } else if ($('.container-collaboration').length > 0) { + me.getView('Common.Views.Collaboration').showPage('#comments-edit-reply-view'); + me.getView('Common.Views.Collaboration').renderEditReply(reply); + } + _.delay(function () { + var $textarea = $('.edit-reply-textarea')[0]; + $textarea.focus(); + $textarea.selectionStart = $textarea.value.length; + }, 100); + $('#edit-reply').single('click', _.bind(function (comment, indReply) { + var value = $('.edit-reply-textarea')[0].value; + if (value && value.length > 0) { + if ($('.container-view-comment').length > 0) { + comment.replys[indReply].reply = value; + this.onChangeComment(comment); + if (Common.SharedSettings.get('phone')) { + uiApp.closeModal($$(editView)); + } else { + $viewComment.find('a.done-reply, a.cancel-reply').remove(); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + } + this.updateViewComment(); + } else { + comment.replys[indReply].reply = value; + this.onChangeComment(comment); + rootView.router.back(); + } } }, me, comment, indReply)); $('.cancel-reply').single('click', _.bind(function () { @@ -1477,12 +1529,19 @@ define([ } }, - onClickResolveComment: function() { - if (!_.isUndefined(this.indexCurrentComment) && !_.isUndefined(this.showComments)) { - var comment = this.showComments[this.indexCurrentComment]; - if (comment) { - if (this.resolveComment(comment.uid)) { - $('.comment-resolve .icon-resolve-comment').toggleClass('check'); + onClickResolveComment: function(uid, e) { + var idComment; + if (!uid) { + var $comment = $(e.currentTarget).closest('.comment'); + idComment = $comment.data('uid'); + } else { + idComment = uid; + } + var comment = this.findComment(idComment); + if (comment) { + if (this.resolveComment(comment.uid)) { + if ($('.container-view-comment').length > 0) { + $('.comment[data-uid=' + idComment + '] .comment-resolve .icon-resolve-comment').toggleClass('check'); } } } @@ -1555,6 +1614,9 @@ define([ initComments: function() { this.getView('Common.Views.Collaboration').renderComments((this.groupCollectionFilter.length !== 0) ? this.groupCollectionFilter : (this.collectionComments.length !== 0) ? this.collectionComments : false); + $('.comment-menu').single('click', _.bind(this.initMenuComments, this)); + $('.reply-menu').single('click', _.bind(this.initReplyMenu, this)); + $('.comment-resolve').single('click', _.bind(this.onClickResolveComment, this, false)); $('.comment-quote').single('click', _.bind(this.onSelectComment, this)); }, diff --git a/apps/common/mobile/lib/template/Collaboration.template b/apps/common/mobile/lib/template/Collaboration.template index f418d24b5..5ebd53428 100644 --- a/apps/common/mobile/lib/template/Collaboration.template +++ b/apps/common/mobile/lib/template/Collaboration.template @@ -237,3 +237,57 @@
    + + + + + + + + + diff --git a/apps/common/mobile/lib/view/Collaboration.js b/apps/common/mobile/lib/view/Collaboration.js index b202b6633..e0c42b43b 100644 --- a/apps/common/mobile/lib/view/Collaboration.js +++ b/apps/common/mobile/lib/view/Collaboration.js @@ -156,7 +156,7 @@ define([ template = '
    ' + '
      '; var comment = comments[indCurComment]; - template += '
    • ' + + template += '
    • ' + '
      ' + '
      '; if (isAndroid) { @@ -224,21 +224,37 @@ define([ items = []; _.each(comments, function (comment) { var itemTemplate = [ - '
    • ', + '
    • ', '
      ', + '
      ', + '<% if (android) { %>
      <%= item.userInitials %>
      <% } %>', '

      <%= item.username %>

      ', '

      <%= item.date %>

      ', + '<% if (android) { %>
      <% } %>', + '
      ', + '
      ', + '
      ', + '
      ', + '
      ', + '
      ', '<% if(item.quote) {%>', '

      <%= item.quote %>

      ', '<% } %>', - '

      <%= item.comment %>

      ', + '

      <%= item.comment %>

      ', '<% if(replys > 0) {%>', '
        ', '<% _.each(item.replys, function (reply) { %>', - '
      • ', - '

        <%= reply.username %>

        ', - '

        <%= reply.date %>

        ', - '

        <%= reply.reply %>

        ', + '
      • ', + '
        ', + '
        ', + '<% if (android) { %>
        <%= reply.userInitials %>
        <% } %>', + '

        <%= reply.username %>

        ', + '

        <%= reply.date %>

        ', + '
        ', + '<% if (android) { %>
        <% } %>', + '
        ', + '
        ', + '

        <%= reply.reply %>

        ', '
        • ', '<% }); %>', '
      ', @@ -256,7 +272,44 @@ define([ } }, + renderEditComment: function(comment) { + var $pageEdit = $('.page-edit-comment .page-content'); + var isAndroid = Framework7.prototype.device.android === true; + var template = '
      ' + + (isAndroid ? '
      ' + comment.userInitials + '
      ' : '') + + '
      ' + comment.username + '
      ' + + '
      ' + comment.date + '
      ' + + (isAndroid ? '
      ' : '') + + '
      ' + + '
      '; + $pageEdit.html(_.template(template)); + }, + renderAddReply: function(name, color, initials, date) { + var $pageAdd = $('.page-add-reply .page-content'); + var isAndroid = Framework7.prototype.device.android === true; + var template = '
      ' + + (isAndroid ? '
      ' + initials + '
      ' : '') + + '
      ' + name + '
      ' + + '
      ' + date + '
      ' + + (isAndroid ? '
      ' : '') + + '
      ' + + '
      '; + $pageAdd.html(_.template(template)); + }, + + renderEditReply: function(reply) { + var $pageEdit = $('.page-edit-reply .page-content'); + var isAndroid = Framework7.prototype.device.android === true; + var template = '
      ' + + (isAndroid ? '
      ' + reply.userInitials + '
      ' : '') + + '
      ' + reply.username + '
      ' + + '
      ' + reply.date + '
      ' + + (isAndroid ? '
      ' : '') + + '
      ' + + '
      '; + $pageEdit.html(_.template(template)); + }, textCollaboration: 'Collaboration', textReviewing: 'Review', @@ -271,7 +324,11 @@ define([ textOriginal: 'Original', textChange: 'Review Change', textEditUsers: 'Users', - textNoComments: "This document doesn\'t contain comments" + textNoComments: "This document doesn\'t contain comments", + textEditСomment: "Edit Comment", + textDone: "Done", + textAddReply: "Add Reply", + textEditReply: "Edit Reply" } })(), Common.Views.Collaboration || {})) }); \ No newline at end of file diff --git a/apps/common/mobile/resources/less/ios/_collaboration.less b/apps/common/mobile/resources/less/ios/_collaboration.less index 076b1e2ac..b47343200 100644 --- a/apps/common/mobile/resources/less/ios/_collaboration.less +++ b/apps/common/mobile/resources/less/ios/_collaboration.less @@ -92,7 +92,17 @@ } //Comments -.page-comments, .add-comment, .page-view-comments, .container-edit-comment, .container-add-reply, .view-comment { +.page-comments, .add-comment, .page-view-comments, .container-edit-comment, .container-add-reply, .view-comment, .page-edit-comment, .page-add-reply, .page-edit-reply { + .header-comment { + display: flex; + justify-content: space-between; + padding-right: 16px; + .comment-right { + display: flex; + justify-content: space-between; + width: 70px; + } + } .list-block .item-inner { display: block; padding: 16px 0; @@ -162,7 +172,7 @@ font-size: 15px; } - .wrap-comment { + .wrap-comment, .wrap-reply { padding: 16px 24px 0 16px; } .comment-textarea, .reply-textarea, .edit-reply-textarea { @@ -210,16 +220,6 @@ } .item-inner { padding: 0; - .header-comment { - display: flex; - justify-content: space-between; - padding-right: 16px; - .comment-right { - display: flex; - justify-content: space-between; - width: 70px; - } - } } } @@ -337,7 +337,7 @@ } .page-add-comment { background-color: #FFFFFF; - .wrap-comment { + .wrap-comment, .wrap-reply { padding: 16px 24px 0 16px; .header-comment { justify-content: flex-start; @@ -378,3 +378,23 @@ .actions-modal-button.color-red { color: @red; } + +.page-edit-comment, .page-add-reply, .page-edit-reply { + background-color: #FFFFFF; + .header-comment { + justify-content: flex-start; + } + .navbar { + .right { + height: 100%; + .done-reply { + display: flex; + align-items: center; + padding-left: 16px; + padding-right: 16px; + height: 100%; + } + } + } +} + diff --git a/apps/common/mobile/resources/less/material/_collaboration.less b/apps/common/mobile/resources/less/material/_collaboration.less index 231ced4b2..5eea3ac56 100644 --- a/apps/common/mobile/resources/less/material/_collaboration.less +++ b/apps/common/mobile/resources/less/material/_collaboration.less @@ -90,11 +90,21 @@ } //Comments -.page-comments, .page-add-comment, .page-view-comments, .container-edit-comment, .container-add-reply, .view-comment { - .list-block .item-inner { - display: block; - padding: 16px 0; - word-wrap: break-word; +.page-comments, .page-add-comment, .page-view-comments, .container-edit-comment, .container-add-reply, .view-comment, .page-edit-comment, .page-add-reply, .page-edit-reply { + .list-block { + ul { + &:before, &:after { + content: none; + } + } + .item-inner { + display: block; + padding: 16px 0; + word-wrap: break-word; + &:after { + content: none; + } + } } p { margin: 0; @@ -143,7 +153,7 @@ font-size: 15px; } - .wrap-comment { + .wrap-comment, .wrap-reply { padding: 16px 24px 0 16px; } .comment-textarea, .reply-textarea, .edit-reply-textarea { @@ -356,7 +366,7 @@ padding: 0 16px; } .page-add-comment { - .wrap-comment { + .wrap-comment, .wrap-reply { padding: 16px 24px 0 16px; .header-comment { justify-content: flex-start; @@ -369,6 +379,7 @@ color: #6d6d72; } .wrap-textarea { + margin-top: 16px; padding-right: 6px; .comment-textarea { border: 1px solid #c4c4c4; @@ -380,7 +391,7 @@ } } -.container-edit-comment, .container-add-reply, container-edit-comment { +.container-edit-comment, .container-add-reply { height: 100%; .navbar { background-color: #FFFFFF; @@ -423,4 +434,23 @@ .actions-modal-button.color-red { color: @red; +} + +.page-edit-comment, .page-add-reply, .page-edit-reply { + background-color: #FFFFFF; + .header-comment { + justify-content: flex-start; + } + .navbar { + .right { + height: 100%; + .done-reply { + display: flex; + align-items: center; + padding-left: 16px; + padding-right: 16px; + height: 100%; + } + } + } } \ No newline at end of file diff --git a/apps/documenteditor/mobile/resources/css/app-ios.css b/apps/documenteditor/mobile/resources/css/app-ios.css index 3e3be5679..93ca6072f 100644 --- a/apps/documenteditor/mobile/resources/css/app-ios.css +++ b/apps/documenteditor/mobile/resources/css/app-ios.css @@ -6479,12 +6479,41 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after #user-list ul:before { content: none; } +.page-comments .header-comment, +.add-comment .header-comment, +.page-view-comments .header-comment, +.container-edit-comment .header-comment, +.container-add-reply .header-comment, +.view-comment .header-comment, +.page-edit-comment .header-comment, +.page-add-reply .header-comment, +.page-edit-reply .header-comment { + display: flex; + justify-content: space-between; + padding-right: 16px; +} +.page-comments .header-comment .comment-right, +.add-comment .header-comment .comment-right, +.page-view-comments .header-comment .comment-right, +.container-edit-comment .header-comment .comment-right, +.container-add-reply .header-comment .comment-right, +.view-comment .header-comment .comment-right, +.page-edit-comment .header-comment .comment-right, +.page-add-reply .header-comment .comment-right, +.page-edit-reply .header-comment .comment-right { + display: flex; + justify-content: space-between; + width: 70px; +} .page-comments .list-block .item-inner, .add-comment .list-block .item-inner, .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, .container-add-reply .list-block .item-inner, -.view-comment .list-block .item-inner { +.view-comment .list-block .item-inner, +.page-edit-comment .list-block .item-inner, +.page-add-reply .list-block .item-inner, +.page-edit-reply .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; @@ -6494,7 +6523,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments p, .container-edit-comment p, .container-add-reply p, -.view-comment p { +.view-comment p, +.page-edit-comment p, +.page-add-reply p, +.page-edit-reply p { margin: 0; word-break: break-word; } @@ -6503,7 +6535,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .list-reply, .container-edit-comment .list-reply, .container-add-reply .list-reply, -.view-comment .list-reply { +.view-comment .list-reply, +.page-edit-comment .list-reply, +.page-add-reply .list-reply, +.page-edit-reply .list-reply { padding-left: 26px; } .page-comments .user-name, @@ -6511,7 +6546,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .user-name, .container-edit-comment .user-name, .container-add-reply .user-name, -.view-comment .user-name { +.view-comment .user-name, +.page-edit-comment .user-name, +.page-add-reply .user-name, +.page-edit-reply .user-name { font-size: 17px; line-height: 22px; color: #000000; @@ -6524,12 +6562,18 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .comment-date, .container-add-reply .comment-date, .view-comment .comment-date, +.page-edit-comment .comment-date, +.page-add-reply .comment-date, +.page-edit-reply .comment-date, .page-comments .reply-date, .add-comment .reply-date, .page-view-comments .reply-date, .container-edit-comment .reply-date, .container-add-reply .reply-date, -.view-comment .reply-date { +.view-comment .reply-date, +.page-edit-comment .reply-date, +.page-add-reply .reply-date, +.page-edit-reply .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6542,12 +6586,18 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .comment-text, .container-add-reply .comment-text, .view-comment .comment-text, +.page-edit-comment .comment-text, +.page-add-reply .comment-text, +.page-edit-reply .comment-text, .page-comments .reply-text, .add-comment .reply-text, .page-view-comments .reply-text, .container-edit-comment .reply-text, .container-add-reply .reply-text, -.view-comment .reply-text { +.view-comment .reply-text, +.page-edit-comment .reply-text, +.page-add-reply .reply-text, +.page-edit-reply .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6560,7 +6610,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item, .container-edit-comment .reply-item, .container-add-reply .reply-item, -.view-comment .reply-item { +.view-comment .reply-item, +.page-edit-comment .reply-item, +.page-add-reply .reply-item, +.page-edit-reply .reply-item { margin-top: 15px; padding-right: 16px; padding-top: 13px; @@ -6570,7 +6623,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, .container-add-reply .reply-item .header-reply, -.view-comment .reply-item .header-reply { +.view-comment .reply-item .header-reply, +.page-edit-comment .reply-item .header-reply, +.page-add-reply .reply-item .header-reply, +.page-edit-reply .reply-item .header-reply { display: flex; justify-content: space-between; } @@ -6579,7 +6635,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, .container-add-reply .reply-item .user-name, -.view-comment .reply-item .user-name { +.view-comment .reply-item .user-name, +.page-edit-comment .reply-item .user-name, +.page-add-reply .reply-item .user-name, +.page-edit-reply .reply-item .user-name { padding-top: 3px; } .page-comments .reply-item:before, @@ -6587,7 +6646,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item:before, .container-edit-comment .reply-item:before, .container-add-reply .reply-item:before, -.view-comment .reply-item:before { +.view-comment .reply-item:before, +.page-edit-comment .reply-item:before, +.page-add-reply .reply-item:before, +.page-edit-reply .reply-item:before { content: ''; position: absolute; left: auto; @@ -6607,7 +6669,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-quote, .container-edit-comment .comment-quote, .container-add-reply .comment-quote, -.view-comment .comment-quote { +.view-comment .comment-quote, +.page-edit-comment .comment-quote, +.page-add-reply .comment-quote, +.page-edit-reply .comment-quote { color: #446995; border-left: 1px solid #446995; padding-left: 10px; @@ -6619,7 +6684,19 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, .container-add-reply .wrap-comment, -.view-comment .wrap-comment { +.view-comment .wrap-comment, +.page-edit-comment .wrap-comment, +.page-add-reply .wrap-comment, +.page-edit-reply .wrap-comment, +.page-comments .wrap-reply, +.add-comment .wrap-reply, +.page-view-comments .wrap-reply, +.container-edit-comment .wrap-reply, +.container-add-reply .wrap-reply, +.view-comment .wrap-reply, +.page-edit-comment .wrap-reply, +.page-add-reply .wrap-reply, +.page-edit-reply .wrap-reply { padding: 16px 24px 0 16px; } .page-comments .comment-textarea, @@ -6628,18 +6705,27 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, .view-comment .comment-textarea, +.page-edit-comment .comment-textarea, +.page-add-reply .comment-textarea, +.page-edit-reply .comment-textarea, .page-comments .reply-textarea, .add-comment .reply-textarea, .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, .view-comment .reply-textarea, +.page-edit-comment .reply-textarea, +.page-add-reply .reply-textarea, +.page-edit-reply .reply-textarea, .page-comments .edit-reply-textarea, .add-comment .edit-reply-textarea, .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea { +.view-comment .edit-reply-textarea, +.page-edit-comment .edit-reply-textarea, +.page-add-reply .edit-reply-textarea, +.page-edit-reply .edit-reply-textarea { margin-top: 10px; background: transparent; outline: none; @@ -6689,18 +6775,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-comment .view-comment .list-block .item-inner { padding: 0; } -.container-view-comment .page-view-comments .list-block .item-inner .header-comment, -.container-view-comment .view-comment .list-block .item-inner .header-comment { - display: flex; - justify-content: space-between; - padding-right: 16px; -} -.container-view-comment .page-view-comments .list-block .item-inner .header-comment .comment-right, -.container-view-comment .view-comment .list-block .item-inner .header-comment .comment-right { - display: flex; - justify-content: space-between; - width: 70px; -} .container-view-comment .toolbar { position: absolute; background-color: #FFFFFF; @@ -6804,24 +6878,30 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-add-comment { background-color: #FFFFFF; } -.page-add-comment .wrap-comment { +.page-add-comment .wrap-comment, +.page-add-comment .wrap-reply { padding: 16px 24px 0 16px; } -.page-add-comment .wrap-comment .header-comment { +.page-add-comment .wrap-comment .header-comment, +.page-add-comment .wrap-reply .header-comment { justify-content: flex-start; } -.page-add-comment .wrap-comment .user-name { +.page-add-comment .wrap-comment .user-name, +.page-add-comment .wrap-reply .user-name { font-weight: bold; } -.page-add-comment .wrap-comment .comment-date { +.page-add-comment .wrap-comment .comment-date, +.page-add-comment .wrap-reply .comment-date { font-size: 12px; color: #6d6d72; } -.page-add-comment .wrap-comment .wrap-textarea { +.page-add-comment .wrap-comment .wrap-textarea, +.page-add-comment .wrap-reply .wrap-textarea { margin-top: 16px; padding-right: 6px; } -.page-add-comment .wrap-comment .wrap-textarea .comment-textarea { +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea, +.page-add-comment .wrap-reply .wrap-textarea .comment-textarea { border: 1px solid #c4c4c4; margin-top: 0; min-height: 100px; @@ -6843,6 +6923,30 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .actions-modal-button.color-red { color: #ff3b30; } +.page-edit-comment, +.page-add-reply, +.page-edit-reply { + background-color: #FFFFFF; +} +.page-edit-comment .header-comment, +.page-add-reply .header-comment, +.page-edit-reply .header-comment { + justify-content: flex-start; +} +.page-edit-comment .navbar .right, +.page-add-reply .navbar .right, +.page-edit-reply .navbar .right { + height: 100%; +} +.page-edit-comment .navbar .right .done-reply, +.page-add-reply .navbar .right .done-reply, +.page-edit-reply .navbar .right .done-reply { + display: flex; + align-items: center; + padding-left: 16px; + padding-right: 16px; + height: 100%; +} .tablet .searchbar.document.replace .center .searchbar:first-child { margin-right: 10px; } diff --git a/apps/documenteditor/mobile/resources/css/app-material.css b/apps/documenteditor/mobile/resources/css/app-material.css index 5193113d3..921ad3969 100644 --- a/apps/documenteditor/mobile/resources/css/app-material.css +++ b/apps/documenteditor/mobile/resources/css/app-material.css @@ -6064,22 +6064,59 @@ html.phone .document-menu .list-block .item-link { #user-list ul:before { content: none; } +.page-comments .list-block ul:before, +.page-add-comment .list-block ul:before, +.page-view-comments .list-block ul:before, +.container-edit-comment .list-block ul:before, +.container-add-reply .list-block ul:before, +.view-comment .list-block ul:before, +.page-edit-comment .list-block ul:before, +.page-add-reply .list-block ul:before, +.page-edit-reply .list-block ul:before, +.page-comments .list-block ul:after, +.page-add-comment .list-block ul:after, +.page-view-comments .list-block ul:after, +.container-edit-comment .list-block ul:after, +.container-add-reply .list-block ul:after, +.view-comment .list-block ul:after, +.page-edit-comment .list-block ul:after, +.page-add-reply .list-block ul:after, +.page-edit-reply .list-block ul:after { + content: none; +} .page-comments .list-block .item-inner, .page-add-comment .list-block .item-inner, .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, .container-add-reply .list-block .item-inner, -.view-comment .list-block .item-inner { +.view-comment .list-block .item-inner, +.page-edit-comment .list-block .item-inner, +.page-add-reply .list-block .item-inner, +.page-edit-reply .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; } +.page-comments .list-block .item-inner:after, +.page-add-comment .list-block .item-inner:after, +.page-view-comments .list-block .item-inner:after, +.container-edit-comment .list-block .item-inner:after, +.container-add-reply .list-block .item-inner:after, +.view-comment .list-block .item-inner:after, +.page-edit-comment .list-block .item-inner:after, +.page-add-reply .list-block .item-inner:after, +.page-edit-reply .list-block .item-inner:after { + content: none; +} .page-comments p, .page-add-comment p, .page-view-comments p, .container-edit-comment p, .container-add-reply p, -.view-comment p { +.view-comment p, +.page-edit-comment p, +.page-add-reply p, +.page-edit-reply p { margin: 0; word-break: break-word; } @@ -6088,7 +6125,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-reply, .container-edit-comment .list-reply, .container-add-reply .list-reply, -.view-comment .list-reply { +.view-comment .list-reply, +.page-edit-comment .list-reply, +.page-add-reply .list-reply, +.page-edit-reply .list-reply { padding-left: 26px; } .page-comments .user-name, @@ -6096,7 +6136,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .user-name, .container-edit-comment .user-name, .container-add-reply .user-name, -.view-comment .user-name { +.view-comment .user-name, +.page-edit-comment .user-name, +.page-add-reply .user-name, +.page-edit-reply .user-name { font-size: 16px; line-height: 22px; color: #000000; @@ -6108,12 +6151,18 @@ html.phone .document-menu .list-block .item-link { .container-edit-comment .comment-date, .container-add-reply .comment-date, .view-comment .comment-date, +.page-edit-comment .comment-date, +.page-add-reply .comment-date, +.page-edit-reply .comment-date, .page-comments .reply-date, .page-add-comment .reply-date, .page-view-comments .reply-date, .container-edit-comment .reply-date, .container-add-reply .reply-date, -.view-comment .reply-date { +.view-comment .reply-date, +.page-edit-comment .reply-date, +.page-add-reply .reply-date, +.page-edit-reply .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6126,12 +6175,18 @@ html.phone .document-menu .list-block .item-link { .container-edit-comment .comment-text, .container-add-reply .comment-text, .view-comment .comment-text, +.page-edit-comment .comment-text, +.page-add-reply .comment-text, +.page-edit-reply .comment-text, .page-comments .reply-text, .page-add-comment .reply-text, .page-view-comments .reply-text, .container-edit-comment .reply-text, .container-add-reply .reply-text, -.view-comment .reply-text { +.view-comment .reply-text, +.page-edit-comment .reply-text, +.page-add-reply .reply-text, +.page-edit-reply .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6144,7 +6199,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item, .container-edit-comment .reply-item, .container-add-reply .reply-item, -.view-comment .reply-item { +.view-comment .reply-item, +.page-edit-comment .reply-item, +.page-add-reply .reply-item, +.page-edit-reply .reply-item { padding-right: 16px; padding-top: 13px; } @@ -6153,7 +6211,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, .container-add-reply .reply-item .header-reply, -.view-comment .reply-item .header-reply { +.view-comment .reply-item .header-reply, +.page-edit-comment .reply-item .header-reply, +.page-add-reply .reply-item .header-reply, +.page-edit-reply .reply-item .header-reply { display: flex; justify-content: space-between; } @@ -6162,7 +6223,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, .container-add-reply .reply-item .user-name, -.view-comment .reply-item .user-name { +.view-comment .reply-item .user-name, +.page-edit-comment .reply-item .user-name, +.page-add-reply .reply-item .user-name, +.page-edit-reply .reply-item .user-name { padding-top: 3px; } .page-comments .comment-quote, @@ -6170,7 +6234,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-quote, .container-edit-comment .comment-quote, .container-add-reply .comment-quote, -.view-comment .comment-quote { +.view-comment .comment-quote, +.page-edit-comment .comment-quote, +.page-add-reply .comment-quote, +.page-edit-reply .comment-quote { color: #446995; border-left: 1px solid #446995; padding-left: 10px; @@ -6182,7 +6249,19 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, .container-add-reply .wrap-comment, -.view-comment .wrap-comment { +.view-comment .wrap-comment, +.page-edit-comment .wrap-comment, +.page-add-reply .wrap-comment, +.page-edit-reply .wrap-comment, +.page-comments .wrap-reply, +.page-add-comment .wrap-reply, +.page-view-comments .wrap-reply, +.container-edit-comment .wrap-reply, +.container-add-reply .wrap-reply, +.view-comment .wrap-reply, +.page-edit-comment .wrap-reply, +.page-add-reply .wrap-reply, +.page-edit-reply .wrap-reply { padding: 16px 24px 0 16px; } .page-comments .comment-textarea, @@ -6191,18 +6270,27 @@ html.phone .document-menu .list-block .item-link { .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, .view-comment .comment-textarea, +.page-edit-comment .comment-textarea, +.page-add-reply .comment-textarea, +.page-edit-reply .comment-textarea, .page-comments .reply-textarea, .page-add-comment .reply-textarea, .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, .view-comment .reply-textarea, +.page-edit-comment .reply-textarea, +.page-add-reply .reply-textarea, +.page-edit-reply .reply-textarea, .page-comments .edit-reply-textarea, .page-add-comment .edit-reply-textarea, .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea { +.view-comment .edit-reply-textarea, +.page-edit-comment .edit-reply-textarea, +.page-add-reply .edit-reply-textarea, +.page-edit-reply .edit-reply-textarea { margin-top: 10px; background: transparent; outline: none; @@ -6217,7 +6305,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment, .container-edit-comment .header-comment, .container-add-reply .header-comment, -.view-comment .header-comment { +.view-comment .header-comment, +.page-edit-comment .header-comment, +.page-add-reply .header-comment, +.page-edit-reply .header-comment { display: flex; justify-content: space-between; padding-right: 16px; @@ -6227,7 +6318,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .comment-right, .container-edit-comment .header-comment .comment-right, .container-add-reply .header-comment .comment-right, -.view-comment .header-comment .comment-right { +.view-comment .header-comment .comment-right, +.page-edit-comment .header-comment .comment-right, +.page-add-reply .header-comment .comment-right, +.page-edit-reply .header-comment .comment-right { display: flex; justify-content: space-between; width: 70px; @@ -6237,7 +6331,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .comment-left, .container-edit-comment .header-comment .comment-left, .container-add-reply .header-comment .comment-left, -.view-comment .header-comment .comment-left { +.view-comment .header-comment .comment-left, +.page-edit-comment .header-comment .comment-left, +.page-add-reply .header-comment .comment-left, +.page-edit-reply .header-comment .comment-left { display: flex; justify-content: space-between; } @@ -6246,7 +6343,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .initials-comment, .container-edit-comment .header-comment .initials-comment, .container-add-reply .header-comment .initials-comment, -.view-comment .header-comment .initials-comment { +.view-comment .header-comment .initials-comment, +.page-edit-comment .header-comment .initials-comment, +.page-add-reply .header-comment .initials-comment, +.page-edit-reply .header-comment .initials-comment { height: 40px; width: 40px; border-radius: 50px; @@ -6262,7 +6362,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-reply .reply-left, .container-edit-comment .header-reply .reply-left, .container-add-reply .header-reply .reply-left, -.view-comment .header-reply .reply-left { +.view-comment .header-reply .reply-left, +.page-edit-comment .header-reply .reply-left, +.page-add-reply .header-reply .reply-left, +.page-edit-reply .header-reply .reply-left { display: flex; justify-content: space-between; align-items: flex-start; @@ -6272,7 +6375,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-reply .initials-reply, .container-edit-comment .header-reply .initials-reply, .container-add-reply .header-reply .initials-reply, -.view-comment .header-reply .initials-reply { +.view-comment .header-reply .initials-reply, +.page-edit-comment .header-reply .initials-reply, +.page-add-reply .header-reply .initials-reply, +.page-edit-reply .header-reply .initials-reply { width: 24px; height: 24px; color: #FFFFFF; @@ -6426,42 +6532,46 @@ html.phone .document-menu .list-block .item-link { #done-comment { padding: 0 16px; } -.page-add-comment .wrap-comment { +.page-add-comment .wrap-comment, +.page-add-comment .wrap-reply { padding: 16px 24px 0 16px; } -.page-add-comment .wrap-comment .header-comment { +.page-add-comment .wrap-comment .header-comment, +.page-add-comment .wrap-reply .header-comment { justify-content: flex-start; } -.page-add-comment .wrap-comment .user-name { +.page-add-comment .wrap-comment .user-name, +.page-add-comment .wrap-reply .user-name { font-weight: bold; } -.page-add-comment .wrap-comment .comment-date { +.page-add-comment .wrap-comment .comment-date, +.page-add-comment .wrap-reply .comment-date { font-size: 12px; color: #6d6d72; } -.page-add-comment .wrap-comment .wrap-textarea { +.page-add-comment .wrap-comment .wrap-textarea, +.page-add-comment .wrap-reply .wrap-textarea { + margin-top: 16px; padding-right: 6px; } -.page-add-comment .wrap-comment .wrap-textarea .comment-textarea { +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea, +.page-add-comment .wrap-reply .wrap-textarea .comment-textarea { border: 1px solid #c4c4c4; margin-top: 0; min-height: 100px; border-radius: 4px; } .container-edit-comment, -.container-add-reply, -container-edit-comment { +.container-add-reply { height: 100%; } .container-edit-comment .navbar, -.container-add-reply .navbar, -container-edit-comment .navbar { +.container-add-reply .navbar { background-color: #FFFFFF; color: #000; } .container-edit-comment .navbar:after, -.container-add-reply .navbar:after, -container-edit-comment .navbar:after { +.container-add-reply .navbar:after { content: ''; position: absolute; left: 0; @@ -6477,38 +6587,56 @@ container-edit-comment .navbar:after { transform-origin: 50% 100%; } .container-edit-comment .navbar .navbar-inner, -.container-add-reply .navbar .navbar-inner, -container-edit-comment .navbar .navbar-inner { +.container-add-reply .navbar .navbar-inner { justify-content: space-between; } .container-edit-comment .navbar a.link i + span, -.container-add-reply .navbar a.link i + span, -container-edit-comment .navbar a.link i + span { +.container-add-reply .navbar a.link i + span { margin-left: 0; } .container-edit-comment .navbar .center, -.container-add-reply .navbar .center, -container-edit-comment .navbar .center { +.container-add-reply .navbar .center { font-size: 18px; } .container-edit-comment .navbar .right, -.container-add-reply .navbar .right, -container-edit-comment .navbar .right { +.container-add-reply .navbar .right { margin-left: 0; } .container-edit-comment .page-add-comment, -.container-add-reply .page-add-comment, -container-edit-comment .page-add-comment { +.container-add-reply .page-add-comment { background-color: #FFFFFF; } .container-edit-comment .header-comment, -.container-add-reply .header-comment, -container-edit-comment .header-comment { +.container-add-reply .header-comment { justify-content: flex-start; } .actions-modal-button.color-red { color: #f44336; } +.page-edit-comment, +.page-add-reply, +.page-edit-reply { + background-color: #FFFFFF; +} +.page-edit-comment .header-comment, +.page-add-reply .header-comment, +.page-edit-reply .header-comment { + justify-content: flex-start; +} +.page-edit-comment .navbar .right, +.page-add-reply .navbar .right, +.page-edit-reply .navbar .right { + height: 100%; +} +.page-edit-comment .navbar .right .done-reply, +.page-add-reply .navbar .right .done-reply, +.page-edit-reply .navbar .right .done-reply { + display: flex; + align-items: center; + padding-left: 16px; + padding-right: 16px; + height: 100%; +} .tablet .searchbar.document.replace .center > .replace { display: flex; } diff --git a/apps/presentationeditor/mobile/resources/css/app-ios.css b/apps/presentationeditor/mobile/resources/css/app-ios.css index 8a92320f8..8be090a46 100644 --- a/apps/presentationeditor/mobile/resources/css/app-ios.css +++ b/apps/presentationeditor/mobile/resources/css/app-ios.css @@ -6479,12 +6479,41 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after #user-list ul:before { content: none; } +.page-comments .header-comment, +.add-comment .header-comment, +.page-view-comments .header-comment, +.container-edit-comment .header-comment, +.container-add-reply .header-comment, +.view-comment .header-comment, +.page-edit-comment .header-comment, +.page-add-reply .header-comment, +.page-edit-reply .header-comment { + display: flex; + justify-content: space-between; + padding-right: 16px; +} +.page-comments .header-comment .comment-right, +.add-comment .header-comment .comment-right, +.page-view-comments .header-comment .comment-right, +.container-edit-comment .header-comment .comment-right, +.container-add-reply .header-comment .comment-right, +.view-comment .header-comment .comment-right, +.page-edit-comment .header-comment .comment-right, +.page-add-reply .header-comment .comment-right, +.page-edit-reply .header-comment .comment-right { + display: flex; + justify-content: space-between; + width: 70px; +} .page-comments .list-block .item-inner, .add-comment .list-block .item-inner, .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, .container-add-reply .list-block .item-inner, -.view-comment .list-block .item-inner { +.view-comment .list-block .item-inner, +.page-edit-comment .list-block .item-inner, +.page-add-reply .list-block .item-inner, +.page-edit-reply .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; @@ -6494,7 +6523,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments p, .container-edit-comment p, .container-add-reply p, -.view-comment p { +.view-comment p, +.page-edit-comment p, +.page-add-reply p, +.page-edit-reply p { margin: 0; word-break: break-word; } @@ -6503,7 +6535,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .list-reply, .container-edit-comment .list-reply, .container-add-reply .list-reply, -.view-comment .list-reply { +.view-comment .list-reply, +.page-edit-comment .list-reply, +.page-add-reply .list-reply, +.page-edit-reply .list-reply { padding-left: 26px; } .page-comments .user-name, @@ -6511,7 +6546,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .user-name, .container-edit-comment .user-name, .container-add-reply .user-name, -.view-comment .user-name { +.view-comment .user-name, +.page-edit-comment .user-name, +.page-add-reply .user-name, +.page-edit-reply .user-name { font-size: 17px; line-height: 22px; color: #000000; @@ -6524,12 +6562,18 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .comment-date, .container-add-reply .comment-date, .view-comment .comment-date, +.page-edit-comment .comment-date, +.page-add-reply .comment-date, +.page-edit-reply .comment-date, .page-comments .reply-date, .add-comment .reply-date, .page-view-comments .reply-date, .container-edit-comment .reply-date, .container-add-reply .reply-date, -.view-comment .reply-date { +.view-comment .reply-date, +.page-edit-comment .reply-date, +.page-add-reply .reply-date, +.page-edit-reply .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6542,12 +6586,18 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .comment-text, .container-add-reply .comment-text, .view-comment .comment-text, +.page-edit-comment .comment-text, +.page-add-reply .comment-text, +.page-edit-reply .comment-text, .page-comments .reply-text, .add-comment .reply-text, .page-view-comments .reply-text, .container-edit-comment .reply-text, .container-add-reply .reply-text, -.view-comment .reply-text { +.view-comment .reply-text, +.page-edit-comment .reply-text, +.page-add-reply .reply-text, +.page-edit-reply .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6560,7 +6610,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item, .container-edit-comment .reply-item, .container-add-reply .reply-item, -.view-comment .reply-item { +.view-comment .reply-item, +.page-edit-comment .reply-item, +.page-add-reply .reply-item, +.page-edit-reply .reply-item { margin-top: 15px; padding-right: 16px; padding-top: 13px; @@ -6570,7 +6623,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, .container-add-reply .reply-item .header-reply, -.view-comment .reply-item .header-reply { +.view-comment .reply-item .header-reply, +.page-edit-comment .reply-item .header-reply, +.page-add-reply .reply-item .header-reply, +.page-edit-reply .reply-item .header-reply { display: flex; justify-content: space-between; } @@ -6579,7 +6635,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, .container-add-reply .reply-item .user-name, -.view-comment .reply-item .user-name { +.view-comment .reply-item .user-name, +.page-edit-comment .reply-item .user-name, +.page-add-reply .reply-item .user-name, +.page-edit-reply .reply-item .user-name { padding-top: 3px; } .page-comments .reply-item:before, @@ -6587,7 +6646,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item:before, .container-edit-comment .reply-item:before, .container-add-reply .reply-item:before, -.view-comment .reply-item:before { +.view-comment .reply-item:before, +.page-edit-comment .reply-item:before, +.page-add-reply .reply-item:before, +.page-edit-reply .reply-item:before { content: ''; position: absolute; left: auto; @@ -6607,7 +6669,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-quote, .container-edit-comment .comment-quote, .container-add-reply .comment-quote, -.view-comment .comment-quote { +.view-comment .comment-quote, +.page-edit-comment .comment-quote, +.page-add-reply .comment-quote, +.page-edit-reply .comment-quote { color: #aa5252; border-left: 1px solid #aa5252; padding-left: 10px; @@ -6619,7 +6684,19 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, .container-add-reply .wrap-comment, -.view-comment .wrap-comment { +.view-comment .wrap-comment, +.page-edit-comment .wrap-comment, +.page-add-reply .wrap-comment, +.page-edit-reply .wrap-comment, +.page-comments .wrap-reply, +.add-comment .wrap-reply, +.page-view-comments .wrap-reply, +.container-edit-comment .wrap-reply, +.container-add-reply .wrap-reply, +.view-comment .wrap-reply, +.page-edit-comment .wrap-reply, +.page-add-reply .wrap-reply, +.page-edit-reply .wrap-reply { padding: 16px 24px 0 16px; } .page-comments .comment-textarea, @@ -6628,18 +6705,27 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, .view-comment .comment-textarea, +.page-edit-comment .comment-textarea, +.page-add-reply .comment-textarea, +.page-edit-reply .comment-textarea, .page-comments .reply-textarea, .add-comment .reply-textarea, .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, .view-comment .reply-textarea, +.page-edit-comment .reply-textarea, +.page-add-reply .reply-textarea, +.page-edit-reply .reply-textarea, .page-comments .edit-reply-textarea, .add-comment .edit-reply-textarea, .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea { +.view-comment .edit-reply-textarea, +.page-edit-comment .edit-reply-textarea, +.page-add-reply .edit-reply-textarea, +.page-edit-reply .edit-reply-textarea { margin-top: 10px; background: transparent; outline: none; @@ -6689,18 +6775,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-comment .view-comment .list-block .item-inner { padding: 0; } -.container-view-comment .page-view-comments .list-block .item-inner .header-comment, -.container-view-comment .view-comment .list-block .item-inner .header-comment { - display: flex; - justify-content: space-between; - padding-right: 16px; -} -.container-view-comment .page-view-comments .list-block .item-inner .header-comment .comment-right, -.container-view-comment .view-comment .list-block .item-inner .header-comment .comment-right { - display: flex; - justify-content: space-between; - width: 70px; -} .container-view-comment .toolbar { position: absolute; background-color: #FFFFFF; @@ -6804,24 +6878,30 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-add-comment { background-color: #FFFFFF; } -.page-add-comment .wrap-comment { +.page-add-comment .wrap-comment, +.page-add-comment .wrap-reply { padding: 16px 24px 0 16px; } -.page-add-comment .wrap-comment .header-comment { +.page-add-comment .wrap-comment .header-comment, +.page-add-comment .wrap-reply .header-comment { justify-content: flex-start; } -.page-add-comment .wrap-comment .user-name { +.page-add-comment .wrap-comment .user-name, +.page-add-comment .wrap-reply .user-name { font-weight: bold; } -.page-add-comment .wrap-comment .comment-date { +.page-add-comment .wrap-comment .comment-date, +.page-add-comment .wrap-reply .comment-date { font-size: 12px; color: #6d6d72; } -.page-add-comment .wrap-comment .wrap-textarea { +.page-add-comment .wrap-comment .wrap-textarea, +.page-add-comment .wrap-reply .wrap-textarea { margin-top: 16px; padding-right: 6px; } -.page-add-comment .wrap-comment .wrap-textarea .comment-textarea { +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea, +.page-add-comment .wrap-reply .wrap-textarea .comment-textarea { border: 1px solid #c4c4c4; margin-top: 0; min-height: 100px; @@ -6843,6 +6923,30 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .actions-modal-button.color-red { color: #ff3b30; } +.page-edit-comment, +.page-add-reply, +.page-edit-reply { + background-color: #FFFFFF; +} +.page-edit-comment .header-comment, +.page-add-reply .header-comment, +.page-edit-reply .header-comment { + justify-content: flex-start; +} +.page-edit-comment .navbar .right, +.page-add-reply .navbar .right, +.page-edit-reply .navbar .right { + height: 100%; +} +.page-edit-comment .navbar .right .done-reply, +.page-add-reply .navbar .right .done-reply, +.page-edit-reply .navbar .right .done-reply { + display: flex; + align-items: center; + padding-left: 16px; + padding-right: 16px; + height: 100%; +} .tablet .searchbar.document.replace .center .searchbar:first-child { margin-right: 10px; } diff --git a/apps/presentationeditor/mobile/resources/css/app-material.css b/apps/presentationeditor/mobile/resources/css/app-material.css index 8be55ee01..b92480d29 100644 --- a/apps/presentationeditor/mobile/resources/css/app-material.css +++ b/apps/presentationeditor/mobile/resources/css/app-material.css @@ -6064,22 +6064,59 @@ html.phone .document-menu .list-block .item-link { #user-list ul:before { content: none; } +.page-comments .list-block ul:before, +.page-add-comment .list-block ul:before, +.page-view-comments .list-block ul:before, +.container-edit-comment .list-block ul:before, +.container-add-reply .list-block ul:before, +.view-comment .list-block ul:before, +.page-edit-comment .list-block ul:before, +.page-add-reply .list-block ul:before, +.page-edit-reply .list-block ul:before, +.page-comments .list-block ul:after, +.page-add-comment .list-block ul:after, +.page-view-comments .list-block ul:after, +.container-edit-comment .list-block ul:after, +.container-add-reply .list-block ul:after, +.view-comment .list-block ul:after, +.page-edit-comment .list-block ul:after, +.page-add-reply .list-block ul:after, +.page-edit-reply .list-block ul:after { + content: none; +} .page-comments .list-block .item-inner, .page-add-comment .list-block .item-inner, .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, .container-add-reply .list-block .item-inner, -.view-comment .list-block .item-inner { +.view-comment .list-block .item-inner, +.page-edit-comment .list-block .item-inner, +.page-add-reply .list-block .item-inner, +.page-edit-reply .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; } +.page-comments .list-block .item-inner:after, +.page-add-comment .list-block .item-inner:after, +.page-view-comments .list-block .item-inner:after, +.container-edit-comment .list-block .item-inner:after, +.container-add-reply .list-block .item-inner:after, +.view-comment .list-block .item-inner:after, +.page-edit-comment .list-block .item-inner:after, +.page-add-reply .list-block .item-inner:after, +.page-edit-reply .list-block .item-inner:after { + content: none; +} .page-comments p, .page-add-comment p, .page-view-comments p, .container-edit-comment p, .container-add-reply p, -.view-comment p { +.view-comment p, +.page-edit-comment p, +.page-add-reply p, +.page-edit-reply p { margin: 0; word-break: break-word; } @@ -6088,7 +6125,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-reply, .container-edit-comment .list-reply, .container-add-reply .list-reply, -.view-comment .list-reply { +.view-comment .list-reply, +.page-edit-comment .list-reply, +.page-add-reply .list-reply, +.page-edit-reply .list-reply { padding-left: 26px; } .page-comments .user-name, @@ -6096,7 +6136,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .user-name, .container-edit-comment .user-name, .container-add-reply .user-name, -.view-comment .user-name { +.view-comment .user-name, +.page-edit-comment .user-name, +.page-add-reply .user-name, +.page-edit-reply .user-name { font-size: 16px; line-height: 22px; color: #000000; @@ -6108,12 +6151,18 @@ html.phone .document-menu .list-block .item-link { .container-edit-comment .comment-date, .container-add-reply .comment-date, .view-comment .comment-date, +.page-edit-comment .comment-date, +.page-add-reply .comment-date, +.page-edit-reply .comment-date, .page-comments .reply-date, .page-add-comment .reply-date, .page-view-comments .reply-date, .container-edit-comment .reply-date, .container-add-reply .reply-date, -.view-comment .reply-date { +.view-comment .reply-date, +.page-edit-comment .reply-date, +.page-add-reply .reply-date, +.page-edit-reply .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6126,12 +6175,18 @@ html.phone .document-menu .list-block .item-link { .container-edit-comment .comment-text, .container-add-reply .comment-text, .view-comment .comment-text, +.page-edit-comment .comment-text, +.page-add-reply .comment-text, +.page-edit-reply .comment-text, .page-comments .reply-text, .page-add-comment .reply-text, .page-view-comments .reply-text, .container-edit-comment .reply-text, .container-add-reply .reply-text, -.view-comment .reply-text { +.view-comment .reply-text, +.page-edit-comment .reply-text, +.page-add-reply .reply-text, +.page-edit-reply .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6144,7 +6199,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item, .container-edit-comment .reply-item, .container-add-reply .reply-item, -.view-comment .reply-item { +.view-comment .reply-item, +.page-edit-comment .reply-item, +.page-add-reply .reply-item, +.page-edit-reply .reply-item { padding-right: 16px; padding-top: 13px; } @@ -6153,7 +6211,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, .container-add-reply .reply-item .header-reply, -.view-comment .reply-item .header-reply { +.view-comment .reply-item .header-reply, +.page-edit-comment .reply-item .header-reply, +.page-add-reply .reply-item .header-reply, +.page-edit-reply .reply-item .header-reply { display: flex; justify-content: space-between; } @@ -6162,7 +6223,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, .container-add-reply .reply-item .user-name, -.view-comment .reply-item .user-name { +.view-comment .reply-item .user-name, +.page-edit-comment .reply-item .user-name, +.page-add-reply .reply-item .user-name, +.page-edit-reply .reply-item .user-name { padding-top: 3px; } .page-comments .comment-quote, @@ -6170,7 +6234,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-quote, .container-edit-comment .comment-quote, .container-add-reply .comment-quote, -.view-comment .comment-quote { +.view-comment .comment-quote, +.page-edit-comment .comment-quote, +.page-add-reply .comment-quote, +.page-edit-reply .comment-quote { color: #aa5252; border-left: 1px solid #aa5252; padding-left: 10px; @@ -6182,7 +6249,19 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, .container-add-reply .wrap-comment, -.view-comment .wrap-comment { +.view-comment .wrap-comment, +.page-edit-comment .wrap-comment, +.page-add-reply .wrap-comment, +.page-edit-reply .wrap-comment, +.page-comments .wrap-reply, +.page-add-comment .wrap-reply, +.page-view-comments .wrap-reply, +.container-edit-comment .wrap-reply, +.container-add-reply .wrap-reply, +.view-comment .wrap-reply, +.page-edit-comment .wrap-reply, +.page-add-reply .wrap-reply, +.page-edit-reply .wrap-reply { padding: 16px 24px 0 16px; } .page-comments .comment-textarea, @@ -6191,18 +6270,27 @@ html.phone .document-menu .list-block .item-link { .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, .view-comment .comment-textarea, +.page-edit-comment .comment-textarea, +.page-add-reply .comment-textarea, +.page-edit-reply .comment-textarea, .page-comments .reply-textarea, .page-add-comment .reply-textarea, .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, .view-comment .reply-textarea, +.page-edit-comment .reply-textarea, +.page-add-reply .reply-textarea, +.page-edit-reply .reply-textarea, .page-comments .edit-reply-textarea, .page-add-comment .edit-reply-textarea, .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea { +.view-comment .edit-reply-textarea, +.page-edit-comment .edit-reply-textarea, +.page-add-reply .edit-reply-textarea, +.page-edit-reply .edit-reply-textarea { margin-top: 10px; background: transparent; outline: none; @@ -6217,7 +6305,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment, .container-edit-comment .header-comment, .container-add-reply .header-comment, -.view-comment .header-comment { +.view-comment .header-comment, +.page-edit-comment .header-comment, +.page-add-reply .header-comment, +.page-edit-reply .header-comment { display: flex; justify-content: space-between; padding-right: 16px; @@ -6227,7 +6318,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .comment-right, .container-edit-comment .header-comment .comment-right, .container-add-reply .header-comment .comment-right, -.view-comment .header-comment .comment-right { +.view-comment .header-comment .comment-right, +.page-edit-comment .header-comment .comment-right, +.page-add-reply .header-comment .comment-right, +.page-edit-reply .header-comment .comment-right { display: flex; justify-content: space-between; width: 70px; @@ -6237,7 +6331,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .comment-left, .container-edit-comment .header-comment .comment-left, .container-add-reply .header-comment .comment-left, -.view-comment .header-comment .comment-left { +.view-comment .header-comment .comment-left, +.page-edit-comment .header-comment .comment-left, +.page-add-reply .header-comment .comment-left, +.page-edit-reply .header-comment .comment-left { display: flex; justify-content: space-between; } @@ -6246,7 +6343,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .initials-comment, .container-edit-comment .header-comment .initials-comment, .container-add-reply .header-comment .initials-comment, -.view-comment .header-comment .initials-comment { +.view-comment .header-comment .initials-comment, +.page-edit-comment .header-comment .initials-comment, +.page-add-reply .header-comment .initials-comment, +.page-edit-reply .header-comment .initials-comment { height: 40px; width: 40px; border-radius: 50px; @@ -6262,7 +6362,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-reply .reply-left, .container-edit-comment .header-reply .reply-left, .container-add-reply .header-reply .reply-left, -.view-comment .header-reply .reply-left { +.view-comment .header-reply .reply-left, +.page-edit-comment .header-reply .reply-left, +.page-add-reply .header-reply .reply-left, +.page-edit-reply .header-reply .reply-left { display: flex; justify-content: space-between; align-items: flex-start; @@ -6272,7 +6375,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-reply .initials-reply, .container-edit-comment .header-reply .initials-reply, .container-add-reply .header-reply .initials-reply, -.view-comment .header-reply .initials-reply { +.view-comment .header-reply .initials-reply, +.page-edit-comment .header-reply .initials-reply, +.page-add-reply .header-reply .initials-reply, +.page-edit-reply .header-reply .initials-reply { width: 24px; height: 24px; color: #FFFFFF; @@ -6426,42 +6532,46 @@ html.phone .document-menu .list-block .item-link { #done-comment { padding: 0 16px; } -.page-add-comment .wrap-comment { +.page-add-comment .wrap-comment, +.page-add-comment .wrap-reply { padding: 16px 24px 0 16px; } -.page-add-comment .wrap-comment .header-comment { +.page-add-comment .wrap-comment .header-comment, +.page-add-comment .wrap-reply .header-comment { justify-content: flex-start; } -.page-add-comment .wrap-comment .user-name { +.page-add-comment .wrap-comment .user-name, +.page-add-comment .wrap-reply .user-name { font-weight: bold; } -.page-add-comment .wrap-comment .comment-date { +.page-add-comment .wrap-comment .comment-date, +.page-add-comment .wrap-reply .comment-date { font-size: 12px; color: #6d6d72; } -.page-add-comment .wrap-comment .wrap-textarea { +.page-add-comment .wrap-comment .wrap-textarea, +.page-add-comment .wrap-reply .wrap-textarea { + margin-top: 16px; padding-right: 6px; } -.page-add-comment .wrap-comment .wrap-textarea .comment-textarea { +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea, +.page-add-comment .wrap-reply .wrap-textarea .comment-textarea { border: 1px solid #c4c4c4; margin-top: 0; min-height: 100px; border-radius: 4px; } .container-edit-comment, -.container-add-reply, -container-edit-comment { +.container-add-reply { height: 100%; } .container-edit-comment .navbar, -.container-add-reply .navbar, -container-edit-comment .navbar { +.container-add-reply .navbar { background-color: #FFFFFF; color: #000; } .container-edit-comment .navbar:after, -.container-add-reply .navbar:after, -container-edit-comment .navbar:after { +.container-add-reply .navbar:after { content: ''; position: absolute; left: 0; @@ -6477,38 +6587,56 @@ container-edit-comment .navbar:after { transform-origin: 50% 100%; } .container-edit-comment .navbar .navbar-inner, -.container-add-reply .navbar .navbar-inner, -container-edit-comment .navbar .navbar-inner { +.container-add-reply .navbar .navbar-inner { justify-content: space-between; } .container-edit-comment .navbar a.link i + span, -.container-add-reply .navbar a.link i + span, -container-edit-comment .navbar a.link i + span { +.container-add-reply .navbar a.link i + span { margin-left: 0; } .container-edit-comment .navbar .center, -.container-add-reply .navbar .center, -container-edit-comment .navbar .center { +.container-add-reply .navbar .center { font-size: 18px; } .container-edit-comment .navbar .right, -.container-add-reply .navbar .right, -container-edit-comment .navbar .right { +.container-add-reply .navbar .right { margin-left: 0; } .container-edit-comment .page-add-comment, -.container-add-reply .page-add-comment, -container-edit-comment .page-add-comment { +.container-add-reply .page-add-comment { background-color: #FFFFFF; } .container-edit-comment .header-comment, -.container-add-reply .header-comment, -container-edit-comment .header-comment { +.container-add-reply .header-comment { justify-content: flex-start; } .actions-modal-button.color-red { color: #f44336; } +.page-edit-comment, +.page-add-reply, +.page-edit-reply { + background-color: #FFFFFF; +} +.page-edit-comment .header-comment, +.page-add-reply .header-comment, +.page-edit-reply .header-comment { + justify-content: flex-start; +} +.page-edit-comment .navbar .right, +.page-add-reply .navbar .right, +.page-edit-reply .navbar .right { + height: 100%; +} +.page-edit-comment .navbar .right .done-reply, +.page-add-reply .navbar .right .done-reply, +.page-edit-reply .navbar .right .done-reply { + display: flex; + align-items: center; + padding-left: 16px; + padding-right: 16px; + height: 100%; +} .tablet .searchbar.document.replace .center > .replace { display: flex; } diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css index 97d206c9b..419d53f85 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css @@ -6479,12 +6479,41 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after #user-list ul:before { content: none; } +.page-comments .header-comment, +.add-comment .header-comment, +.page-view-comments .header-comment, +.container-edit-comment .header-comment, +.container-add-reply .header-comment, +.view-comment .header-comment, +.page-edit-comment .header-comment, +.page-add-reply .header-comment, +.page-edit-reply .header-comment { + display: flex; + justify-content: space-between; + padding-right: 16px; +} +.page-comments .header-comment .comment-right, +.add-comment .header-comment .comment-right, +.page-view-comments .header-comment .comment-right, +.container-edit-comment .header-comment .comment-right, +.container-add-reply .header-comment .comment-right, +.view-comment .header-comment .comment-right, +.page-edit-comment .header-comment .comment-right, +.page-add-reply .header-comment .comment-right, +.page-edit-reply .header-comment .comment-right { + display: flex; + justify-content: space-between; + width: 70px; +} .page-comments .list-block .item-inner, .add-comment .list-block .item-inner, .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, .container-add-reply .list-block .item-inner, -.view-comment .list-block .item-inner { +.view-comment .list-block .item-inner, +.page-edit-comment .list-block .item-inner, +.page-add-reply .list-block .item-inner, +.page-edit-reply .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; @@ -6494,7 +6523,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments p, .container-edit-comment p, .container-add-reply p, -.view-comment p { +.view-comment p, +.page-edit-comment p, +.page-add-reply p, +.page-edit-reply p { margin: 0; word-break: break-word; } @@ -6503,7 +6535,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .list-reply, .container-edit-comment .list-reply, .container-add-reply .list-reply, -.view-comment .list-reply { +.view-comment .list-reply, +.page-edit-comment .list-reply, +.page-add-reply .list-reply, +.page-edit-reply .list-reply { padding-left: 26px; } .page-comments .user-name, @@ -6511,7 +6546,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .user-name, .container-edit-comment .user-name, .container-add-reply .user-name, -.view-comment .user-name { +.view-comment .user-name, +.page-edit-comment .user-name, +.page-add-reply .user-name, +.page-edit-reply .user-name { font-size: 17px; line-height: 22px; color: #000000; @@ -6524,12 +6562,18 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .comment-date, .container-add-reply .comment-date, .view-comment .comment-date, +.page-edit-comment .comment-date, +.page-add-reply .comment-date, +.page-edit-reply .comment-date, .page-comments .reply-date, .add-comment .reply-date, .page-view-comments .reply-date, .container-edit-comment .reply-date, .container-add-reply .reply-date, -.view-comment .reply-date { +.view-comment .reply-date, +.page-edit-comment .reply-date, +.page-add-reply .reply-date, +.page-edit-reply .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6542,12 +6586,18 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .comment-text, .container-add-reply .comment-text, .view-comment .comment-text, +.page-edit-comment .comment-text, +.page-add-reply .comment-text, +.page-edit-reply .comment-text, .page-comments .reply-text, .add-comment .reply-text, .page-view-comments .reply-text, .container-edit-comment .reply-text, .container-add-reply .reply-text, -.view-comment .reply-text { +.view-comment .reply-text, +.page-edit-comment .reply-text, +.page-add-reply .reply-text, +.page-edit-reply .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6560,7 +6610,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item, .container-edit-comment .reply-item, .container-add-reply .reply-item, -.view-comment .reply-item { +.view-comment .reply-item, +.page-edit-comment .reply-item, +.page-add-reply .reply-item, +.page-edit-reply .reply-item { margin-top: 15px; padding-right: 16px; padding-top: 13px; @@ -6570,7 +6623,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, .container-add-reply .reply-item .header-reply, -.view-comment .reply-item .header-reply { +.view-comment .reply-item .header-reply, +.page-edit-comment .reply-item .header-reply, +.page-add-reply .reply-item .header-reply, +.page-edit-reply .reply-item .header-reply { display: flex; justify-content: space-between; } @@ -6579,7 +6635,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, .container-add-reply .reply-item .user-name, -.view-comment .reply-item .user-name { +.view-comment .reply-item .user-name, +.page-edit-comment .reply-item .user-name, +.page-add-reply .reply-item .user-name, +.page-edit-reply .reply-item .user-name { padding-top: 3px; } .page-comments .reply-item:before, @@ -6587,7 +6646,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item:before, .container-edit-comment .reply-item:before, .container-add-reply .reply-item:before, -.view-comment .reply-item:before { +.view-comment .reply-item:before, +.page-edit-comment .reply-item:before, +.page-add-reply .reply-item:before, +.page-edit-reply .reply-item:before { content: ''; position: absolute; left: auto; @@ -6607,7 +6669,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-quote, .container-edit-comment .comment-quote, .container-add-reply .comment-quote, -.view-comment .comment-quote { +.view-comment .comment-quote, +.page-edit-comment .comment-quote, +.page-add-reply .comment-quote, +.page-edit-reply .comment-quote { color: #40865c; border-left: 1px solid #40865c; padding-left: 10px; @@ -6619,7 +6684,19 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, .container-add-reply .wrap-comment, -.view-comment .wrap-comment { +.view-comment .wrap-comment, +.page-edit-comment .wrap-comment, +.page-add-reply .wrap-comment, +.page-edit-reply .wrap-comment, +.page-comments .wrap-reply, +.add-comment .wrap-reply, +.page-view-comments .wrap-reply, +.container-edit-comment .wrap-reply, +.container-add-reply .wrap-reply, +.view-comment .wrap-reply, +.page-edit-comment .wrap-reply, +.page-add-reply .wrap-reply, +.page-edit-reply .wrap-reply { padding: 16px 24px 0 16px; } .page-comments .comment-textarea, @@ -6628,18 +6705,27 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, .view-comment .comment-textarea, +.page-edit-comment .comment-textarea, +.page-add-reply .comment-textarea, +.page-edit-reply .comment-textarea, .page-comments .reply-textarea, .add-comment .reply-textarea, .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, .view-comment .reply-textarea, +.page-edit-comment .reply-textarea, +.page-add-reply .reply-textarea, +.page-edit-reply .reply-textarea, .page-comments .edit-reply-textarea, .add-comment .edit-reply-textarea, .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea { +.view-comment .edit-reply-textarea, +.page-edit-comment .edit-reply-textarea, +.page-add-reply .edit-reply-textarea, +.page-edit-reply .edit-reply-textarea { margin-top: 10px; background: transparent; outline: none; @@ -6689,18 +6775,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-comment .view-comment .list-block .item-inner { padding: 0; } -.container-view-comment .page-view-comments .list-block .item-inner .header-comment, -.container-view-comment .view-comment .list-block .item-inner .header-comment { - display: flex; - justify-content: space-between; - padding-right: 16px; -} -.container-view-comment .page-view-comments .list-block .item-inner .header-comment .comment-right, -.container-view-comment .view-comment .list-block .item-inner .header-comment .comment-right { - display: flex; - justify-content: space-between; - width: 70px; -} .container-view-comment .toolbar { position: absolute; background-color: #FFFFFF; @@ -6804,24 +6878,30 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-add-comment { background-color: #FFFFFF; } -.page-add-comment .wrap-comment { +.page-add-comment .wrap-comment, +.page-add-comment .wrap-reply { padding: 16px 24px 0 16px; } -.page-add-comment .wrap-comment .header-comment { +.page-add-comment .wrap-comment .header-comment, +.page-add-comment .wrap-reply .header-comment { justify-content: flex-start; } -.page-add-comment .wrap-comment .user-name { +.page-add-comment .wrap-comment .user-name, +.page-add-comment .wrap-reply .user-name { font-weight: bold; } -.page-add-comment .wrap-comment .comment-date { +.page-add-comment .wrap-comment .comment-date, +.page-add-comment .wrap-reply .comment-date { font-size: 12px; color: #6d6d72; } -.page-add-comment .wrap-comment .wrap-textarea { +.page-add-comment .wrap-comment .wrap-textarea, +.page-add-comment .wrap-reply .wrap-textarea { margin-top: 16px; padding-right: 6px; } -.page-add-comment .wrap-comment .wrap-textarea .comment-textarea { +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea, +.page-add-comment .wrap-reply .wrap-textarea .comment-textarea { border: 1px solid #c4c4c4; margin-top: 0; min-height: 100px; @@ -6843,6 +6923,30 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .actions-modal-button.color-red { color: #ff3b30; } +.page-edit-comment, +.page-add-reply, +.page-edit-reply { + background-color: #FFFFFF; +} +.page-edit-comment .header-comment, +.page-add-reply .header-comment, +.page-edit-reply .header-comment { + justify-content: flex-start; +} +.page-edit-comment .navbar .right, +.page-add-reply .navbar .right, +.page-edit-reply .navbar .right { + height: 100%; +} +.page-edit-comment .navbar .right .done-reply, +.page-add-reply .navbar .right .done-reply, +.page-edit-reply .navbar .right .done-reply { + display: flex; + align-items: center; + padding-left: 16px; + padding-right: 16px; + height: 100%; +} i.icon.icon-search { width: 24px; height: 24px; diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-material.css b/apps/spreadsheeteditor/mobile/resources/css/app-material.css index 594d458e7..9784d2320 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-material.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-material.css @@ -6074,22 +6074,59 @@ html.phone .document-menu .list-block .item-link { #user-list ul:before { content: none; } +.page-comments .list-block ul:before, +.page-add-comment .list-block ul:before, +.page-view-comments .list-block ul:before, +.container-edit-comment .list-block ul:before, +.container-add-reply .list-block ul:before, +.view-comment .list-block ul:before, +.page-edit-comment .list-block ul:before, +.page-add-reply .list-block ul:before, +.page-edit-reply .list-block ul:before, +.page-comments .list-block ul:after, +.page-add-comment .list-block ul:after, +.page-view-comments .list-block ul:after, +.container-edit-comment .list-block ul:after, +.container-add-reply .list-block ul:after, +.view-comment .list-block ul:after, +.page-edit-comment .list-block ul:after, +.page-add-reply .list-block ul:after, +.page-edit-reply .list-block ul:after { + content: none; +} .page-comments .list-block .item-inner, .page-add-comment .list-block .item-inner, .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, .container-add-reply .list-block .item-inner, -.view-comment .list-block .item-inner { +.view-comment .list-block .item-inner, +.page-edit-comment .list-block .item-inner, +.page-add-reply .list-block .item-inner, +.page-edit-reply .list-block .item-inner { display: block; padding: 16px 0; word-wrap: break-word; } +.page-comments .list-block .item-inner:after, +.page-add-comment .list-block .item-inner:after, +.page-view-comments .list-block .item-inner:after, +.container-edit-comment .list-block .item-inner:after, +.container-add-reply .list-block .item-inner:after, +.view-comment .list-block .item-inner:after, +.page-edit-comment .list-block .item-inner:after, +.page-add-reply .list-block .item-inner:after, +.page-edit-reply .list-block .item-inner:after { + content: none; +} .page-comments p, .page-add-comment p, .page-view-comments p, .container-edit-comment p, .container-add-reply p, -.view-comment p { +.view-comment p, +.page-edit-comment p, +.page-add-reply p, +.page-edit-reply p { margin: 0; word-break: break-word; } @@ -6098,7 +6135,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-reply, .container-edit-comment .list-reply, .container-add-reply .list-reply, -.view-comment .list-reply { +.view-comment .list-reply, +.page-edit-comment .list-reply, +.page-add-reply .list-reply, +.page-edit-reply .list-reply { padding-left: 26px; } .page-comments .user-name, @@ -6106,7 +6146,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .user-name, .container-edit-comment .user-name, .container-add-reply .user-name, -.view-comment .user-name { +.view-comment .user-name, +.page-edit-comment .user-name, +.page-add-reply .user-name, +.page-edit-reply .user-name { font-size: 16px; line-height: 22px; color: #000000; @@ -6118,12 +6161,18 @@ html.phone .document-menu .list-block .item-link { .container-edit-comment .comment-date, .container-add-reply .comment-date, .view-comment .comment-date, +.page-edit-comment .comment-date, +.page-add-reply .comment-date, +.page-edit-reply .comment-date, .page-comments .reply-date, .page-add-comment .reply-date, .page-view-comments .reply-date, .container-edit-comment .reply-date, .container-add-reply .reply-date, -.view-comment .reply-date { +.view-comment .reply-date, +.page-edit-comment .reply-date, +.page-add-reply .reply-date, +.page-edit-reply .reply-date { font-size: 12px; line-height: 18px; color: #6d6d72; @@ -6136,12 +6185,18 @@ html.phone .document-menu .list-block .item-link { .container-edit-comment .comment-text, .container-add-reply .comment-text, .view-comment .comment-text, +.page-edit-comment .comment-text, +.page-add-reply .comment-text, +.page-edit-reply .comment-text, .page-comments .reply-text, .page-add-comment .reply-text, .page-view-comments .reply-text, .container-edit-comment .reply-text, .container-add-reply .reply-text, -.view-comment .reply-text { +.view-comment .reply-text, +.page-edit-comment .reply-text, +.page-add-reply .reply-text, +.page-edit-reply .reply-text { color: #000000; font-size: 15px; line-height: 25px; @@ -6154,7 +6209,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item, .container-edit-comment .reply-item, .container-add-reply .reply-item, -.view-comment .reply-item { +.view-comment .reply-item, +.page-edit-comment .reply-item, +.page-add-reply .reply-item, +.page-edit-reply .reply-item { padding-right: 16px; padding-top: 13px; } @@ -6163,7 +6221,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, .container-add-reply .reply-item .header-reply, -.view-comment .reply-item .header-reply { +.view-comment .reply-item .header-reply, +.page-edit-comment .reply-item .header-reply, +.page-add-reply .reply-item .header-reply, +.page-edit-reply .reply-item .header-reply { display: flex; justify-content: space-between; } @@ -6172,7 +6233,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, .container-add-reply .reply-item .user-name, -.view-comment .reply-item .user-name { +.view-comment .reply-item .user-name, +.page-edit-comment .reply-item .user-name, +.page-add-reply .reply-item .user-name, +.page-edit-reply .reply-item .user-name { padding-top: 3px; } .page-comments .comment-quote, @@ -6180,7 +6244,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-quote, .container-edit-comment .comment-quote, .container-add-reply .comment-quote, -.view-comment .comment-quote { +.view-comment .comment-quote, +.page-edit-comment .comment-quote, +.page-add-reply .comment-quote, +.page-edit-reply .comment-quote { color: #40865c; border-left: 1px solid #40865c; padding-left: 10px; @@ -6192,7 +6259,19 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, .container-add-reply .wrap-comment, -.view-comment .wrap-comment { +.view-comment .wrap-comment, +.page-edit-comment .wrap-comment, +.page-add-reply .wrap-comment, +.page-edit-reply .wrap-comment, +.page-comments .wrap-reply, +.page-add-comment .wrap-reply, +.page-view-comments .wrap-reply, +.container-edit-comment .wrap-reply, +.container-add-reply .wrap-reply, +.view-comment .wrap-reply, +.page-edit-comment .wrap-reply, +.page-add-reply .wrap-reply, +.page-edit-reply .wrap-reply { padding: 16px 24px 0 16px; } .page-comments .comment-textarea, @@ -6201,18 +6280,27 @@ html.phone .document-menu .list-block .item-link { .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, .view-comment .comment-textarea, +.page-edit-comment .comment-textarea, +.page-add-reply .comment-textarea, +.page-edit-reply .comment-textarea, .page-comments .reply-textarea, .page-add-comment .reply-textarea, .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, .view-comment .reply-textarea, +.page-edit-comment .reply-textarea, +.page-add-reply .reply-textarea, +.page-edit-reply .reply-textarea, .page-comments .edit-reply-textarea, .page-add-comment .edit-reply-textarea, .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea { +.view-comment .edit-reply-textarea, +.page-edit-comment .edit-reply-textarea, +.page-add-reply .edit-reply-textarea, +.page-edit-reply .edit-reply-textarea { margin-top: 10px; background: transparent; outline: none; @@ -6227,7 +6315,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment, .container-edit-comment .header-comment, .container-add-reply .header-comment, -.view-comment .header-comment { +.view-comment .header-comment, +.page-edit-comment .header-comment, +.page-add-reply .header-comment, +.page-edit-reply .header-comment { display: flex; justify-content: space-between; padding-right: 16px; @@ -6237,7 +6328,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .comment-right, .container-edit-comment .header-comment .comment-right, .container-add-reply .header-comment .comment-right, -.view-comment .header-comment .comment-right { +.view-comment .header-comment .comment-right, +.page-edit-comment .header-comment .comment-right, +.page-add-reply .header-comment .comment-right, +.page-edit-reply .header-comment .comment-right { display: flex; justify-content: space-between; width: 70px; @@ -6247,7 +6341,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .comment-left, .container-edit-comment .header-comment .comment-left, .container-add-reply .header-comment .comment-left, -.view-comment .header-comment .comment-left { +.view-comment .header-comment .comment-left, +.page-edit-comment .header-comment .comment-left, +.page-add-reply .header-comment .comment-left, +.page-edit-reply .header-comment .comment-left { display: flex; justify-content: space-between; } @@ -6256,7 +6353,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .initials-comment, .container-edit-comment .header-comment .initials-comment, .container-add-reply .header-comment .initials-comment, -.view-comment .header-comment .initials-comment { +.view-comment .header-comment .initials-comment, +.page-edit-comment .header-comment .initials-comment, +.page-add-reply .header-comment .initials-comment, +.page-edit-reply .header-comment .initials-comment { height: 40px; width: 40px; border-radius: 50px; @@ -6272,7 +6372,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-reply .reply-left, .container-edit-comment .header-reply .reply-left, .container-add-reply .header-reply .reply-left, -.view-comment .header-reply .reply-left { +.view-comment .header-reply .reply-left, +.page-edit-comment .header-reply .reply-left, +.page-add-reply .header-reply .reply-left, +.page-edit-reply .header-reply .reply-left { display: flex; justify-content: space-between; align-items: flex-start; @@ -6282,7 +6385,10 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-reply .initials-reply, .container-edit-comment .header-reply .initials-reply, .container-add-reply .header-reply .initials-reply, -.view-comment .header-reply .initials-reply { +.view-comment .header-reply .initials-reply, +.page-edit-comment .header-reply .initials-reply, +.page-add-reply .header-reply .initials-reply, +.page-edit-reply .header-reply .initials-reply { width: 24px; height: 24px; color: #FFFFFF; @@ -6436,42 +6542,46 @@ html.phone .document-menu .list-block .item-link { #done-comment { padding: 0 16px; } -.page-add-comment .wrap-comment { +.page-add-comment .wrap-comment, +.page-add-comment .wrap-reply { padding: 16px 24px 0 16px; } -.page-add-comment .wrap-comment .header-comment { +.page-add-comment .wrap-comment .header-comment, +.page-add-comment .wrap-reply .header-comment { justify-content: flex-start; } -.page-add-comment .wrap-comment .user-name { +.page-add-comment .wrap-comment .user-name, +.page-add-comment .wrap-reply .user-name { font-weight: bold; } -.page-add-comment .wrap-comment .comment-date { +.page-add-comment .wrap-comment .comment-date, +.page-add-comment .wrap-reply .comment-date { font-size: 12px; color: #6d6d72; } -.page-add-comment .wrap-comment .wrap-textarea { +.page-add-comment .wrap-comment .wrap-textarea, +.page-add-comment .wrap-reply .wrap-textarea { + margin-top: 16px; padding-right: 6px; } -.page-add-comment .wrap-comment .wrap-textarea .comment-textarea { +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea, +.page-add-comment .wrap-reply .wrap-textarea .comment-textarea { border: 1px solid #c4c4c4; margin-top: 0; min-height: 100px; border-radius: 4px; } .container-edit-comment, -.container-add-reply, -container-edit-comment { +.container-add-reply { height: 100%; } .container-edit-comment .navbar, -.container-add-reply .navbar, -container-edit-comment .navbar { +.container-add-reply .navbar { background-color: #FFFFFF; color: #000; } .container-edit-comment .navbar:after, -.container-add-reply .navbar:after, -container-edit-comment .navbar:after { +.container-add-reply .navbar:after { content: ''; position: absolute; left: 0; @@ -6487,38 +6597,56 @@ container-edit-comment .navbar:after { transform-origin: 50% 100%; } .container-edit-comment .navbar .navbar-inner, -.container-add-reply .navbar .navbar-inner, -container-edit-comment .navbar .navbar-inner { +.container-add-reply .navbar .navbar-inner { justify-content: space-between; } .container-edit-comment .navbar a.link i + span, -.container-add-reply .navbar a.link i + span, -container-edit-comment .navbar a.link i + span { +.container-add-reply .navbar a.link i + span { margin-left: 0; } .container-edit-comment .navbar .center, -.container-add-reply .navbar .center, -container-edit-comment .navbar .center { +.container-add-reply .navbar .center { font-size: 18px; } .container-edit-comment .navbar .right, -.container-add-reply .navbar .right, -container-edit-comment .navbar .right { +.container-add-reply .navbar .right { margin-left: 0; } .container-edit-comment .page-add-comment, -.container-add-reply .page-add-comment, -container-edit-comment .page-add-comment { +.container-add-reply .page-add-comment { background-color: #FFFFFF; } .container-edit-comment .header-comment, -.container-add-reply .header-comment, -container-edit-comment .header-comment { +.container-add-reply .header-comment { justify-content: flex-start; } .actions-modal-button.color-red { color: #f44336; } +.page-edit-comment, +.page-add-reply, +.page-edit-reply { + background-color: #FFFFFF; +} +.page-edit-comment .header-comment, +.page-add-reply .header-comment, +.page-edit-reply .header-comment { + justify-content: flex-start; +} +.page-edit-comment .navbar .right, +.page-add-reply .navbar .right, +.page-edit-reply .navbar .right { + height: 100%; +} +.page-edit-comment .navbar .right .done-reply, +.page-add-reply .navbar .right .done-reply, +.page-edit-reply .navbar .right .done-reply { + display: flex; + align-items: center; + padding-left: 16px; + padding-right: 16px; + height: 100%; +} .tablet .searchbar.document.replace .center > .replace { display: flex; } From 22604c05674cd280590bddc6f191f690d07c5599 Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Thu, 2 Apr 2020 18:30:36 +0300 Subject: [PATCH 09/23] [de mobile] work with comments (fix styles) --- .../mobile/lib/controller/Collaboration.js | 41 ++++++++++++------- .../lib/template/Collaboration.template | 2 +- .../resources/less/ios/_collaboration.less | 12 +++++- .../less/material/_collaboration.less | 11 ++++- .../mobile/resources/css/app-ios.css | 20 +++++++-- .../mobile/resources/css/app-material.css | 20 +++++++-- .../mobile/resources/css/app-ios.css | 20 +++++++-- .../mobile/resources/css/app-material.css | 20 +++++++-- .../mobile/resources/css/app-ios.css | 20 +++++++-- .../mobile/resources/css/app-material.css | 20 +++++++-- 10 files changed, 142 insertions(+), 44 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index 8767924b9..b40f63117 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -953,6 +953,9 @@ define([ } else { idComment = id; } + if (_.isNumber(idComment)) { + idComment = idComment.toString(); + } var comment = me.findComment(idComment); me.getCurrentUser(); var date = me.dateToLocaleTimeString(new Date()); @@ -966,7 +969,7 @@ define([ '
      ' + '
      ' + (isAndroid ? '' : '' + me.textCancel + '') + '
      ' + '
      ' + me.textAddReply + '
      ' + - '
      ' + (isAndroid ? '' : '' + me.textDone + '') + '
      ' + + '
      ' + (isAndroid ? '' : '' + me.textDone + '') + '
      ' + '
      ' + '
      ' + '
      ' + @@ -987,7 +990,7 @@ define([ $('.popup').css('z-index', '20000'); } else { $('.container-view-comment .toolbar').find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'none'); - var template = _.template('' + me.textDone + ''); + var template = _.template('' + me.textDone + ''); $('.container-view-comment .button-right').append(template); template = _.template('' + me.textCancel + ''); $('.container-view-comment .button-left').append(template); @@ -995,22 +998,23 @@ define([ $('.view-comment .page-content').append(template); } } else if ($('.container-collaboration').length > 0) { - me.getView('Common.Views.Collaboration').showPage('#comments-add-reply-view'); + me.getView('Common.Views.Collaboration').showPage('#comments-add-reply-view', false); var name = me.currentUser.asc_getUserName(), color = me.currentUser.asc_getColor(); me.getView('Common.Views.Collaboration').renderAddReply(name, color, me.getInitials(name), date); } - $('.done-reply').single('click', _.bind(function (uid) { + $('#add-new-reply').single('click', _.bind(function (uid) { var reply = $('.reply-textarea')[0].value; if ($('.container-view-comment').length > 0) { var $viewComment = $('.container-view-comment'); if (reply && reply.length > 0) { this.addReply(uid, reply); - uiApp.closeModal($$(addReplyView)); this.updateViewComment(this.showComments, this.indexCurrentComment); if (!phone) { - $viewComment.find('a.done-reply, a.cancel-reply').css('display', 'none'); + $viewComment.find('a#add-new-reply, a.cancel-reply').remove(); $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + } else { + uiApp.closeModal($$(addReplyView)); } } } else if ($('.container-collaboration').length > 0) { @@ -1023,7 +1027,7 @@ define([ if ($viewComment.find('.block-reply').length > 0) { $viewComment.find('.block-reply').remove(); } - $viewComment.find('a.done-reply, a.cancel-reply').css('display', 'none'); + $viewComment.find('a#add-new-reply, a.cancel-reply').css('display', 'none'); $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); }, me)); } @@ -1116,6 +1120,9 @@ define([ initMenuComments: function(e) { var $comment = $(e.currentTarget).closest('.comment'); var idComment = $comment.data('uid'); + if (_.isNumber(idComment)) { + idComment = idComment.toString(); + } var comment = this.findComment(idComment); if ($('.actions-modal').length === 0 && comment) { var me = this; @@ -1171,6 +1178,9 @@ define([ var me = this; var ind = $(event.currentTarget).parent().parent().data('ind'); var idComment = $(event.currentTarget).closest('.comment').data('uid'); + if (_.isNumber(idComment)) { + idComment = idComment.toString(); + } _.delay(function () { var _menuItems = []; _menuItems.push({ @@ -1368,8 +1378,7 @@ define([ '
      ' + (isAndroid ? '' : '' + me.textDone + '') + '
      ' + '
      ' + '
    ' + - '
    ' + - '
    ' + + '
    ' + '
    ' + '
    ' + (isAndroid ? '
    ' + comment.userInitials + '
    ' : '') + @@ -1380,7 +1389,6 @@ define([ '
    ' + '
    ' + '
    ' + - '
    ' + '
    ' ); $('.popup').css('z-index', '20000'); @@ -1404,7 +1412,7 @@ define([ } } } else if ($('.container-collaboration').length > 0) { - this.getView('Common.Views.Collaboration').showPage('#comments-edit-view'); + this.getView('Common.Views.Collaboration').showPage('#comments-edit-view', false); this.getView('Common.Views.Collaboration').renderEditComment(comment); } _.defer(function () { @@ -1486,13 +1494,13 @@ define([ $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'none'); var template = _.template(''); $reply.append(template); - template = _.template('' + me.textDone + ''); + template = _.template('' + me.textDone + ''); $viewComment.find('.button-right').append(template); template = _.template('' + me.textCancel + ''); $viewComment.find('.button-left').append(template); } } else if ($('.container-collaboration').length > 0) { - me.getView('Common.Views.Collaboration').showPage('#comments-edit-reply-view'); + me.getView('Common.Views.Collaboration').showPage('#comments-edit-reply-view', false); me.getView('Common.Views.Collaboration').renderEditReply(reply); } _.delay(function () { @@ -1509,7 +1517,7 @@ define([ if (Common.SharedSettings.get('phone')) { uiApp.closeModal($$(editView)); } else { - $viewComment.find('a.done-reply, a.cancel-reply').remove(); + $viewComment.find('a#edit-reply, a.cancel-reply').remove(); $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); } this.updateViewComment(); @@ -1521,7 +1529,7 @@ define([ } }, me, comment, indReply)); $('.cancel-reply').single('click', _.bind(function () { - $viewComment.find('a.done-reply, a.cancel-reply, .edit-reply-textarea').remove(); + $viewComment.find('a#edit-reply, a.cancel-reply, .edit-reply-textarea').remove(); $reply.find('.reply-text').css('display', 'block'); $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); }, me)); @@ -1537,6 +1545,9 @@ define([ } else { idComment = uid; } + if (_.isNumber(idComment)) { + idComment = idComment.toString(); + } var comment = this.findComment(idComment); if (comment) { if (this.resolveComment(comment.uid)) { diff --git a/apps/common/mobile/lib/template/Collaboration.template b/apps/common/mobile/lib/template/Collaboration.template index 5ebd53428..334bf7058 100644 --- a/apps/common/mobile/lib/template/Collaboration.template +++ b/apps/common/mobile/lib/template/Collaboration.template @@ -262,7 +262,7 @@
    <% if (!android) { %><%= scope.textBack %><% } %>
    <%= scope.textAddReply %>
    -
    <% if (android) { %><% } else { %><%= scope.textDone %><% } %>
    +
    <% if (android) { %><% } else { %><%= scope.textDone %><% } %>
    diff --git a/apps/common/mobile/resources/less/ios/_collaboration.less b/apps/common/mobile/resources/less/ios/_collaboration.less index b47343200..448112b20 100644 --- a/apps/common/mobile/resources/less/ios/_collaboration.less +++ b/apps/common/mobile/resources/less/ios/_collaboration.less @@ -201,6 +201,7 @@ //view comment .container-view-comment { + position: fixed; -webkit-transition: height 100ms; transition: height 120ms; background-color: #FFFFFF; @@ -225,7 +226,7 @@ } .toolbar { - position: absolute; + position: fixed; background-color: #FFFFFF; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); &:before { @@ -264,12 +265,14 @@ margin-top: 0; } &.popover { + position: absolute; border-radius: 4px; min-height: 170px; height: 400px; max-height: 600px; .toolbar { + position: absolute; border-radius: 0 0 4px 4px; .toolbar-inner { padding-right: 0; @@ -387,7 +390,7 @@ .navbar { .right { height: 100%; - .done-reply { + #add-reply, #edit-comment, #edit-reply { display: flex; align-items: center; padding-left: 16px; @@ -398,3 +401,8 @@ } } +.container-edit-comment { + position: fixed; + +} + diff --git a/apps/common/mobile/resources/less/material/_collaboration.less b/apps/common/mobile/resources/less/material/_collaboration.less index 5eea3ac56..624d2c303 100644 --- a/apps/common/mobile/resources/less/material/_collaboration.less +++ b/apps/common/mobile/resources/less/material/_collaboration.less @@ -225,6 +225,7 @@ //view comment .container-view-comment { + position: fixed; -webkit-transition: height 100ms; transition: height 100ms; background-color: #FFFFFF; @@ -246,7 +247,7 @@ } .toolbar { - position: absolute; + position: fixed; background-color: #FFFFFF; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); &.toolbar-bottom { @@ -294,12 +295,14 @@ margin-top: 0; } &.popover { + position: absolute; border-radius: 4px; min-height: 170px; height: 400px; max-height: 600px; .toolbar { + position: absolute; border-radius: 0 0 4px 4px; .toolbar-inner { padding-right: 0; @@ -444,7 +447,7 @@ .navbar { .right { height: 100%; - .done-reply { + #add-reply, #edit-comment, #edit-reply { display: flex; align-items: center; padding-left: 16px; @@ -453,4 +456,8 @@ } } } +} + +.container-edit-comment { + position: fixed; } \ No newline at end of file diff --git a/apps/documenteditor/mobile/resources/css/app-ios.css b/apps/documenteditor/mobile/resources/css/app-ios.css index 93ca6072f..480f2f293 100644 --- a/apps/documenteditor/mobile/resources/css/app-ios.css +++ b/apps/documenteditor/mobile/resources/css/app-ios.css @@ -6746,6 +6746,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after background-color: #FFFFFF; } .container-view-comment { + position: fixed; -webkit-transition: height 100ms; transition: height 120ms; background-color: #FFFFFF; @@ -6776,7 +6777,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after padding: 0; } .container-view-comment .toolbar { - position: absolute; + position: fixed; background-color: #FFFFFF; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } @@ -6815,12 +6816,14 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after margin-top: 0; } .container-view-comment.popover { + position: absolute; border-radius: 4px; min-height: 170px; height: 400px; max-height: 600px; } .container-view-comment.popover .toolbar { + position: absolute; border-radius: 0 0 4px 4px; } .container-view-comment.popover .toolbar .toolbar-inner { @@ -6938,15 +6941,24 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-edit-reply .navbar .right { height: 100%; } -.page-edit-comment .navbar .right .done-reply, -.page-add-reply .navbar .right .done-reply, -.page-edit-reply .navbar .right .done-reply { +.page-edit-comment .navbar .right #add-reply, +.page-add-reply .navbar .right #add-reply, +.page-edit-reply .navbar .right #add-reply, +.page-edit-comment .navbar .right #edit-comment, +.page-add-reply .navbar .right #edit-comment, +.page-edit-reply .navbar .right #edit-comment, +.page-edit-comment .navbar .right #edit-reply, +.page-add-reply .navbar .right #edit-reply, +.page-edit-reply .navbar .right #edit-reply { display: flex; align-items: center; padding-left: 16px; padding-right: 16px; height: 100%; } +.container-edit-comment { + position: fixed; +} .tablet .searchbar.document.replace .center .searchbar:first-child { margin-right: 10px; } diff --git a/apps/documenteditor/mobile/resources/css/app-material.css b/apps/documenteditor/mobile/resources/css/app-material.css index 921ad3969..941217e68 100644 --- a/apps/documenteditor/mobile/resources/css/app-material.css +++ b/apps/documenteditor/mobile/resources/css/app-material.css @@ -6399,6 +6399,7 @@ html.phone .document-menu .list-block .item-link { color: #446995; } .container-view-comment { + position: fixed; -webkit-transition: height 100ms; transition: height 100ms; background-color: #FFFFFF; @@ -6426,7 +6427,7 @@ html.phone .document-menu .list-block .item-link { padding: 0; } .container-view-comment .toolbar { - position: absolute; + position: fixed; background-color: #FFFFFF; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } @@ -6472,12 +6473,14 @@ html.phone .document-menu .list-block .item-link { margin-top: 0; } .container-view-comment.popover { + position: absolute; border-radius: 4px; min-height: 170px; height: 400px; max-height: 600px; } .container-view-comment.popover .toolbar { + position: absolute; border-radius: 0 0 4px 4px; } .container-view-comment.popover .toolbar .toolbar-inner { @@ -6628,15 +6631,24 @@ html.phone .document-menu .list-block .item-link { .page-edit-reply .navbar .right { height: 100%; } -.page-edit-comment .navbar .right .done-reply, -.page-add-reply .navbar .right .done-reply, -.page-edit-reply .navbar .right .done-reply { +.page-edit-comment .navbar .right #add-reply, +.page-add-reply .navbar .right #add-reply, +.page-edit-reply .navbar .right #add-reply, +.page-edit-comment .navbar .right #edit-comment, +.page-add-reply .navbar .right #edit-comment, +.page-edit-reply .navbar .right #edit-comment, +.page-edit-comment .navbar .right #edit-reply, +.page-add-reply .navbar .right #edit-reply, +.page-edit-reply .navbar .right #edit-reply { display: flex; align-items: center; padding-left: 16px; padding-right: 16px; height: 100%; } +.container-edit-comment { + position: fixed; +} .tablet .searchbar.document.replace .center > .replace { display: flex; } diff --git a/apps/presentationeditor/mobile/resources/css/app-ios.css b/apps/presentationeditor/mobile/resources/css/app-ios.css index 8be090a46..f95047727 100644 --- a/apps/presentationeditor/mobile/resources/css/app-ios.css +++ b/apps/presentationeditor/mobile/resources/css/app-ios.css @@ -6746,6 +6746,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after background-color: #FFFFFF; } .container-view-comment { + position: fixed; -webkit-transition: height 100ms; transition: height 120ms; background-color: #FFFFFF; @@ -6776,7 +6777,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after padding: 0; } .container-view-comment .toolbar { - position: absolute; + position: fixed; background-color: #FFFFFF; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } @@ -6815,12 +6816,14 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after margin-top: 0; } .container-view-comment.popover { + position: absolute; border-radius: 4px; min-height: 170px; height: 400px; max-height: 600px; } .container-view-comment.popover .toolbar { + position: absolute; border-radius: 0 0 4px 4px; } .container-view-comment.popover .toolbar .toolbar-inner { @@ -6938,15 +6941,24 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-edit-reply .navbar .right { height: 100%; } -.page-edit-comment .navbar .right .done-reply, -.page-add-reply .navbar .right .done-reply, -.page-edit-reply .navbar .right .done-reply { +.page-edit-comment .navbar .right #add-reply, +.page-add-reply .navbar .right #add-reply, +.page-edit-reply .navbar .right #add-reply, +.page-edit-comment .navbar .right #edit-comment, +.page-add-reply .navbar .right #edit-comment, +.page-edit-reply .navbar .right #edit-comment, +.page-edit-comment .navbar .right #edit-reply, +.page-add-reply .navbar .right #edit-reply, +.page-edit-reply .navbar .right #edit-reply { display: flex; align-items: center; padding-left: 16px; padding-right: 16px; height: 100%; } +.container-edit-comment { + position: fixed; +} .tablet .searchbar.document.replace .center .searchbar:first-child { margin-right: 10px; } diff --git a/apps/presentationeditor/mobile/resources/css/app-material.css b/apps/presentationeditor/mobile/resources/css/app-material.css index b92480d29..bc395fc6a 100644 --- a/apps/presentationeditor/mobile/resources/css/app-material.css +++ b/apps/presentationeditor/mobile/resources/css/app-material.css @@ -6399,6 +6399,7 @@ html.phone .document-menu .list-block .item-link { color: #aa5252; } .container-view-comment { + position: fixed; -webkit-transition: height 100ms; transition: height 100ms; background-color: #FFFFFF; @@ -6426,7 +6427,7 @@ html.phone .document-menu .list-block .item-link { padding: 0; } .container-view-comment .toolbar { - position: absolute; + position: fixed; background-color: #FFFFFF; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } @@ -6472,12 +6473,14 @@ html.phone .document-menu .list-block .item-link { margin-top: 0; } .container-view-comment.popover { + position: absolute; border-radius: 4px; min-height: 170px; height: 400px; max-height: 600px; } .container-view-comment.popover .toolbar { + position: absolute; border-radius: 0 0 4px 4px; } .container-view-comment.popover .toolbar .toolbar-inner { @@ -6628,15 +6631,24 @@ html.phone .document-menu .list-block .item-link { .page-edit-reply .navbar .right { height: 100%; } -.page-edit-comment .navbar .right .done-reply, -.page-add-reply .navbar .right .done-reply, -.page-edit-reply .navbar .right .done-reply { +.page-edit-comment .navbar .right #add-reply, +.page-add-reply .navbar .right #add-reply, +.page-edit-reply .navbar .right #add-reply, +.page-edit-comment .navbar .right #edit-comment, +.page-add-reply .navbar .right #edit-comment, +.page-edit-reply .navbar .right #edit-comment, +.page-edit-comment .navbar .right #edit-reply, +.page-add-reply .navbar .right #edit-reply, +.page-edit-reply .navbar .right #edit-reply { display: flex; align-items: center; padding-left: 16px; padding-right: 16px; height: 100%; } +.container-edit-comment { + position: fixed; +} .tablet .searchbar.document.replace .center > .replace { display: flex; } diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css index 419d53f85..db6e90d77 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css @@ -6746,6 +6746,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after background-color: #FFFFFF; } .container-view-comment { + position: fixed; -webkit-transition: height 100ms; transition: height 120ms; background-color: #FFFFFF; @@ -6776,7 +6777,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after padding: 0; } .container-view-comment .toolbar { - position: absolute; + position: fixed; background-color: #FFFFFF; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } @@ -6815,12 +6816,14 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after margin-top: 0; } .container-view-comment.popover { + position: absolute; border-radius: 4px; min-height: 170px; height: 400px; max-height: 600px; } .container-view-comment.popover .toolbar { + position: absolute; border-radius: 0 0 4px 4px; } .container-view-comment.popover .toolbar .toolbar-inner { @@ -6938,15 +6941,24 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-edit-reply .navbar .right { height: 100%; } -.page-edit-comment .navbar .right .done-reply, -.page-add-reply .navbar .right .done-reply, -.page-edit-reply .navbar .right .done-reply { +.page-edit-comment .navbar .right #add-reply, +.page-add-reply .navbar .right #add-reply, +.page-edit-reply .navbar .right #add-reply, +.page-edit-comment .navbar .right #edit-comment, +.page-add-reply .navbar .right #edit-comment, +.page-edit-reply .navbar .right #edit-comment, +.page-edit-comment .navbar .right #edit-reply, +.page-add-reply .navbar .right #edit-reply, +.page-edit-reply .navbar .right #edit-reply { display: flex; align-items: center; padding-left: 16px; padding-right: 16px; height: 100%; } +.container-edit-comment { + position: fixed; +} i.icon.icon-search { width: 24px; height: 24px; diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-material.css b/apps/spreadsheeteditor/mobile/resources/css/app-material.css index 9784d2320..3b14df50c 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-material.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-material.css @@ -6409,6 +6409,7 @@ html.phone .document-menu .list-block .item-link { color: #40865c; } .container-view-comment { + position: fixed; -webkit-transition: height 100ms; transition: height 100ms; background-color: #FFFFFF; @@ -6436,7 +6437,7 @@ html.phone .document-menu .list-block .item-link { padding: 0; } .container-view-comment .toolbar { - position: absolute; + position: fixed; background-color: #FFFFFF; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } @@ -6482,12 +6483,14 @@ html.phone .document-menu .list-block .item-link { margin-top: 0; } .container-view-comment.popover { + position: absolute; border-radius: 4px; min-height: 170px; height: 400px; max-height: 600px; } .container-view-comment.popover .toolbar { + position: absolute; border-radius: 0 0 4px 4px; } .container-view-comment.popover .toolbar .toolbar-inner { @@ -6638,15 +6641,24 @@ html.phone .document-menu .list-block .item-link { .page-edit-reply .navbar .right { height: 100%; } -.page-edit-comment .navbar .right .done-reply, -.page-add-reply .navbar .right .done-reply, -.page-edit-reply .navbar .right .done-reply { +.page-edit-comment .navbar .right #add-reply, +.page-add-reply .navbar .right #add-reply, +.page-edit-reply .navbar .right #add-reply, +.page-edit-comment .navbar .right #edit-comment, +.page-add-reply .navbar .right #edit-comment, +.page-edit-reply .navbar .right #edit-comment, +.page-edit-comment .navbar .right #edit-reply, +.page-add-reply .navbar .right #edit-reply, +.page-edit-reply .navbar .right #edit-reply { display: flex; align-items: center; padding-left: 16px; padding-right: 16px; height: 100%; } +.container-edit-comment { + position: fixed; +} .tablet .searchbar.document.replace .center > .replace { display: flex; } From cc4110dd5eab78544329a436efe40e3f3bbcc1ae Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Fri, 3 Apr 2020 21:01:26 +0300 Subject: [PATCH 10/23] [DE mobile] Fix view/add/edit/delete comments --- .../mobile/lib/controller/Collaboration.js | 190 ++++++++++++------ .../resources/less/ios/_collaboration.less | 3 + .../less/material/_collaboration.less | 5 +- .../mobile/app/view/add/AddOther.js | 4 + .../mobile/resources/css/app-ios.css | 29 +++ .../mobile/resources/css/app-material.css | 35 +++- .../mobile/resources/css/app-ios.css | 29 +++ .../mobile/resources/css/app-material.css | 35 +++- .../mobile/resources/css/app-ios.css | 29 +++ .../mobile/resources/css/app-material.css | 35 +++- 10 files changed, 317 insertions(+), 77 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index b40f63117..19745f013 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -93,6 +93,8 @@ define([ this.api.asc_registerCallback('asc_onRemoveComment', _.bind(this.onApiRemoveComment, this)); this.api.asc_registerCallback('asc_onRemoveComments', _.bind(this.onApiRemoveComments, this)); this.api.asc_registerCallback('asc_onShowComment', _.bind(this.apiShowComments, this)); + this.api.asc_registerCallback('asc_onHideComment', _.bind(this.apiHideComments, this)); + if (editor === 'DE') { this.api.asc_registerCallback('asc_onShowRevisionsChange', _.bind(this.changeReview, this)); } @@ -751,6 +753,36 @@ define([ } }); } + if ($('.container-view-comment').length > 0) { + me.indexCurrentComment = 0; + me.updateViewComment(); + } + }, + + apiHideComments: function() { + if ($('.container-view-comment').length > 0) { + uiApp.closeModal(); + $('.container-view-comment').remove(); + } + }, + + disabledViewComments: function(disabled) { + if ($('.container-view-comment').length > 0) { + if (disabled) { + $('.comment-resolve, .comment-menu, .add-reply').addClass('disabled'); + if (!$('.prev-comment').hasClass('disabled')) { + $('.prev-comment').addClass('disabled'); + } + if (!$('.next-comment').hasClass('disabled')) { + $('.next-comment').addClass('disabled'); + } + } else { + $('.comment-resolve, .comment-menu, .add-reply').removeClass('disabled'); + if (this.showComments.length > 1) { + $('.prev-comment, .next-comment').removeClass('disabled'); + } + } + } }, updateViewComment: function() { @@ -758,6 +790,9 @@ define([ $('.comment-menu').single('click', _.bind(this.initMenuComments, this)); $('.reply-menu').single('click', _.bind(this.initReplyMenu, this)); $('.comment-resolve').single('click', _.bind(this.onClickResolveComment, this, false)); + if (this.showComments.length === 1) { + $('.prev-comment, .next-comment').addClass('disabled'); + } }, showCommentModal: function() { @@ -989,6 +1024,7 @@ define([ ); $('.popup').css('z-index', '20000'); } else { + me.disabledViewComments(true); $('.container-view-comment .toolbar').find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'none'); var template = _.template('' + me.textDone + ''); $('.container-view-comment .button-right').append(template); @@ -1003,6 +1039,10 @@ define([ color = me.currentUser.asc_getColor(); me.getView('Common.Views.Collaboration').renderAddReply(name, color, me.getInitials(name), date); } + _.defer(function () { + var $textarea = $('.reply-textarea')[0]; + $textarea.focus(); + }); $('#add-new-reply').single('click', _.bind(function (uid) { var reply = $('.reply-textarea')[0].value; if ($('.container-view-comment').length > 0) { @@ -1016,6 +1056,7 @@ define([ } else { uiApp.closeModal($$(addReplyView)); } + this.disabledViewComments(false); } } else if ($('.container-collaboration').length > 0) { this.addReply(uid, reply); @@ -1029,6 +1070,7 @@ define([ } $viewComment.find('a#add-new-reply, a.cancel-reply').css('display', 'none'); $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + this.disabledViewComments(false); }, me)); } }, @@ -1118,50 +1160,91 @@ define([ }, initMenuComments: function(e) { - var $comment = $(e.currentTarget).closest('.comment'); - var idComment = $comment.data('uid'); - if (_.isNumber(idComment)) { - idComment = idComment.toString(); + if ($('.actions-modal').length < 1) { + var $comment = $(e.currentTarget).closest('.comment'); + var idComment = $comment.data('uid'); + if (_.isNumber(idComment)) { + idComment = idComment.toString(); + } + var comment = this.findComment(idComment); + if ($('.actions-modal').length === 0 && comment) { + var me = this; + _.delay(function () { + var _menuItems = []; + _menuItems.push({ + caption: me.textEdit, + event: 'edit' + }); + if (!comment.resolved) { + _menuItems.push({ + caption: me.textResolve, + event: 'resolve' + }); + } else { + _menuItems.push({ + caption: me.textReopen, + event: 'resolve' + }); + } + if ($('.container-collaboration').length > 0) { + _menuItems.push({ + caption: me.textAddReply, + event: 'addreply' + }); + } + _menuItems.push({ + caption: me.textDeleteComment, + event: 'delete', + color: 'red' + }); + _.each(_menuItems, function (item) { + item.text = item.caption; + item.onClick = function () { + me.onCommentMenuClick(item.event, idComment) + } + }); + + me.menuComments = uiApp.actions([_menuItems, [ + { + text: me.textCancel, + bold: true, + onClick: function () { + me.onCommentMenuClick(); + } + } + ]]); + }, 100); + } + this.disabledViewComments(true); } - var comment = this.findComment(idComment); - if ($('.actions-modal').length === 0 && comment) { + }, + + initReplyMenu: function(event) { + if ($('.actions-modal').length < 1) { var me = this; + var ind = $(event.currentTarget).parent().parent().data('ind'); + var idComment = $(event.currentTarget).closest('.comment').data('uid'); + if (_.isNumber(idComment)) { + idComment = idComment.toString(); + } _.delay(function () { var _menuItems = []; _menuItems.push({ caption: me.textEdit, - event: 'edit' + event: 'editreply' }); - if (!comment.resolved) { - _menuItems.push({ - caption: me.textResolve, - event: 'resolve' - }); - } else { - _menuItems.push({ - caption: me.textReopen, - event: 'resolve' - }); - } - if ($('.container-collaboration').length > 0) { - _menuItems.push({ - caption: me.textAddReply, - event: 'addreply' - }); - } _menuItems.push({ - caption: me.textDeleteComment, - event: 'delete', + caption: me.textDeleteReply, + event: 'deletereply', color: 'red' }); _.each(_menuItems, function (item) { item.text = item.caption; item.onClick = function () { - me.onCommentMenuClick(item.event, idComment) + me.onCommentMenuClick(item.event, idComment, ind); } }); - - me.menuComments = uiApp.actions([_menuItems, [ + uiApp.actions([_menuItems, [ { text: me.textCancel, bold: true, @@ -1171,45 +1254,10 @@ define([ } ]]); }, 100); + this.disabledViewComments(true); } }, - initReplyMenu: function(event) { - var me = this; - var ind = $(event.currentTarget).parent().parent().data('ind'); - var idComment = $(event.currentTarget).closest('.comment').data('uid'); - if (_.isNumber(idComment)) { - idComment = idComment.toString(); - } - _.delay(function () { - var _menuItems = []; - _menuItems.push({ - caption: me.textEdit, - event: 'editreply' - }); - _menuItems.push({ - caption: me.textDeleteReply, - event: 'deletereply', - color: 'red' - }); - _.each(_menuItems, function (item) { - item.text = item.caption; - item.onClick = function () { - me.onCommentMenuClick(item.event, idComment, ind); - } - }); - uiApp.actions([_menuItems, [ - { - text: me.textCancel, - bold: true, - onClick: function () { - me.onCommentMenuClick(); - } - } - ]]); - }, 100); - }, - onCommentMenuClick: function(action, idComment, indReply) { var me = this; function addOverlay () { @@ -1228,10 +1276,12 @@ define([ case 'resolve': addOverlay(); me.onClickResolveComment(idComment); + me.disabledViewComments(false); break; case 'delete': addOverlay(); me.onDeleteComment(idComment); + me.disabledViewComments(false); break; case 'editreply': addOverlay(); @@ -1240,12 +1290,14 @@ define([ case 'deletereply': addOverlay(); me.onDeleteReply(idComment, indReply); + me.disabledViewComments(false); break; case 'addreply': addOverlay(); me.onClickAddReply(idComment); default: addOverlay(); + me.disabledViewComments(false); break; } }, @@ -1435,6 +1487,7 @@ define([ $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); } this.updateViewComment(); + this.disabledViewComments(false); } else if ($('.container-collaboration').length > 0) { rootView.router.back(); } @@ -1445,6 +1498,7 @@ define([ $viewComment.find('a.done-edit-comment, a.cancel-edit-comment, .comment-textarea').remove(); $viewComment.find('.comment-text span').css('display', 'block'); $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + this.disabledViewComments(false); }, me)); } }, @@ -1503,11 +1557,11 @@ define([ me.getView('Common.Views.Collaboration').showPage('#comments-edit-reply-view', false); me.getView('Common.Views.Collaboration').renderEditReply(reply); } - _.delay(function () { + _.defer(function () { var $textarea = $('.edit-reply-textarea')[0]; $textarea.focus(); $textarea.selectionStart = $textarea.value.length; - }, 100); + }); $('#edit-reply').single('click', _.bind(function (comment, indReply) { var value = $('.edit-reply-textarea')[0].value; if (value && value.length > 0) { @@ -1526,12 +1580,14 @@ define([ this.onChangeComment(comment); rootView.router.back(); } + this.disabledViewComments(false); } }, me, comment, indReply)); $('.cancel-reply').single('click', _.bind(function () { $viewComment.find('a#edit-reply, a.cancel-reply, .edit-reply-textarea').remove(); $reply.find('.reply-text').css('display', 'block'); $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + this.disabledViewComments(false); }, me)); } } diff --git a/apps/common/mobile/resources/less/ios/_collaboration.less b/apps/common/mobile/resources/less/ios/_collaboration.less index 448112b20..112fba932 100644 --- a/apps/common/mobile/resources/less/ios/_collaboration.less +++ b/apps/common/mobile/resources/less/ios/_collaboration.less @@ -115,6 +115,9 @@ .list-reply { padding-left: 26px; } + .reply-textarea, .comment-textarea, .edit-reply-textarea { + resize: vertical; + } .user-name { font-size: 17px; line-height: 22px; diff --git a/apps/common/mobile/resources/less/material/_collaboration.less b/apps/common/mobile/resources/less/material/_collaboration.less index 624d2c303..5ac455060 100644 --- a/apps/common/mobile/resources/less/material/_collaboration.less +++ b/apps/common/mobile/resources/less/material/_collaboration.less @@ -113,6 +113,9 @@ .list-reply { padding-left: 26px; } + .reply-textarea, .comment-textarea, .edit-reply-textarea { + resize: vertical; + } .user-name { font-size: 16px; line-height: 22px; @@ -447,7 +450,7 @@ .navbar { .right { height: 100%; - #add-reply, #edit-comment, #edit-reply { + #add-new-reply, #edit-comment, #edit-reply { display: flex; align-items: center; padding-left: 16px; diff --git a/apps/documenteditor/mobile/app/view/add/AddOther.js b/apps/documenteditor/mobile/app/view/add/AddOther.js index 76bfaeb07..8e030be93 100644 --- a/apps/documenteditor/mobile/app/view/add/AddOther.js +++ b/apps/documenteditor/mobile/app/view/add/AddOther.js @@ -162,6 +162,10 @@ define([ comment: comment }); $commentInfo.html(insert); + _.defer(function () { + var $textarea = $('.comment-textarea')[0]; + $textarea.focus(); + }); }, renderNumFormat: function (dataFormat, selectFormat) { diff --git a/apps/documenteditor/mobile/resources/css/app-ios.css b/apps/documenteditor/mobile/resources/css/app-ios.css index 480f2f293..305972301 100644 --- a/apps/documenteditor/mobile/resources/css/app-ios.css +++ b/apps/documenteditor/mobile/resources/css/app-ios.css @@ -6541,6 +6541,35 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-edit-reply .list-reply { padding-left: 26px; } +.page-comments .reply-textarea, +.add-comment .reply-textarea, +.page-view-comments .reply-textarea, +.container-edit-comment .reply-textarea, +.container-add-reply .reply-textarea, +.view-comment .reply-textarea, +.page-edit-comment .reply-textarea, +.page-add-reply .reply-textarea, +.page-edit-reply .reply-textarea, +.page-comments .comment-textarea, +.add-comment .comment-textarea, +.page-view-comments .comment-textarea, +.container-edit-comment .comment-textarea, +.container-add-reply .comment-textarea, +.view-comment .comment-textarea, +.page-edit-comment .comment-textarea, +.page-add-reply .comment-textarea, +.page-edit-reply .comment-textarea, +.page-comments .edit-reply-textarea, +.add-comment .edit-reply-textarea, +.page-view-comments .edit-reply-textarea, +.container-edit-comment .edit-reply-textarea, +.container-add-reply .edit-reply-textarea, +.view-comment .edit-reply-textarea, +.page-edit-comment .edit-reply-textarea, +.page-add-reply .edit-reply-textarea, +.page-edit-reply .edit-reply-textarea { + resize: vertical; +} .page-comments .user-name, .add-comment .user-name, .page-view-comments .user-name, diff --git a/apps/documenteditor/mobile/resources/css/app-material.css b/apps/documenteditor/mobile/resources/css/app-material.css index 941217e68..5c5c3fb8b 100644 --- a/apps/documenteditor/mobile/resources/css/app-material.css +++ b/apps/documenteditor/mobile/resources/css/app-material.css @@ -6131,6 +6131,35 @@ html.phone .document-menu .list-block .item-link { .page-edit-reply .list-reply { padding-left: 26px; } +.page-comments .reply-textarea, +.page-add-comment .reply-textarea, +.page-view-comments .reply-textarea, +.container-edit-comment .reply-textarea, +.container-add-reply .reply-textarea, +.view-comment .reply-textarea, +.page-edit-comment .reply-textarea, +.page-add-reply .reply-textarea, +.page-edit-reply .reply-textarea, +.page-comments .comment-textarea, +.page-add-comment .comment-textarea, +.page-view-comments .comment-textarea, +.container-edit-comment .comment-textarea, +.container-add-reply .comment-textarea, +.view-comment .comment-textarea, +.page-edit-comment .comment-textarea, +.page-add-reply .comment-textarea, +.page-edit-reply .comment-textarea, +.page-comments .edit-reply-textarea, +.page-add-comment .edit-reply-textarea, +.page-view-comments .edit-reply-textarea, +.container-edit-comment .edit-reply-textarea, +.container-add-reply .edit-reply-textarea, +.view-comment .edit-reply-textarea, +.page-edit-comment .edit-reply-textarea, +.page-add-reply .edit-reply-textarea, +.page-edit-reply .edit-reply-textarea { + resize: vertical; +} .page-comments .user-name, .page-add-comment .user-name, .page-view-comments .user-name, @@ -6631,9 +6660,9 @@ html.phone .document-menu .list-block .item-link { .page-edit-reply .navbar .right { height: 100%; } -.page-edit-comment .navbar .right #add-reply, -.page-add-reply .navbar .right #add-reply, -.page-edit-reply .navbar .right #add-reply, +.page-edit-comment .navbar .right #add-new-reply, +.page-add-reply .navbar .right #add-new-reply, +.page-edit-reply .navbar .right #add-new-reply, .page-edit-comment .navbar .right #edit-comment, .page-add-reply .navbar .right #edit-comment, .page-edit-reply .navbar .right #edit-comment, diff --git a/apps/presentationeditor/mobile/resources/css/app-ios.css b/apps/presentationeditor/mobile/resources/css/app-ios.css index f95047727..3915440f2 100644 --- a/apps/presentationeditor/mobile/resources/css/app-ios.css +++ b/apps/presentationeditor/mobile/resources/css/app-ios.css @@ -6541,6 +6541,35 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-edit-reply .list-reply { padding-left: 26px; } +.page-comments .reply-textarea, +.add-comment .reply-textarea, +.page-view-comments .reply-textarea, +.container-edit-comment .reply-textarea, +.container-add-reply .reply-textarea, +.view-comment .reply-textarea, +.page-edit-comment .reply-textarea, +.page-add-reply .reply-textarea, +.page-edit-reply .reply-textarea, +.page-comments .comment-textarea, +.add-comment .comment-textarea, +.page-view-comments .comment-textarea, +.container-edit-comment .comment-textarea, +.container-add-reply .comment-textarea, +.view-comment .comment-textarea, +.page-edit-comment .comment-textarea, +.page-add-reply .comment-textarea, +.page-edit-reply .comment-textarea, +.page-comments .edit-reply-textarea, +.add-comment .edit-reply-textarea, +.page-view-comments .edit-reply-textarea, +.container-edit-comment .edit-reply-textarea, +.container-add-reply .edit-reply-textarea, +.view-comment .edit-reply-textarea, +.page-edit-comment .edit-reply-textarea, +.page-add-reply .edit-reply-textarea, +.page-edit-reply .edit-reply-textarea { + resize: vertical; +} .page-comments .user-name, .add-comment .user-name, .page-view-comments .user-name, diff --git a/apps/presentationeditor/mobile/resources/css/app-material.css b/apps/presentationeditor/mobile/resources/css/app-material.css index bc395fc6a..b6dd3c3ec 100644 --- a/apps/presentationeditor/mobile/resources/css/app-material.css +++ b/apps/presentationeditor/mobile/resources/css/app-material.css @@ -6131,6 +6131,35 @@ html.phone .document-menu .list-block .item-link { .page-edit-reply .list-reply { padding-left: 26px; } +.page-comments .reply-textarea, +.page-add-comment .reply-textarea, +.page-view-comments .reply-textarea, +.container-edit-comment .reply-textarea, +.container-add-reply .reply-textarea, +.view-comment .reply-textarea, +.page-edit-comment .reply-textarea, +.page-add-reply .reply-textarea, +.page-edit-reply .reply-textarea, +.page-comments .comment-textarea, +.page-add-comment .comment-textarea, +.page-view-comments .comment-textarea, +.container-edit-comment .comment-textarea, +.container-add-reply .comment-textarea, +.view-comment .comment-textarea, +.page-edit-comment .comment-textarea, +.page-add-reply .comment-textarea, +.page-edit-reply .comment-textarea, +.page-comments .edit-reply-textarea, +.page-add-comment .edit-reply-textarea, +.page-view-comments .edit-reply-textarea, +.container-edit-comment .edit-reply-textarea, +.container-add-reply .edit-reply-textarea, +.view-comment .edit-reply-textarea, +.page-edit-comment .edit-reply-textarea, +.page-add-reply .edit-reply-textarea, +.page-edit-reply .edit-reply-textarea { + resize: vertical; +} .page-comments .user-name, .page-add-comment .user-name, .page-view-comments .user-name, @@ -6631,9 +6660,9 @@ html.phone .document-menu .list-block .item-link { .page-edit-reply .navbar .right { height: 100%; } -.page-edit-comment .navbar .right #add-reply, -.page-add-reply .navbar .right #add-reply, -.page-edit-reply .navbar .right #add-reply, +.page-edit-comment .navbar .right #add-new-reply, +.page-add-reply .navbar .right #add-new-reply, +.page-edit-reply .navbar .right #add-new-reply, .page-edit-comment .navbar .right #edit-comment, .page-add-reply .navbar .right #edit-comment, .page-edit-reply .navbar .right #edit-comment, diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css index db6e90d77..a568ed13a 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css @@ -6541,6 +6541,35 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-edit-reply .list-reply { padding-left: 26px; } +.page-comments .reply-textarea, +.add-comment .reply-textarea, +.page-view-comments .reply-textarea, +.container-edit-comment .reply-textarea, +.container-add-reply .reply-textarea, +.view-comment .reply-textarea, +.page-edit-comment .reply-textarea, +.page-add-reply .reply-textarea, +.page-edit-reply .reply-textarea, +.page-comments .comment-textarea, +.add-comment .comment-textarea, +.page-view-comments .comment-textarea, +.container-edit-comment .comment-textarea, +.container-add-reply .comment-textarea, +.view-comment .comment-textarea, +.page-edit-comment .comment-textarea, +.page-add-reply .comment-textarea, +.page-edit-reply .comment-textarea, +.page-comments .edit-reply-textarea, +.add-comment .edit-reply-textarea, +.page-view-comments .edit-reply-textarea, +.container-edit-comment .edit-reply-textarea, +.container-add-reply .edit-reply-textarea, +.view-comment .edit-reply-textarea, +.page-edit-comment .edit-reply-textarea, +.page-add-reply .edit-reply-textarea, +.page-edit-reply .edit-reply-textarea { + resize: vertical; +} .page-comments .user-name, .add-comment .user-name, .page-view-comments .user-name, diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-material.css b/apps/spreadsheeteditor/mobile/resources/css/app-material.css index 3b14df50c..473708f41 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-material.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-material.css @@ -6141,6 +6141,35 @@ html.phone .document-menu .list-block .item-link { .page-edit-reply .list-reply { padding-left: 26px; } +.page-comments .reply-textarea, +.page-add-comment .reply-textarea, +.page-view-comments .reply-textarea, +.container-edit-comment .reply-textarea, +.container-add-reply .reply-textarea, +.view-comment .reply-textarea, +.page-edit-comment .reply-textarea, +.page-add-reply .reply-textarea, +.page-edit-reply .reply-textarea, +.page-comments .comment-textarea, +.page-add-comment .comment-textarea, +.page-view-comments .comment-textarea, +.container-edit-comment .comment-textarea, +.container-add-reply .comment-textarea, +.view-comment .comment-textarea, +.page-edit-comment .comment-textarea, +.page-add-reply .comment-textarea, +.page-edit-reply .comment-textarea, +.page-comments .edit-reply-textarea, +.page-add-comment .edit-reply-textarea, +.page-view-comments .edit-reply-textarea, +.container-edit-comment .edit-reply-textarea, +.container-add-reply .edit-reply-textarea, +.view-comment .edit-reply-textarea, +.page-edit-comment .edit-reply-textarea, +.page-add-reply .edit-reply-textarea, +.page-edit-reply .edit-reply-textarea { + resize: vertical; +} .page-comments .user-name, .page-add-comment .user-name, .page-view-comments .user-name, @@ -6641,9 +6670,9 @@ html.phone .document-menu .list-block .item-link { .page-edit-reply .navbar .right { height: 100%; } -.page-edit-comment .navbar .right #add-reply, -.page-add-reply .navbar .right #add-reply, -.page-edit-reply .navbar .right #add-reply, +.page-edit-comment .navbar .right #add-new-reply, +.page-add-reply .navbar .right #add-new-reply, +.page-edit-reply .navbar .right #add-new-reply, .page-edit-comment .navbar .right #edit-comment, .page-add-reply .navbar .right #edit-comment, .page-edit-reply .navbar .right #edit-comment, From d37f5612dea2a2304bbe7a3d23661854bc5d18bf Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Mon, 6 Apr 2020 19:00:54 +0300 Subject: [PATCH 11/23] [DE mobile] fix layout add other --- .../mobile/app/template/AddOther.template | 24 +++++++++---------- 1 file changed, 12 insertions(+), 12 deletions(-) diff --git a/apps/documenteditor/mobile/app/template/AddOther.template b/apps/documenteditor/mobile/app/template/AddOther.template index ee5a922fb..3f6b0493c 100644 --- a/apps/documenteditor/mobile/app/template/AddOther.template +++ b/apps/documenteditor/mobile/app/template/AddOther.template @@ -2,6 +2,18 @@ From 37007d900573df1e00f601d1ad09f4f20af31913 Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Tue, 7 Apr 2020 13:36:38 +0300 Subject: [PATCH 12/23] [DE mobile] Comments (add sort comments in collaboration, fix animation when open add comment) --- apps/common/mobile/lib/view/Collaboration.js | 3 +- .../mobile/app/view/DocumentHolder.js | 12 ++++--- .../mobile/app/view/add/AddOther.js | 36 ++++++++++--------- 3 files changed, 29 insertions(+), 22 deletions(-) diff --git a/apps/common/mobile/lib/view/Collaboration.js b/apps/common/mobile/lib/view/Collaboration.js index e0c42b43b..98cf76b97 100644 --- a/apps/common/mobile/lib/view/Collaboration.js +++ b/apps/common/mobile/lib/view/Collaboration.js @@ -220,9 +220,10 @@ define([ if ($('#no-comments').length > 0) { $('#no-comments').remove(); } + var sortComments = _.sortBy(comments, 'time').reverse(); var $listComments = $('#comments-list'), items = []; - _.each(comments, function (comment) { + _.each(sortComments, function (comment) { var itemTemplate = [ '
  • ', '
    ', diff --git a/apps/documenteditor/mobile/app/view/DocumentHolder.js b/apps/documenteditor/mobile/app/view/DocumentHolder.js index c9637f358..a51381327 100644 --- a/apps/documenteditor/mobile/app/view/DocumentHolder.js +++ b/apps/documenteditor/mobile/app/view/DocumentHolder.js @@ -126,11 +126,15 @@ define([ }, hideMenu: function () { - $('#' + _anchorId) - .css('left', -1000) - .css('top', -1000); + if ($('.document-menu').length > 0) { + $('#' + _anchorId) + .css('left', -1000) + .css('top', -1000); - uiApp.closeModal('.document-menu.modal-in'); + uiApp.closeModal('.document-menu.modal-in'); + } else if ($('.actions-modal').length > 0) { + uiApp.closeModal('.actions-modal.modal-in'); + } } } })()); diff --git a/apps/documenteditor/mobile/app/view/add/AddOther.js b/apps/documenteditor/mobile/app/view/add/AddOther.js index 8e030be93..023bdbc99 100644 --- a/apps/documenteditor/mobile/app/view/add/AddOther.js +++ b/apps/documenteditor/mobile/app/view/add/AddOther.js @@ -149,23 +149,25 @@ define([ }, renderComment: function(comment) { - var $commentInfo = $('#comment-info'); - var template = [ - '<% if (android) { %>
    <%= comment.userInitials %>
    <% } %>', - '
    <%= comment.username %>
    ', - '
    <%= comment.date %>
    ', - '<% if (android) { %>
    <% } %>', - '
    ' - ].join(''); - var insert = _.template(template)({ - android: Framework7.prototype.device.android, - comment: comment - }); - $commentInfo.html(insert); - _.defer(function () { - var $textarea = $('.comment-textarea')[0]; - $textarea.focus(); - }); + _.delay(function () { + var $commentInfo = $('#comment-info'); + var template = [ + '<% if (android) { %>
    <%= comment.userInitials %>
    <% } %>', + '
    <%= comment.username %>
    ', + '
    <%= comment.date %>
    ', + '<% if (android) { %>
    <% } %>', + '
    ' + ].join(''); + var insert = _.template(template)({ + android: Framework7.prototype.device.android, + comment: comment + }); + $commentInfo.html(insert); + _.defer(function () { + var $textarea = $('.comment-textarea')[0]; + $textarea.focus(); + }); + }, 100); }, renderNumFormat: function (dataFormat, selectFormat) { From 61193b2f6acf3cd10ac2ccaf9153d3885a206c7b Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Tue, 7 Apr 2020 17:28:12 +0300 Subject: [PATCH 13/23] [DE mobile] Comments (add modal comfirm when detele comment/draft) --- .../mobile/lib/controller/Collaboration.js | 19 ++++++++++++-- .../mobile/app/controller/add/AddOther.js | 25 ++++++++++++++++++- .../mobile/app/template/AddOther.template | 2 +- 3 files changed, 42 insertions(+), 4 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index 688c3418c..49dddb733 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -1288,7 +1288,20 @@ define([ break; case 'delete': addOverlay(); - me.onDeleteComment(idComment); + uiApp.modal({ + title: this.textDeleteComment, + text: this.textMessageDeleteComment, + buttons: [ + { + text: this.textCancel + }, + { + text: this.textYes, + onClick: function () { + me.onDeleteComment(idComment); + } + }] + }); me.disabledViewComments(false); break; case 'editreply': @@ -1998,7 +2011,9 @@ define([ textEditComment: 'Edit comment', textDeleteReply: 'Delete reply', textEditReply: 'Edit reply', - textReopen: 'Reopen' + textReopen: 'Reopen', + textMessageDeleteComment: 'Do you really want to delete this comment?', + textYes: 'Yes' } })(), Common.Controllers.Collaboration || {})) diff --git a/apps/documenteditor/mobile/app/controller/add/AddOther.js b/apps/documenteditor/mobile/app/controller/add/AddOther.js index da9a96245..36f25503c 100644 --- a/apps/documenteditor/mobile/app/controller/add/AddOther.js +++ b/apps/documenteditor/mobile/app/controller/add/AddOther.js @@ -119,6 +119,26 @@ define([ if (comment) { this.getView('AddOther').renderComment(comment); $('#done-comment').single('click', _.bind(this.onDoneComment, this)); + $('.back-from-add-comment').single('click', _.bind(function () { + if ($('#comment-text').val().length > 0) { + uiApp.modal({ + title: '', + text: this.textDeleteDraft, + buttons: [ + { + text: this.textCancel + }, + { + text: this.textContinue, + onClick: function () { + DE.getController('AddContainer').rootView.router.back(); + } + }] + }) + } else { + DE.getController('AddContainer').rootView.router.back(); + } + }, this)) } }, @@ -384,7 +404,10 @@ define([ txtNotUrl: 'This field should be a URL in the format \"http://www.example.com\"', textBottomOfPage: 'Bottom Of Page', - textBelowText: 'Below Text' + textBelowText: 'Below Text', + textDeleteDraft: 'Delete draft?', + textCancel: 'Cancel', + textContinue: 'Continue' } })(), DE.Controllers.AddOther || {})) diff --git a/apps/documenteditor/mobile/app/template/AddOther.template b/apps/documenteditor/mobile/app/template/AddOther.template index 3f6b0493c..f646fe425 100644 --- a/apps/documenteditor/mobile/app/template/AddOther.template +++ b/apps/documenteditor/mobile/app/template/AddOther.template @@ -342,7 +342,7 @@
    -
    <% if (!android) { %><%= scope.textBack %><% } %>
    +
    <% if (!android) { %><%= scope.textBack %><% } %>
    <%= scope.textAddComment %>
    <% if (android) { %><% } else { %><%= scope.textDone %><% } %>
    From 9dea0c8fae725990bf6fcd29cb52229935e45c46 Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Thu, 9 Apr 2020 20:51:04 +0300 Subject: [PATCH 14/23] [DE mobile] Comments (add check of appOptions: canComments, canViewComments, canEditComments) --- .../mobile/lib/controller/Collaboration.js | 16 +++++++---- .../lib/template/Collaboration.template | 2 +- apps/common/mobile/lib/view/Collaboration.js | 28 ++++++++++++++----- .../mobile/app/controller/DocumentHolder.js | 22 +++++++++++---- .../mobile/app/controller/Main.js | 5 +++- .../mobile/app/controller/add/AddOther.js | 5 ++++ .../mobile/app/template/AddOther.template | 2 +- .../mobile/app/view/add/AddOther.js | 3 ++ 8 files changed, 62 insertions(+), 21 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index 49dddb733..dc8ec38c7 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -106,6 +106,9 @@ define([ setMode: function(mode) { this.appConfig = mode; + this.view = this.getView('Common.Views.Collaboration'); + this.view.viewmode = !mode.canComments; + this.view.canViewComments = mode.canViewComments; _userId = mode.user.id; if (editor === 'DE') { _fileKey = mode.fileKey; @@ -822,7 +825,7 @@ define([ '
    ' + '
    ' + '
    ' + - '' + me.textAddReply + '' + + (!me.view.viewmode ? '' + me.textAddReply + '' : '') + '
    ' + '
    ' + '' + @@ -856,7 +859,7 @@ define([ '
    ' + '
    ' + '
    ' + - '' + me.textAddReply + '' + + (!me.view.viewmode ? '' + me.textAddReply + '' : '') + '
    ' + '
    ' + '' + @@ -1728,7 +1731,8 @@ define([ date : this.dateToLocaleTimeString(date), reply : data.asc_getReply(i).asc_getText(), time : date.getTime(), - userInitials : this.getInitials(username) + userInitials : this.getInitials(username), + editable : this.appConfig.canEditComments || (data.asc_getReply(i).asc_getUserId() == _userId) }); } } @@ -1754,7 +1758,8 @@ define([ time : date.getTime(), replys : [], groupName : (groupname && groupname.length>1) ? groupname[1] : null, - userInitials : this.getInitials(username) + userInitials : this.getInitials(username), + editable : this.appConfig.canEditComments || (data.asc_getUserId() == _userId) }; if (comment) { var replies = this.readSDKReplies(data); @@ -1809,7 +1814,8 @@ define([ date : me.dateToLocaleTimeString(dateReply), reply : data.asc_getReply(i).asc_getText(), time : dateReply.getTime(), - userInitials : me.getInitials(username) + userInitials : me.getInitials(username), + editable : me.appConfig.canEditComments || (data.asc_getUserId() == _userId) }); } comment.replys = replies; diff --git a/apps/common/mobile/lib/template/Collaboration.template b/apps/common/mobile/lib/template/Collaboration.template index 334bf7058..d1be94a44 100644 --- a/apps/common/mobile/lib/template/Collaboration.template +++ b/apps/common/mobile/lib/template/Collaboration.template @@ -20,7 +20,7 @@
    • -
  • +
  • diff --git a/apps/common/mobile/lib/view/Collaboration.js b/apps/common/mobile/lib/view/Collaboration.js index 98cf76b97..f20dbf161 100644 --- a/apps/common/mobile/lib/view/Collaboration.js +++ b/apps/common/mobile/lib/view/Collaboration.js @@ -116,6 +116,9 @@ define([ if (this.layout) { var $layour = this.layout.find('#collaboration-root-view'), isPhone = Common.SharedSettings.get('phone'); + if (!this.canViewComments) { + $layour.find('#item-comments').remove(); + } return $layour.html(); } @@ -150,6 +153,7 @@ define([ renderViewComments: function(comments, indCurComment) { var isAndroid = Framework7.prototype.device.android === true; + var me = this; if ($('.view-comment .page-content').length > 0) { var template = ''; if (comments && comments.length > 0) { @@ -168,11 +172,13 @@ define([ template += '
    '; } template += '
    '; - template += '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    • '; + if (comment.editable && !me.viewmode) { + template += '
    ' + + '
    ' + + '
    ' + + '
    '; + } + template += '
    '; if (comment.quote) template += '

    ' + comment.quote + '

    '; template += '
    ' + comment.comment + '
    '; @@ -191,8 +197,10 @@ define([ if (isAndroid) { template += '
    '; } - template += '
    ' + - '
    ' + + if (reply.editable && !me.viewmode) { + template += '
    '; + } + template += '' + '

    ' + reply.reply + '

    ' + ''; }); @@ -209,6 +217,7 @@ define([ }, renderComments: function (comments) { + var me = this; var $pageComments = $('.page-comments .page-content'); if (!comments) { if ($('.comment').length > 0) { @@ -233,10 +242,12 @@ define([ '

    <%= item.date %>

    ', '<% if (android) { %><% } %>', '', + '<% if (item.editable && !viewmode) { %>', '
    ', '
    ', '
    ', '
    ', + '<% } %>', '', '<% if(item.quote) {%>', '

    <%= item.quote %>

    ', @@ -253,7 +264,9 @@ define([ '

    <%= reply.date %>

    ', '', '<% if (android) { %><% } %>', + '<% if (reply.editable && !viewmode) { %>', '
    ', + '<% } %>', '', '

    <%= reply.reply %>

    ', '', @@ -267,6 +280,7 @@ define([ android: Framework7.prototype.device.android, item: comment, replys: comment.replys.length, + viewmode: me.viewmode })); }); $listComments.html(items.join('')); diff --git a/apps/documenteditor/mobile/app/controller/DocumentHolder.js b/apps/documenteditor/mobile/app/controller/DocumentHolder.js index 7aecfd2f9..ff8893ccf 100644 --- a/apps/documenteditor/mobile/app/controller/DocumentHolder.js +++ b/apps/documenteditor/mobile/app/controller/DocumentHolder.js @@ -62,7 +62,8 @@ define([ _inRevisionChange = false, _isComments = false, _menuPos = [], - _timer = 0; + _timer = 0, + _canViewComments = true; return { models: [], @@ -104,6 +105,7 @@ define([ setMode: function (mode) { _isEdit = mode.isEdit; _canReview = mode.canReview; + _canViewComments = mode.canViewComments; }, // When our application is ready, lets get started @@ -434,6 +436,12 @@ define([ icon: 'icon-copy' }); } + if (_canViewComments && _isComments && !_isEdit) { + arrItems.push({ + caption: me.menuViewComment, + event: 'viewcomment' + }); + } var isText = false, isTable = false, @@ -556,17 +564,19 @@ define([ } } - if (_isComments) { + if (_isComments && _canViewComments) { arrItems.push({ caption: me.menuViewComment, event: 'viewcomment' }); } - arrItems.push({ - caption: me.menuAddComment, - event: 'addcomment' - }); + if (_canViewComments) { + arrItems.push({ + caption: me.menuAddComment, + event: 'addcomment' + }); + } } } diff --git a/apps/documenteditor/mobile/app/controller/Main.js b/apps/documenteditor/mobile/app/controller/Main.js index ad3be8a53..2f0351f5b 100644 --- a/apps/documenteditor/mobile/app/controller/Main.js +++ b/apps/documenteditor/mobile/app/controller/Main.js @@ -762,7 +762,10 @@ define([ me.appOptions.canHistoryClose = me.editorConfig.canHistoryClose; me.appOptions.canUseMailMerge = me.appOptions.canLicense && me.appOptions.canEdit && !me.appOptions.isDesktopApp; me.appOptions.canSendEmailAddresses = me.appOptions.canLicense && me.editorConfig.canSendEmailAddresses && me.appOptions.canEdit && me.appOptions.canCoAuthoring; - me.appOptions.canComments = me.appOptions.canLicense && !((typeof (me.editorConfig.customization) == 'object') && me.editorConfig.customization.comments===false); + me.appOptions.canComments = me.appOptions.canLicense && (me.permissions.comment===undefined ? me.appOptions.isEdit : me.permissions.comment) && (me.editorConfig.mode !== 'view'); + me.appOptions.canComments = me.appOptions.canComments && !((typeof (me.editorConfig.customization) == 'object') && me.editorConfig.customization.comments===false); + me.appOptions.canViewComments = me.appOptions.canComments || !((typeof (me.editorConfig.customization) == 'object') && me.editorConfig.customization.comments===false); + me.appOptions.canEditComments = me.appOptions.isOffline || !(typeof (me.editorConfig.customization) == 'object' && me.editorConfig.customization.commentAuthorOnly); me.appOptions.canChat = me.appOptions.canLicense && !me.appOptions.isOffline && !((typeof (me.editorConfig.customization) == 'object') && me.editorConfig.customization.chat===false); me.appOptions.canEditStyles = me.appOptions.canLicense && me.appOptions.canEdit; me.appOptions.canPrint = (me.permissions.print !== false); diff --git a/apps/documenteditor/mobile/app/controller/add/AddOther.js b/apps/documenteditor/mobile/app/controller/add/AddOther.js index 36f25503c..a137cd1bd 100644 --- a/apps/documenteditor/mobile/app/controller/add/AddOther.js +++ b/apps/documenteditor/mobile/app/controller/add/AddOther.js @@ -81,6 +81,11 @@ define([ me.api = api; }, + setMode: function (mode) { + this.view = this.getView('AddOther'); + this.view.canViewComments = mode.canViewComments; + }, + onLaunch: function () { this.createView('AddOther').render(); }, diff --git a/apps/documenteditor/mobile/app/template/AddOther.template b/apps/documenteditor/mobile/app/template/AddOther.template index f646fe425..c664a7dd4 100644 --- a/apps/documenteditor/mobile/app/template/AddOther.template +++ b/apps/documenteditor/mobile/app/template/AddOther.template @@ -2,7 +2,7 @@
      -
    • +
    • diff --git a/apps/documenteditor/mobile/app/view/add/AddOther.js b/apps/documenteditor/mobile/app/view/add/AddOther.js index 023bdbc99..523c58880 100644 --- a/apps/documenteditor/mobile/app/view/add/AddOther.js +++ b/apps/documenteditor/mobile/app/view/add/AddOther.js @@ -88,6 +88,9 @@ define([ rootLayout: function () { if (this.layout) { + if (!this.canViewComments) { + this.layout.find('#addother-root-view #item-comment').remove(); + } return this.layout .find('#addother-root-view') .html(); From 96b9c849aca2ad9205b4692b175bf4dc84949a9e Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Fri, 10 Apr 2020 18:58:59 +0300 Subject: [PATCH 15/23] [PE mobile] Comments (add: add/edit/delete comments, add/edit/delete reply, tab other into insert) --- .../mobile/lib/controller/Collaboration.js | 7 +- apps/presentationeditor/mobile/app-dev.js | 2 + apps/presentationeditor/mobile/app.js | 2 + .../mobile/app/controller/DocumentHolder.js | 44 ++++- .../mobile/app/controller/Main.js | 5 +- .../mobile/app/controller/add/AddContainer.js | 11 +- .../mobile/app/controller/add/AddOther.js | 142 ++++++++++++++++ .../mobile/app/template/AddOther.template | 37 +++++ .../mobile/app/view/add/AddOther.js | 154 ++++++++++++++++++ .../mobile/resources/css/app-ios.css | 26 ++- .../mobile/resources/css/app-material.css | 45 +++++ .../mobile/resources/less/ios/_icons.less | 25 ++- .../resources/less/material/_icons.less | 46 ++++++ 13 files changed, 536 insertions(+), 10 deletions(-) create mode 100644 apps/presentationeditor/mobile/app/controller/add/AddOther.js create mode 100644 apps/presentationeditor/mobile/app/template/AddOther.template create mode 100644 apps/presentationeditor/mobile/app/view/add/AddOther.js diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index dc8ec38c7..71e42bbd4 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -797,7 +797,8 @@ define([ }, updateViewComment: function() { - DE.getController('Common.Controllers.Collaboration').getView('Common.Views.Collaboration').renderViewComments(this.showComments, this.indexCurrentComment); + var appPrefix = !!window.DE ? DE : !!window.PE ? PE : SSE; + appPrefix.getController('Common.Controllers.Collaboration').getView('Common.Views.Collaboration').renderViewComments(this.showComments, this.indexCurrentComment); $('.comment-menu').single('click', _.bind(this.initMenuComments, this)); $('.reply-menu').single('click', _.bind(this.initReplyMenu, this)); $('.comment-resolve').single('click', _.bind(this.onClickResolveComment, this, false)); @@ -963,7 +964,7 @@ define([ this.indexCurrentComment -= 1; } var me = this; - DE.getController('Common.Controllers.Collaboration').getView('Common.Views.Collaboration').renderViewComments(me.showComments, me.indexCurrentComment); + me.getView('Common.Views.Collaboration').renderViewComments(me.showComments, me.indexCurrentComment); _.defer(function () { $('.comment-menu').single('click', _.bind(me.initMenuComments, me)); $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); @@ -980,7 +981,7 @@ define([ this.indexCurrentComment += 1; } var me = this; - DE.getController('Common.Controllers.Collaboration').getView('Common.Views.Collaboration').renderViewComments(me.showComments, me.indexCurrentComment); + me.getView('Common.Views.Collaboration').renderViewComments(me.showComments, me.indexCurrentComment); _.defer(function () { $('.comment-menu').single('click', _.bind(me.initMenuComments, me)); $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); diff --git a/apps/presentationeditor/mobile/app-dev.js b/apps/presentationeditor/mobile/app-dev.js index 931f572a8..552212b59 100644 --- a/apps/presentationeditor/mobile/app-dev.js +++ b/apps/presentationeditor/mobile/app-dev.js @@ -150,6 +150,7 @@ require([ 'AddImage', 'AddLink', 'AddSlide', + 'AddOther', 'Common.Controllers.Collaboration' ] }); @@ -218,6 +219,7 @@ require([ 'presentationeditor/mobile/app/controller/add/AddImage', 'presentationeditor/mobile/app/controller/add/AddLink', 'presentationeditor/mobile/app/controller/add/AddSlide', + 'presentationeditor/mobile/app/controller/add/AddOther', 'common/mobile/lib/controller/Collaboration' ], function() { diff --git a/apps/presentationeditor/mobile/app.js b/apps/presentationeditor/mobile/app.js index abcec73a8..39ff0d4ef 100644 --- a/apps/presentationeditor/mobile/app.js +++ b/apps/presentationeditor/mobile/app.js @@ -160,6 +160,7 @@ require([ 'AddImage', 'AddLink', 'AddSlide', + 'AddOther', 'Common.Controllers.Collaboration' ] }); @@ -228,6 +229,7 @@ require([ 'presentationeditor/mobile/app/controller/add/AddImage', 'presentationeditor/mobile/app/controller/add/AddLink', 'presentationeditor/mobile/app/controller/add/AddSlide', + 'presentationeditor/mobile/app/controller/add/AddOther', 'common/mobile/lib/controller/Collaboration' ], function() { app.start(); diff --git a/apps/presentationeditor/mobile/app/controller/DocumentHolder.js b/apps/presentationeditor/mobile/app/controller/DocumentHolder.js index 9f629e27d..b43aa613e 100644 --- a/apps/presentationeditor/mobile/app/controller/DocumentHolder.js +++ b/apps/presentationeditor/mobile/app/controller/DocumentHolder.js @@ -56,7 +56,9 @@ define([ _view, _actionSheets = [], _isEdit = false, - _isPopMenuHidden = false; + _isPopMenuHidden = false, + _isComments = false, + _canViewComments = true; return { models: [], @@ -83,10 +85,21 @@ define([ me.api.asc_registerCallback('asc_onDocumentContentReady', _.bind(me.onApiDocumentContentReady, me)); Common.NotificationCenter.on('api:disconnect', _.bind(me.onCoAuthoringDisconnect, me)); me.api.asc_registerCallback('asc_onCoAuthoringDisconnect', _.bind(me.onCoAuthoringDisconnect,me)); + me.api.asc_registerCallback('asc_onShowComment', _.bind(me.onApiShowComment, me)); + me.api.asc_registerCallback('asc_onHideComment', _.bind(me.onApiHideComment, me)); + }, + + onApiShowComment: function(comments) { + _isComments = comments && comments.length>0; + }, + + onApiHideComment: function() { + _isComments = false; }, setMode: function (mode) { _isEdit = mode.isEdit; + _canViewComments = mode.canViewComments; }, // When our application is ready, lets get started @@ -152,6 +165,13 @@ define([ return true; } }); + } else if ('viewcomment' == eventName) { + var getCollaboration = PE.getController('Common.Controllers.Collaboration'); + getCollaboration.showCommentModal(); + } else if ('addcomment' == eventName) { + _view.hideMenu(); + PE.getController('AddContainer').showModal(); + PE.getController('AddOther').getView('AddOther').showPageComment(false); } else if ('showActionSheet' == eventName && _actionSheets.length > 0) { _.delay(function () { _.each(_actionSheets, function (action) { @@ -268,6 +288,12 @@ define([ icon: 'icon-copy' }); } + if (_canViewComments && _isComments && !_isEdit) { + arrItems.push({ + caption: me.menuViewComment, + event: 'viewcomment' + }); + } if (stack.length > 0) { var topObject = stack[stack.length - 1], @@ -316,6 +342,20 @@ define([ event: 'addlink' }); } + + if (_isComments && _canViewComments) { + arrItems.push({ + caption: me.menuViewComment, + event: 'viewcomment' + }); + } + + if (_canViewComments) { + arrItems.push({ + caption: me.menuAddComment, + event: 'addcomment' + }); + } } } @@ -353,6 +393,8 @@ define([ menuAddLink: 'Add Link', menuOpenLink: 'Open Link', menuMore: 'More', + menuViewComment: 'View Comment', + menuAddComment: 'Add Comment', sheetCancel: 'Cancel', textCopyCutPasteActions: 'Copy, Cut and Paste Actions', errorCopyCutPaste: 'Copy, cut and paste actions using the context menu will be performed within the current file only. You cannot copy or paste to or from other applications.' diff --git a/apps/presentationeditor/mobile/app/controller/Main.js b/apps/presentationeditor/mobile/app/controller/Main.js index 303d3a172..7d8dd1958 100644 --- a/apps/presentationeditor/mobile/app/controller/Main.js +++ b/apps/presentationeditor/mobile/app/controller/Main.js @@ -698,7 +698,10 @@ define([ me.appOptions.canHistoryClose = me.editorConfig.canHistoryClose; me.appOptions.canUseMailMerge = me.appOptions.canLicense && me.appOptions.canEdit && !me.appOptions.isDesktopApp; me.appOptions.canSendEmailAddresses = me.appOptions.canLicense && me.editorConfig.canSendEmailAddresses && me.appOptions.canEdit && me.appOptions.canCoAuthoring; - me.appOptions.canComments = me.appOptions.canLicense && !((typeof (me.editorConfig.customization) == 'object') && me.editorConfig.customization.comments===false); + me.appOptions.canComments = me.appOptions.canLicense && (me.permissions.comment===undefined ? me.appOptions.isEdit : me.permissions.comment) && (me.editorConfig.mode !== 'view'); + me.appOptions.canComments = me.appOptions.canComments && !((typeof (me.editorConfig.customization) == 'object') && me.editorConfig.customization.comments===false); + me.appOptions.canViewComments = me.appOptions.canComments || !((typeof (me.editorConfig.customization) == 'object') && me.editorConfig.customization.comments===false); + me.appOptions.canEditComments = me.appOptions.isOffline || !(typeof (me.editorConfig.customization) == 'object' && me.editorConfig.customization.commentAuthorOnly); me.appOptions.canChat = me.appOptions.canLicense && !me.appOptions.isOffline && !((typeof (me.editorConfig.customization) == 'object') && me.editorConfig.customization.chat===false); me.appOptions.canEditStyles = me.appOptions.canLicense && me.appOptions.canEdit; me.appOptions.canPrint = (me.permissions.print !== false); diff --git a/apps/presentationeditor/mobile/app/controller/add/AddContainer.js b/apps/presentationeditor/mobile/app/controller/add/AddContainer.js index 4a38ed5ad..95fe5aea1 100644 --- a/apps/presentationeditor/mobile/app/controller/add/AddContainer.js +++ b/apps/presentationeditor/mobile/app/controller/add/AddContainer.js @@ -134,6 +134,14 @@ define([ .rootLayout() }); + addViews.push({ + caption: me.textOther, + id: 'add-other', + layout: PE.getController('AddOther') + .getView('AddOther') + .rootLayout() + }); + return addViews; }, @@ -287,7 +295,8 @@ define([ textTable: 'Table', textShape: 'Shape', textImage: 'Image', - textLink: 'Link' + textLink: 'Link', + textOther: 'Other' } })(), PE.Controllers.AddContainer || {})) }); \ No newline at end of file diff --git a/apps/presentationeditor/mobile/app/controller/add/AddOther.js b/apps/presentationeditor/mobile/app/controller/add/AddOther.js new file mode 100644 index 000000000..2a41e9423 --- /dev/null +++ b/apps/presentationeditor/mobile/app/controller/add/AddOther.js @@ -0,0 +1,142 @@ +/* + * + * (c) Copyright Ascensio System SIA 2010-2019 + * + * This program is a free software product. You can redistribute it and/or + * modify it under the terms of the GNU Affero General Public License (AGPL) + * version 3 as published by the Free Software Foundation. In accordance with + * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect + * that Ascensio System SIA expressly excludes the warranty of non-infringement + * of any third-party rights. + * + * This program is distributed WITHOUT ANY WARRANTY; without even the implied + * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. For + * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html + * + * You can contact Ascensio System SIA at 20A-12 Ernesta Birznieka-Upisha + * street, Riga, Latvia, EU, LV-1050. + * + * The interactive user interfaces in modified source and object code versions + * of the Program must display Appropriate Legal Notices, as required under + * Section 5 of the GNU AGPL version 3. + * + * Pursuant to Section 7(b) of the License you must retain the original Product + * logo when distributing the program. Pursuant to Section 7(e) we decline to + * grant you any rights under trademark law for use of our trademarks. + * + * All the Product's GUI elements, including illustrations and icon sets, as + * well as technical writing content are licensed under the terms of the + * Creative Commons Attribution-ShareAlike 4.0 International. See the License + * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode + * + */ +/** + * AddOther.js + * Presentation Editor + * + * Created by Julia Svinareva on 10/04/20 + * Copyright (c) 2020 Ascensio System SIA. All rights reserved. + * + */ + +define([ + 'core', + 'presentationeditor/mobile/app/view/add/AddOther', + 'jquery', + 'underscore', + 'backbone' +], function (core, view, $, _, Backbone) { + 'use strict'; + + PE.Controllers.AddOther = Backbone.Controller.extend(_.extend((function() { + + return { + models: [], + collections: [], + views: [ + 'AddOther' + ], + + initialize: function () { + Common.NotificationCenter.on('addcontainer:show', _.bind(this.initEvents, this)); + + this.addListeners({ + 'AddOther': { + 'page:show' : this.onPageShow + } + }); + }, + + setApi: function (api) { + var me = this; + me.api = api; + }, + + setMode: function (mode) { + this.view = this.getView('AddOther'); + this.view.canViewComments = mode.canViewComments; + }, + + onLaunch: function () { + this.createView('AddOther').render(); + }, + + initEvents: function () { + var me = this; + + }, + + onPageShow: function (view, pageId) { + var me = this; + + $('.page[data-page=addother-comment] li a').single('click', _.buffered(me.onInsertComment, 100, me)); + + if (pageId == '#addother-insert-comment') { + me.initInsertComment(); + } + }, + + // Handlers + initInsertComment: function () { + var comment = PE.getController('Common.Controllers.Collaboration').getCommentInfo(); + if (comment) { + this.getView('AddOther').renderComment(comment); + $('#done-comment').single('click', _.bind(this.onDoneComment, this)); + $('.back-from-add-comment').single('click', _.bind(function () { + if ($('#comment-text').val().length > 0) { + uiApp.modal({ + title: '', + text: this.textDeleteDraft, + buttons: [ + { + text: this.textCancel + }, + { + text: this.textContinue, + onClick: function () { + PE.getController('AddContainer').rootView.router.back(); + } + }] + }) + } else { + PE.getController('AddContainer').rootView.router.back(); + } + }, this)) + } + }, + + onDoneComment: function() { + var value = $('#comment-text').val(); + if (value.length > 0) { + PE.getController('Common.Controllers.Collaboration').onAddNewComment(value); + PE.getController('AddContainer').hideModal(); + } + }, + + textDeleteDraft: 'Delete draft?', + textCancel: 'Cancel', + textContinue: 'Continue' + + } + })(), PE.Controllers.AddOther || {})) +}); \ No newline at end of file diff --git a/apps/presentationeditor/mobile/app/template/AddOther.template b/apps/presentationeditor/mobile/app/template/AddOther.template new file mode 100644 index 000000000..6b894f93e --- /dev/null +++ b/apps/presentationeditor/mobile/app/template/AddOther.template @@ -0,0 +1,37 @@ + + + + + \ No newline at end of file diff --git a/apps/presentationeditor/mobile/app/view/add/AddOther.js b/apps/presentationeditor/mobile/app/view/add/AddOther.js new file mode 100644 index 000000000..82e94a6ad --- /dev/null +++ b/apps/presentationeditor/mobile/app/view/add/AddOther.js @@ -0,0 +1,154 @@ +/* + * + * (c) Copyright Ascensio System SIA 2010-2019 + * + * This program is a free software product. You can redistribute it and/or + * modify it under the terms of the GNU Affero General Public License (AGPL) + * version 3 as published by the Free Software Foundation. In accordance with + * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect + * that Ascensio System SIA expressly excludes the warranty of non-infringement + * of any third-party rights. + * + * This program is distributed WITHOUT ANY WARRANTY; without even the implied + * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. For + * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html + * + * You can contact Ascensio System SIA at 20A-12 Ernesta Birznieka-Upisha + * street, Riga, Latvia, EU, LV-1050. + * + * The interactive user interfaces in modified source and object code versions + * of the Program must display Appropriate Legal Notices, as required under + * Section 5 of the GNU AGPL version 3. + * + * Pursuant to Section 7(b) of the License you must retain the original Product + * logo when distributing the program. Pursuant to Section 7(e) we decline to + * grant you any rights under trademark law for use of our trademarks. + * + * All the Product's GUI elements, including illustrations and icon sets, as + * well as technical writing content are licensed under the terms of the + * Creative Commons Attribution-ShareAlike 4.0 International. See the License + * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode + * + */ + +/** + * AddOther.js + * Presentation Editor + * + * Created by Julia Svinareva on 10/04/20 + * Copyright (c) 2020 Ascensio System SIA. All rights reserved. + * + */ + +define([ + 'text!presentationeditor/mobile/app/template/AddOther.template', + 'jquery', + 'underscore', + 'backbone' +], function (addTemplate, $, _, Backbone) { + 'use strict'; + + PE.Views.AddOther = Backbone.View.extend(_.extend((function() { + // private + + return { + // el: '.view-main', + + template: _.template(addTemplate), + + events: { + }, + + initialize: function () { + Common.NotificationCenter.on('addcontainer:show', _.bind(this.initEvents, this)); + }, + + initEvents: function () { + var me = this; + + $('#add-other-comment').single('click', _.bind(me.showPageComment, me)); + + me.initControls(); + }, + + // Render layout + render: function () { + this.layout = $('
      ').append(this.template({ + android : Common.SharedSettings.get('android'), + phone : Common.SharedSettings.get('phone'), + scope : this + })); + + return this; + }, + + rootLayout: function () { + if (this.layout) { + if (!this.canViewComments) { + this.layout.find('#addother-root-view #item-comment').remove(); + } + return this.layout + .find('#addother-root-view') + .html(); + } + + return ''; + }, + + initControls: function () { + // + }, + + showPage: function (templateId, animate) { + var rootView = PE.getController('AddContainer').rootView; + + if (rootView && this.layout) { + var $content = this.layout.find(templateId); + + // Android fix for navigation + if (Framework7.prototype.device.android) { + $content.find('.page').append($content.find('.navbar')); + } + + rootView.router.load({ + content: $content.html(), + animatePages: animate !== false + }); + + this.fireEvent('page:show', [this, templateId]); + } + }, + + showPageComment: function(animate) { + this.showPage('#addother-insert-comment', animate); + }, + + renderComment: function(comment) { + _.delay(function () { + var $commentInfo = $('#comment-info'); + var template = [ + '<% if (android) { %>
      <%= comment.userInitials %>
      <% } %>', + '
      <%= comment.username %>
      ', + '
      <%= comment.date %>
      ', + '<% if (android) { %>
      <% } %>', + '
      ' + ].join(''); + var insert = _.template(template)({ + android: Framework7.prototype.device.android, + comment: comment + }); + $commentInfo.html(insert); + _.defer(function () { + var $textarea = $('.comment-textarea')[0]; + $textarea.focus(); + }); + }, 100); + }, + + textComment: 'Comment', + textAddComment: 'Add Comment', + textDone: 'Done' + + } + })(), PE.Views.AddOther || {})) +}); \ No newline at end of file diff --git a/apps/presentationeditor/mobile/resources/css/app-ios.css b/apps/presentationeditor/mobile/resources/css/app-ios.css index 7b7a308b7..fd9fef61d 100644 --- a/apps/presentationeditor/mobile/resources/css/app-ios.css +++ b/apps/presentationeditor/mobile/resources/css/app-ios.css @@ -7220,12 +7220,14 @@ i.icon.icon-in-indent { background-color: #aa5252; -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%23aa5252%22%3E%3Cg%3E%3Cpath%20d%3D%22M1%2C20v-1h21v1H1z%20M12%2C16H1v-1h11V16z%20M12%2C12H1v-1h11V12z%20M12%2C8H1V7h11V8z%20M21%2C11.2l0.2%2C0.3L21%2C11.8L16.7%2C16L16%2C15.3l3.8-3.8L16%2C7.7L16.7%2C7L21%2C11.2z%20M22%2C4H1V3h21V4z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); } -i.icon.icon-prev { +i.icon.icon-prev, +i.icon.icon-prev-comment { width: 22px; height: 22px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%23aa5252%22%3E%3Cg%3E%3Cpath%20d%3D%22M16%2C20.5L15%2C21.5L4.5%2C11l0%2C0l0%2C0L15%2C0.5L16%2C1.5L6.6%2C11L16%2C20.5z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); } -i.icon.icon-next { +i.icon.icon-next, +i.icon.icon-next-comment { width: 22px; height: 22px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%23aa5252%22%3E%3Cg%3E%3Cpath%20d%3D%22M15.5%2C11L6%2C1.5l1.1-1.1L17.5%2C11l0%2C0l0%2C0L7.1%2C21.5L6%2C20.5L15.5%2C11z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); @@ -7478,6 +7480,26 @@ i.icon.icon-paste { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%202H0V20H9V24H24V7H19V2H14V3H18V7H9V19H1V3H5V2ZM10%208H23V23H10V8Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M5%200H14V5H5V0Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2012H12V11H21V12Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2016H12V15H21V16Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2020H12V19H21V20Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); } +i.icon.icon-menu-comment { + width: 30px; + height: 30px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2030%2030%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M10%2015C10%2016.6569%208.65685%2018%207%2018C5.34315%2018%204%2016.6569%204%2015C4%2013.3431%205.34315%2012%207%2012C8.65685%2012%2010%2013.3431%2010%2015ZM7%2016.7143C7.94677%2016.7143%208.71429%2015.9468%208.71429%2015C8.71429%2014.0532%207.94677%2013.2857%207%2013.2857C6.05323%2013.2857%205.28571%2014.0532%205.28571%2015C5.28571%2015.9468%206.05323%2016.7143%207%2016.7143Z%22%20fill%3D%22%23A3A3A3%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M18%2015C18%2016.6569%2016.6569%2018%2015%2018C13.3431%2018%2012%2016.6569%2012%2015C12%2013.3431%2013.3431%2012%2015%2012C16.6569%2012%2018%2013.3431%2018%2015ZM15%2016.7143C15.9468%2016.7143%2016.7143%2015.9468%2016.7143%2015C16.7143%2014.0532%2015.9468%2013.2857%2015%2013.2857C14.0532%2013.2857%2013.2857%2014.0532%2013.2857%2015C13.2857%2015.9468%2014.0532%2016.7143%2015%2016.7143Z%22%20fill%3D%22%23A3A3A3%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M26%2015C26%2016.6569%2024.6569%2018%2023%2018C21.3431%2018%2020%2016.6569%2020%2015C20%2013.3431%2021.3431%2012%2023%2012C24.6569%2012%2026%2013.3431%2026%2015ZM23%2016.7143C23.9468%2016.7143%2024.7143%2015.9468%2024.7143%2015C24.7143%2014.0532%2023.9468%2013.2857%2023%2013.2857C22.0532%2013.2857%2021.2857%2014.0532%2021.2857%2015C21.2857%2015.9468%2022.0532%2016.7143%2023%2016.7143Z%22%20fill%3D%22%23A3A3A3%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-resolve-comment { + width: 30px; + height: 30px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2030%2030%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M11.6195%2020.8555C11.8237%2021.0673%2012.1658%2021.0577%2012.358%2020.8349L22.516%209.05783C22.7843%208.74676%2022.7528%208.27781%2022.4453%208.00545C22.1315%207.72756%2021.651%207.7604%2021.3779%208.07839L12.3546%2018.587C12.1638%2018.8092%2011.8238%2018.8206%2011.6186%2018.6117L8.10643%2015.0366C7.81574%2014.7407%207.34084%2014.7345%207.04258%2015.0228C6.74283%2015.3125%206.73444%2015.7903%207.02383%2016.0904L11.6195%2020.8555Z%22%20fill%3D%22%23A3A3A3%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-resolve-comment.check { + width: 30px; + height: 30px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2030%2030%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M0%200H30V30H0V0Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M11.6195%2020.8555C11.8237%2021.0673%2012.1658%2021.0577%2012.358%2020.8349L22.516%209.05783C22.7843%208.74676%2022.7528%208.27781%2022.4453%208.00545V8.00545C22.1315%207.72756%2021.651%207.7604%2021.3779%208.07839L12.3546%2018.587C12.1638%2018.8092%2011.8238%2018.8206%2011.6186%2018.6117L8.10643%2015.0366C7.81575%2014.7407%207.34084%2014.7345%207.04258%2015.0228V15.0228C6.74283%2015.3125%206.73444%2015.7903%207.02383%2016.0904L11.6195%2020.8555Z%22%20fill%3D%22%234cd964%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-insert-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20.1538%209.00708H11.8462C10.8266%209.00708%2010%209.83461%2010%2010.8554V15.1694C10%2016.1902%2010.8266%2017.0177%2011.8462%2017.0177H13.8329C13.9409%2017.0177%2014.0454%2017.0556%2014.1284%2017.1248L18.243%2020.392C18.5436%2020.6428%2019%2020.4288%2019%2020.037V17.4798C19%2017.2246%2019.2066%2017.0177%2019.4615%2017.0177H20.1538C21.1734%2017.0177%2022%2016.1902%2022%2015.1694V10.8554C22%209.83461%2021.1734%209.00708%2020.1538%209.00708ZM20%2010.0083C20.5523%2010.0083%2021%2010.4565%2021%2011.0095V15.0154C21%2015.5683%2020.5523%2016.0165%2020%2016.0165H18.0025L18%2018.8995C18%2019.2912%2018%2019%2018%2019L14.5%2016.0165H12C11.4477%2016.0165%2011%2015.5683%2011%2015.0154V11.0095C11%2010.4565%2011.4477%2010.0083%2012%2010.0083H20Z%22%20fill%3D%22%23aa5252%22%2F%3E%3Cpath%20d%3D%22M14.5%203H4.5C3.18908%203%202%204.2153%202%205.50295V12.0346C2%2013.3222%203.18908%2014.013%204.5%2014.013H5.5C5.82773%2014.013%206%2014.1917%206%2014.5136V17.5183C6%2018.0125%206.6135%2018.3352%207%2018.0189L11%2014.9858V13.5L7%2016.5V13.0118H4.5C3.78992%2013.0118%203%2012.732%203%2012.0346V5.50295C3%204.80547%203.78992%204.00118%204.5%204.00118H14.5C15.2101%204.00118%2016%204.80547%2016%205.50295V8.0059H17V5.50295C17%204.2153%2015.8109%203%2014.5%203Z%22%20fill%3D%22%23aa5252%22%2F%3E%3C%2Fsvg%3E"); +} .label-switch input[type="checkbox"]:checked + .checkbox { background: #aa5252; } diff --git a/apps/presentationeditor/mobile/resources/css/app-material.css b/apps/presentationeditor/mobile/resources/css/app-material.css index dc5561f6e..d5be5c3ff 100644 --- a/apps/presentationeditor/mobile/resources/css/app-material.css +++ b/apps/presentationeditor/mobile/resources/css/app-material.css @@ -7091,6 +7091,51 @@ i.icon.icon-paste { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%202H0V20H9V24H24V7H19V2H14V3H18V7H9V19H1V3H5V2ZM10%208H23V23H10V8Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20d%3D%22M5%200H14V5H5V0Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2012H12V11H21V12Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2016H12V15H21V16Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2020H12V19H21V20Z%22%20fill%3D%22black%22%2F%3E%3C%2Fsvg%3E"); } +i.icon.icon-menu-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M16.6047%2016.5848C17.0078%2016.1793%2017.4729%2015.9766%2018%2015.9766C18.5271%2015.9766%2018.9922%2016.1793%2019.3953%2016.5848C19.7984%2016.9903%2020%2017.4581%2020%2017.9883C20%2018.5185%2019.7984%2018.9864%2019.3953%2019.3918C18.9922%2019.7973%2018.5271%2020%2018%2020C17.4729%2020%2017.0078%2019.7973%2016.6047%2019.3918C16.2016%2018.9864%2016%2018.5185%2016%2017.9883C16%2017.4581%2016.2016%2016.9903%2016.6047%2016.5848ZM16.6047%2010.5965C17.0078%2010.191%2017.4729%209.9883%2018%209.9883C18.5271%209.9883%2018.9922%2010.191%2019.3953%2010.5965C19.7984%2011.0019%2020%2011.4698%2020%2012C20%2012.5302%2019.7984%2012.9981%2019.3953%2013.4035C18.9922%2013.809%2018.5271%2014.0117%2018%2014.0117C17.4729%2014.0117%2017.0078%2013.809%2016.6047%2013.4035C16.2016%2012.9981%2016%2012.5302%2016%2012C16%2011.4698%2016.2016%2011.0019%2016.6047%2010.5965ZM19.3953%207.4152C18.9922%207.82066%2018.5271%208.02339%2018%208.02339C17.4729%208.02339%2017.0078%207.82066%2016.6047%207.4152C16.2016%207.00975%2016%206.54191%2016%206.0117C16%205.48148%2016.2016%205.01365%2016.6047%204.60819C17.0078%204.20273%2017.4729%204%2018%204C18.5271%204%2018.9922%204.20273%2019.3953%204.60819C19.7984%205.01365%2020%205.48148%2020%206.0117C20%206.54191%2019.7984%207.00975%2019.3953%207.4152Z%22%20fill%3D%22black%22%20fill-opacity%3D%220.6%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-resolve-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9%2016.1719L19.5938%205.57812L21%206.98438L9%2018.9844L3.42188%2013.4062L4.82812%2012L9%2016.1719Z%22%20fill%3D%22black%22%20fill-opacity%3D%220.6%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-resolve-comment.check { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9%2016.1719L19.5938%205.57812L21%206.98438L9%2018.9844L3.42188%2013.4062L4.82812%2012L9%2016.1719Z%22%20fill%3D%22%2340865C%22%20fill-opacity%3D%220.6%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-prev-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M15.4219%207.40625L10.8281%2012L15.4219%2016.5938L14.0156%2018L8.01562%2012L14.0156%206L15.4219%207.40625Z%22%20fill%3D%22%23aa5252%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-next-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9.98438%206L15.9844%2012L9.98438%2018L8.57812%2016.5938L13.1719%2012L8.57812%207.40625L9.98438%206Z%22%20fill%3D%22%23aa5252%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-close-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18.9844%206.42188L13.4062%2012L18.9844%2017.5781L17.5781%2018.9844L12%2013.4062L6.42188%2018.9844L5.01562%2017.5781L10.5938%2012L5.01562%206.42188L6.42188%205.01562L12%2010.5938L17.5781%205.01562L18.9844%206.42188Z%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%200.6)%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-done-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9%2016.1719L19.5938%205.57812L21%206.98438L9%2018.9844L3.42188%2013.4062L4.82812%2012L9%2016.1719Z%22%20fill%3D%22%23aa5252%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-insert-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20.1538%209.00708H11.8462C10.8266%209.00708%2010%209.83461%2010%2010.8554V15.1694C10%2016.1902%2010.8266%2017.0177%2011.8462%2017.0177H13.8329C13.9409%2017.0177%2014.0454%2017.0556%2014.1284%2017.1248L18.243%2020.392C18.5436%2020.6428%2019%2020.4288%2019%2020.037V17.4798C19%2017.2246%2019.2066%2017.0177%2019.4615%2017.0177H20.1538C21.1734%2017.0177%2022%2016.1902%2022%2015.1694V10.8554C22%209.83461%2021.1734%209.00708%2020.1538%209.00708ZM20%2010.0083C20.5523%2010.0083%2021%2010.4565%2021%2011.0095V15.0154C21%2015.5683%2020.5523%2016.0165%2020%2016.0165H18.0025L18%2018.8995C18%2019.2912%2018%2019%2018%2019L14.5%2016.0165H12C11.4477%2016.0165%2011%2015.5683%2011%2015.0154V11.0095C11%2010.4565%2011.4477%2010.0083%2012%2010.0083H20Z%22%20fill%3D%22%23aa5252%22%2F%3E%3Cpath%20d%3D%22M14.5%203H4.5C3.18908%203%202%204.2153%202%205.50295V12.0346C2%2013.3222%203.18908%2014.013%204.5%2014.013H5.5C5.82773%2014.013%206%2014.1917%206%2014.5136V17.5183C6%2018.0125%206.6135%2018.3352%207%2018.0189L11%2014.9858V13.5L7%2016.5V13.0118H4.5C3.78992%2013.0118%203%2012.732%203%2012.0346V5.50295C3%204.80547%203.78992%204.00118%204.5%204.00118H14.5C15.2101%204.00118%2016%204.80547%2016%205.50295V8.0059H17V5.50295C17%204.2153%2015.8109%203%2014.5%203Z%22%20fill%3D%22%23aa5252%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-done-comment-white { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9%2016.1719L19.5938%205.57812L21%206.98438L9%2018.9844L3.42188%2013.4062L4.82812%2012L9%2016.1719Z%22%20fill%3D%22%23FFFFFF%22%2F%3E%3C%2Fsvg%3E"); +} .navbar i.icon.icon-logo { width: 100px; height: 14px; diff --git a/apps/presentationeditor/mobile/resources/less/ios/_icons.less b/apps/presentationeditor/mobile/resources/less/ios/_icons.less index 82bca371a..719330b78 100644 --- a/apps/presentationeditor/mobile/resources/less/ios/_icons.less +++ b/apps/presentationeditor/mobile/resources/less/ios/_icons.less @@ -155,12 +155,12 @@ i.icon { height: 22px; .encoded-svg-mask(''); } - &.icon-prev { + &.icon-prev, &.icon-prev-comment { width: 22px; height: 22px; .encoded-svg-background(''); } - &.icon-next { + &.icon-next, &.icon-next-comment { width: 22px; height: 22px; .encoded-svg-background(''); @@ -430,4 +430,25 @@ i.icon { height: 24px; .encoded-svg-background(''); } + //comments + &.icon-menu-comment { + width: 30px; + height: 30px; + .encoded-svg-background(''); + } + &.icon-resolve-comment { + width: 30px; + height: 30px; + .encoded-svg-background(''); + } + &.icon-resolve-comment.check { + width: 30px; + height: 30px; + .encoded-svg-background(''); + } + &.icon-insert-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } } \ No newline at end of file diff --git a/apps/presentationeditor/mobile/resources/less/material/_icons.less b/apps/presentationeditor/mobile/resources/less/material/_icons.less index bc7d5e766..b8dcb4460 100644 --- a/apps/presentationeditor/mobile/resources/less/material/_icons.less +++ b/apps/presentationeditor/mobile/resources/less/material/_icons.less @@ -395,6 +395,52 @@ i.icon { height: 24px; .encoded-svg-background(''); } + //Comments + &.icon-menu-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-resolve-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-resolve-comment.check { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-prev-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-next-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-close-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-done-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-insert-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-done-comment-white { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } } // Overwrite color for toolbar From 4d5f9edae8fa94bb9c0da404c20c96e056af6020 Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Tue, 14 Apr 2020 19:28:37 +0300 Subject: [PATCH 16/23] [SSE mobile] Comments (add: add/edit/delete comments, add/edit/delete reply) --- .../mobile/lib/controller/Collaboration.js | 57 ++++++++++---- .../mobile/app/controller/add/AddOther.js | 10 +-- .../mobile/app/controller/add/AddOther.js | 10 +-- .../mobile/app/controller/DocumentHolder.js | 45 ++++++++++- .../mobile/app/controller/Main.js | 5 +- .../mobile/app/controller/add/AddOther.js | 54 ++++++++++++- .../mobile/app/template/AddOther.template | 23 ++++++ .../mobile/app/view/add/AddOther.js | 78 +++++++++++++++++-- .../mobile/resources/css/app-ios.css | 39 +++++++++- .../mobile/resources/css/app-material.css | 58 ++++++++++++++ .../mobile/resources/less/app-ios.less | 13 ++++ .../mobile/resources/less/app-material.less | 13 ++++ .../mobile/resources/less/ios/_icons.less | 25 +++++- .../resources/less/material/_icons.less | 46 +++++++++++ 14 files changed, 439 insertions(+), 37 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index 71e42bbd4..14c527755 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -768,6 +768,9 @@ define([ me.indexCurrentComment = 0; me.updateViewComment(); } + if (window.SSE) { + SSE.getController('AddOther').sedHideAddComment(true); + } }, apiHideComments: function() { @@ -775,6 +778,9 @@ define([ uiApp.closeModal(); $('.container-view-comment').remove(); } + if (window.SSE) { + SSE.getController('AddOther').sedHideAddComment(false); + } }, disabledViewComments: function(disabled) { @@ -923,15 +929,33 @@ define([ newHeight = '100%'; me.swipeFull = true; me.closeCommentPicker = false; - $('.container-view-comment').css('opacity', '1'); + if (window.SSE) { + if ($('.container-view-comment').hasClass('onHide')) { + $('.container-view-comment').removeClass('onHide'); + } + } else { + $('.container-view-comment').css('opacity', '1'); + } } else if (dist < 100) { newHeight = '50%'; me.swipeFull = false; me.closeCommentPicker = false; - $('.container-view-comment').css('opacity', '1'); + if (window.SSE) { + if ($('.container-view-comment').hasClass('onHide')) { + $('.container-view-comment').removeClass('onHide'); + } + } else { + $('.container-view-comment').css('opacity', '1'); + } } else { me.closeCommentPicker = true; - $('.container-view-comment').css('opacity', '0.6'); + if (window.SSE) { + if (!$('.container-view-comment').hasClass('onHide')) { + $('.container-view-comment').addClass('onHide'); + } + } else { + $('.container-view-comment').css('opacity', '0.6'); + } } $('.container-view-comment').css('height', newHeight); me.swipeHeight = newHeight; @@ -1093,7 +1117,7 @@ define([ reply = null, addReply = null, ascComment = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)), - comment = _.findWhere(this.collectionComments, {uid: id}); + comment = this.findComment(id); if (ascComment && comment) { @@ -1144,7 +1168,7 @@ define([ } }, - onAddNewComment: function(value) { + onAddNewComment: function(value, documentFlag) { var comment; if (typeof Asc.asc_CCommentDataWord !== 'undefined') { comment = new Asc.asc_CCommentDataWord(null); @@ -1163,12 +1187,15 @@ define([ comment.asc_putSolved(false); if (!_.isUndefined(comment.asc_putDocumentFlag)) - comment.asc_putDocumentFlag(false); + comment.asc_putDocumentFlag(documentFlag); this.api.asc_addComment(comment); uiApp.closeModal(); + + return true; } + return false; }, initMenuComments: function(e) { @@ -1878,8 +1905,9 @@ define([ findCommentInGroup: function (id) { for (var name in this.groupCollectionComments) { - var store = this.groupCollectionComments[name], - model = _.findWhere(store, {uid: id}); + var store = this.groupCollectionComments[name]; + var id = _.isArray(id) ? id[0] : id; + var model = _.findWhere(store, {uid: id}); if (model) return model; } }, @@ -1893,7 +1921,12 @@ define([ } } } - if (this.groupCollectionComments.length > 0) { + if (this.collectionComments.length > 0) { + var comment = _.findWhere(this.collectionComments, {uid: id}); + if (comment) { + remove(this.collectionComments, comment); + } + } else { for (var name in this.groupCollectionComments) { var store = this.groupCollectionComments[name], comment = _.findWhere(store, {uid: id}); @@ -1905,12 +1938,6 @@ define([ } } } - if (this.collectionComments.length > 0) { - var comment = _.findWhere(this.collectionComments, {uid: id}); - if (comment) { - remove(this.collectionComments, comment); - } - } if(!silentUpdate && $('.page-comments').length > 0) { this.initComments(); } diff --git a/apps/documenteditor/mobile/app/controller/add/AddOther.js b/apps/documenteditor/mobile/app/controller/add/AddOther.js index a137cd1bd..742ddc793 100644 --- a/apps/documenteditor/mobile/app/controller/add/AddOther.js +++ b/apps/documenteditor/mobile/app/controller/add/AddOther.js @@ -114,16 +114,16 @@ define([ } else if (pageId == '#addother-insert-footnote') { me.initInsertFootnote(); } else if (pageId === "#addother-insert-comment") { - me.initInsertComment(); + me.initInsertComment(false); } }, // Handlers - initInsertComment: function () { + initInsertComment: function (documentFlag) { var comment = DE.getController('Common.Controllers.Collaboration').getCommentInfo(); if (comment) { this.getView('AddOther').renderComment(comment); - $('#done-comment').single('click', _.bind(this.onDoneComment, this)); + $('#done-comment').single('click', _.bind(this.onDoneComment, this, documentFlag)); $('.back-from-add-comment').single('click', _.bind(function () { if ($('#comment-text').val().length > 0) { uiApp.modal({ @@ -147,10 +147,10 @@ define([ } }, - onDoneComment: function() { + onDoneComment: function(documentFlag) { var value = $('#comment-text').val(); if (value.length > 0) { - DE.getController('Common.Controllers.Collaboration').onAddNewComment(value); + DE.getController('Common.Controllers.Collaboration').onAddNewComment(value, documentFlag); DE.getController('AddContainer').hideModal(); } }, diff --git a/apps/presentationeditor/mobile/app/controller/add/AddOther.js b/apps/presentationeditor/mobile/app/controller/add/AddOther.js index 2a41e9423..dcbf08121 100644 --- a/apps/presentationeditor/mobile/app/controller/add/AddOther.js +++ b/apps/presentationeditor/mobile/app/controller/add/AddOther.js @@ -92,16 +92,16 @@ define([ $('.page[data-page=addother-comment] li a').single('click', _.buffered(me.onInsertComment, 100, me)); if (pageId == '#addother-insert-comment') { - me.initInsertComment(); + me.initInsertComment(false); } }, // Handlers - initInsertComment: function () { + initInsertComment: function (documentFlag) { var comment = PE.getController('Common.Controllers.Collaboration').getCommentInfo(); if (comment) { this.getView('AddOther').renderComment(comment); - $('#done-comment').single('click', _.bind(this.onDoneComment, this)); + $('#done-comment').single('click', _.bind(this.onDoneComment, this, documentFlag)); $('.back-from-add-comment').single('click', _.bind(function () { if ($('#comment-text').val().length > 0) { uiApp.modal({ @@ -125,10 +125,10 @@ define([ } }, - onDoneComment: function() { + onDoneComment: function(documentFlag) { var value = $('#comment-text').val(); if (value.length > 0) { - PE.getController('Common.Controllers.Collaboration').onAddNewComment(value); + PE.getController('Common.Controllers.Collaboration').onAddNewComment(value, documentFlag); PE.getController('AddContainer').hideModal(); } }, diff --git a/apps/spreadsheeteditor/mobile/app/controller/DocumentHolder.js b/apps/spreadsheeteditor/mobile/app/controller/DocumentHolder.js index 50023d10f..2f51a7f37 100644 --- a/apps/spreadsheeteditor/mobile/app/controller/DocumentHolder.js +++ b/apps/spreadsheeteditor/mobile/app/controller/DocumentHolder.js @@ -52,7 +52,9 @@ define([ SSE.Controllers.DocumentHolder = Backbone.Controller.extend(_.extend((function() { // private var _actionSheets = [], - _isEdit = false; + _isEdit = false, + _canViewComments = true, + _isComments = false; function openLink(url) { var newDocumentPage = window.open(url, '_blank'); @@ -84,6 +86,16 @@ define([ this.api.asc_registerCallback('asc_onHidePopMenu', _.bind(this.onApiHidePopMenu, this)); Common.NotificationCenter.on('api:disconnect', _.bind(this.onCoAuthoringDisconnect, this)); this.api.asc_registerCallback('asc_onCoAuthoringDisconnect', _.bind(this.onCoAuthoringDisconnect,this)); + this.api.asc_registerCallback('asc_onShowComment', _.bind(this.onApiShowComment, this)); + this.api.asc_registerCallback('asc_onHideComment', _.bind(this.onApiHideComment, this)); + }, + + onApiShowComment: function(comments) { + _isComments = comments && comments.length>0; + }, + + onApiHideComment: function() { + _isComments = false; }, setMode: function (mode) { @@ -91,6 +103,7 @@ define([ if (_isEdit) { this.api.asc_registerCallback('asc_onSetAFDialog', _.bind(this.onApiFilterOptions, this)); } + _canViewComments = mode.canViewComments; }, // When our application is ready, lets get started @@ -191,6 +204,14 @@ define([ case 'freezePanes': me.api.asc_freezePane(); break; + case 'viewcomment': + me.view.hideMenu(); + SSE.getController('Common.Controllers.Collaboration').showCommentModal(); + break; + case 'addcomment': + me.view.hideMenu(); + SSE.getController('AddContainer').showModal(); + SSE.getController('AddOther').getView('AddOther').showPageComment(false); } if ('showActionSheet' == event && _actionSheets.length > 0) { @@ -277,6 +298,12 @@ define([ event: 'openlink' }); } + if (_canViewComments && _isComments) { + arrItems.push({ + caption: me.menuViewComment, + event: 'viewcomment' + }); + } } else { if (!iscelllocked && (isimagemenu || isshapemenu || ischartmenu || istextshapemenu || istextchartmenu)) { @@ -382,6 +409,20 @@ define([ }); } + + if (_canViewComments) { + if (_isComments) { + arrItems.push({ + caption: me.menuViewComment, + event: 'viewcomment' + }); + } else { + arrItems.push({ + caption: me.menuAddComment, + event: 'addcomment' + }); + } + } } @@ -434,6 +475,8 @@ define([ sheetCancel: 'Cancel', menuFreezePanes: 'Freeze Panes', menuUnfreezePanes: 'Unfreeze Panes', + menuViewComment: 'View Comment', + menuAddComment: 'Add Comment', textCopyCutPasteActions: 'Copy, Cut and Paste Actions', errorCopyCutPaste: 'Copy, cut and paste actions using the context menu will be performed within the current file only. You cannot copy or paste to or from other applications.' } diff --git a/apps/spreadsheeteditor/mobile/app/controller/Main.js b/apps/spreadsheeteditor/mobile/app/controller/Main.js index dd7a3cb23..2f38c4a03 100644 --- a/apps/spreadsheeteditor/mobile/app/controller/Main.js +++ b/apps/spreadsheeteditor/mobile/app/controller/Main.js @@ -717,7 +717,10 @@ define([ /** coauthoring begin **/ me.appOptions.canCoAuthoring = !me.appOptions.isLightVersion; /** coauthoring end **/ - me.appOptions.canComments = me.appOptions.canLicense && !((typeof (me.editorConfig.customization) == 'object') && me.editorConfig.customization.comments===false); + me.appOptions.canComments = me.appOptions.canLicense && (me.permissions.comment===undefined ? me.appOptions.isEdit : me.permissions.comment) && (me.editorConfig.mode !== 'view'); + me.appOptions.canComments = me.appOptions.canComments && !((typeof (me.editorConfig.customization) == 'object') && me.editorConfig.customization.comments===false); + me.appOptions.canViewComments = me.appOptions.canComments || !((typeof (me.editorConfig.customization) == 'object') && me.editorConfig.customization.comments===false); + me.appOptions.canEditComments = me.appOptions.isOffline || !(typeof (me.editorConfig.customization) == 'object' && me.editorConfig.customization.commentAuthorOnly); me.appOptions.canChat = me.appOptions.canLicense && !me.appOptions.isOffline && !((typeof (me.editorConfig.customization) == 'object') && me.editorConfig.customization.chat===false); me.appOptions.canRename = !!me.permissions.rename; diff --git a/apps/spreadsheeteditor/mobile/app/controller/add/AddOther.js b/apps/spreadsheeteditor/mobile/app/controller/add/AddOther.js index 570fec38c..937cdcb9c 100644 --- a/apps/spreadsheeteditor/mobile/app/controller/add/AddOther.js +++ b/apps/spreadsheeteditor/mobile/app/controller/add/AddOther.js @@ -75,6 +75,15 @@ define([ }, + setMode: function (mode) { + this.view = this.getView('AddOther'); + this.view.canViewComments = mode.canViewComments; + }, + + sedHideAddComment: function(hide) { + this.view.isHideAddComment = hide; //prohibit adding multiple comments in one cell + }, + onLaunch: function () { this.createView('AddOther').render(); }, @@ -100,11 +109,51 @@ define([ $('#addimage-file').single('click', function () { me.onInsertImage({islocal:true}); }); + } else if (pageId === "#addother-insert-comment") { + me.initInsertComment(false); } }, // Handlers + initInsertComment: function (documentFlag) { + var comment = SSE.getController('Common.Controllers.Collaboration').getCommentInfo(); + if (comment) { + this.getView('AddOther').renderComment(comment); + $('#done-comment').single('click', _.bind(this.onDoneComment, this, documentFlag)); + $('.back-from-add-comment').single('click', _.bind(function () { + if ($('#comment-text').val().length > 0) { + uiApp.modal({ + title: '', + text: this.textDeleteDraft, + buttons: [ + { + text: this.textCancel + }, + { + text: this.textContinue, + onClick: function () { + SSE.getController('AddContainer').rootView.router.back(); + } + }] + }) + } else { + SSE.getController('AddContainer').rootView.router.back(); + } + }, this)) + } + }, + + onDoneComment: function(documentFlag) { + var value = $('#comment-text').val(); + if (value.length > 0) { + if (SSE.getController('Common.Controllers.Collaboration').onAddNewComment(value, documentFlag)) { + this.view.isHideAddComment = true; + } + SSE.getController('AddContainer').hideModal(); + } + }, + onInsertImage: function (args) { if ( !args.islocal ) { var me = this; @@ -137,7 +186,10 @@ define([ }, textEmptyImgUrl : 'You need to specify image URL.', - txtNotUrl: 'This field should be a URL in the format \"http://www.example.com\"' + txtNotUrl: 'This field should be a URL in the format \"http://www.example.com\"', + textDeleteDraft: 'Delete draft?', + textCancel: 'Cancel', + textContinue: 'Continue' } })(), SSE.Controllers.AddOther || {})) }); \ No newline at end of file diff --git a/apps/spreadsheeteditor/mobile/app/template/AddOther.template b/apps/spreadsheeteditor/mobile/app/template/AddOther.template index f20d083e8..4089e161e 100644 --- a/apps/spreadsheeteditor/mobile/app/template/AddOther.template +++ b/apps/spreadsheeteditor/mobile/app/template/AddOther.template @@ -2,6 +2,18 @@ +
      + + +
      +
      +
      +
      +
      + +
      +
      \ No newline at end of file diff --git a/apps/spreadsheeteditor/mobile/app/view/add/AddOther.js b/apps/spreadsheeteditor/mobile/app/view/add/AddOther.js index 4b5b98675..5ad766736 100644 --- a/apps/spreadsheeteditor/mobile/app/view/add/AddOther.js +++ b/apps/spreadsheeteditor/mobile/app/view/add/AddOther.js @@ -62,6 +62,23 @@ define([ var mapNavigation = {}; + var tplNavigationComment = '
      ' + + '
      ' + + '
      ' + + '' + + '' + + '<% if (!android) { %><%= textBack %><% } %>' + + '' + + '
      ' + + '
      <%= title %>
      ' + + '
      ' + + '' + + '<% if (android) { %><% } else { %><%= textDone %><% } %>' + + '' + + '
      ' + + '
      ' + + '
      '; + var getNavigation = function (panelid) { var el = mapNavigation[panelid]; if ( !el ) { @@ -73,16 +90,28 @@ define([ case '#addother-insimage': _title = this.textInsertImage; break; case '#addother-sort': _title = this.textSort; break; case '#addother-imagefromurl': _title = this.textLinkSettings; break; + case '#addother-insert-comment': _title = this.textAddComment; break; } - mapNavigation = - el = _.template(tplNavigation)({ + if (panelid === '#addother-insert-comment') { + el = _.template(tplNavigationComment)({ android : Common.SharedSettings.get('android'), phone : Common.SharedSettings.get('phone'), textBack : this.textBack, + textDone : this.textDone, title : _title } ); + } else { + mapNavigation = + el = _.template(tplNavigation)({ + android : Common.SharedSettings.get('android'), + phone : Common.SharedSettings.get('phone'), + textBack : this.textBack, + title : _title + } + ); + } } return el; @@ -106,6 +135,7 @@ define([ $page.find('#add-other-insimage').single('click', _.bind(me.showInsertImage, me)); $page.find('#add-other-link').single('click', _.bind(me.showInsertLink, me)); $page.find('#add-other-sort').single('click', _.bind(me.showSortPage, me)); + $page.find('#add-other-comment').single('click', _.bind(me.showPageComment, me)); me.initControls(); }, @@ -123,6 +153,14 @@ define([ rootLayout: function () { if (this.layout) { + if (!this.canViewComments) { + this.layout.find('#addother-root-view #item-comment').remove(); + } + if (this.isHideAddComment) { + this.layout.find('#addother-root-view #item-comment').hide(); + } else { + this.layout.find('#addother-root-view #item-comment').show(); + } return this.layout .find('#addother-root-view') .html(); @@ -144,7 +182,7 @@ define([ // }, - showPage: function (templateId) { + showPage: function (templateId, animate) { var rootView = SSE.getController('AddContainer').rootView; if (rootView && this.layout) { @@ -161,13 +199,40 @@ define([ } rootView.router.load({ - content: $content.html() + content: $content.html(), + animatePages: animate !== false }); this.fireEvent('page:show', [this, templateId]); } }, + showPageComment: function(animate) { + this.showPage('#addother-insert-comment', animate); + }, + + renderComment: function(comment) { + _.delay(function () { + var $commentInfo = $('#comment-info'); + var template = [ + '<% if (android) { %>
      <%= comment.userInitials %>
      <% } %>', + '
      <%= comment.username %>
      ', + '
      <%= comment.date %>
      ', + '<% if (android) { %>
      <% } %>', + '
      ' + ].join(''); + var insert = _.template(template)({ + android: Framework7.prototype.device.android, + comment: comment + }); + $commentInfo.html(insert); + _.defer(function () { + var $textarea = $('.comment-textarea')[0]; + $textarea.focus(); + }); + }, 100); + }, + showInsertImage: function () { this.showPage('#addother-insimage'); @@ -227,7 +292,10 @@ define([ textAddress: 'Address', textImageURL: 'Image URL', textFilter: 'Filter', - textLinkSettings: 'Link Settings' + textLinkSettings: 'Link Settings', + textComment: 'Comment', + textAddComment: 'Add Comment', + textDone: 'Done' } })(), SSE.Views.AddOther || {})) }); \ No newline at end of file diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css index 97ff19d6c..32f523dfe 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css @@ -7112,12 +7112,14 @@ i.icon.icon-text-valign-bottom { background-color: #40865c; -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%2340865c%22%3E%3Cg%3E%3Crect%20class%3D%22cls-1%22%20x%3D%222%22%20y%3D%2218%22%20width%3D%2219%22%20height%3D%221%22%2F%3E%3Crect%20class%3D%22cls-1%22%20x%3D%222%22%20y%3D%2220%22%20width%3D%2219%22%20height%3D%221%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2211%204%2012%204%2012%2015.17%2014.35%2013.2%2015%2014.06%2011.5%2017%208%2014%208.65%2013.2%2011%2015.17%2011%204%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); } -i.icon.icon-prev { +i.icon.icon-prev, +i.icon.icon-prev-comment { width: 22px; height: 22px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%2340865c%22%3E%3Cg%3E%3Cpath%20d%3D%22M16%2C20.5L15%2C21.5L4.5%2C11l0%2C0l0%2C0L15%2C0.5L16%2C1.5L6.6%2C11L16%2C20.5z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); } -i.icon.icon-next { +i.icon.icon-next, +i.icon.icon-next-comment { width: 22px; height: 22px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%2340865c%22%3E%3Cg%3E%3Cpath%20d%3D%22M15.5%2C11L6%2C1.5l1.1-1.1L17.5%2C11l0%2C0l0%2C0L7.1%2C21.5L6%2C20.5L15.5%2C11z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); @@ -7362,6 +7364,26 @@ i.icon.icon-paste { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%202H0V20H9V24H24V7H19V2H14V3H18V7H9V19H1V3H5V2ZM10%208H23V23H10V8Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M5%200H14V5H5V0Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2012H12V11H21V12Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2016H12V15H21V16Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2020H12V19H21V20Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); } +i.icon.icon-menu-comment { + width: 30px; + height: 30px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2030%2030%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M10%2015C10%2016.6569%208.65685%2018%207%2018C5.34315%2018%204%2016.6569%204%2015C4%2013.3431%205.34315%2012%207%2012C8.65685%2012%2010%2013.3431%2010%2015ZM7%2016.7143C7.94677%2016.7143%208.71429%2015.9468%208.71429%2015C8.71429%2014.0532%207.94677%2013.2857%207%2013.2857C6.05323%2013.2857%205.28571%2014.0532%205.28571%2015C5.28571%2015.9468%206.05323%2016.7143%207%2016.7143Z%22%20fill%3D%22%23A3A3A3%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M18%2015C18%2016.6569%2016.6569%2018%2015%2018C13.3431%2018%2012%2016.6569%2012%2015C12%2013.3431%2013.3431%2012%2015%2012C16.6569%2012%2018%2013.3431%2018%2015ZM15%2016.7143C15.9468%2016.7143%2016.7143%2015.9468%2016.7143%2015C16.7143%2014.0532%2015.9468%2013.2857%2015%2013.2857C14.0532%2013.2857%2013.2857%2014.0532%2013.2857%2015C13.2857%2015.9468%2014.0532%2016.7143%2015%2016.7143Z%22%20fill%3D%22%23A3A3A3%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M26%2015C26%2016.6569%2024.6569%2018%2023%2018C21.3431%2018%2020%2016.6569%2020%2015C20%2013.3431%2021.3431%2012%2023%2012C24.6569%2012%2026%2013.3431%2026%2015ZM23%2016.7143C23.9468%2016.7143%2024.7143%2015.9468%2024.7143%2015C24.7143%2014.0532%2023.9468%2013.2857%2023%2013.2857C22.0532%2013.2857%2021.2857%2014.0532%2021.2857%2015C21.2857%2015.9468%2022.0532%2016.7143%2023%2016.7143Z%22%20fill%3D%22%23A3A3A3%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-resolve-comment { + width: 30px; + height: 30px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2030%2030%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M11.6195%2020.8555C11.8237%2021.0673%2012.1658%2021.0577%2012.358%2020.8349L22.516%209.05783C22.7843%208.74676%2022.7528%208.27781%2022.4453%208.00545C22.1315%207.72756%2021.651%207.7604%2021.3779%208.07839L12.3546%2018.587C12.1638%2018.8092%2011.8238%2018.8206%2011.6186%2018.6117L8.10643%2015.0366C7.81574%2014.7407%207.34084%2014.7345%207.04258%2015.0228C6.74283%2015.3125%206.73444%2015.7903%207.02383%2016.0904L11.6195%2020.8555Z%22%20fill%3D%22%23A3A3A3%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-resolve-comment.check { + width: 30px; + height: 30px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2230%22%20height%3D%2230%22%20viewBox%3D%220%200%2030%2030%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M0%200H30V30H0V0Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M11.6195%2020.8555C11.8237%2021.0673%2012.1658%2021.0577%2012.358%2020.8349L22.516%209.05783C22.7843%208.74676%2022.7528%208.27781%2022.4453%208.00545V8.00545C22.1315%207.72756%2021.651%207.7604%2021.3779%208.07839L12.3546%2018.587C12.1638%2018.8092%2011.8238%2018.8206%2011.6186%2018.6117L8.10643%2015.0366C7.81575%2014.7407%207.34084%2014.7345%207.04258%2015.0228V15.0228C6.74283%2015.3125%206.73444%2015.7903%207.02383%2016.0904L11.6195%2020.8555Z%22%20fill%3D%22%234cd964%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-insert-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20.1538%209.00708H11.8462C10.8266%209.00708%2010%209.83461%2010%2010.8554V15.1694C10%2016.1902%2010.8266%2017.0177%2011.8462%2017.0177H13.8329C13.9409%2017.0177%2014.0454%2017.0556%2014.1284%2017.1248L18.243%2020.392C18.5436%2020.6428%2019%2020.4288%2019%2020.037V17.4798C19%2017.2246%2019.2066%2017.0177%2019.4615%2017.0177H20.1538C21.1734%2017.0177%2022%2016.1902%2022%2015.1694V10.8554C22%209.83461%2021.1734%209.00708%2020.1538%209.00708ZM20%2010.0083C20.5523%2010.0083%2021%2010.4565%2021%2011.0095V15.0154C21%2015.5683%2020.5523%2016.0165%2020%2016.0165H18.0025L18%2018.8995C18%2019.2912%2018%2019%2018%2019L14.5%2016.0165H12C11.4477%2016.0165%2011%2015.5683%2011%2015.0154V11.0095C11%2010.4565%2011.4477%2010.0083%2012%2010.0083H20Z%22%20fill%3D%22%2340865c%22%2F%3E%3Cpath%20d%3D%22M14.5%203H4.5C3.18908%203%202%204.2153%202%205.50295V12.0346C2%2013.3222%203.18908%2014.013%204.5%2014.013H5.5C5.82773%2014.013%206%2014.1917%206%2014.5136V17.5183C6%2018.0125%206.6135%2018.3352%207%2018.0189L11%2014.9858V13.5L7%2016.5V13.0118H4.5C3.78992%2013.0118%203%2012.732%203%2012.0346V5.50295C3%204.80547%203.78992%204.00118%204.5%204.00118H14.5C15.2101%204.00118%2016%204.80547%2016%205.50295V8.0059H17V5.50295C17%204.2153%2015.8109%203%2014.5%203Z%22%20fill%3D%22%2340865c%22%2F%3E%3C%2Fsvg%3E"); +} .chart-types .thumb.bar-normal { background-image: url('../img/charts/chart-03.png'); } @@ -8195,3 +8217,16 @@ html.pixel-ratio-3 .cell-styles.dataview .row li { background-size: 20px 20px; width: 25px; } +.picker-modal.container-view-comment { + background-color: #efeff4; +} +.picker-modal.container-view-comment.onHide .swipe-container, +.picker-modal.container-view-comment.onHide .toolbar-inner, +.picker-modal.container-view-comment.onHide .pages { + opacity: 0.6; +} +.picker-modal.container-view-comment .swipe-container, +.picker-modal.container-view-comment .toolbar, +.picker-modal.container-view-comment .pages { + background-color: #FFFFFF; +} diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-material.css b/apps/spreadsheeteditor/mobile/resources/css/app-material.css index fbedc52d8..93a468c05 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-material.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-material.css @@ -7084,6 +7084,51 @@ i.icon.icon-paste { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%202H0V20H9V24H24V7H19V2H14V3H18V7H9V19H1V3H5V2ZM10%208H23V23H10V8Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20d%3D%22M5%200H14V5H5V0Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2012H12V11H21V12Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2016H12V15H21V16Z%22%20fill%3D%22black%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21%2020H12V19H21V20Z%22%20fill%3D%22black%22%2F%3E%3C%2Fsvg%3E"); } +i.icon.icon-menu-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M16.6047%2016.5848C17.0078%2016.1793%2017.4729%2015.9766%2018%2015.9766C18.5271%2015.9766%2018.9922%2016.1793%2019.3953%2016.5848C19.7984%2016.9903%2020%2017.4581%2020%2017.9883C20%2018.5185%2019.7984%2018.9864%2019.3953%2019.3918C18.9922%2019.7973%2018.5271%2020%2018%2020C17.4729%2020%2017.0078%2019.7973%2016.6047%2019.3918C16.2016%2018.9864%2016%2018.5185%2016%2017.9883C16%2017.4581%2016.2016%2016.9903%2016.6047%2016.5848ZM16.6047%2010.5965C17.0078%2010.191%2017.4729%209.9883%2018%209.9883C18.5271%209.9883%2018.9922%2010.191%2019.3953%2010.5965C19.7984%2011.0019%2020%2011.4698%2020%2012C20%2012.5302%2019.7984%2012.9981%2019.3953%2013.4035C18.9922%2013.809%2018.5271%2014.0117%2018%2014.0117C17.4729%2014.0117%2017.0078%2013.809%2016.6047%2013.4035C16.2016%2012.9981%2016%2012.5302%2016%2012C16%2011.4698%2016.2016%2011.0019%2016.6047%2010.5965ZM19.3953%207.4152C18.9922%207.82066%2018.5271%208.02339%2018%208.02339C17.4729%208.02339%2017.0078%207.82066%2016.6047%207.4152C16.2016%207.00975%2016%206.54191%2016%206.0117C16%205.48148%2016.2016%205.01365%2016.6047%204.60819C17.0078%204.20273%2017.4729%204%2018%204C18.5271%204%2018.9922%204.20273%2019.3953%204.60819C19.7984%205.01365%2020%205.48148%2020%206.0117C20%206.54191%2019.7984%207.00975%2019.3953%207.4152Z%22%20fill%3D%22black%22%20fill-opacity%3D%220.6%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-resolve-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9%2016.1719L19.5938%205.57812L21%206.98438L9%2018.9844L3.42188%2013.4062L4.82812%2012L9%2016.1719Z%22%20fill%3D%22black%22%20fill-opacity%3D%220.6%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-resolve-comment.check { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9%2016.1719L19.5938%205.57812L21%206.98438L9%2018.9844L3.42188%2013.4062L4.82812%2012L9%2016.1719Z%22%20fill%3D%22%2340865C%22%20fill-opacity%3D%220.6%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-prev-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M15.4219%207.40625L10.8281%2012L15.4219%2016.5938L14.0156%2018L8.01562%2012L14.0156%206L15.4219%207.40625Z%22%20fill%3D%22%2340865c%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-next-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9.98438%206L15.9844%2012L9.98438%2018L8.57812%2016.5938L13.1719%2012L8.57812%207.40625L9.98438%206Z%22%20fill%3D%22%2340865c%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-close-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18.9844%206.42188L13.4062%2012L18.9844%2017.5781L17.5781%2018.9844L12%2013.4062L6.42188%2018.9844L5.01562%2017.5781L10.5938%2012L5.01562%206.42188L6.42188%205.01562L12%2010.5938L17.5781%205.01562L18.9844%206.42188Z%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%200.6)%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-done-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9%2016.1719L19.5938%205.57812L21%206.98438L9%2018.9844L3.42188%2013.4062L4.82812%2012L9%2016.1719Z%22%20fill%3D%22%2340865c%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-insert-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20.1538%209.00708H11.8462C10.8266%209.00708%2010%209.83461%2010%2010.8554V15.1694C10%2016.1902%2010.8266%2017.0177%2011.8462%2017.0177H13.8329C13.9409%2017.0177%2014.0454%2017.0556%2014.1284%2017.1248L18.243%2020.392C18.5436%2020.6428%2019%2020.4288%2019%2020.037V17.4798C19%2017.2246%2019.2066%2017.0177%2019.4615%2017.0177H20.1538C21.1734%2017.0177%2022%2016.1902%2022%2015.1694V10.8554C22%209.83461%2021.1734%209.00708%2020.1538%209.00708ZM20%2010.0083C20.5523%2010.0083%2021%2010.4565%2021%2011.0095V15.0154C21%2015.5683%2020.5523%2016.0165%2020%2016.0165H18.0025L18%2018.8995C18%2019.2912%2018%2019%2018%2019L14.5%2016.0165H12C11.4477%2016.0165%2011%2015.5683%2011%2015.0154V11.0095C11%2010.4565%2011.4477%2010.0083%2012%2010.0083H20Z%22%20fill%3D%22%2340865c%22%2F%3E%3Cpath%20d%3D%22M14.5%203H4.5C3.18908%203%202%204.2153%202%205.50295V12.0346C2%2013.3222%203.18908%2014.013%204.5%2014.013H5.5C5.82773%2014.013%206%2014.1917%206%2014.5136V17.5183C6%2018.0125%206.6135%2018.3352%207%2018.0189L11%2014.9858V13.5L7%2016.5V13.0118H4.5C3.78992%2013.0118%203%2012.732%203%2012.0346V5.50295C3%204.80547%203.78992%204.00118%204.5%204.00118H14.5C15.2101%204.00118%2016%204.80547%2016%205.50295V8.0059H17V5.50295C17%204.2153%2015.8109%203%2014.5%203Z%22%20fill%3D%22%2340865c%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-done-comment-white { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9%2016.1719L19.5938%205.57812L21%206.98438L9%2018.9844L3.42188%2013.4062L4.82812%2012L9%2016.1719Z%22%20fill%3D%22%23FFFFFF%22%2F%3E%3C%2Fsvg%3E"); +} .navbar i.icon.icon-logo { width: 100px; height: 14px; @@ -8158,3 +8203,16 @@ html.pixel-ratio-3 .cell-styles.dataview .row li { background-size: 20px 20px; width: 25px; } +.picker-modal.container-view-comment { + background-color: #efeff4; +} +.picker-modal.container-view-comment.onHide .swipe-container, +.picker-modal.container-view-comment.onHide .toolbar-inner, +.picker-modal.container-view-comment.onHide .pages { + opacity: 0.6; +} +.picker-modal.container-view-comment .swipe-container, +.picker-modal.container-view-comment .toolbar, +.picker-modal.container-view-comment .pages { + background-color: #FFFFFF; +} diff --git a/apps/spreadsheeteditor/mobile/resources/less/app-ios.less b/apps/spreadsheeteditor/mobile/resources/less/app-ios.less index 69f0a6eaf..ea4955770 100644 --- a/apps/spreadsheeteditor/mobile/resources/less/app-ios.less +++ b/apps/spreadsheeteditor/mobile/resources/less/app-ios.less @@ -341,4 +341,17 @@ input, textarea { width: 25px; } } +} + +//Comments +.picker-modal.container-view-comment { + &.onHide { + .swipe-container, .toolbar-inner, .pages { + opacity: 0.6; + } + } + background-color: #efeff4; + .swipe-container, .toolbar, .pages { + background-color: #FFFFFF; + } } \ No newline at end of file diff --git a/apps/spreadsheeteditor/mobile/resources/less/app-material.less b/apps/spreadsheeteditor/mobile/resources/less/app-material.less index 6cc861eac..897d5eb15 100644 --- a/apps/spreadsheeteditor/mobile/resources/less/app-material.less +++ b/apps/spreadsheeteditor/mobile/resources/less/app-material.less @@ -330,4 +330,17 @@ input, textarea { width: 25px; } } +} + +//Comments +.picker-modal.container-view-comment { + &.onHide { + .swipe-container, .toolbar-inner, .pages { + opacity: 0.6; + } + } + background-color: #efeff4; + .swipe-container, .toolbar, .pages { + background-color: #FFFFFF; + } } \ No newline at end of file diff --git a/apps/spreadsheeteditor/mobile/resources/less/ios/_icons.less b/apps/spreadsheeteditor/mobile/resources/less/ios/_icons.less index bf9b1ebfd..8f314eb15 100644 --- a/apps/spreadsheeteditor/mobile/resources/less/ios/_icons.less +++ b/apps/spreadsheeteditor/mobile/resources/less/ios/_icons.less @@ -121,12 +121,12 @@ i.icon { height: 22px; .encoded-svg-mask(''); } - &.icon-prev { + &.icon-prev, &.icon-prev-comment { width: 22px; height: 22px; .encoded-svg-background(''); } - &.icon-next { + &.icon-next, &.icon-next-comment { width: 22px; height: 22px; .encoded-svg-background(''); @@ -388,6 +388,27 @@ i.icon { height: 24px; .encoded-svg-background(''); } + //Comments + &.icon-menu-comment { + width: 30px; + height: 30px; + .encoded-svg-background(''); + } + &.icon-resolve-comment { + width: 30px; + height: 30px; + .encoded-svg-background(''); + } + &.icon-resolve-comment.check { + width: 30px; + height: 30px; + .encoded-svg-background(''); + } + &.icon-insert-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } } .chart-types .thumb { diff --git a/apps/spreadsheeteditor/mobile/resources/less/material/_icons.less b/apps/spreadsheeteditor/mobile/resources/less/material/_icons.less index 941748222..8a8250db9 100644 --- a/apps/spreadsheeteditor/mobile/resources/less/material/_icons.less +++ b/apps/spreadsheeteditor/mobile/resources/less/material/_icons.less @@ -347,6 +347,52 @@ i.icon { height: 24px; .encoded-svg-background(''); } + //Comments + &.icon-menu-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-resolve-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-resolve-comment.check { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-prev-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-next-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-close-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-done-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-insert-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-done-comment-white { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } } // Overwrite color for toolbar From cd4826ff92b23fbb96c448919518b20d43fcb8a3 Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Wed, 15 Apr 2020 19:50:15 +0300 Subject: [PATCH 17/23] [mobile] Comments (added check for the ability to add comments) --- .../mobile/lib/controller/Collaboration.js | 4 +- .../mobile/app/controller/DocumentHolder.js | 6 ++- .../mobile/app/controller/add/AddOther.js | 45 +++++++++++++++++++ .../mobile/app/view/add/AddOther.js | 7 ++- .../mobile/app/controller/DocumentHolder.js | 3 +- .../mobile/app/controller/add/AddOther.js | 27 ++++++++++- .../mobile/app/view/add/AddOther.js | 11 +++-- .../mobile/app/controller/DocumentHolder.js | 2 +- .../mobile/app/controller/add/AddOther.js | 17 +++++-- .../mobile/app/view/add/AddOther.js | 12 ++--- 10 files changed, 112 insertions(+), 22 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index 14c527755..651f1bdee 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -769,7 +769,7 @@ define([ me.updateViewComment(); } if (window.SSE) { - SSE.getController('AddOther').sedHideAddComment(true); + SSE.getController('AddOther').setHideAddComment(true); } }, @@ -779,7 +779,7 @@ define([ $('.container-view-comment').remove(); } if (window.SSE) { - SSE.getController('AddOther').sedHideAddComment(false); + SSE.getController('AddOther').setHideAddComment(false); } }, diff --git a/apps/documenteditor/mobile/app/controller/DocumentHolder.js b/apps/documenteditor/mobile/app/controller/DocumentHolder.js index ff8893ccf..1b54d0928 100644 --- a/apps/documenteditor/mobile/app/controller/DocumentHolder.js +++ b/apps/documenteditor/mobile/app/controller/DocumentHolder.js @@ -462,7 +462,7 @@ define([ lockedHeader = objectValue.get_Locked(); } - if (objectType == Asc.c_oAscTypeSelectElement.Text) { + if (objectType == Asc.c_oAscTypeSelectElement.Paragraph) { isText = true; lockedText = objectValue.get_Locked(); } else if (objectType == Asc.c_oAscTypeSelectElement.Image) { @@ -571,7 +571,9 @@ define([ }); } - if (_canViewComments) { + var isObject = isShape || isChart || isImage || isTable; + var hideAddComment = !_canViewComments || me.api.can_AddQuotedComment() === false || lockedText || lockedTable || lockedImage || lockedHeader || (!isText && isObject); + if (!hideAddComment) { arrItems.push({ caption: me.menuAddComment, event: 'addcomment' diff --git a/apps/documenteditor/mobile/app/controller/add/AddOther.js b/apps/documenteditor/mobile/app/controller/add/AddOther.js index 742ddc793..041cb3758 100644 --- a/apps/documenteditor/mobile/app/controller/add/AddOther.js +++ b/apps/documenteditor/mobile/app/controller/add/AddOther.js @@ -94,6 +94,51 @@ define([ var me = this; $('#add-other-pagebreak').single('click', _.bind(me.onPageBreak, me)); $('#add-other-columnbreak').single('click', _.bind(me.onColumnBreak, me)); + this.view.hideInsertComments = this.isHideInsertComment(); + }, + + isHideInsertComment: function() { + var stack = this.api.getSelectedElements(); + var isText = false, + isTable = false, + isImage = false, + isChart = false, + isShape = false, + isLink = false, + lockedText = false, + lockedTable = false, + lockedImage = false, + lockedHeader = false; + _.each(stack, function (item) { + var objectType = item.get_ObjectType(), + objectValue = item.get_ObjectValue(); + if (objectType == Asc.c_oAscTypeSelectElement.Header) { + lockedHeader = objectValue.get_Locked(); + } + if (objectType == Asc.c_oAscTypeSelectElement.Paragraph) { + isText = true; + lockedText = objectValue.get_Locked(); + } else if (objectType == Asc.c_oAscTypeSelectElement.Image) { + lockedImage = objectValue.get_Locked(); + if (objectValue && objectValue.get_ChartProperties()) { + isChart = true; + } else if (objectType && objectValue.get_ShapeProperties()) { + isShape = true; + } else { + isImage = true; + } + } else if (objectType == Asc.c_oAscTypeSelectElement.Table) { + isTable = true; + lockedTable = objectValue.get_Locked(); + } else if (objectType == Asc.c_oAscTypeSelectElement.Hyperlink) { + isLink = true; + } + }); + if (stack.length > 0) { + var isObject = isShape || isChart || isImage || isTable; + return (this.api.can_AddQuotedComment() === false || lockedText || lockedTable || lockedImage || lockedHeader || (!isText && isObject)); + } + return true; }, onPageShow: function (view, pageId) { diff --git a/apps/documenteditor/mobile/app/view/add/AddOther.js b/apps/documenteditor/mobile/app/view/add/AddOther.js index 523c58880..746f300de 100644 --- a/apps/documenteditor/mobile/app/view/add/AddOther.js +++ b/apps/documenteditor/mobile/app/view/add/AddOther.js @@ -70,7 +70,12 @@ define([ $('#add-other-link').single('click', _.bind(me.showLink, me)); $('#add-other-pagenumber').single('click', _.bind(me.showPagePosition, me)); $('#add-other-footnote').single('click', _.bind(me.showPageFootnote, me)); - $('#add-other-comment').single('click', _.bind(me.showPageComment, me)); + if (this.hideInsertComments) { + $('#item-comment').hide(); + } else { + $('#item-comment').show(); + $('#add-other-comment').single('click', _.bind(me.showPageComment, me)); + } me.initControls(); }, diff --git a/apps/presentationeditor/mobile/app/controller/DocumentHolder.js b/apps/presentationeditor/mobile/app/controller/DocumentHolder.js index b43aa613e..e46b5d68b 100644 --- a/apps/presentationeditor/mobile/app/controller/DocumentHolder.js +++ b/apps/presentationeditor/mobile/app/controller/DocumentHolder.js @@ -350,7 +350,8 @@ define([ }); } - if (_canViewComments) { + var hideAddComment = (isText && isChart) || me.api.can_AddQuotedComment() === false || !_canViewComments; + if (!hideAddComment) { arrItems.push({ caption: me.menuAddComment, event: 'addcomment' diff --git a/apps/presentationeditor/mobile/app/controller/add/AddOther.js b/apps/presentationeditor/mobile/app/controller/add/AddOther.js index dcbf08121..b64bc7a35 100644 --- a/apps/presentationeditor/mobile/app/controller/add/AddOther.js +++ b/apps/presentationeditor/mobile/app/controller/add/AddOther.js @@ -83,14 +83,37 @@ define([ initEvents: function () { var me = this; + this.view.hideInsertComments = this.isHideInsertComment(); + }, + isHideInsertComment: function() { + var stack = this.api.getSelectedElements(); + var isText = false, + isChart = false; + + _.each(stack, function (item) { + var objectType = item.get_ObjectType(); + if (objectType == Asc.c_oAscTypeSelectElement.Paragraph) { + isText = true; + } else if (objectType == Asc.c_oAscTypeSelectElement.Chart) { + isChart = true; + } + }); + if (stack.length > 0) { + var topObject = stack[stack.length - 1], + topObjectValue = topObject.get_ObjectValue(), + objectLocked = _.isFunction(topObjectValue.get_Locked) ? topObjectValue.get_Locked() : false; + !objectLocked && (objectLocked = _.isFunction(topObjectValue.get_LockDelete) ? topObjectValue.get_LockDelete() : false); + if (!objectLocked) { + return ((isText && isChart) || this.api.can_AddQuotedComment() === false); + } + } + return true; }, onPageShow: function (view, pageId) { var me = this; - $('.page[data-page=addother-comment] li a').single('click', _.buffered(me.onInsertComment, 100, me)); - if (pageId == '#addother-insert-comment') { me.initInsertComment(false); } diff --git a/apps/presentationeditor/mobile/app/view/add/AddOther.js b/apps/presentationeditor/mobile/app/view/add/AddOther.js index 82e94a6ad..6473fba24 100644 --- a/apps/presentationeditor/mobile/app/view/add/AddOther.js +++ b/apps/presentationeditor/mobile/app/view/add/AddOther.js @@ -64,11 +64,14 @@ define([ }, initEvents: function () { - var me = this; + if (this.hideInsertComments) { + $('#item-comment').hide(); + } else { + $('#item-comment').show(); + $('#add-other-comment').single('click', _.bind(this.showPageComment, this)); + } - $('#add-other-comment').single('click', _.bind(me.showPageComment, me)); - - me.initControls(); + this.initControls(); }, // Render layout diff --git a/apps/spreadsheeteditor/mobile/app/controller/DocumentHolder.js b/apps/spreadsheeteditor/mobile/app/controller/DocumentHolder.js index 2f51a7f37..8f0f5ed37 100644 --- a/apps/spreadsheeteditor/mobile/app/controller/DocumentHolder.js +++ b/apps/spreadsheeteditor/mobile/app/controller/DocumentHolder.js @@ -416,7 +416,7 @@ define([ caption: me.menuViewComment, event: 'viewcomment' }); - } else { + } else if (iscellmenu) { arrItems.push({ caption: me.menuAddComment, event: 'addcomment' diff --git a/apps/spreadsheeteditor/mobile/app/controller/add/AddOther.js b/apps/spreadsheeteditor/mobile/app/controller/add/AddOther.js index 937cdcb9c..6986b3ba9 100644 --- a/apps/spreadsheeteditor/mobile/app/controller/add/AddOther.js +++ b/apps/spreadsheeteditor/mobile/app/controller/add/AddOther.js @@ -80,8 +80,8 @@ define([ this.view.canViewComments = mode.canViewComments; }, - sedHideAddComment: function(hide) { - this.view.isHideAddComment = hide; //prohibit adding multiple comments in one cell + setHideAddComment: function(hide) { + this.view.isComments = hide; //prohibit adding multiple comments in one cell }, onLaunch: function () { @@ -92,6 +92,17 @@ define([ if ( args && !(_.indexOf(args.panels, 'image') < 0) ) { this.onPageShow(this.getView('AddOther'), '#addother-insimage'); } + this.view.hideInsertComments = this.isHideInsertComment(); + }, + + isHideInsertComment: function() { + var cellinfo = this.api.asc_getCellInfo(); + var iscelllocked = cellinfo.asc_getLocked(), + seltype = cellinfo.asc_getFlags().asc_getSelectionType(); + if (seltype === Asc.c_oAscSelectionType.RangeCells && !iscelllocked) { + return false; + } + return true; }, onPageShow: function (view, pageId) { @@ -148,7 +159,7 @@ define([ var value = $('#comment-text').val(); if (value.length > 0) { if (SSE.getController('Common.Controllers.Collaboration').onAddNewComment(value, documentFlag)) { - this.view.isHideAddComment = true; + this.view.isComments = true; } SSE.getController('AddContainer').hideModal(); } diff --git a/apps/spreadsheeteditor/mobile/app/view/add/AddOther.js b/apps/spreadsheeteditor/mobile/app/view/add/AddOther.js index 5ad766736..07e3ddb73 100644 --- a/apps/spreadsheeteditor/mobile/app/view/add/AddOther.js +++ b/apps/spreadsheeteditor/mobile/app/view/add/AddOther.js @@ -135,7 +135,12 @@ define([ $page.find('#add-other-insimage').single('click', _.bind(me.showInsertImage, me)); $page.find('#add-other-link').single('click', _.bind(me.showInsertLink, me)); $page.find('#add-other-sort').single('click', _.bind(me.showSortPage, me)); - $page.find('#add-other-comment').single('click', _.bind(me.showPageComment, me)); + if (me.hideInsertComments || me.isComments) { + $('#item-comment').hide(); + } else { + $('#item-comment').show(); + $('#add-other-comment').single('click', _.bind(me.showPageComment, me)); + } me.initControls(); }, @@ -156,11 +161,6 @@ define([ if (!this.canViewComments) { this.layout.find('#addother-root-view #item-comment').remove(); } - if (this.isHideAddComment) { - this.layout.find('#addother-root-view #item-comment').hide(); - } else { - this.layout.find('#addother-root-view #item-comment').show(); - } return this.layout .find('#addother-root-view') .html(); From 5fa1b9dbb51fcfb5d95772c64cf297b4f71fd943 Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Tue, 21 Apr 2020 18:36:06 +0300 Subject: [PATCH 18/23] [mobile] Comments (refactoring, moved comment editing) --- .../mobile/lib/controller/Collaboration.js | 603 +++++------------- apps/common/mobile/lib/view/Collaboration.js | 110 +++- .../resources/less/ios/_collaboration.less | 82 +-- .../less/material/_collaboration.less | 82 +-- .../mobile/resources/css/app-ios.css | 61 +- .../mobile/resources/css/app-material.css | 67 +- .../mobile/resources/css/app-ios.css | 61 +- .../mobile/resources/css/app-material.css | 67 +- .../mobile/resources/css/app-ios.css | 61 +- .../mobile/resources/css/app-material.css | 67 +- 10 files changed, 456 insertions(+), 805 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index 651f1bdee..0f6778519 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -803,8 +803,7 @@ define([ }, updateViewComment: function() { - var appPrefix = !!window.DE ? DE : !!window.PE ? PE : SSE; - appPrefix.getController('Common.Controllers.Collaboration').getView('Common.Views.Collaboration').renderViewComments(this.showComments, this.indexCurrentComment); + this.view.renderViewComments(this.showComments, this.indexCurrentComment); $('.comment-menu').single('click', _.bind(this.initMenuComments, this)); $('.reply-menu').single('click', _.bind(this.initReplyMenu, this)); $('.comment-resolve').single('click', _.bind(this.onClickResolveComment, this, false)); @@ -815,7 +814,6 @@ define([ showCommentModal: function() { var me = this, - isAndroid = Framework7.prototype.device.android === true, appPrefix = !!window.DE ? DE : !!window.PE ? PE : SSE, mainView = appPrefix.getController('Editor').getView('Editor').f7View; @@ -829,54 +827,17 @@ define([ '
      ' + '
      ' + '
      ' + - '
      ' + - '
      ' + - '
      ' + - (!me.view.viewmode ? '' + me.textAddReply + '' : '') + - '
      ' + - '
      ' + - '' + - '' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + + me.view.getTemplateContainerViewComments() + '
      ' - )).on('opened', function () { - if (_.isFunction(me.api.asc_OnShowContextMenu)) { - me.api.asc_OnShowContextMenu() - } - }).on('close', function (e) { + )).on('close', function (e) { mainView.showNavbar(); - }).on('closed', function () { - if (_.isFunction(me.api.asc_OnHideContextMenu)) { - me.api.asc_OnHideContextMenu() - } }); mainView.hideNavbar(); } else { me.modalViewComment = uiApp.popover( '
      ' + '
      ' + - '
      ' + - '
      ' + - '
      ' + - (!me.view.viewmode ? '' + me.textAddReply + '' : '') + - '
      ' + - '
      ' + - '' + - '' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + + me.view.getTemplateContainerViewComments() + '
      ' + '
      ', $$('#toolbar-collaboration') @@ -987,8 +948,8 @@ define([ } else { this.indexCurrentComment -= 1; } + this.view.renderViewComments(this.showComments, this.indexCurrentComment); var me = this; - me.getView('Common.Views.Collaboration').renderViewComments(me.showComments, me.indexCurrentComment); _.defer(function () { $('.comment-menu').single('click', _.bind(me.initMenuComments, me)); $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); @@ -1004,8 +965,8 @@ define([ } else { this.indexCurrentComment += 1; } + this.view.renderViewComments(this.showComments, this.indexCurrentComment); var me = this; - me.getView('Common.Views.Collaboration').renderViewComments(me.showComments, me.indexCurrentComment); _.defer(function () { $('.comment-menu').single('click', _.bind(me.initMenuComments, me)); $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); @@ -1016,14 +977,8 @@ define([ onClickAddReply: function(id) { var me = this; - var isAndroid = Framework7.prototype.device.android === true, - phone = Common.SharedSettings.get('phone'); - var idComment; - if (!id) { - idComment = $('.view-comment').find('.comment').data('uid'); - } else { - idComment = id; - } + var phone = Common.SharedSettings.get('phone'); + var idComment = !id ? $('.page-view-comments').find('.comment').data('uid') : id; if (_.isNumber(idComment)) { idComment = idComment.toString(); } @@ -1031,32 +986,14 @@ define([ me.getCurrentUser(); var date = me.dateToLocaleTimeString(new Date()); if (comment) { - var addReplyView; if ($('.container-view-comment').length > 0) { if (phone) { - addReplyView = uiApp.popup( - '
      ' + - '
      ' + - '
      ' + - '
      ' + (isAndroid ? '' : '' + me.textCancel + '') + '
      ' + - '
      ' + me.textAddReply + '
      ' + - '
      ' + (isAndroid ? '' : '' + me.textDone + '') + '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - (isAndroid ? '
      ' + me.getInitials(me.currentUser.asc_getUserName()) + '
      ' : '') + - '
      ' + me.currentUser.asc_getUserName() + '
      ' + - '
      ' + date + '
      ' + - (isAndroid ? '
      ' : '') + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + var colorUser = me.currentUser.asc_getColor(), + name = me.currentUser.asc_getUserName(), + initialUser = me.getInitials(name); + var templatePopup = me.getView('Common.Views.Collaboration').getTemplateAddReplyPopup(name, colorUser, initialUser, date); + me.addReplyView = uiApp.popup( + templatePopup ); $('.popup').css('z-index', '20000'); } else { @@ -1067,7 +1004,7 @@ define([ template = _.template('' + me.textCancel + ''); $('.container-view-comment .button-left').append(template); template = _.template('
      '); - $('.view-comment .page-content').append(template); + $('.page-view-comments .page-content').append(template); } } else if ($('.container-collaboration').length > 0) { me.getView('Common.Views.Collaboration').showPage('#comments-add-reply-view', false); @@ -1079,123 +1016,46 @@ define([ var $textarea = $('.reply-textarea')[0]; $textarea.focus(); }); - $('#add-new-reply').single('click', _.bind(function (uid) { - var reply = $('.reply-textarea')[0].value; - if ($('.container-view-comment').length > 0) { - var $viewComment = $('.container-view-comment'); - if (reply && reply.length > 0) { - this.addReply(uid, reply); - this.updateViewComment(this.showComments, this.indexCurrentComment); - if (!phone) { - $viewComment.find('a#add-new-reply, a.cancel-reply').remove(); - $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); - } else { - uiApp.closeModal($$(addReplyView)); - } - this.disabledViewComments(false); + $('#add-new-reply').single('click', _.bind(me.onDoneAddNewReply, me, comment.uid)); + $('.cancel-reply').single('click', _.bind(me.onCancelAddNewReply, me)); + } + }, + + onDoneAddNewReply: function(uid) { + var phone = Common.SharedSettings.get('phone'); + var reply = $('.reply-textarea')[0].value; + if ($('.container-view-comment').length > 0) { + var $viewComment = $('.container-view-comment'); + if (reply && reply.length > 0) { + this.addReply && this.addReply(uid, reply, _userId); + if (!phone) { + $viewComment.find('a#add-new-reply, a.cancel-reply').remove(); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + if ($('.block-reply').length > 0) { + $('.block-reply').remove(); } - } else if ($('.container-collaboration').length > 0) { - this.addReply(uid, reply); - rootView.router.back(); + } else { + uiApp.closeModal($$(this.addReplyView)); } - }, me, comment.uid)); - $('.cancel-reply').single('click', _.bind(function () { - var $viewComment = $('.container-view-comment'); - if ($viewComment.find('.block-reply').length > 0) { - $viewComment.find('.block-reply').remove(); - } - $viewComment.find('a#add-new-reply, a.cancel-reply').css('display', 'none'); - $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); this.disabledViewComments(false); - }, me)); - } - }, - - addReply: function(id, replyVal) { - if (replyVal.length > 0) { - var me = this, - reply = null, - addReply = null, - ascComment = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)), - comment = this.findComment(id); - - if (ascComment && comment) { - - ascComment.asc_putText(comment.comment); - ascComment.asc_putQuoteText(comment.quote); - ascComment.asc_putTime(me.utcDateToString(new Date(comment.time))); - ascComment.asc_putOnlyOfficeTime(me.ooDateToString(new Date(comment.time))); - ascComment.asc_putUserId(comment.userid); - ascComment.asc_putUserName(comment.username); - ascComment.asc_putSolved(comment.resolved); - ascComment.asc_putGuid(comment.guid); - - if (!_.isUndefined(ascComment.asc_putDocumentFlag)) { - ascComment.asc_putDocumentFlag(comment.unattached); - } - - reply = comment.replys; - if (reply && reply.length) { - reply.forEach(function (reply) { - - addReply = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)); - if (addReply) { - addReply.asc_putText(reply.reply); - addReply.asc_putTime(me.utcDateToString(new Date(reply.time))); - addReply.asc_putOnlyOfficeTime(me.ooDateToString(new Date(reply.time))); - addReply.asc_putUserId(reply.userid); - addReply.asc_putUserName(reply.username); - - ascComment.asc_addReply(addReply); - } - }); - } - - addReply = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)); - if (addReply) { - addReply.asc_putText(replyVal); - addReply.asc_putTime(me.utcDateToString(new Date())); - addReply.asc_putOnlyOfficeTime(me.ooDateToString(new Date())); - me.getCurrentUser(); - addReply.asc_putUserId(_userId); - addReply.asc_putUserName(me.currentUser.asc_getUserName()); - - ascComment.asc_addReply(addReply); - - me.api.asc_changeComment(id, ascComment); - } } + } else if ($('.container-collaboration').length > 0) { + this.addReply && this.addReply(uid, reply, _userId); + rootView.router.back(); } }, - onAddNewComment: function(value, documentFlag) { - var comment; - if (typeof Asc.asc_CCommentDataWord !== 'undefined') { - comment = new Asc.asc_CCommentDataWord(null); - } else { - comment = new Asc.asc_CCommentData(null); + onCancelAddNewReply: function() { + var $viewComment = $('.container-view-comment'); + if ($viewComment.find('.block-reply').length > 0) { + $viewComment.find('.block-reply').remove(); } + $viewComment.find('a#add-new-reply, a.cancel-reply').css('display', 'none'); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + this.disabledViewComments(false); + }, - var textComment = value; - - if (textComment.length > 0) { - comment.asc_putText(textComment); - comment.asc_putTime(this.utcDateToString(new Date())); - comment.asc_putOnlyOfficeTime(this.ooDateToString(new Date())); - comment.asc_putUserId(this.currentUser.asc_getIdOriginal()); - comment.asc_putUserName(this.currentUser.asc_getUserName()); - comment.asc_putSolved(false); - - if (!_.isUndefined(comment.asc_putDocumentFlag)) - comment.asc_putDocumentFlag(documentFlag); - - this.api.asc_addComment(comment); - - uiApp.closeModal(); - - return true; - } - return false; + onAddNewComment: function() { }, initMenuComments: function(e) { @@ -1319,7 +1179,7 @@ define([ break; case 'delete': addOverlay(); - uiApp.modal({ + $$(uiApp.modal({ title: this.textDeleteComment, text: this.textMessageDeleteComment, buttons: [ @@ -1329,9 +1189,11 @@ define([ { text: this.textYes, onClick: function () { - me.onDeleteComment(idComment); + me.onDeleteComment && me.onDeleteComment(idComment); } }] + })).on('close', function () { + addOverlay(); }); me.disabledViewComments(false); break; @@ -1341,7 +1203,22 @@ define([ break; case 'deletereply': addOverlay(); - me.onDeleteReply(idComment, indReply); + $$(uiApp.modal({ + title: this.textDeleteReply, + text: this.textMessageDeleteReply, + buttons: [ + { + text: this.textCancel + }, + { + text: this.textYes, + onClick: function () { + me.onDeleteReply && me.onDeleteReply(idComment, indReply); + } + }] + })).on('close', function () { + addOverlay(); + }); me.disabledViewComments(false); break; case 'addreply': @@ -1354,147 +1231,18 @@ define([ } }, - onChangeComment: function(comment) { - if (this.api) { - var ascComment, - me = this; - if (typeof Asc.asc_CCommentDataWord !== 'undefined') { - ascComment = new Asc.asc_CCommentDataWord(null); - } else { - ascComment = new Asc.asc_CCommentData(null); - } - - if (ascComment && comment) { - var uid = comment.uid; - ascComment.asc_putText(comment.comment); - ascComment.asc_putQuoteText(comment.quote); - ascComment.asc_putTime(me.utcDateToString(new Date(comment.time))); - ascComment.asc_putOnlyOfficeTime(me.ooDateToString(new Date(comment.time))); - ascComment.asc_putUserId(comment.userid); - ascComment.asc_putUserName(comment.username); - ascComment.asc_putSolved(!comment.resolved); - ascComment.asc_putGuid(comment.guid); - - if (!_.isUndefined(ascComment.asc_putDocumentFlag)) { - ascComment.asc_putDocumentFlag(comment.unattached); - } - - var reply = comment.replys; - if (reply && reply.length > 0) { - reply.forEach(function (reply) { - var addReply = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)); - if (addReply) { - addReply.asc_putText(reply.reply); - addReply.asc_putTime(me.utcDateToString(new Date(reply.time))); - addReply.asc_putOnlyOfficeTime(me.ooDateToString(new Date(reply.time))); - addReply.asc_putUserId(reply.userid); - addReply.asc_putUserName(reply.username); - - ascComment.asc_addReply(addReply); - } - }); - } - - this.api.asc_changeComment(uid, ascComment); - return true; - } - } - return false; - }, - - onDeleteComment: function(uid) { - var comment = this.findComment(uid); - if (this.api && comment) { - this.api.asc_removeComment(uid); - if ($('.container-view-comment').length > 0) { - if (this.showComments.length === 0) { - uiApp.closeModal(); - } else { - this.indexCurrentComment = this.indexCurrentComment - 1 > -1 ? this.indexCurrentComment - 1 : 0; - this.updateViewComment(); - } - } - } - }, - - onDeleteReply: function(idComment, indReply) { - if (!_.isUndefined(idComment) && !_.isUndefined(indReply)) { - var me = this, - replies = null, - addReply = null, - ascComment = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)), - comment = me.findComment(idComment); - - if (ascComment && comment) { - var id = comment.uid; - ascComment.asc_putText(comment.comment); - ascComment.asc_putQuoteText(comment.quote); - ascComment.asc_putTime(me.utcDateToString(new Date(comment.time))); - ascComment.asc_putOnlyOfficeTime(me.ooDateToString(new Date(comment.time))); - ascComment.asc_putUserId(comment.userid); - ascComment.asc_putUserName(comment.username); - ascComment.asc_putSolved(comment.resolved); - ascComment.asc_putGuid(comment.guid); - - if (!_.isUndefined(ascComment.asc_putDocumentFlag)) { - ascComment.asc_putDocumentFlag(comment.unattached); - } - - replies = comment.replys; - if (replies && replies.length) { - replies.forEach(function (reply) { - if (reply.ind !== indReply) { - addReply = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)); - if (addReply) { - addReply.asc_putText(reply.reply); - addReply.asc_putTime(me.utcDateToString(new Date(reply.time))); - addReply.asc_putOnlyOfficeTime(me.ooDateToString(new Date(reply.time))); - addReply.asc_putUserId(reply.userid); - addReply.asc_putUserName(reply.username); - - ascComment.asc_addReply(addReply); - } - } - }); - } - - me.api.asc_changeComment(id, ascComment); - if($('.container-view-comment').length > 0) { - me.updateViewComment(); - } - } - } - }, - showEditComment: function(idComment) { - var me = this, - isAndroid = Framework7.prototype.device.android === true; + var me = this; if (idComment) { var comment = this.findComment(idComment); if ($('.container-view-comment').length > 0) { if (Common.SharedSettings.get('phone')) { me.editView = uiApp.popup( - '
      ' + - '
      ' + - '
      ' + - '
      ' + (isAndroid ? ' ' : '' + me.textCancel + '') + '
      ' + - '
      ' + me.textEditComment + '
      ' + - '
      ' + (isAndroid ? '' : '' + me.textDone + '') + '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - (isAndroid ? '
      ' + comment.userInitials + '
      ' : '') + - '
      ' + comment.username + '
      ' + - '
      ' + comment.date + '
      ' + - (isAndroid ? '
      ' : '') + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + me.view.getTemplateEditCommentPopup(comment) ); + $$(me.editView).on('close', function(){ + me.disabledViewComments(false); + }); $('.popup').css('z-index', '20000'); _.delay(function () { var $textarea = $('.comment-textarea')[0]; @@ -1524,74 +1272,62 @@ define([ $textarea.focus(); $textarea.selectionStart = $textarea.value.length; }); - $('#edit-comment').single('click', _.bind(function (comment) { - var value = $('#comment-text')[0].value; - if (value && value.length > 0) { - comment.comment = value; - if (!this.onChangeComment(comment)) return; - if ($('.container-view-comment').length > 0) { - this.showComments[this.indexCurrentComment] = comment; - if (Common.SharedSettings.get('phone')) { - uiApp.closeModal($$(me.editView)); - } else { - var $viewComment = $('.container-view-comment'); - $viewComment.find('a.done-edit-comment, a.cancel-edit-comment').remove(); - $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); - } - this.updateViewComment(); - this.disabledViewComments(false); - } else if ($('.container-collaboration').length > 0) { - rootView.router.back(); + $('#edit-comment').single('click', _.bind(me.onEditComment, me, comment)); + $('.cancel-edit-comment').single('click', _.bind(me.onCancelEditComment, me)); + } + }, + + onEditComment: function(comment) { + var value = $('#comment-text')[0].value; + if (value && value.length > 0) { + if (!_.isUndefined(this.onChangeComment)) { + comment.comment = value; + this.onChangeComment(comment); + } + if ($('.container-view-comment').length > 0) { + if (Common.SharedSettings.get('phone')) { + uiApp.closeModal($$(this.editView)); + } else { + var $viewComment = $('.container-view-comment'); + $viewComment.find('a.done-edit-comment, a.cancel-edit-comment').remove(); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + if ($viewComment.find('.comment-textarea').length > 0) { + $viewComment.find('.comment-textarea').remove(); + $viewComment.find('.comment-text span').css('display', 'block'); } } - }, me, comment)); - $('.cancel-edit-comment').single('click', _.bind(function () { - var $viewComment = $('.container-view-comment'); - $viewComment.find('a.done-edit-comment, a.cancel-edit-comment, .comment-textarea').remove(); - $viewComment.find('.comment-text span').css('display', 'block'); - $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); this.disabledViewComments(false); - }, me)); + } else if ($('.container-collaboration').length > 0) { + rootView.router.back(); + } } }, + onCancelEditComment: function() { + var $viewComment = $('.container-view-comment'); + $viewComment.find('a.done-edit-comment, a.cancel-edit-comment, .comment-textarea').remove(); + $viewComment.find('.comment-text span').css('display', 'block'); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + this.disabledViewComments(false); + }, + showEditReply: function(idComment, indReply) { var me = this; var comment = me.findComment(idComment); if (comment) { - var editView, - replies, + var replies, reply; - var isAndroid = Framework7.prototype.device.android === true; replies = comment.replys; reply = replies[indReply]; if (reply) { if ($('.container-view-comment').length > 0) { if (Common.SharedSettings.get('phone')) { - editView = uiApp.popup( - '
      ' + - '
      ' + - '
      ' + - '
      ' + (isAndroid ? '' : '' + me.textCancel + '') + '
      ' + - '
      ' + me.textEditReply + '
      ' + - '
      ' + (isAndroid ? '' : '' + me.textDone + '') + '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - (isAndroid ? '
      ' + reply.userInitials + '
      ' : '') + - '
      ' + reply.username + '
      ' + - '
      ' + reply.date + '
      ' + - (isAndroid ? '
      ' : '') + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + - '
      ' + me.editReplyView = uiApp.popup( + me.view.getTemplateEditReplyPopup(reply) ); + $$(me.editReplyView).on('close', function () { + me.disabledViewComments(false); + }); $('.popup').css('z-index', '20000'); } else { var $reply = $('.reply-item[data-ind=' + indReply + ']'); @@ -1614,37 +1350,49 @@ define([ $textarea.focus(); $textarea.selectionStart = $textarea.value.length; }); - $('#edit-reply').single('click', _.bind(function (comment, indReply) { - var value = $('.edit-reply-textarea')[0].value; - if (value && value.length > 0) { - if ($('.container-view-comment').length > 0) { - comment.replys[indReply].reply = value; - this.onChangeComment(comment); - if (Common.SharedSettings.get('phone')) { - uiApp.closeModal($$(editView)); - } else { - $viewComment.find('a#edit-reply, a.cancel-reply').remove(); - $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); - } - this.updateViewComment(); - } else { - comment.replys[indReply].reply = value; - this.onChangeComment(comment); - rootView.router.back(); - } - this.disabledViewComments(false); - } - }, me, comment, indReply)); - $('.cancel-reply').single('click', _.bind(function () { - $viewComment.find('a#edit-reply, a.cancel-reply, .edit-reply-textarea').remove(); - $reply.find('.reply-text').css('display', 'block'); - $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); - this.disabledViewComments(false); - }, me)); + $('#edit-reply').single('click', _.bind(me.onEditReply, me, comment, indReply)); + $('.cancel-reply').single('click', _.bind(me.onCancelEditReply, me)); } } }, + onEditReply: function(comment, indReply) { + var value = $('.edit-reply-textarea')[0].value; + if (value && value.length > 0) { + if ($('.container-view-comment').length > 0) { + if (!_.isUndefined(this.onChangeComment)) { + comment.replys[indReply].reply = value; + this.onChangeComment(comment); + } + if (Common.SharedSettings.get('phone')) { + uiApp.closeModal($$(this.editReplyView)); + } else { + var $viewComment = $('.container-view-comment'); + $viewComment.find('a#edit-reply, a.cancel-reply').remove(); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + if ($viewComment.find('.edit-reply-textarea').length > 0) { + $viewComment.find('.edit-reply-textarea').remove(); + $viewComment.find('.reply-text').css('display', 'block'); + } + } + } else { + if (!_.isUndefined(this.onChangeComment)) { + comment.replys[indReply].reply = value; + this.onChangeComment(comment); + } + rootView.router.back(); + } + this.disabledViewComments(false); + } + }, + + onCancelEditReply: function() { + $viewComment.find('a#edit-reply, a.cancel-reply, .edit-reply-textarea').remove(); + $reply.find('.reply-text').css('display', 'block'); + $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); + this.disabledViewComments(false); + }, + onClickResolveComment: function(uid, e) { var idComment; if (!uid) { @@ -1658,57 +1406,10 @@ define([ } var comment = this.findComment(idComment); if (comment) { - if (this.resolveComment(comment.uid)) { - if ($('.container-view-comment').length > 0) { - $('.comment[data-uid=' + idComment + '] .comment-resolve .icon-resolve-comment').toggleClass('check'); - } - } + this.resolveComment && this.resolveComment(comment.uid); } }, - resolveComment: function (uid) { - var me = this, - reply = null, - addReply = null, - ascComment = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)), - comment = me.findComment(uid); - - if (ascComment && comment && me.api) { - ascComment.asc_putText(comment.comment); - ascComment.asc_putQuoteText(comment.quote); - ascComment.asc_putTime(me.utcDateToString(new Date(comment.time))); - ascComment.asc_putOnlyOfficeTime(me.ooDateToString(new Date(comment.time))); - ascComment.asc_putUserId(comment.userid); - ascComment.asc_putUserName(comment.username); - ascComment.asc_putSolved(!comment.resolved); - ascComment.asc_putGuid(comment.guid); - - if (!_.isUndefined(ascComment.asc_putDocumentFlag)) { - ascComment.asc_putDocumentFlag(comment.unattached); - } - - reply = comment.replys; - if (reply && reply.length) { - reply.forEach(function (reply) { - addReply = (typeof Asc.asc_CCommentDataWord !== 'undefined' ? new Asc.asc_CCommentDataWord(null) : new Asc.asc_CCommentData(null)); - if (addReply) { - addReply.asc_putText(reply.reply); - addReply.asc_putTime(me.utcDateToString(new Date(reply.time))); - addReply.asc_putOnlyOfficeTime(me.ooDateToString(new Date(reply.time))); - addReply.asc_putUserId(reply.userid); - addReply.asc_putUserName(reply.username); - - ascComment.asc_addReply(addReply); - } - }); - } - - me.api.asc_changeComment(uid, ascComment); - return true; - } - return false; - }, - // utils timeZoneOffsetInMs: (new Date()).getTimezoneOffset() * 60000, utcDateToString: function (date) { @@ -1857,6 +1558,9 @@ define([ showComment = comment; } } + if ($('.container-view-comment').length > 0) { + this.updateViewComment(); + } } }, @@ -2047,6 +1751,7 @@ define([ textEditReply: 'Edit reply', textReopen: 'Reopen', textMessageDeleteComment: 'Do you really want to delete this comment?', + textMessageDeleteReply: 'Do you really want to delete this reply?', textYes: 'Yes' } diff --git a/apps/common/mobile/lib/view/Collaboration.js b/apps/common/mobile/lib/view/Collaboration.js index f20dbf161..748ec1bd7 100644 --- a/apps/common/mobile/lib/view/Collaboration.js +++ b/apps/common/mobile/lib/view/Collaboration.js @@ -154,7 +154,7 @@ define([ renderViewComments: function(comments, indCurComment) { var isAndroid = Framework7.prototype.device.android === true; var me = this; - if ($('.view-comment .page-content').length > 0) { + if ($('.page-view-comments .page-content').length > 0) { var template = ''; if (comments && comments.length > 0) { template = '
      ' + @@ -210,10 +210,10 @@ define([ template += '
      ' + '
      • '; template += '
    '; - $('.view-comment .page-content').html(template); + $('.page-view-comments .page-content').html(template); } } - Common.Utils.addScrollIfNeed('.view-comment.page', '.view-comment .page-content'); + Common.Utils.addScrollIfNeed('.page-view-comments.page', '.page-view-comments .page-content'); }, renderComments: function (comments) { @@ -326,6 +326,107 @@ define([ $pageEdit.html(_.template(template)); }, + //view comments + getTemplateAddReplyPopup: function(name, color, initial, date) { + var isAndroid = Framework7.prototype.device.android === true; + var template = '
    ' + + '
    ' + + '
    ' + + '
    ' + (isAndroid ? '' : '' + this.textCancel + '') + '
    ' + + '
    ' + this.textAddReply + '
    ' + + '
    ' + (isAndroid ? '' : '' + this.textDone + '') + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + (isAndroid ? '
    ' + initial + '
    ' : '') + + '
    ' + name + '
    ' + + '
    ' + date + '
    ' + + (isAndroid ? '
    ' : '') + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    '; + return template; + }, + + getTemplateContainerViewComments: function() { + var template = '
    ' + + '
    ' + + '
    ' + + (!this.viewmode ? '' + this.textAddReply + '' : '') + + '
    ' + + '
    ' + + '' + + '' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    '; + return template; + }, + + getTemplateEditCommentPopup: function(comment) { + var isAndroid = Framework7.prototype.device.android === true; + var template = '
    ' + + '
    ' + + '
    ' + + '
    ' + (isAndroid ? ' ' : '' + this.textCancel + '') + '
    ' + + '
    ' + this.textEditСomment + '
    ' + + '
    ' + (isAndroid ? '' : '' + this.textDone + '') + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + (isAndroid ? '
    ' + comment.userInitials + '
    ' : '') + + '
    ' + comment.username + '
    ' + + '
    ' + comment.date + '
    ' + + (isAndroid ? '
    ' : '') + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    '; + return template; + }, + + getTemplateEditReplyPopup: function(reply) { + var isAndroid = Framework7.prototype.device.android === true; + var template = '
    ' + + '
    ' + + '
    ' + + '
    ' + (isAndroid ? '' : '' + this.textCancel + '') + '
    ' + + '
    ' + this.textEditReply + '
    ' + + '
    ' + (isAndroid ? '' : '' + this.textDone + '') + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + (isAndroid ? '
    ' + reply.userInitials + '
    ' : '') + + '
    ' + reply.username + '
    ' + + '
    ' + reply.date + '
    ' + + (isAndroid ? '
    ' : '') + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    ' + + '
    '; + return template; + }, + textCollaboration: 'Collaboration', textReviewing: 'Review', textСomments: 'Сomments', @@ -343,7 +444,8 @@ define([ textEditСomment: "Edit Comment", textDone: "Done", textAddReply: "Add Reply", - textEditReply: "Edit Reply" + textEditReply: "Edit Reply", + textCancel: 'Cancel' } })(), Common.Views.Collaboration || {})) }); \ No newline at end of file diff --git a/apps/common/mobile/resources/less/ios/_collaboration.less b/apps/common/mobile/resources/less/ios/_collaboration.less index 112fba932..b6812b334 100644 --- a/apps/common/mobile/resources/less/ios/_collaboration.less +++ b/apps/common/mobile/resources/less/ios/_collaboration.less @@ -92,7 +92,7 @@ } //Comments -.page-comments, .add-comment, .page-view-comments, .container-edit-comment, .container-add-reply, .view-comment, .page-edit-comment, .page-add-reply, .page-edit-reply { +.page-comments, .add-comment, .page-view-comments, .container-edit-comment, .container-add-reply, .page-edit-comment, .page-add-reply, .page-edit-reply { .header-comment { display: flex; justify-content: space-between; @@ -215,7 +215,7 @@ .pages { background-color: #FFFFFF; } - .page-view-comments, .view-comment { + .page-view-comments { background-color: #FFFFFF; .list-block { margin-bottom: 100px; @@ -282,54 +282,60 @@ } } - .page { - border-radius: 13px; - .page-content { - padding: 16px; - padding-bottom: 80px; + .pages { + position: absolute; - .list-block { - margin-bottom: 0px; + .page { + border-radius: 13px; - .item-content { - padding-left: 0; + .page-content { + padding: 16px; + padding-bottom: 80px; - .header-comment, .reply-item { - padding-right: 0; + .list-block { + margin-bottom: 0px; + + .item-content { + padding-left: 0; + + .header-comment, .reply-item { + padding-right: 0; + } } } - } - .block-reply { - margin-top: 10px; - .reply-textarea { - min-height: 70px; - width: 278px; + .block-reply { + margin-top: 10px; + + .reply-textarea { + min-height: 70px; + width: 278px; + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 5px; + } + } + + .edit-reply-textarea { + min-height: 60px; + width: 100%; border: 1px solid #c4c4c4; border-radius: 6px; padding: 5px; + height: 60px; + margin-top: 10px; } - } - .edit-reply-textarea { - min-height: 60px; - width: 100%; - border: 1px solid #c4c4c4; - border-radius: 6px; - padding: 5px; - height: 60px; - margin-top: 10px; - } + .comment-text { + padding-right: 0; - .comment-text { - padding-right: 0; - - .comment-textarea { - border: 1px solid #c4c4c4; - border-radius: 6px; - padding: 8px; - min-height: 80px; - height: 80px; + .comment-textarea { + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 8px; + min-height: 80px; + height: 80px; + } } } } diff --git a/apps/common/mobile/resources/less/material/_collaboration.less b/apps/common/mobile/resources/less/material/_collaboration.less index 5ac455060..5a158aef5 100644 --- a/apps/common/mobile/resources/less/material/_collaboration.less +++ b/apps/common/mobile/resources/less/material/_collaboration.less @@ -90,7 +90,7 @@ } //Comments -.page-comments, .page-add-comment, .page-view-comments, .container-edit-comment, .container-add-reply, .view-comment, .page-edit-comment, .page-add-reply, .page-edit-reply { +.page-comments, .page-add-comment, .page-view-comments, .container-edit-comment, .container-add-reply, .page-edit-comment, .page-add-reply, .page-edit-reply { .list-block { ul { &:before, &:after { @@ -236,7 +236,7 @@ border-top-right-radius: 4px; height: 50%; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); - .page-view-comments, .view-comment { + .page-view-comments { background-color: #FFFFFF; .list-block { margin-bottom: 120px; @@ -312,54 +312,60 @@ } } - .page { - border-radius: 13px; - .page-content { - padding: 16px; - padding-bottom: 80px; + .pages { + position: absolute; - .list-block { - margin-bottom: 0px; + .page { + border-radius: 13px; - .item-content { - padding-left: 0; + .page-content { + padding: 16px; + padding-bottom: 80px; - .header-comment, .reply-item { - padding-right: 0; + .list-block { + margin-bottom: 0px; + + .item-content { + padding-left: 0; + + .header-comment, .reply-item { + padding-right: 0; + } } } - } - .block-reply { - margin-top: 10px; - .reply-textarea { - min-height: 70px; - width: 278px; + .block-reply { + margin-top: 10px; + + .reply-textarea { + min-height: 70px; + width: 278px; + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 5px; + } + } + + .edit-reply-textarea { + min-height: 60px; + width: 100%; border: 1px solid #c4c4c4; border-radius: 6px; padding: 5px; + height: 60px; + margin-top: 10px; } - } - .edit-reply-textarea { - min-height: 60px; - width: 100%; - border: 1px solid #c4c4c4; - border-radius: 6px; - padding: 5px; - height: 60px; - margin-top: 10px; - } + .comment-text { + padding-right: 0; - .comment-text { - padding-right: 0; - - .comment-textarea { - border: 1px solid #c4c4c4; - border-radius: 6px; - padding: 8px; - min-height: 80px; - height: 80px; + .comment-textarea { + border: 1px solid #c4c4c4; + border-radius: 6px; + padding: 8px; + min-height: 80px; + height: 80px; + } } } } diff --git a/apps/documenteditor/mobile/resources/css/app-ios.css b/apps/documenteditor/mobile/resources/css/app-ios.css index 59dc17faf..112fcf541 100644 --- a/apps/documenteditor/mobile/resources/css/app-ios.css +++ b/apps/documenteditor/mobile/resources/css/app-ios.css @@ -6487,7 +6487,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .header-comment, .container-edit-comment .header-comment, .container-add-reply .header-comment, -.view-comment .header-comment, .page-edit-comment .header-comment, .page-add-reply .header-comment, .page-edit-reply .header-comment { @@ -6500,7 +6499,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .header-comment .comment-right, .container-edit-comment .header-comment .comment-right, .container-add-reply .header-comment .comment-right, -.view-comment .header-comment .comment-right, .page-edit-comment .header-comment .comment-right, .page-add-reply .header-comment .comment-right, .page-edit-reply .header-comment .comment-right { @@ -6513,7 +6511,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, .container-add-reply .list-block .item-inner, -.view-comment .list-block .item-inner, .page-edit-comment .list-block .item-inner, .page-add-reply .list-block .item-inner, .page-edit-reply .list-block .item-inner { @@ -6526,7 +6523,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments p, .container-edit-comment p, .container-add-reply p, -.view-comment p, .page-edit-comment p, .page-add-reply p, .page-edit-reply p { @@ -6538,7 +6534,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .list-reply, .container-edit-comment .list-reply, .container-add-reply .list-reply, -.view-comment .list-reply, .page-edit-comment .list-reply, .page-add-reply .list-reply, .page-edit-reply .list-reply { @@ -6549,7 +6544,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, -.view-comment .reply-textarea, .page-edit-comment .reply-textarea, .page-add-reply .reply-textarea, .page-edit-reply .reply-textarea, @@ -6558,7 +6552,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, -.view-comment .comment-textarea, .page-edit-comment .comment-textarea, .page-add-reply .comment-textarea, .page-edit-reply .comment-textarea, @@ -6567,7 +6560,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea, .page-edit-comment .edit-reply-textarea, .page-add-reply .edit-reply-textarea, .page-edit-reply .edit-reply-textarea { @@ -6578,7 +6570,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .user-name, .container-edit-comment .user-name, .container-add-reply .user-name, -.view-comment .user-name, .page-edit-comment .user-name, .page-add-reply .user-name, .page-edit-reply .user-name { @@ -6593,7 +6584,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-date, .container-edit-comment .comment-date, .container-add-reply .comment-date, -.view-comment .comment-date, .page-edit-comment .comment-date, .page-add-reply .comment-date, .page-edit-reply .comment-date, @@ -6602,7 +6592,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-date, .container-edit-comment .reply-date, .container-add-reply .reply-date, -.view-comment .reply-date, .page-edit-comment .reply-date, .page-add-reply .reply-date, .page-edit-reply .reply-date { @@ -6617,7 +6606,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-text, .container-edit-comment .comment-text, .container-add-reply .comment-text, -.view-comment .comment-text, .page-edit-comment .comment-text, .page-add-reply .comment-text, .page-edit-reply .comment-text, @@ -6626,7 +6614,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-text, .container-edit-comment .reply-text, .container-add-reply .reply-text, -.view-comment .reply-text, .page-edit-comment .reply-text, .page-add-reply .reply-text, .page-edit-reply .reply-text { @@ -6642,7 +6629,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item, .container-edit-comment .reply-item, .container-add-reply .reply-item, -.view-comment .reply-item, .page-edit-comment .reply-item, .page-add-reply .reply-item, .page-edit-reply .reply-item { @@ -6655,7 +6641,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, .container-add-reply .reply-item .header-reply, -.view-comment .reply-item .header-reply, .page-edit-comment .reply-item .header-reply, .page-add-reply .reply-item .header-reply, .page-edit-reply .reply-item .header-reply { @@ -6667,7 +6652,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, .container-add-reply .reply-item .user-name, -.view-comment .reply-item .user-name, .page-edit-comment .reply-item .user-name, .page-add-reply .reply-item .user-name, .page-edit-reply .reply-item .user-name { @@ -6678,7 +6662,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item:before, .container-edit-comment .reply-item:before, .container-add-reply .reply-item:before, -.view-comment .reply-item:before, .page-edit-comment .reply-item:before, .page-add-reply .reply-item:before, .page-edit-reply .reply-item:before { @@ -6701,7 +6684,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-quote, .container-edit-comment .comment-quote, .container-add-reply .comment-quote, -.view-comment .comment-quote, .page-edit-comment .comment-quote, .page-add-reply .comment-quote, .page-edit-reply .comment-quote { @@ -6716,7 +6698,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, .container-add-reply .wrap-comment, -.view-comment .wrap-comment, .page-edit-comment .wrap-comment, .page-add-reply .wrap-comment, .page-edit-reply .wrap-comment, @@ -6725,7 +6706,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .wrap-reply, .container-edit-comment .wrap-reply, .container-add-reply .wrap-reply, -.view-comment .wrap-reply, .page-edit-comment .wrap-reply, .page-add-reply .wrap-reply, .page-edit-reply .wrap-reply { @@ -6736,7 +6716,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, -.view-comment .comment-textarea, .page-edit-comment .comment-textarea, .page-add-reply .comment-textarea, .page-edit-reply .comment-textarea, @@ -6745,7 +6724,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, -.view-comment .reply-textarea, .page-edit-comment .reply-textarea, .page-add-reply .reply-textarea, .page-edit-reply .reply-textarea, @@ -6754,7 +6732,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea, .page-edit-comment .edit-reply-textarea, .page-add-reply .edit-reply-textarea, .page-edit-reply .edit-reply-textarea { @@ -6790,22 +6767,17 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-comment .pages { background-color: #FFFFFF; } -.container-view-comment .page-view-comments, -.container-view-comment .view-comment { +.container-view-comment .page-view-comments { background-color: #FFFFFF; } -.container-view-comment .page-view-comments .list-block, -.container-view-comment .view-comment .list-block { +.container-view-comment .page-view-comments .list-block { margin-bottom: 100px; } .container-view-comment .page-view-comments .list-block ul:before, -.container-view-comment .view-comment .list-block ul:before, -.container-view-comment .page-view-comments .list-block ul:after, -.container-view-comment .view-comment .list-block ul:after { +.container-view-comment .page-view-comments .list-block ul:after { content: none; } -.container-view-comment .page-view-comments .list-block .item-inner, -.container-view-comment .view-comment .list-block .item-inner { +.container-view-comment .page-view-comments .list-block .item-inner { padding: 0; } .container-view-comment .toolbar { @@ -6861,34 +6833,37 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-comment.popover .toolbar .toolbar-inner { padding-right: 0; } -.container-view-comment.popover .page { +.container-view-comment.popover .pages { + position: absolute; +} +.container-view-comment.popover .pages .page { border-radius: 13px; } -.container-view-comment.popover .page .page-content { +.container-view-comment.popover .pages .page .page-content { padding: 16px; padding-bottom: 80px; } -.container-view-comment.popover .page .page-content .list-block { +.container-view-comment.popover .pages .page .page-content .list-block { margin-bottom: 0px; } -.container-view-comment.popover .page .page-content .list-block .item-content { +.container-view-comment.popover .pages .page .page-content .list-block .item-content { padding-left: 0; } -.container-view-comment.popover .page .page-content .list-block .item-content .header-comment, -.container-view-comment.popover .page .page-content .list-block .item-content .reply-item { +.container-view-comment.popover .pages .page .page-content .list-block .item-content .header-comment, +.container-view-comment.popover .pages .page .page-content .list-block .item-content .reply-item { padding-right: 0; } -.container-view-comment.popover .page .page-content .block-reply { +.container-view-comment.popover .pages .page .page-content .block-reply { margin-top: 10px; } -.container-view-comment.popover .page .page-content .block-reply .reply-textarea { +.container-view-comment.popover .pages .page .page-content .block-reply .reply-textarea { min-height: 70px; width: 278px; border: 1px solid #c4c4c4; border-radius: 6px; padding: 5px; } -.container-view-comment.popover .page .page-content .edit-reply-textarea { +.container-view-comment.popover .pages .page .page-content .edit-reply-textarea { min-height: 60px; width: 100%; border: 1px solid #c4c4c4; @@ -6897,10 +6872,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after height: 60px; margin-top: 10px; } -.container-view-comment.popover .page .page-content .comment-text { +.container-view-comment.popover .pages .page .page-content .comment-text { padding-right: 0; } -.container-view-comment.popover .page .page-content .comment-text .comment-textarea { +.container-view-comment.popover .pages .page .page-content .comment-text .comment-textarea { border: 1px solid #c4c4c4; border-radius: 6px; padding: 8px; diff --git a/apps/documenteditor/mobile/resources/css/app-material.css b/apps/documenteditor/mobile/resources/css/app-material.css index 2ea8931d6..bc06120d8 100644 --- a/apps/documenteditor/mobile/resources/css/app-material.css +++ b/apps/documenteditor/mobile/resources/css/app-material.css @@ -6061,7 +6061,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-block ul:before, .container-edit-comment .list-block ul:before, .container-add-reply .list-block ul:before, -.view-comment .list-block ul:before, .page-edit-comment .list-block ul:before, .page-add-reply .list-block ul:before, .page-edit-reply .list-block ul:before, @@ -6070,7 +6069,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-block ul:after, .container-edit-comment .list-block ul:after, .container-add-reply .list-block ul:after, -.view-comment .list-block ul:after, .page-edit-comment .list-block ul:after, .page-add-reply .list-block ul:after, .page-edit-reply .list-block ul:after { @@ -6081,7 +6079,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, .container-add-reply .list-block .item-inner, -.view-comment .list-block .item-inner, .page-edit-comment .list-block .item-inner, .page-add-reply .list-block .item-inner, .page-edit-reply .list-block .item-inner { @@ -6094,7 +6091,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-block .item-inner:after, .container-edit-comment .list-block .item-inner:after, .container-add-reply .list-block .item-inner:after, -.view-comment .list-block .item-inner:after, .page-edit-comment .list-block .item-inner:after, .page-add-reply .list-block .item-inner:after, .page-edit-reply .list-block .item-inner:after { @@ -6105,7 +6101,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments p, .container-edit-comment p, .container-add-reply p, -.view-comment p, .page-edit-comment p, .page-add-reply p, .page-edit-reply p { @@ -6117,7 +6112,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-reply, .container-edit-comment .list-reply, .container-add-reply .list-reply, -.view-comment .list-reply, .page-edit-comment .list-reply, .page-add-reply .list-reply, .page-edit-reply .list-reply { @@ -6128,7 +6122,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, -.view-comment .reply-textarea, .page-edit-comment .reply-textarea, .page-add-reply .reply-textarea, .page-edit-reply .reply-textarea, @@ -6137,7 +6130,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, -.view-comment .comment-textarea, .page-edit-comment .comment-textarea, .page-add-reply .comment-textarea, .page-edit-reply .comment-textarea, @@ -6146,7 +6138,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea, .page-edit-comment .edit-reply-textarea, .page-add-reply .edit-reply-textarea, .page-edit-reply .edit-reply-textarea { @@ -6157,7 +6148,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .user-name, .container-edit-comment .user-name, .container-add-reply .user-name, -.view-comment .user-name, .page-edit-comment .user-name, .page-add-reply .user-name, .page-edit-reply .user-name { @@ -6171,7 +6161,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-date, .container-edit-comment .comment-date, .container-add-reply .comment-date, -.view-comment .comment-date, .page-edit-comment .comment-date, .page-add-reply .comment-date, .page-edit-reply .comment-date, @@ -6180,7 +6169,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-date, .container-edit-comment .reply-date, .container-add-reply .reply-date, -.view-comment .reply-date, .page-edit-comment .reply-date, .page-add-reply .reply-date, .page-edit-reply .reply-date { @@ -6195,7 +6183,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-text, .container-edit-comment .comment-text, .container-add-reply .comment-text, -.view-comment .comment-text, .page-edit-comment .comment-text, .page-add-reply .comment-text, .page-edit-reply .comment-text, @@ -6204,7 +6191,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-text, .container-edit-comment .reply-text, .container-add-reply .reply-text, -.view-comment .reply-text, .page-edit-comment .reply-text, .page-add-reply .reply-text, .page-edit-reply .reply-text { @@ -6220,7 +6206,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item, .container-edit-comment .reply-item, .container-add-reply .reply-item, -.view-comment .reply-item, .page-edit-comment .reply-item, .page-add-reply .reply-item, .page-edit-reply .reply-item { @@ -6232,7 +6217,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, .container-add-reply .reply-item .header-reply, -.view-comment .reply-item .header-reply, .page-edit-comment .reply-item .header-reply, .page-add-reply .reply-item .header-reply, .page-edit-reply .reply-item .header-reply { @@ -6244,7 +6228,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, .container-add-reply .reply-item .user-name, -.view-comment .reply-item .user-name, .page-edit-comment .reply-item .user-name, .page-add-reply .reply-item .user-name, .page-edit-reply .reply-item .user-name { @@ -6255,7 +6238,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-quote, .container-edit-comment .comment-quote, .container-add-reply .comment-quote, -.view-comment .comment-quote, .page-edit-comment .comment-quote, .page-add-reply .comment-quote, .page-edit-reply .comment-quote { @@ -6270,7 +6252,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, .container-add-reply .wrap-comment, -.view-comment .wrap-comment, .page-edit-comment .wrap-comment, .page-add-reply .wrap-comment, .page-edit-reply .wrap-comment, @@ -6279,7 +6260,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .wrap-reply, .container-edit-comment .wrap-reply, .container-add-reply .wrap-reply, -.view-comment .wrap-reply, .page-edit-comment .wrap-reply, .page-add-reply .wrap-reply, .page-edit-reply .wrap-reply { @@ -6290,7 +6270,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, -.view-comment .comment-textarea, .page-edit-comment .comment-textarea, .page-add-reply .comment-textarea, .page-edit-reply .comment-textarea, @@ -6299,7 +6278,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, -.view-comment .reply-textarea, .page-edit-comment .reply-textarea, .page-add-reply .reply-textarea, .page-edit-reply .reply-textarea, @@ -6308,7 +6286,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea, .page-edit-comment .edit-reply-textarea, .page-add-reply .edit-reply-textarea, .page-edit-reply .edit-reply-textarea { @@ -6326,7 +6303,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment, .container-edit-comment .header-comment, .container-add-reply .header-comment, -.view-comment .header-comment, .page-edit-comment .header-comment, .page-add-reply .header-comment, .page-edit-reply .header-comment { @@ -6339,7 +6315,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .comment-right, .container-edit-comment .header-comment .comment-right, .container-add-reply .header-comment .comment-right, -.view-comment .header-comment .comment-right, .page-edit-comment .header-comment .comment-right, .page-add-reply .header-comment .comment-right, .page-edit-reply .header-comment .comment-right { @@ -6352,7 +6327,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .comment-left, .container-edit-comment .header-comment .comment-left, .container-add-reply .header-comment .comment-left, -.view-comment .header-comment .comment-left, .page-edit-comment .header-comment .comment-left, .page-add-reply .header-comment .comment-left, .page-edit-reply .header-comment .comment-left { @@ -6364,7 +6338,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .initials-comment, .container-edit-comment .header-comment .initials-comment, .container-add-reply .header-comment .initials-comment, -.view-comment .header-comment .initials-comment, .page-edit-comment .header-comment .initials-comment, .page-add-reply .header-comment .initials-comment, .page-edit-reply .header-comment .initials-comment { @@ -6383,7 +6356,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-reply .reply-left, .container-edit-comment .header-reply .reply-left, .container-add-reply .header-reply .reply-left, -.view-comment .header-reply .reply-left, .page-edit-comment .header-reply .reply-left, .page-add-reply .header-reply .reply-left, .page-edit-reply .header-reply .reply-left { @@ -6396,7 +6368,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-reply .initials-reply, .container-edit-comment .header-reply .initials-reply, .container-add-reply .header-reply .initials-reply, -.view-comment .header-reply .initials-reply, .page-edit-comment .header-reply .initials-reply, .page-add-reply .header-reply .initials-reply, .page-edit-reply .header-reply .initials-reply { @@ -6429,22 +6400,17 @@ html.phone .document-menu .list-block .item-link { height: 50%; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } -.container-view-comment .page-view-comments, -.container-view-comment .view-comment { +.container-view-comment .page-view-comments { background-color: #FFFFFF; } -.container-view-comment .page-view-comments .list-block, -.container-view-comment .view-comment .list-block { +.container-view-comment .page-view-comments .list-block { margin-bottom: 120px; } .container-view-comment .page-view-comments .list-block ul:before, -.container-view-comment .view-comment .list-block ul:before, -.container-view-comment .page-view-comments .list-block ul:after, -.container-view-comment .view-comment .list-block ul:after { +.container-view-comment .page-view-comments .list-block ul:after { content: none; } -.container-view-comment .page-view-comments .list-block .item-inner, -.container-view-comment .view-comment .list-block .item-inner { +.container-view-comment .page-view-comments .list-block .item-inner { padding: 0; } .container-view-comment .toolbar { @@ -6507,34 +6473,37 @@ html.phone .document-menu .list-block .item-link { .container-view-comment.popover .toolbar .toolbar-inner { padding-right: 0; } -.container-view-comment.popover .page { +.container-view-comment.popover .pages { + position: absolute; +} +.container-view-comment.popover .pages .page { border-radius: 13px; } -.container-view-comment.popover .page .page-content { +.container-view-comment.popover .pages .page .page-content { padding: 16px; padding-bottom: 80px; } -.container-view-comment.popover .page .page-content .list-block { +.container-view-comment.popover .pages .page .page-content .list-block { margin-bottom: 0px; } -.container-view-comment.popover .page .page-content .list-block .item-content { +.container-view-comment.popover .pages .page .page-content .list-block .item-content { padding-left: 0; } -.container-view-comment.popover .page .page-content .list-block .item-content .header-comment, -.container-view-comment.popover .page .page-content .list-block .item-content .reply-item { +.container-view-comment.popover .pages .page .page-content .list-block .item-content .header-comment, +.container-view-comment.popover .pages .page .page-content .list-block .item-content .reply-item { padding-right: 0; } -.container-view-comment.popover .page .page-content .block-reply { +.container-view-comment.popover .pages .page .page-content .block-reply { margin-top: 10px; } -.container-view-comment.popover .page .page-content .block-reply .reply-textarea { +.container-view-comment.popover .pages .page .page-content .block-reply .reply-textarea { min-height: 70px; width: 278px; border: 1px solid #c4c4c4; border-radius: 6px; padding: 5px; } -.container-view-comment.popover .page .page-content .edit-reply-textarea { +.container-view-comment.popover .pages .page .page-content .edit-reply-textarea { min-height: 60px; width: 100%; border: 1px solid #c4c4c4; @@ -6543,10 +6512,10 @@ html.phone .document-menu .list-block .item-link { height: 60px; margin-top: 10px; } -.container-view-comment.popover .page .page-content .comment-text { +.container-view-comment.popover .pages .page .page-content .comment-text { padding-right: 0; } -.container-view-comment.popover .page .page-content .comment-text .comment-textarea { +.container-view-comment.popover .pages .page .page-content .comment-text .comment-textarea { border: 1px solid #c4c4c4; border-radius: 6px; padding: 8px; diff --git a/apps/presentationeditor/mobile/resources/css/app-ios.css b/apps/presentationeditor/mobile/resources/css/app-ios.css index fd9fef61d..6ae23fa66 100644 --- a/apps/presentationeditor/mobile/resources/css/app-ios.css +++ b/apps/presentationeditor/mobile/resources/css/app-ios.css @@ -6487,7 +6487,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .header-comment, .container-edit-comment .header-comment, .container-add-reply .header-comment, -.view-comment .header-comment, .page-edit-comment .header-comment, .page-add-reply .header-comment, .page-edit-reply .header-comment { @@ -6500,7 +6499,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .header-comment .comment-right, .container-edit-comment .header-comment .comment-right, .container-add-reply .header-comment .comment-right, -.view-comment .header-comment .comment-right, .page-edit-comment .header-comment .comment-right, .page-add-reply .header-comment .comment-right, .page-edit-reply .header-comment .comment-right { @@ -6513,7 +6511,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, .container-add-reply .list-block .item-inner, -.view-comment .list-block .item-inner, .page-edit-comment .list-block .item-inner, .page-add-reply .list-block .item-inner, .page-edit-reply .list-block .item-inner { @@ -6526,7 +6523,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments p, .container-edit-comment p, .container-add-reply p, -.view-comment p, .page-edit-comment p, .page-add-reply p, .page-edit-reply p { @@ -6538,7 +6534,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .list-reply, .container-edit-comment .list-reply, .container-add-reply .list-reply, -.view-comment .list-reply, .page-edit-comment .list-reply, .page-add-reply .list-reply, .page-edit-reply .list-reply { @@ -6549,7 +6544,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, -.view-comment .reply-textarea, .page-edit-comment .reply-textarea, .page-add-reply .reply-textarea, .page-edit-reply .reply-textarea, @@ -6558,7 +6552,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, -.view-comment .comment-textarea, .page-edit-comment .comment-textarea, .page-add-reply .comment-textarea, .page-edit-reply .comment-textarea, @@ -6567,7 +6560,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea, .page-edit-comment .edit-reply-textarea, .page-add-reply .edit-reply-textarea, .page-edit-reply .edit-reply-textarea { @@ -6578,7 +6570,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .user-name, .container-edit-comment .user-name, .container-add-reply .user-name, -.view-comment .user-name, .page-edit-comment .user-name, .page-add-reply .user-name, .page-edit-reply .user-name { @@ -6593,7 +6584,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-date, .container-edit-comment .comment-date, .container-add-reply .comment-date, -.view-comment .comment-date, .page-edit-comment .comment-date, .page-add-reply .comment-date, .page-edit-reply .comment-date, @@ -6602,7 +6592,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-date, .container-edit-comment .reply-date, .container-add-reply .reply-date, -.view-comment .reply-date, .page-edit-comment .reply-date, .page-add-reply .reply-date, .page-edit-reply .reply-date { @@ -6617,7 +6606,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-text, .container-edit-comment .comment-text, .container-add-reply .comment-text, -.view-comment .comment-text, .page-edit-comment .comment-text, .page-add-reply .comment-text, .page-edit-reply .comment-text, @@ -6626,7 +6614,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-text, .container-edit-comment .reply-text, .container-add-reply .reply-text, -.view-comment .reply-text, .page-edit-comment .reply-text, .page-add-reply .reply-text, .page-edit-reply .reply-text { @@ -6642,7 +6629,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item, .container-edit-comment .reply-item, .container-add-reply .reply-item, -.view-comment .reply-item, .page-edit-comment .reply-item, .page-add-reply .reply-item, .page-edit-reply .reply-item { @@ -6655,7 +6641,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, .container-add-reply .reply-item .header-reply, -.view-comment .reply-item .header-reply, .page-edit-comment .reply-item .header-reply, .page-add-reply .reply-item .header-reply, .page-edit-reply .reply-item .header-reply { @@ -6667,7 +6652,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, .container-add-reply .reply-item .user-name, -.view-comment .reply-item .user-name, .page-edit-comment .reply-item .user-name, .page-add-reply .reply-item .user-name, .page-edit-reply .reply-item .user-name { @@ -6678,7 +6662,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item:before, .container-edit-comment .reply-item:before, .container-add-reply .reply-item:before, -.view-comment .reply-item:before, .page-edit-comment .reply-item:before, .page-add-reply .reply-item:before, .page-edit-reply .reply-item:before { @@ -6701,7 +6684,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-quote, .container-edit-comment .comment-quote, .container-add-reply .comment-quote, -.view-comment .comment-quote, .page-edit-comment .comment-quote, .page-add-reply .comment-quote, .page-edit-reply .comment-quote { @@ -6716,7 +6698,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, .container-add-reply .wrap-comment, -.view-comment .wrap-comment, .page-edit-comment .wrap-comment, .page-add-reply .wrap-comment, .page-edit-reply .wrap-comment, @@ -6725,7 +6706,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .wrap-reply, .container-edit-comment .wrap-reply, .container-add-reply .wrap-reply, -.view-comment .wrap-reply, .page-edit-comment .wrap-reply, .page-add-reply .wrap-reply, .page-edit-reply .wrap-reply { @@ -6736,7 +6716,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, -.view-comment .comment-textarea, .page-edit-comment .comment-textarea, .page-add-reply .comment-textarea, .page-edit-reply .comment-textarea, @@ -6745,7 +6724,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, -.view-comment .reply-textarea, .page-edit-comment .reply-textarea, .page-add-reply .reply-textarea, .page-edit-reply .reply-textarea, @@ -6754,7 +6732,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea, .page-edit-comment .edit-reply-textarea, .page-add-reply .edit-reply-textarea, .page-edit-reply .edit-reply-textarea { @@ -6790,22 +6767,17 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-comment .pages { background-color: #FFFFFF; } -.container-view-comment .page-view-comments, -.container-view-comment .view-comment { +.container-view-comment .page-view-comments { background-color: #FFFFFF; } -.container-view-comment .page-view-comments .list-block, -.container-view-comment .view-comment .list-block { +.container-view-comment .page-view-comments .list-block { margin-bottom: 100px; } .container-view-comment .page-view-comments .list-block ul:before, -.container-view-comment .view-comment .list-block ul:before, -.container-view-comment .page-view-comments .list-block ul:after, -.container-view-comment .view-comment .list-block ul:after { +.container-view-comment .page-view-comments .list-block ul:after { content: none; } -.container-view-comment .page-view-comments .list-block .item-inner, -.container-view-comment .view-comment .list-block .item-inner { +.container-view-comment .page-view-comments .list-block .item-inner { padding: 0; } .container-view-comment .toolbar { @@ -6861,34 +6833,37 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-comment.popover .toolbar .toolbar-inner { padding-right: 0; } -.container-view-comment.popover .page { +.container-view-comment.popover .pages { + position: absolute; +} +.container-view-comment.popover .pages .page { border-radius: 13px; } -.container-view-comment.popover .page .page-content { +.container-view-comment.popover .pages .page .page-content { padding: 16px; padding-bottom: 80px; } -.container-view-comment.popover .page .page-content .list-block { +.container-view-comment.popover .pages .page .page-content .list-block { margin-bottom: 0px; } -.container-view-comment.popover .page .page-content .list-block .item-content { +.container-view-comment.popover .pages .page .page-content .list-block .item-content { padding-left: 0; } -.container-view-comment.popover .page .page-content .list-block .item-content .header-comment, -.container-view-comment.popover .page .page-content .list-block .item-content .reply-item { +.container-view-comment.popover .pages .page .page-content .list-block .item-content .header-comment, +.container-view-comment.popover .pages .page .page-content .list-block .item-content .reply-item { padding-right: 0; } -.container-view-comment.popover .page .page-content .block-reply { +.container-view-comment.popover .pages .page .page-content .block-reply { margin-top: 10px; } -.container-view-comment.popover .page .page-content .block-reply .reply-textarea { +.container-view-comment.popover .pages .page .page-content .block-reply .reply-textarea { min-height: 70px; width: 278px; border: 1px solid #c4c4c4; border-radius: 6px; padding: 5px; } -.container-view-comment.popover .page .page-content .edit-reply-textarea { +.container-view-comment.popover .pages .page .page-content .edit-reply-textarea { min-height: 60px; width: 100%; border: 1px solid #c4c4c4; @@ -6897,10 +6872,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after height: 60px; margin-top: 10px; } -.container-view-comment.popover .page .page-content .comment-text { +.container-view-comment.popover .pages .page .page-content .comment-text { padding-right: 0; } -.container-view-comment.popover .page .page-content .comment-text .comment-textarea { +.container-view-comment.popover .pages .page .page-content .comment-text .comment-textarea { border: 1px solid #c4c4c4; border-radius: 6px; padding: 8px; diff --git a/apps/presentationeditor/mobile/resources/css/app-material.css b/apps/presentationeditor/mobile/resources/css/app-material.css index d5be5c3ff..fa11f66a1 100644 --- a/apps/presentationeditor/mobile/resources/css/app-material.css +++ b/apps/presentationeditor/mobile/resources/css/app-material.css @@ -6061,7 +6061,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-block ul:before, .container-edit-comment .list-block ul:before, .container-add-reply .list-block ul:before, -.view-comment .list-block ul:before, .page-edit-comment .list-block ul:before, .page-add-reply .list-block ul:before, .page-edit-reply .list-block ul:before, @@ -6070,7 +6069,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-block ul:after, .container-edit-comment .list-block ul:after, .container-add-reply .list-block ul:after, -.view-comment .list-block ul:after, .page-edit-comment .list-block ul:after, .page-add-reply .list-block ul:after, .page-edit-reply .list-block ul:after { @@ -6081,7 +6079,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, .container-add-reply .list-block .item-inner, -.view-comment .list-block .item-inner, .page-edit-comment .list-block .item-inner, .page-add-reply .list-block .item-inner, .page-edit-reply .list-block .item-inner { @@ -6094,7 +6091,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-block .item-inner:after, .container-edit-comment .list-block .item-inner:after, .container-add-reply .list-block .item-inner:after, -.view-comment .list-block .item-inner:after, .page-edit-comment .list-block .item-inner:after, .page-add-reply .list-block .item-inner:after, .page-edit-reply .list-block .item-inner:after { @@ -6105,7 +6101,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments p, .container-edit-comment p, .container-add-reply p, -.view-comment p, .page-edit-comment p, .page-add-reply p, .page-edit-reply p { @@ -6117,7 +6112,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-reply, .container-edit-comment .list-reply, .container-add-reply .list-reply, -.view-comment .list-reply, .page-edit-comment .list-reply, .page-add-reply .list-reply, .page-edit-reply .list-reply { @@ -6128,7 +6122,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, -.view-comment .reply-textarea, .page-edit-comment .reply-textarea, .page-add-reply .reply-textarea, .page-edit-reply .reply-textarea, @@ -6137,7 +6130,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, -.view-comment .comment-textarea, .page-edit-comment .comment-textarea, .page-add-reply .comment-textarea, .page-edit-reply .comment-textarea, @@ -6146,7 +6138,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea, .page-edit-comment .edit-reply-textarea, .page-add-reply .edit-reply-textarea, .page-edit-reply .edit-reply-textarea { @@ -6157,7 +6148,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .user-name, .container-edit-comment .user-name, .container-add-reply .user-name, -.view-comment .user-name, .page-edit-comment .user-name, .page-add-reply .user-name, .page-edit-reply .user-name { @@ -6171,7 +6161,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-date, .container-edit-comment .comment-date, .container-add-reply .comment-date, -.view-comment .comment-date, .page-edit-comment .comment-date, .page-add-reply .comment-date, .page-edit-reply .comment-date, @@ -6180,7 +6169,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-date, .container-edit-comment .reply-date, .container-add-reply .reply-date, -.view-comment .reply-date, .page-edit-comment .reply-date, .page-add-reply .reply-date, .page-edit-reply .reply-date { @@ -6195,7 +6183,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-text, .container-edit-comment .comment-text, .container-add-reply .comment-text, -.view-comment .comment-text, .page-edit-comment .comment-text, .page-add-reply .comment-text, .page-edit-reply .comment-text, @@ -6204,7 +6191,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-text, .container-edit-comment .reply-text, .container-add-reply .reply-text, -.view-comment .reply-text, .page-edit-comment .reply-text, .page-add-reply .reply-text, .page-edit-reply .reply-text { @@ -6220,7 +6206,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item, .container-edit-comment .reply-item, .container-add-reply .reply-item, -.view-comment .reply-item, .page-edit-comment .reply-item, .page-add-reply .reply-item, .page-edit-reply .reply-item { @@ -6232,7 +6217,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, .container-add-reply .reply-item .header-reply, -.view-comment .reply-item .header-reply, .page-edit-comment .reply-item .header-reply, .page-add-reply .reply-item .header-reply, .page-edit-reply .reply-item .header-reply { @@ -6244,7 +6228,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, .container-add-reply .reply-item .user-name, -.view-comment .reply-item .user-name, .page-edit-comment .reply-item .user-name, .page-add-reply .reply-item .user-name, .page-edit-reply .reply-item .user-name { @@ -6255,7 +6238,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-quote, .container-edit-comment .comment-quote, .container-add-reply .comment-quote, -.view-comment .comment-quote, .page-edit-comment .comment-quote, .page-add-reply .comment-quote, .page-edit-reply .comment-quote { @@ -6270,7 +6252,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, .container-add-reply .wrap-comment, -.view-comment .wrap-comment, .page-edit-comment .wrap-comment, .page-add-reply .wrap-comment, .page-edit-reply .wrap-comment, @@ -6279,7 +6260,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .wrap-reply, .container-edit-comment .wrap-reply, .container-add-reply .wrap-reply, -.view-comment .wrap-reply, .page-edit-comment .wrap-reply, .page-add-reply .wrap-reply, .page-edit-reply .wrap-reply { @@ -6290,7 +6270,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, -.view-comment .comment-textarea, .page-edit-comment .comment-textarea, .page-add-reply .comment-textarea, .page-edit-reply .comment-textarea, @@ -6299,7 +6278,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, -.view-comment .reply-textarea, .page-edit-comment .reply-textarea, .page-add-reply .reply-textarea, .page-edit-reply .reply-textarea, @@ -6308,7 +6286,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea, .page-edit-comment .edit-reply-textarea, .page-add-reply .edit-reply-textarea, .page-edit-reply .edit-reply-textarea { @@ -6326,7 +6303,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment, .container-edit-comment .header-comment, .container-add-reply .header-comment, -.view-comment .header-comment, .page-edit-comment .header-comment, .page-add-reply .header-comment, .page-edit-reply .header-comment { @@ -6339,7 +6315,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .comment-right, .container-edit-comment .header-comment .comment-right, .container-add-reply .header-comment .comment-right, -.view-comment .header-comment .comment-right, .page-edit-comment .header-comment .comment-right, .page-add-reply .header-comment .comment-right, .page-edit-reply .header-comment .comment-right { @@ -6352,7 +6327,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .comment-left, .container-edit-comment .header-comment .comment-left, .container-add-reply .header-comment .comment-left, -.view-comment .header-comment .comment-left, .page-edit-comment .header-comment .comment-left, .page-add-reply .header-comment .comment-left, .page-edit-reply .header-comment .comment-left { @@ -6364,7 +6338,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .initials-comment, .container-edit-comment .header-comment .initials-comment, .container-add-reply .header-comment .initials-comment, -.view-comment .header-comment .initials-comment, .page-edit-comment .header-comment .initials-comment, .page-add-reply .header-comment .initials-comment, .page-edit-reply .header-comment .initials-comment { @@ -6383,7 +6356,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-reply .reply-left, .container-edit-comment .header-reply .reply-left, .container-add-reply .header-reply .reply-left, -.view-comment .header-reply .reply-left, .page-edit-comment .header-reply .reply-left, .page-add-reply .header-reply .reply-left, .page-edit-reply .header-reply .reply-left { @@ -6396,7 +6368,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-reply .initials-reply, .container-edit-comment .header-reply .initials-reply, .container-add-reply .header-reply .initials-reply, -.view-comment .header-reply .initials-reply, .page-edit-comment .header-reply .initials-reply, .page-add-reply .header-reply .initials-reply, .page-edit-reply .header-reply .initials-reply { @@ -6429,22 +6400,17 @@ html.phone .document-menu .list-block .item-link { height: 50%; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } -.container-view-comment .page-view-comments, -.container-view-comment .view-comment { +.container-view-comment .page-view-comments { background-color: #FFFFFF; } -.container-view-comment .page-view-comments .list-block, -.container-view-comment .view-comment .list-block { +.container-view-comment .page-view-comments .list-block { margin-bottom: 120px; } .container-view-comment .page-view-comments .list-block ul:before, -.container-view-comment .view-comment .list-block ul:before, -.container-view-comment .page-view-comments .list-block ul:after, -.container-view-comment .view-comment .list-block ul:after { +.container-view-comment .page-view-comments .list-block ul:after { content: none; } -.container-view-comment .page-view-comments .list-block .item-inner, -.container-view-comment .view-comment .list-block .item-inner { +.container-view-comment .page-view-comments .list-block .item-inner { padding: 0; } .container-view-comment .toolbar { @@ -6507,34 +6473,37 @@ html.phone .document-menu .list-block .item-link { .container-view-comment.popover .toolbar .toolbar-inner { padding-right: 0; } -.container-view-comment.popover .page { +.container-view-comment.popover .pages { + position: absolute; +} +.container-view-comment.popover .pages .page { border-radius: 13px; } -.container-view-comment.popover .page .page-content { +.container-view-comment.popover .pages .page .page-content { padding: 16px; padding-bottom: 80px; } -.container-view-comment.popover .page .page-content .list-block { +.container-view-comment.popover .pages .page .page-content .list-block { margin-bottom: 0px; } -.container-view-comment.popover .page .page-content .list-block .item-content { +.container-view-comment.popover .pages .page .page-content .list-block .item-content { padding-left: 0; } -.container-view-comment.popover .page .page-content .list-block .item-content .header-comment, -.container-view-comment.popover .page .page-content .list-block .item-content .reply-item { +.container-view-comment.popover .pages .page .page-content .list-block .item-content .header-comment, +.container-view-comment.popover .pages .page .page-content .list-block .item-content .reply-item { padding-right: 0; } -.container-view-comment.popover .page .page-content .block-reply { +.container-view-comment.popover .pages .page .page-content .block-reply { margin-top: 10px; } -.container-view-comment.popover .page .page-content .block-reply .reply-textarea { +.container-view-comment.popover .pages .page .page-content .block-reply .reply-textarea { min-height: 70px; width: 278px; border: 1px solid #c4c4c4; border-radius: 6px; padding: 5px; } -.container-view-comment.popover .page .page-content .edit-reply-textarea { +.container-view-comment.popover .pages .page .page-content .edit-reply-textarea { min-height: 60px; width: 100%; border: 1px solid #c4c4c4; @@ -6543,10 +6512,10 @@ html.phone .document-menu .list-block .item-link { height: 60px; margin-top: 10px; } -.container-view-comment.popover .page .page-content .comment-text { +.container-view-comment.popover .pages .page .page-content .comment-text { padding-right: 0; } -.container-view-comment.popover .page .page-content .comment-text .comment-textarea { +.container-view-comment.popover .pages .page .page-content .comment-text .comment-textarea { border: 1px solid #c4c4c4; border-radius: 6px; padding: 8px; diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css index 32f523dfe..44a7fb9f3 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css @@ -6480,7 +6480,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .header-comment, .container-edit-comment .header-comment, .container-add-reply .header-comment, -.view-comment .header-comment, .page-edit-comment .header-comment, .page-add-reply .header-comment, .page-edit-reply .header-comment { @@ -6493,7 +6492,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .header-comment .comment-right, .container-edit-comment .header-comment .comment-right, .container-add-reply .header-comment .comment-right, -.view-comment .header-comment .comment-right, .page-edit-comment .header-comment .comment-right, .page-add-reply .header-comment .comment-right, .page-edit-reply .header-comment .comment-right { @@ -6506,7 +6504,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, .container-add-reply .list-block .item-inner, -.view-comment .list-block .item-inner, .page-edit-comment .list-block .item-inner, .page-add-reply .list-block .item-inner, .page-edit-reply .list-block .item-inner { @@ -6519,7 +6516,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments p, .container-edit-comment p, .container-add-reply p, -.view-comment p, .page-edit-comment p, .page-add-reply p, .page-edit-reply p { @@ -6531,7 +6527,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .list-reply, .container-edit-comment .list-reply, .container-add-reply .list-reply, -.view-comment .list-reply, .page-edit-comment .list-reply, .page-add-reply .list-reply, .page-edit-reply .list-reply { @@ -6542,7 +6537,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, -.view-comment .reply-textarea, .page-edit-comment .reply-textarea, .page-add-reply .reply-textarea, .page-edit-reply .reply-textarea, @@ -6551,7 +6545,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, -.view-comment .comment-textarea, .page-edit-comment .comment-textarea, .page-add-reply .comment-textarea, .page-edit-reply .comment-textarea, @@ -6560,7 +6553,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea, .page-edit-comment .edit-reply-textarea, .page-add-reply .edit-reply-textarea, .page-edit-reply .edit-reply-textarea { @@ -6571,7 +6563,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .user-name, .container-edit-comment .user-name, .container-add-reply .user-name, -.view-comment .user-name, .page-edit-comment .user-name, .page-add-reply .user-name, .page-edit-reply .user-name { @@ -6586,7 +6577,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-date, .container-edit-comment .comment-date, .container-add-reply .comment-date, -.view-comment .comment-date, .page-edit-comment .comment-date, .page-add-reply .comment-date, .page-edit-reply .comment-date, @@ -6595,7 +6585,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-date, .container-edit-comment .reply-date, .container-add-reply .reply-date, -.view-comment .reply-date, .page-edit-comment .reply-date, .page-add-reply .reply-date, .page-edit-reply .reply-date { @@ -6610,7 +6599,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-text, .container-edit-comment .comment-text, .container-add-reply .comment-text, -.view-comment .comment-text, .page-edit-comment .comment-text, .page-add-reply .comment-text, .page-edit-reply .comment-text, @@ -6619,7 +6607,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-text, .container-edit-comment .reply-text, .container-add-reply .reply-text, -.view-comment .reply-text, .page-edit-comment .reply-text, .page-add-reply .reply-text, .page-edit-reply .reply-text { @@ -6635,7 +6622,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item, .container-edit-comment .reply-item, .container-add-reply .reply-item, -.view-comment .reply-item, .page-edit-comment .reply-item, .page-add-reply .reply-item, .page-edit-reply .reply-item { @@ -6648,7 +6634,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, .container-add-reply .reply-item .header-reply, -.view-comment .reply-item .header-reply, .page-edit-comment .reply-item .header-reply, .page-add-reply .reply-item .header-reply, .page-edit-reply .reply-item .header-reply { @@ -6660,7 +6645,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, .container-add-reply .reply-item .user-name, -.view-comment .reply-item .user-name, .page-edit-comment .reply-item .user-name, .page-add-reply .reply-item .user-name, .page-edit-reply .reply-item .user-name { @@ -6671,7 +6655,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-item:before, .container-edit-comment .reply-item:before, .container-add-reply .reply-item:before, -.view-comment .reply-item:before, .page-edit-comment .reply-item:before, .page-add-reply .reply-item:before, .page-edit-reply .reply-item:before { @@ -6694,7 +6677,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-quote, .container-edit-comment .comment-quote, .container-add-reply .comment-quote, -.view-comment .comment-quote, .page-edit-comment .comment-quote, .page-add-reply .comment-quote, .page-edit-reply .comment-quote { @@ -6709,7 +6691,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, .container-add-reply .wrap-comment, -.view-comment .wrap-comment, .page-edit-comment .wrap-comment, .page-add-reply .wrap-comment, .page-edit-reply .wrap-comment, @@ -6718,7 +6699,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .wrap-reply, .container-edit-comment .wrap-reply, .container-add-reply .wrap-reply, -.view-comment .wrap-reply, .page-edit-comment .wrap-reply, .page-add-reply .wrap-reply, .page-edit-reply .wrap-reply { @@ -6729,7 +6709,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, -.view-comment .comment-textarea, .page-edit-comment .comment-textarea, .page-add-reply .comment-textarea, .page-edit-reply .comment-textarea, @@ -6738,7 +6717,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, -.view-comment .reply-textarea, .page-edit-comment .reply-textarea, .page-add-reply .reply-textarea, .page-edit-reply .reply-textarea, @@ -6747,7 +6725,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea, .page-edit-comment .edit-reply-textarea, .page-add-reply .edit-reply-textarea, .page-edit-reply .edit-reply-textarea { @@ -6783,22 +6760,17 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-comment .pages { background-color: #FFFFFF; } -.container-view-comment .page-view-comments, -.container-view-comment .view-comment { +.container-view-comment .page-view-comments { background-color: #FFFFFF; } -.container-view-comment .page-view-comments .list-block, -.container-view-comment .view-comment .list-block { +.container-view-comment .page-view-comments .list-block { margin-bottom: 100px; } .container-view-comment .page-view-comments .list-block ul:before, -.container-view-comment .view-comment .list-block ul:before, -.container-view-comment .page-view-comments .list-block ul:after, -.container-view-comment .view-comment .list-block ul:after { +.container-view-comment .page-view-comments .list-block ul:after { content: none; } -.container-view-comment .page-view-comments .list-block .item-inner, -.container-view-comment .view-comment .list-block .item-inner { +.container-view-comment .page-view-comments .list-block .item-inner { padding: 0; } .container-view-comment .toolbar { @@ -6854,34 +6826,37 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-view-comment.popover .toolbar .toolbar-inner { padding-right: 0; } -.container-view-comment.popover .page { +.container-view-comment.popover .pages { + position: absolute; +} +.container-view-comment.popover .pages .page { border-radius: 13px; } -.container-view-comment.popover .page .page-content { +.container-view-comment.popover .pages .page .page-content { padding: 16px; padding-bottom: 80px; } -.container-view-comment.popover .page .page-content .list-block { +.container-view-comment.popover .pages .page .page-content .list-block { margin-bottom: 0px; } -.container-view-comment.popover .page .page-content .list-block .item-content { +.container-view-comment.popover .pages .page .page-content .list-block .item-content { padding-left: 0; } -.container-view-comment.popover .page .page-content .list-block .item-content .header-comment, -.container-view-comment.popover .page .page-content .list-block .item-content .reply-item { +.container-view-comment.popover .pages .page .page-content .list-block .item-content .header-comment, +.container-view-comment.popover .pages .page .page-content .list-block .item-content .reply-item { padding-right: 0; } -.container-view-comment.popover .page .page-content .block-reply { +.container-view-comment.popover .pages .page .page-content .block-reply { margin-top: 10px; } -.container-view-comment.popover .page .page-content .block-reply .reply-textarea { +.container-view-comment.popover .pages .page .page-content .block-reply .reply-textarea { min-height: 70px; width: 278px; border: 1px solid #c4c4c4; border-radius: 6px; padding: 5px; } -.container-view-comment.popover .page .page-content .edit-reply-textarea { +.container-view-comment.popover .pages .page .page-content .edit-reply-textarea { min-height: 60px; width: 100%; border: 1px solid #c4c4c4; @@ -6890,10 +6865,10 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after height: 60px; margin-top: 10px; } -.container-view-comment.popover .page .page-content .comment-text { +.container-view-comment.popover .pages .page .page-content .comment-text { padding-right: 0; } -.container-view-comment.popover .page .page-content .comment-text .comment-textarea { +.container-view-comment.popover .pages .page .page-content .comment-text .comment-textarea { border: 1px solid #c4c4c4; border-radius: 6px; padding: 8px; diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-material.css b/apps/spreadsheeteditor/mobile/resources/css/app-material.css index 93a468c05..a2b95dc58 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-material.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-material.css @@ -6071,7 +6071,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-block ul:before, .container-edit-comment .list-block ul:before, .container-add-reply .list-block ul:before, -.view-comment .list-block ul:before, .page-edit-comment .list-block ul:before, .page-add-reply .list-block ul:before, .page-edit-reply .list-block ul:before, @@ -6080,7 +6079,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-block ul:after, .container-edit-comment .list-block ul:after, .container-add-reply .list-block ul:after, -.view-comment .list-block ul:after, .page-edit-comment .list-block ul:after, .page-add-reply .list-block ul:after, .page-edit-reply .list-block ul:after { @@ -6091,7 +6089,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-block .item-inner, .container-edit-comment .list-block .item-inner, .container-add-reply .list-block .item-inner, -.view-comment .list-block .item-inner, .page-edit-comment .list-block .item-inner, .page-add-reply .list-block .item-inner, .page-edit-reply .list-block .item-inner { @@ -6104,7 +6101,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-block .item-inner:after, .container-edit-comment .list-block .item-inner:after, .container-add-reply .list-block .item-inner:after, -.view-comment .list-block .item-inner:after, .page-edit-comment .list-block .item-inner:after, .page-add-reply .list-block .item-inner:after, .page-edit-reply .list-block .item-inner:after { @@ -6115,7 +6111,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments p, .container-edit-comment p, .container-add-reply p, -.view-comment p, .page-edit-comment p, .page-add-reply p, .page-edit-reply p { @@ -6127,7 +6122,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .list-reply, .container-edit-comment .list-reply, .container-add-reply .list-reply, -.view-comment .list-reply, .page-edit-comment .list-reply, .page-add-reply .list-reply, .page-edit-reply .list-reply { @@ -6138,7 +6132,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, -.view-comment .reply-textarea, .page-edit-comment .reply-textarea, .page-add-reply .reply-textarea, .page-edit-reply .reply-textarea, @@ -6147,7 +6140,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, -.view-comment .comment-textarea, .page-edit-comment .comment-textarea, .page-add-reply .comment-textarea, .page-edit-reply .comment-textarea, @@ -6156,7 +6148,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea, .page-edit-comment .edit-reply-textarea, .page-add-reply .edit-reply-textarea, .page-edit-reply .edit-reply-textarea { @@ -6167,7 +6158,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .user-name, .container-edit-comment .user-name, .container-add-reply .user-name, -.view-comment .user-name, .page-edit-comment .user-name, .page-add-reply .user-name, .page-edit-reply .user-name { @@ -6181,7 +6171,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-date, .container-edit-comment .comment-date, .container-add-reply .comment-date, -.view-comment .comment-date, .page-edit-comment .comment-date, .page-add-reply .comment-date, .page-edit-reply .comment-date, @@ -6190,7 +6179,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-date, .container-edit-comment .reply-date, .container-add-reply .reply-date, -.view-comment .reply-date, .page-edit-comment .reply-date, .page-add-reply .reply-date, .page-edit-reply .reply-date { @@ -6205,7 +6193,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-text, .container-edit-comment .comment-text, .container-add-reply .comment-text, -.view-comment .comment-text, .page-edit-comment .comment-text, .page-add-reply .comment-text, .page-edit-reply .comment-text, @@ -6214,7 +6201,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-text, .container-edit-comment .reply-text, .container-add-reply .reply-text, -.view-comment .reply-text, .page-edit-comment .reply-text, .page-add-reply .reply-text, .page-edit-reply .reply-text { @@ -6230,7 +6216,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item, .container-edit-comment .reply-item, .container-add-reply .reply-item, -.view-comment .reply-item, .page-edit-comment .reply-item, .page-add-reply .reply-item, .page-edit-reply .reply-item { @@ -6242,7 +6227,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item .header-reply, .container-edit-comment .reply-item .header-reply, .container-add-reply .reply-item .header-reply, -.view-comment .reply-item .header-reply, .page-edit-comment .reply-item .header-reply, .page-add-reply .reply-item .header-reply, .page-edit-reply .reply-item .header-reply { @@ -6254,7 +6238,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-item .user-name, .container-edit-comment .reply-item .user-name, .container-add-reply .reply-item .user-name, -.view-comment .reply-item .user-name, .page-edit-comment .reply-item .user-name, .page-add-reply .reply-item .user-name, .page-edit-reply .reply-item .user-name { @@ -6265,7 +6248,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-quote, .container-edit-comment .comment-quote, .container-add-reply .comment-quote, -.view-comment .comment-quote, .page-edit-comment .comment-quote, .page-add-reply .comment-quote, .page-edit-reply .comment-quote { @@ -6280,7 +6262,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .wrap-comment, .container-edit-comment .wrap-comment, .container-add-reply .wrap-comment, -.view-comment .wrap-comment, .page-edit-comment .wrap-comment, .page-add-reply .wrap-comment, .page-edit-reply .wrap-comment, @@ -6289,7 +6270,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .wrap-reply, .container-edit-comment .wrap-reply, .container-add-reply .wrap-reply, -.view-comment .wrap-reply, .page-edit-comment .wrap-reply, .page-add-reply .wrap-reply, .page-edit-reply .wrap-reply { @@ -6300,7 +6280,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .comment-textarea, .container-edit-comment .comment-textarea, .container-add-reply .comment-textarea, -.view-comment .comment-textarea, .page-edit-comment .comment-textarea, .page-add-reply .comment-textarea, .page-edit-reply .comment-textarea, @@ -6309,7 +6288,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .reply-textarea, .container-edit-comment .reply-textarea, .container-add-reply .reply-textarea, -.view-comment .reply-textarea, .page-edit-comment .reply-textarea, .page-add-reply .reply-textarea, .page-edit-reply .reply-textarea, @@ -6318,7 +6296,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .edit-reply-textarea, .container-edit-comment .edit-reply-textarea, .container-add-reply .edit-reply-textarea, -.view-comment .edit-reply-textarea, .page-edit-comment .edit-reply-textarea, .page-add-reply .edit-reply-textarea, .page-edit-reply .edit-reply-textarea { @@ -6336,7 +6313,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment, .container-edit-comment .header-comment, .container-add-reply .header-comment, -.view-comment .header-comment, .page-edit-comment .header-comment, .page-add-reply .header-comment, .page-edit-reply .header-comment { @@ -6349,7 +6325,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .comment-right, .container-edit-comment .header-comment .comment-right, .container-add-reply .header-comment .comment-right, -.view-comment .header-comment .comment-right, .page-edit-comment .header-comment .comment-right, .page-add-reply .header-comment .comment-right, .page-edit-reply .header-comment .comment-right { @@ -6362,7 +6337,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .comment-left, .container-edit-comment .header-comment .comment-left, .container-add-reply .header-comment .comment-left, -.view-comment .header-comment .comment-left, .page-edit-comment .header-comment .comment-left, .page-add-reply .header-comment .comment-left, .page-edit-reply .header-comment .comment-left { @@ -6374,7 +6348,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-comment .initials-comment, .container-edit-comment .header-comment .initials-comment, .container-add-reply .header-comment .initials-comment, -.view-comment .header-comment .initials-comment, .page-edit-comment .header-comment .initials-comment, .page-add-reply .header-comment .initials-comment, .page-edit-reply .header-comment .initials-comment { @@ -6393,7 +6366,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-reply .reply-left, .container-edit-comment .header-reply .reply-left, .container-add-reply .header-reply .reply-left, -.view-comment .header-reply .reply-left, .page-edit-comment .header-reply .reply-left, .page-add-reply .header-reply .reply-left, .page-edit-reply .header-reply .reply-left { @@ -6406,7 +6378,6 @@ html.phone .document-menu .list-block .item-link { .page-view-comments .header-reply .initials-reply, .container-edit-comment .header-reply .initials-reply, .container-add-reply .header-reply .initials-reply, -.view-comment .header-reply .initials-reply, .page-edit-comment .header-reply .initials-reply, .page-add-reply .header-reply .initials-reply, .page-edit-reply .header-reply .initials-reply { @@ -6439,22 +6410,17 @@ html.phone .document-menu .list-block .item-link { height: 50%; box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2), 0px 4px 5px rgba(0, 0, 0, 0.12), 0px 2px 4px rgba(0, 0, 0, 0.14); } -.container-view-comment .page-view-comments, -.container-view-comment .view-comment { +.container-view-comment .page-view-comments { background-color: #FFFFFF; } -.container-view-comment .page-view-comments .list-block, -.container-view-comment .view-comment .list-block { +.container-view-comment .page-view-comments .list-block { margin-bottom: 120px; } .container-view-comment .page-view-comments .list-block ul:before, -.container-view-comment .view-comment .list-block ul:before, -.container-view-comment .page-view-comments .list-block ul:after, -.container-view-comment .view-comment .list-block ul:after { +.container-view-comment .page-view-comments .list-block ul:after { content: none; } -.container-view-comment .page-view-comments .list-block .item-inner, -.container-view-comment .view-comment .list-block .item-inner { +.container-view-comment .page-view-comments .list-block .item-inner { padding: 0; } .container-view-comment .toolbar { @@ -6517,34 +6483,37 @@ html.phone .document-menu .list-block .item-link { .container-view-comment.popover .toolbar .toolbar-inner { padding-right: 0; } -.container-view-comment.popover .page { +.container-view-comment.popover .pages { + position: absolute; +} +.container-view-comment.popover .pages .page { border-radius: 13px; } -.container-view-comment.popover .page .page-content { +.container-view-comment.popover .pages .page .page-content { padding: 16px; padding-bottom: 80px; } -.container-view-comment.popover .page .page-content .list-block { +.container-view-comment.popover .pages .page .page-content .list-block { margin-bottom: 0px; } -.container-view-comment.popover .page .page-content .list-block .item-content { +.container-view-comment.popover .pages .page .page-content .list-block .item-content { padding-left: 0; } -.container-view-comment.popover .page .page-content .list-block .item-content .header-comment, -.container-view-comment.popover .page .page-content .list-block .item-content .reply-item { +.container-view-comment.popover .pages .page .page-content .list-block .item-content .header-comment, +.container-view-comment.popover .pages .page .page-content .list-block .item-content .reply-item { padding-right: 0; } -.container-view-comment.popover .page .page-content .block-reply { +.container-view-comment.popover .pages .page .page-content .block-reply { margin-top: 10px; } -.container-view-comment.popover .page .page-content .block-reply .reply-textarea { +.container-view-comment.popover .pages .page .page-content .block-reply .reply-textarea { min-height: 70px; width: 278px; border: 1px solid #c4c4c4; border-radius: 6px; padding: 5px; } -.container-view-comment.popover .page .page-content .edit-reply-textarea { +.container-view-comment.popover .pages .page .page-content .edit-reply-textarea { min-height: 60px; width: 100%; border: 1px solid #c4c4c4; @@ -6553,10 +6522,10 @@ html.phone .document-menu .list-block .item-link { height: 60px; margin-top: 10px; } -.container-view-comment.popover .page .page-content .comment-text { +.container-view-comment.popover .pages .page .page-content .comment-text { padding-right: 0; } -.container-view-comment.popover .page .page-content .comment-text .comment-textarea { +.container-view-comment.popover .pages .page .page-content .comment-text .comment-textarea { border: 1px solid #c4c4c4; border-radius: 6px; padding: 8px; From 582c1ab6ced805cf969ce7450d0022b61fd5a49e Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Tue, 21 Apr 2020 20:38:07 +0300 Subject: [PATCH 19/23] [mobile] Comments (add translations) --- .../mobile/lib/controller/Collaboration.js | 3 --- apps/common/mobile/lib/view/Collaboration.js | 10 ++++---- .../mobile/app/controller/add/AddOther.js | 2 +- apps/documenteditor/mobile/locale/en.json | 24 ++++++++++++++++++ .../mobile/app/controller/add/AddOther.js | 2 +- apps/presentationeditor/mobile/locale/en.json | 25 +++++++++++++++++++ .../mobile/app/controller/add/AddOther.js | 2 +- apps/spreadsheeteditor/mobile/locale/en.json | 24 ++++++++++++++++++ 8 files changed, 81 insertions(+), 11 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index 0f6778519..013928067 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -1739,16 +1739,13 @@ define([ textParaMoveFromUp: 'Moved Up:', textParaMoveFromDown: 'Moved Down:', textEditUser: 'Document is currently being edited by several users.', - textAddComment: "Add Comment", textCancel: "Cancel", textDone: "Done", textAddReply: "Add Reply", textEdit: 'Edit', textResolve: 'Resolve', textDeleteComment: 'Delete comment', - textEditComment: 'Edit comment', textDeleteReply: 'Delete reply', - textEditReply: 'Edit reply', textReopen: 'Reopen', textMessageDeleteComment: 'Do you really want to delete this comment?', textMessageDeleteReply: 'Do you really want to delete this reply?', diff --git a/apps/common/mobile/lib/view/Collaboration.js b/apps/common/mobile/lib/view/Collaboration.js index 748ec1bd7..b87108959 100644 --- a/apps/common/mobile/lib/view/Collaboration.js +++ b/apps/common/mobile/lib/view/Collaboration.js @@ -440,11 +440,11 @@ define([ textOriginal: 'Original', textChange: 'Review Change', textEditUsers: 'Users', - textNoComments: "This document doesn\'t contain comments", - textEditСomment: "Edit Comment", - textDone: "Done", - textAddReply: "Add Reply", - textEditReply: "Edit Reply", + textNoComments: 'This document doesn\'t contain comments', + textEditСomment: 'Edit Comment', + textDone: 'Done', + textAddReply: 'Add Reply', + textEditReply: 'Edit Reply', textCancel: 'Cancel' } })(), Common.Views.Collaboration || {})) diff --git a/apps/documenteditor/mobile/app/controller/add/AddOther.js b/apps/documenteditor/mobile/app/controller/add/AddOther.js index 041cb3758..fc09c8d7b 100644 --- a/apps/documenteditor/mobile/app/controller/add/AddOther.js +++ b/apps/documenteditor/mobile/app/controller/add/AddOther.js @@ -455,7 +455,7 @@ define([ txtNotUrl: 'This field should be a URL in the format \"http://www.example.com\"', textBottomOfPage: 'Bottom Of Page', textBelowText: 'Below Text', - textDeleteDraft: 'Delete draft?', + textDeleteDraft: 'Do you really want to delete draft?', textCancel: 'Cancel', textContinue: 'Continue' diff --git a/apps/documenteditor/mobile/locale/en.json b/apps/documenteditor/mobile/locale/en.json index 8402c0bb5..a44edb222 100644 --- a/apps/documenteditor/mobile/locale/en.json +++ b/apps/documenteditor/mobile/locale/en.json @@ -12,6 +12,17 @@ "Common.Controllers.Collaboration.textDeleted": "Deleted:", "Common.Controllers.Collaboration.textDStrikeout": "Double strikeout", "Common.Controllers.Collaboration.textEditUser": "Users who are editing the file:", + "Common.Controllers.Collaboration.textCancel": "Cancel", + "Common.Controllers.Collaboration.textDone": "Done", + "Common.Controllers.Collaboration.textAddReply": "Add Reply", + "Common.Controllers.Collaboration.textEdit": "Edit", + "Common.Controllers.Collaboration.textResolve": "Resolve", + "Common.Controllers.Collaboration.textDeleteComment": "Delete comment", + "Common.Controllers.Collaboration.textDeleteReply": "Delete reply", + "Common.Controllers.Collaboration.textReopen": "Reopen", + "Common.Controllers.Collaboration.textMessageDeleteComment": "Do you really want to delete this comment?", + "Common.Controllers.Collaboration.textMessageDeleteReply": "Do you really want to delete this reply?", + "Common.Controllers.Collaboration.textYes": "Yes", "Common.Controllers.Collaboration.textEquation": "Equation", "Common.Controllers.Collaboration.textExact": "exactly", "Common.Controllers.Collaboration.textFirstLine": "First line", @@ -77,6 +88,11 @@ "Common.Views.Collaboration.textReview": "Track Changes", "Common.Views.Collaboration.textReviewing": "Review", "Common.Views.Collaboration.textСomments": "Сomments", + "Common.Views.Collaboration.textEditСomment": "Edit Comment", + "Common.Views.Collaboration.textDone": "Done", + "Common.Views.Collaboration.textAddReply": "Add Reply", + "Common.Views.Collaboration.textEditReply": "Edit Reply", + "Common.Views.Collaboration.textCancel": "Cancel", "DE.Controllers.AddContainer.textImage": "Image", "DE.Controllers.AddContainer.textOther": "Other", "DE.Controllers.AddContainer.textShape": "Shape", @@ -86,6 +102,9 @@ "DE.Controllers.AddOther.textBelowText": "Below Text", "DE.Controllers.AddOther.textBottomOfPage": "Bottom Of Page", "DE.Controllers.AddOther.txtNotUrl": "This field should be a URL in the 'http://www.example.com' format", + "DE.Controllers.AddOther.textDeleteDraft": "Do you really want to delete draft?", + "DE.Controllers.AddOther.textCancel": "Cancel", + "DE.Controllers.AddOther.textContinue": "Continue", "DE.Controllers.AddTable.textCancel": "Cancel", "DE.Controllers.AddTable.textColumns": "Columns", "DE.Controllers.AddTable.textRows": "Rows", @@ -110,6 +129,8 @@ "DE.Controllers.DocumentHolder.textRows": "Rows", "DE.Controllers.DocumentHolder.textCopyCutPasteActions": "Copy, Cut and Paste Actions", "DE.Controllers.DocumentHolder.errorCopyCutPaste": "Copy, cut and paste actions using the context menu will be performed within the current file only. You cannot copy or paste to or from other applications.", + "DE.Controllers.DocumentHolder.menuViewComment": "View Comment", + "DE.Controllers.DocumentHolder.menuAddComment": "Add Comment", "DE.Controllers.EditContainer.textChart": "Chart", "DE.Controllers.EditContainer.textFooter": "Footer", "DE.Controllers.EditContainer.textHeader": "Header", @@ -298,6 +319,9 @@ "DE.Views.AddOther.textSectionBreak": "Section Break", "DE.Views.AddOther.textStartFrom": "Start At", "DE.Views.AddOther.textTip": "Screen Tip", + "DE.Views.AddOther.textComment": "Comment", + "DE.Views.AddOther.textAddComment": "Add Comment", + "DE.Views.AddOther.textDone": "Done", "DE.Views.EditChart.textAddCustomColor": "Add Custom Color", "DE.Views.EditChart.textAlign": "Align", "DE.Views.EditChart.textBack": "Back", diff --git a/apps/presentationeditor/mobile/app/controller/add/AddOther.js b/apps/presentationeditor/mobile/app/controller/add/AddOther.js index b64bc7a35..7d5bddd16 100644 --- a/apps/presentationeditor/mobile/app/controller/add/AddOther.js +++ b/apps/presentationeditor/mobile/app/controller/add/AddOther.js @@ -156,7 +156,7 @@ define([ } }, - textDeleteDraft: 'Delete draft?', + textDeleteDraft: 'Do you really want to delete draft?', textCancel: 'Cancel', textContinue: 'Continue' diff --git a/apps/presentationeditor/mobile/locale/en.json b/apps/presentationeditor/mobile/locale/en.json index 16aac262d..974581605 100644 --- a/apps/presentationeditor/mobile/locale/en.json +++ b/apps/presentationeditor/mobile/locale/en.json @@ -1,5 +1,16 @@ { "Common.Controllers.Collaboration.textEditUser": "Users who are editing the file:", + "Common.Controllers.Collaboration.textCancel": "Cancel", + "Common.Controllers.Collaboration.textDone": "Done", + "Common.Controllers.Collaboration.textAddReply": "Add Reply", + "Common.Controllers.Collaboration.textEdit": "Edit", + "Common.Controllers.Collaboration.textResolve": "Resolve", + "Common.Controllers.Collaboration.textDeleteComment": "Delete comment", + "Common.Controllers.Collaboration.textDeleteReply": "Delete reply", + "Common.Controllers.Collaboration.textReopen": "Reopen", + "Common.Controllers.Collaboration.textMessageDeleteComment": "Do you really want to delete this comment?", + "Common.Controllers.Collaboration.textMessageDeleteReply": "Do you really want to delete this reply?", + "Common.Controllers.Collaboration.textYes": "Yes", "Common.UI.ThemeColorPalette.textCustomColors": "Custom Colors", "Common.UI.ThemeColorPalette.textStandartColors": "Standard Colors", "Common.UI.ThemeColorPalette.textThemeColors": "Theme Colors", @@ -10,11 +21,17 @@ "Common.Views.Collaboration.textEditUsers": "Users", "Common.Views.Collaboration.textNoComments": "This presentation doesn't contain comments", "Common.Views.Collaboration.textСomments": "Сomments", + "Common.Views.Collaboration.textEditСomment": "Edit Comment", + "Common.Views.Collaboration.textDone": "Done", + "Common.Views.Collaboration.textAddReply": "Add Reply", + "Common.Views.Collaboration.textEditReply": "Edit Reply", + "Common.Views.Collaboration.textCancel": "Cancel", "PE.Controllers.AddContainer.textImage": "Image", "PE.Controllers.AddContainer.textLink": "Link", "PE.Controllers.AddContainer.textShape": "Shape", "PE.Controllers.AddContainer.textSlide": "Slide", "PE.Controllers.AddContainer.textTable": "Table", + "PE.Controllers.AddContainer.textOther": "Other", "PE.Controllers.AddImage.textEmptyImgUrl": "You need to specify image URL.", "PE.Controllers.AddImage.txtNotUrl": "This field should be a URL in the format 'http://www.example.com'", "PE.Controllers.AddLink.textDefault": "Selected text", @@ -30,6 +47,9 @@ "PE.Controllers.AddTable.textColumns": "Columns", "PE.Controllers.AddTable.textRows": "Rows", "PE.Controllers.AddTable.textTableSize": "Table Size", + "PE.Controllers.AddOther.textDeleteDraft": "Do you really want to delete draft?", + "PE.Controllers.AddOther.textCancel": "Cancel", + "PE.Controllers.AddOther.textContinue": "Continue", "PE.Controllers.DocumentHolder.menuAddLink": "Add Link", "PE.Controllers.DocumentHolder.menuCopy": "Copy", "PE.Controllers.DocumentHolder.menuCut": "Cut", @@ -38,6 +58,8 @@ "PE.Controllers.DocumentHolder.menuMore": "More", "PE.Controllers.DocumentHolder.menuOpenLink": "Open Link", "PE.Controllers.DocumentHolder.menuPaste": "Paste", + "PE.Controllers.DocumentHolder.menuViewComment": "View Comment", + "PE.Controllers.DocumentHolder.menuAddComment": "Add Comment", "PE.Controllers.DocumentHolder.sheetCancel": "Cancel", "PE.Controllers.DocumentHolder.textCopyCutPasteActions": "Copy, Cut and Paste Actions", "PE.Controllers.DocumentHolder.errorCopyCutPaste": "Copy, cut and paste actions using the context menu will be performed within the current file only. You cannot copy or paste to or from other applications.", @@ -257,6 +279,9 @@ "PE.Views.AddLink.textNumber": "Slide Number", "PE.Views.AddLink.textPrev": "Previous Slide", "PE.Views.AddLink.textTip": "Screen Tip", + "PE.Views.AddOther.textComment": "Comment", + "PE.Views.AddOther.textAddComment": "Add Comment", + "PE.Views.AddOther.textDone": "Done", "PE.Views.EditChart.textAddCustomColor": "Add Custom Color", "PE.Views.EditChart.textAlign": "Align", "PE.Views.EditChart.textAlignBottom": "Align Bottom", diff --git a/apps/spreadsheeteditor/mobile/app/controller/add/AddOther.js b/apps/spreadsheeteditor/mobile/app/controller/add/AddOther.js index 6986b3ba9..e62a322e1 100644 --- a/apps/spreadsheeteditor/mobile/app/controller/add/AddOther.js +++ b/apps/spreadsheeteditor/mobile/app/controller/add/AddOther.js @@ -198,7 +198,7 @@ define([ textEmptyImgUrl : 'You need to specify image URL.', txtNotUrl: 'This field should be a URL in the format \"http://www.example.com\"', - textDeleteDraft: 'Delete draft?', + textDeleteDraft: 'Do you really want to delete draft?', textCancel: 'Cancel', textContinue: 'Continue' } diff --git a/apps/spreadsheeteditor/mobile/locale/en.json b/apps/spreadsheeteditor/mobile/locale/en.json index ee71efa83..65cf7a6b6 100644 --- a/apps/spreadsheeteditor/mobile/locale/en.json +++ b/apps/spreadsheeteditor/mobile/locale/en.json @@ -1,5 +1,16 @@ { "Common.Controllers.Collaboration.textEditUser": "Users who are editing the file:", + "Common.Controllers.Collaboration.textCancel": "Cancel", + "Common.Controllers.Collaboration.textDone": "Done", + "Common.Controllers.Collaboration.textAddReply": "Add Reply", + "Common.Controllers.Collaboration.textEdit": "Edit", + "Common.Controllers.Collaboration.textResolve": "Resolve", + "Common.Controllers.Collaboration.textDeleteComment": "Delete comment", + "Common.Controllers.Collaboration.textDeleteReply": "Delete reply", + "Common.Controllers.Collaboration.textReopen": "Reopen", + "Common.Controllers.Collaboration.textMessageDeleteComment": "Do you really want to delete this comment?", + "Common.Controllers.Collaboration.textMessageDeleteReply": "Do you really want to delete this reply?", + "Common.Controllers.Collaboration.textYes": "Yes", "Common.UI.ThemeColorPalette.textCustomColors": "Custom Colors", "Common.UI.ThemeColorPalette.textStandartColors": "Standard Colors", "Common.UI.ThemeColorPalette.textThemeColors": "Theme Colors", @@ -10,6 +21,11 @@ "Common.Views.Collaboration.textEditUsers": "Users", "Common.Views.Collaboration.textNoComments": "This spreadsheet doesn't contain comments", "Common.Views.Collaboration.textСomments": "Сomments", + "Common.Views.Collaboration.textEditСomment": "Edit Comment", + "Common.Views.Collaboration.textDone": "Done", + "Common.Views.Collaboration.textAddReply": "Add Reply", + "Common.Views.Collaboration.textEditReply": "Edit Reply", + "Common.Views.Collaboration.textCancel": "Cancel", "SSE.Controllers.AddChart.txtDiagramTitle": "Chart Title", "SSE.Controllers.AddChart.txtSeries": "Series", "SSE.Controllers.AddChart.txtXAxis": "X Axis", @@ -23,6 +39,9 @@ "SSE.Controllers.AddLink.txtNotUrl": "This field should be a URL in the format 'http://www.example.com'", "SSE.Controllers.AddOther.textEmptyImgUrl": "You need to specify image URL.", "SSE.Controllers.AddOther.txtNotUrl": "This field should be a URL in the format 'http://www.example.com'", + "SSE.Controllers.AddOther.textDeleteDraft": "Do you really want to delete draft?", + "SSE.Controllers.AddOther.textCancel": "Cancel", + "SSE.Controllers.AddOther.textContinue": "Continue", "SSE.Controllers.DocumentHolder.menuAddLink": "Add Link", "SSE.Controllers.DocumentHolder.menuCell": "Cell", "SSE.Controllers.DocumentHolder.menuCopy": "Copy", @@ -40,6 +59,8 @@ "SSE.Controllers.DocumentHolder.menuUnmerge": "Unmerge", "SSE.Controllers.DocumentHolder.menuUnwrap": "Unwrap", "SSE.Controllers.DocumentHolder.menuWrap": "Wrap", + "SSE.Controllers.DocumentHolder.menuViewComment": "View Comment", + "SSE.Controllers.DocumentHolder.menuAddComment": "Add Comment", "SSE.Controllers.DocumentHolder.sheetCancel": "Cancel", "SSE.Controllers.DocumentHolder.warnMergeLostData": "Operation can destroy data in the selected cells.
    Continue?", "SSE.Controllers.DocumentHolder.textCopyCutPasteActions": "Copy, Cut and Paste Actions", @@ -351,6 +372,9 @@ "SSE.Views.AddOther.textLink": "Link", "SSE.Views.AddOther.textSort": "Sort and Filter", "SSE.Views.AddOther.textLinkSettings": "Link Settings", + "SSE.Views.AddOther.textComment": "Comment", + "SSE.Views.AddOther.textAddComment": "Add Comment", + "SSE.Views.AddOther.textDone": "Done", "SSE.Views.EditCell.textAccounting": "Accounting", "SSE.Views.EditCell.textAddCustomColor": "Add Custom Color", "SSE.Views.EditCell.textAlignBottom": "Align Bottom", From 43c5300cdc702922453abb87a348a4cf21a89efa Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Fri, 24 Apr 2020 14:30:55 +0300 Subject: [PATCH 20/23] [mobile] Comments (fix bugs) --- .../mobile/lib/controller/Collaboration.js | 42 +++++++++++++------ apps/common/mobile/lib/view/Collaboration.js | 16 +++++-- .../resources/less/ios/_collaboration.less | 1 + .../less/material/_collaboration.less | 1 + .../mobile/app/view/add/AddOther.js | 12 ++++++ .../mobile/resources/css/app-ios.css | 1 + .../mobile/resources/css/app-material.css | 1 + .../mobile/app/view/add/AddOther.js | 12 ++++++ .../mobile/resources/css/app-ios.css | 1 + .../mobile/resources/css/app-material.css | 1 + .../mobile/app/view/add/AddOther.js | 12 ++++++ .../mobile/resources/css/app-ios.css | 1 + .../mobile/resources/css/app-material.css | 1 + 13 files changed, 87 insertions(+), 15 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index 013928067..3f2694a0a 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -804,8 +804,8 @@ define([ updateViewComment: function() { this.view.renderViewComments(this.showComments, this.indexCurrentComment); - $('.comment-menu').single('click', _.bind(this.initMenuComments, this)); - $('.reply-menu').single('click', _.bind(this.initReplyMenu, this)); + $('.comment-menu').single('click', _.buffered(this.initMenuComments, 100, this)); + $('.reply-menu').single('click', _.buffered(this.initReplyMenu, 100, this)); $('.comment-resolve').single('click', _.bind(this.onClickResolveComment, this, false)); if (this.showComments.length === 1) { $('.prev-comment, .next-comment').addClass('disabled'); @@ -860,9 +860,9 @@ define([ me.getView('Common.Views.Collaboration').renderViewComments(me.showComments, me.indexCurrentComment); $('.prev-comment').single('click', _.bind(me.onViewPrevComment, me)); $('.next-comment').single('click', _.bind(me.onViewNextComment, me)); - $('.comment-menu').single('click', _.bind(me.initMenuComments, me)); + $('.comment-menu').single('click', _.buffered(me.initMenuComments, 100, me)); $('.add-reply').single('click', _.bind(me.onClickAddReply, me, false)); - $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); + $('.reply-menu').single('click', _.buffered(me.initReplyMenu, 100, me)); $('.comment-resolve').single('click', _.bind(me.onClickResolveComment, me, false)); if (me.showComments.length === 1) { @@ -951,8 +951,8 @@ define([ this.view.renderViewComments(this.showComments, this.indexCurrentComment); var me = this; _.defer(function () { - $('.comment-menu').single('click', _.bind(me.initMenuComments, me)); - $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); + $('.comment-menu').single('click', _.buffered(me.initMenuComments, 100, me)); + $('.reply-menu').single('click', _.buffered(me.initReplyMenu, 100, me)); $('.comment-resolve').single('click', _.bind(me.onClickResolveComment, me, false)); }); } @@ -968,8 +968,8 @@ define([ this.view.renderViewComments(this.showComments, this.indexCurrentComment); var me = this; _.defer(function () { - $('.comment-menu').single('click', _.bind(me.initMenuComments, me)); - $('.reply-menu').single('click', _.bind(me.initReplyMenu, me)); + $('.comment-menu').single('click', _.buffered(me.initMenuComments, 100, me)); + $('.reply-menu').single('click', _.buffered(me.initReplyMenu, 100, me)); $('.comment-resolve').single('click', _.bind(me.onClickResolveComment, me, false)); }); } @@ -1014,7 +1014,19 @@ define([ } _.defer(function () { var $textarea = $('.reply-textarea')[0]; + var $btnAddReply = $('#add-new-reply'); $textarea.focus(); + $btnAddReply.addClass('disabled'); + $textarea.oninput = function () { + if ($textarea.value.length < 1) { + if (!$btnAddReply.hasClass('disabled')) + $btnAddReply.addClass('disabled'); + } else { + if ($btnAddReply.hasClass('disabled')) { + $btnAddReply.removeClass('disabled'); + } + } + }; }); $('#add-new-reply').single('click', _.bind(me.onDoneAddNewReply, me, comment.uid)); $('.cancel-reply').single('click', _.bind(me.onCancelAddNewReply, me)); @@ -1050,7 +1062,7 @@ define([ if ($viewComment.find('.block-reply').length > 0) { $viewComment.find('.block-reply').remove(); } - $viewComment.find('a#add-new-reply, a.cancel-reply').css('display', 'none'); + $viewComment.find('a#add-new-reply, a.cancel-reply').remove(); $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); this.disabledViewComments(false); }, @@ -1112,6 +1124,9 @@ define([ } } ]]); + $$(me.menuComments).on('close', function () { + me.disabledViewComments(false); + }); }, 100); } this.disabledViewComments(true); @@ -1143,7 +1158,7 @@ define([ me.onCommentMenuClick(item.event, idComment, ind); } }); - uiApp.actions([_menuItems, [ + me.menuReply = uiApp.actions([_menuItems, [ { text: me.textCancel, bold: true, @@ -1152,6 +1167,9 @@ define([ } } ]]); + $$(me.menuReply).on('close', function () { + me.disabledViewComments(false); + }); }, 100); this.disabledViewComments(true); } @@ -1434,8 +1452,8 @@ define([ initComments: function() { this.getView('Common.Views.Collaboration').renderComments((this.groupCollectionFilter.length !== 0) ? this.groupCollectionFilter : (this.collectionComments.length !== 0) ? this.collectionComments : false); - $('.comment-menu').single('click', _.bind(this.initMenuComments, this)); - $('.reply-menu').single('click', _.bind(this.initReplyMenu, this)); + $('.comment-menu').single('click', _.buffered(this.initMenuComments, 100, this)); + $('.reply-menu').single('click', _.buffered(this.initReplyMenu, 100, this)); $('.comment-resolve').single('click', _.bind(this.onClickResolveComment, this, false)); $('.comment-quote').single('click', _.bind(this.onSelectComment, this)); }, diff --git a/apps/common/mobile/lib/view/Collaboration.js b/apps/common/mobile/lib/view/Collaboration.js index b87108959..13a47f164 100644 --- a/apps/common/mobile/lib/view/Collaboration.js +++ b/apps/common/mobile/lib/view/Collaboration.js @@ -151,6 +151,15 @@ define([ //Comments + sliceQuote: function(text) { + var sliced = text.slice(0,100); + if (sliced.length < text.length) { + sliced += '...'; + return sliced; + } + return text; + }, + renderViewComments: function(comments, indCurComment) { var isAndroid = Framework7.prototype.device.android === true; var me = this; @@ -180,7 +189,7 @@ define([ } template += '
    '; - if (comment.quote) template += '

    ' + comment.quote + '

    '; + if (comment.quote) template += '

    ' + me.sliceQuote(comment.quote) + '

    '; template += '
    ' + comment.comment + '
    '; if (comment.replys.length > 0) { template += '
      '; @@ -250,7 +259,7 @@ define([ '<% } %>', '', '<% if(item.quote) {%>', - '

      <%= item.quote %>

      ', + '

      <%= quote %>

      ', '<% } %>', '

      <%= item.comment %>

      ', '<% if(replys > 0) {%>', @@ -280,7 +289,8 @@ define([ android: Framework7.prototype.device.android, item: comment, replys: comment.replys.length, - viewmode: me.viewmode + viewmode: me.viewmode, + quote: me.sliceQuote(comment.quote) })); }); $listComments.html(items.join('')); diff --git a/apps/common/mobile/resources/less/ios/_collaboration.less b/apps/common/mobile/resources/less/ios/_collaboration.less index b6812b334..d3a89c340 100644 --- a/apps/common/mobile/resources/less/ios/_collaboration.less +++ b/apps/common/mobile/resources/less/ios/_collaboration.less @@ -171,6 +171,7 @@ color: @themeColor; border-left: 1px solid @themeColor; padding-left: 10px; + padding-right: 16px; margin: 5px 0; font-size: 15px; } diff --git a/apps/common/mobile/resources/less/material/_collaboration.less b/apps/common/mobile/resources/less/material/_collaboration.less index 5a158aef5..d58a5a7ee 100644 --- a/apps/common/mobile/resources/less/material/_collaboration.less +++ b/apps/common/mobile/resources/less/material/_collaboration.less @@ -152,6 +152,7 @@ color: @themeColor; border-left: 1px solid @themeColor; padding-left: 10px; + padding-right: 16px; margin: 5px 0; font-size: 15px; } diff --git a/apps/documenteditor/mobile/app/view/add/AddOther.js b/apps/documenteditor/mobile/app/view/add/AddOther.js index 746f300de..84be9a873 100644 --- a/apps/documenteditor/mobile/app/view/add/AddOther.js +++ b/apps/documenteditor/mobile/app/view/add/AddOther.js @@ -173,7 +173,19 @@ define([ $commentInfo.html(insert); _.defer(function () { var $textarea = $('.comment-textarea')[0]; + var $btnAddComment = $('#done-comment'); + $btnAddComment.addClass('disabled'); $textarea.focus(); + $textarea.oninput = function () { + if ($textarea.value.length < 1) { + if (!$btnAddComment.hasClass('disabled')) + $btnAddComment.addClass('disabled'); + } else { + if ($btnAddComment.hasClass('disabled')) { + $btnAddComment.removeClass('disabled'); + } + } + }; }); }, 100); }, diff --git a/apps/documenteditor/mobile/resources/css/app-ios.css b/apps/documenteditor/mobile/resources/css/app-ios.css index 112fcf541..3fa73222a 100644 --- a/apps/documenteditor/mobile/resources/css/app-ios.css +++ b/apps/documenteditor/mobile/resources/css/app-ios.css @@ -6690,6 +6690,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after color: #446995; border-left: 1px solid #446995; padding-left: 10px; + padding-right: 16px; margin: 5px 0; font-size: 15px; } diff --git a/apps/documenteditor/mobile/resources/css/app-material.css b/apps/documenteditor/mobile/resources/css/app-material.css index bc06120d8..16b33a898 100644 --- a/apps/documenteditor/mobile/resources/css/app-material.css +++ b/apps/documenteditor/mobile/resources/css/app-material.css @@ -6244,6 +6244,7 @@ html.phone .document-menu .list-block .item-link { color: #446995; border-left: 1px solid #446995; padding-left: 10px; + padding-right: 16px; margin: 5px 0; font-size: 15px; } diff --git a/apps/presentationeditor/mobile/app/view/add/AddOther.js b/apps/presentationeditor/mobile/app/view/add/AddOther.js index 6473fba24..34b7a1df9 100644 --- a/apps/presentationeditor/mobile/app/view/add/AddOther.js +++ b/apps/presentationeditor/mobile/app/view/add/AddOther.js @@ -143,7 +143,19 @@ define([ $commentInfo.html(insert); _.defer(function () { var $textarea = $('.comment-textarea')[0]; + var $btnAddComment = $('#done-comment'); + $btnAddComment.addClass('disabled'); $textarea.focus(); + $textarea.oninput = function () { + if ($textarea.value.length < 1) { + if (!$btnAddComment.hasClass('disabled')) + $btnAddComment.addClass('disabled'); + } else { + if ($btnAddComment.hasClass('disabled')) { + $btnAddComment.removeClass('disabled'); + } + } + }; }); }, 100); }, diff --git a/apps/presentationeditor/mobile/resources/css/app-ios.css b/apps/presentationeditor/mobile/resources/css/app-ios.css index 6ae23fa66..44414d9c9 100644 --- a/apps/presentationeditor/mobile/resources/css/app-ios.css +++ b/apps/presentationeditor/mobile/resources/css/app-ios.css @@ -6690,6 +6690,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after color: #aa5252; border-left: 1px solid #aa5252; padding-left: 10px; + padding-right: 16px; margin: 5px 0; font-size: 15px; } diff --git a/apps/presentationeditor/mobile/resources/css/app-material.css b/apps/presentationeditor/mobile/resources/css/app-material.css index fa11f66a1..eb23f750c 100644 --- a/apps/presentationeditor/mobile/resources/css/app-material.css +++ b/apps/presentationeditor/mobile/resources/css/app-material.css @@ -6244,6 +6244,7 @@ html.phone .document-menu .list-block .item-link { color: #aa5252; border-left: 1px solid #aa5252; padding-left: 10px; + padding-right: 16px; margin: 5px 0; font-size: 15px; } diff --git a/apps/spreadsheeteditor/mobile/app/view/add/AddOther.js b/apps/spreadsheeteditor/mobile/app/view/add/AddOther.js index 07e3ddb73..fbc7d6967 100644 --- a/apps/spreadsheeteditor/mobile/app/view/add/AddOther.js +++ b/apps/spreadsheeteditor/mobile/app/view/add/AddOther.js @@ -228,7 +228,19 @@ define([ $commentInfo.html(insert); _.defer(function () { var $textarea = $('.comment-textarea')[0]; + var $btnAddComment = $('#done-comment'); + $btnAddComment.addClass('disabled'); $textarea.focus(); + $textarea.oninput = function () { + if ($textarea.value.length < 1) { + if (!$btnAddComment.hasClass('disabled')) + $btnAddComment.addClass('disabled'); + } else { + if ($btnAddComment.hasClass('disabled')) { + $btnAddComment.removeClass('disabled'); + } + } + }; }); }, 100); }, diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css index 44a7fb9f3..596615b11 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css @@ -6683,6 +6683,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after color: #40865c; border-left: 1px solid #40865c; padding-left: 10px; + padding-right: 16px; margin: 5px 0; font-size: 15px; } diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-material.css b/apps/spreadsheeteditor/mobile/resources/css/app-material.css index a2b95dc58..4291b0a43 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-material.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-material.css @@ -6254,6 +6254,7 @@ html.phone .document-menu .list-block .item-link { color: #40865c; border-left: 1px solid #40865c; padding-left: 10px; + padding-right: 16px; margin: 5px 0; font-size: 15px; } From a3b347c911e362c8187a9060aa2c789b3e63580e Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Thu, 30 Apr 2020 12:55:09 +0300 Subject: [PATCH 21/23] =?UTF-8?q?[mobile]=20=D0=A1hanged=20tabs=20template?= =?UTF-8?q?=20into=20insert?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../mobile/resources/less/ios/_container.less | 17 ++ .../mobile/app/controller/add/AddContainer.js | 12 +- .../mobile/app/controller/add/AddOther.js | 6 +- .../mobile/app/template/AddOther.template | 102 +++++--- .../mobile/app/view/add/AddOther.js | 10 +- apps/documenteditor/mobile/locale/en.json | 1 + .../mobile/resources/css/app-ios.css | 48 ++++ .../mobile/resources/css/app-material.css | 46 +++- .../mobile/resources/less/app-material.less | 12 + .../mobile/resources/less/ios/_icons.less | 47 ++++ .../resources/less/material/_icons.less | 40 +++- .../mobile/app/controller/DocumentHolder.js | 4 +- .../mobile/app/controller/add/AddContainer.js | 45 +--- .../mobile/app/controller/add/AddLink.js | 22 +- .../mobile/app/controller/add/AddOther.js | 18 ++ .../mobile/app/controller/add/AddTable.js | 8 +- .../mobile/app/template/AddLink.template | 171 -------------- .../mobile/app/template/AddOther.template | 223 ++++++++++++++++++ .../mobile/app/template/AddTable.template | 12 - .../mobile/app/view/add/AddLink.js | 137 ----------- .../mobile/app/view/add/AddOther.js | 67 +++++- .../mobile/app/view/add/AddTable.js | 104 -------- apps/presentationeditor/mobile/locale/en.json | 15 ++ .../mobile/resources/css/app-ios.css | 53 +++++ .../mobile/resources/css/app-material.css | 49 +++- .../mobile/resources/less/app-material.less | 12 + .../mobile/resources/less/ios/_icons.less | 51 ++++ .../resources/less/material/_icons.less | 43 +++- .../mobile/app/controller/add/AddContainer.js | 9 +- .../mobile/app/template/AddOther.template | 30 +-- .../mobile/resources/css/app-ios.css | 58 +++++ .../mobile/resources/css/app-material.css | 53 ++++- .../mobile/resources/less/app-material.less | 12 + .../mobile/resources/less/ios/_icons.less | 56 +++++ .../resources/less/material/_icons.less | 46 +++- 35 files changed, 1028 insertions(+), 611 deletions(-) delete mode 100644 apps/presentationeditor/mobile/app/template/AddLink.template delete mode 100644 apps/presentationeditor/mobile/app/template/AddTable.template delete mode 100644 apps/presentationeditor/mobile/app/view/add/AddLink.js delete mode 100644 apps/presentationeditor/mobile/app/view/add/AddTable.js diff --git a/apps/common/mobile/resources/less/ios/_container.less b/apps/common/mobile/resources/less/ios/_container.less index de81509ef..3d1885edf 100644 --- a/apps/common/mobile/resources/less/ios/_container.less +++ b/apps/common/mobile/resources/less/ios/_container.less @@ -97,4 +97,21 @@ .popover-inner { height: 400px; } +} + +.container-add { + .categories { + > .buttons-row { + .button { + &.active { + i.icon { + background-color: transparent; + } + } + display: flex; + justify-content: center; + align-items: center; + } + } + } } \ No newline at end of file diff --git a/apps/documenteditor/mobile/app/controller/add/AddContainer.js b/apps/documenteditor/mobile/app/controller/add/AddContainer.js index 39c5c7608..6a5975fef 100644 --- a/apps/documenteditor/mobile/app/controller/add/AddContainer.js +++ b/apps/documenteditor/mobile/app/controller/add/AddContainer.js @@ -75,6 +75,7 @@ define([ uiApp.closeModal(); me._showByStack(Common.SharedSettings.get('phone')); + uiApp.showTab('#add-other'); DE.getController('Toolbar').getView('Toolbar').hideSearch(); }, @@ -92,6 +93,7 @@ define([ addViews.push({ caption: me.textTable, id: 'add-table', + icon: 'icon-add-table', layout: DE.getController('AddTable') .getView('AddTable') .rootLayout() @@ -100,6 +102,7 @@ define([ addViews.push({ caption: me.textShape, id: 'add-shape', + icon: 'icon-add-shape', layout: DE.getController('AddShape') .getView('AddShape') .rootLayout() @@ -108,6 +111,7 @@ define([ addViews.push({ caption: me.textImage, id: 'add-image', + icon: 'icon-add-image', layout: DE.getController('AddImage') .getView('AddImage') .rootLayout() @@ -116,6 +120,7 @@ define([ addViews.push({ caption: me.textOther, id: 'add-other', + icon: 'icon-add-other', layout: DE.getController('AddOther') .getView('AddOther') .rootLayout() @@ -153,7 +158,7 @@ define([ $layoutNavbar .find('.toolbar-inner') .append( - '' + layout.caption + '' + '' ); }); $layoutNavbar @@ -168,7 +173,7 @@ define([ $layoutNavbar .find('.buttons-row') .append( - '' + layout.caption + '' + '' ); }); } @@ -247,7 +252,8 @@ define([ } me.rootView = uiApp.addView('.add-root-view', { - dynamicNavbar: true + dynamicNavbar: true, + domCache: true }); Common.NotificationCenter.trigger('addcontainer:show'); diff --git a/apps/documenteditor/mobile/app/controller/add/AddOther.js b/apps/documenteditor/mobile/app/controller/add/AddOther.js index fc09c8d7b..7ab12a1e3 100644 --- a/apps/documenteditor/mobile/app/controller/add/AddOther.js +++ b/apps/documenteditor/mobile/app/controller/add/AddOther.js @@ -91,9 +91,6 @@ define([ }, initEvents: function () { - var me = this; - $('#add-other-pagebreak').single('click', _.bind(me.onPageBreak, me)); - $('#add-other-columnbreak').single('click', _.bind(me.onColumnBreak, me)); this.view.hideInsertComments = this.isHideInsertComment(); }, @@ -160,6 +157,9 @@ define([ me.initInsertFootnote(); } else if (pageId === "#addother-insert-comment") { me.initInsertComment(false); + } else if (pageId === "#addother-insert-break") { + $('#add-other-pagebreak').single('click', _.bind(me.onPageBreak, me)); + $('#add-other-columnbreak').single('click', _.bind(me.onColumnBreak, me)); } }, diff --git a/apps/documenteditor/mobile/app/template/AddOther.template b/apps/documenteditor/mobile/app/template/AddOther.template index c664a7dd4..b67fdcf51 100644 --- a/apps/documenteditor/mobile/app/template/AddOther.template +++ b/apps/documenteditor/mobile/app/template/AddOther.template @@ -14,42 +14,6 @@ -
    • - -
      -
      - -
      -
      -
      <%= scope.textPageBreak %>
      -
      -
      -       -
      • -
    • - -
      -
      - -
      -
      -
      <%= scope.textColumnBreak %>
      -
      -
      -       -
      • -
    • - -
      -
      - -
      -
      -
      <%= scope.textSectionBreak %>
      -
      -
      -       -
    • @@ -74,6 +38,18 @@
      • +
    • + +
      +
      + +
      +
      +
      <%= scope.textBreak %>
      +
      +
      +       +
    • @@ -354,4 +330,58 @@
      + + + +       \ No newline at end of file diff --git a/apps/documenteditor/mobile/app/view/add/AddOther.js b/apps/documenteditor/mobile/app/view/add/AddOther.js index 84be9a873..ce0261455 100644 --- a/apps/documenteditor/mobile/app/view/add/AddOther.js +++ b/apps/documenteditor/mobile/app/view/add/AddOther.js @@ -66,10 +66,10 @@ define([ initEvents: function () { var me = this; - $('#add-other-section').single('click', _.bind(me.showSectionBreak, me)); $('#add-other-link').single('click', _.bind(me.showLink, me)); $('#add-other-pagenumber').single('click', _.bind(me.showPagePosition, me)); $('#add-other-footnote').single('click', _.bind(me.showPageFootnote, me)); + $('#add-other-break').single('click', _.bind(me.showPageBreak, me)); if (this.hideInsertComments) { $('#item-comment').hide(); } else { @@ -128,6 +128,11 @@ define([ } }, + showPageBreak: function() { + this.showPage('#addother-insert-break'); + $('#add-other-section').single('click', _.bind(this.showSectionBreak, this)); + }, + showSectionBreak: function () { this.showPage('#addother-sectionbreak'); }, @@ -271,7 +276,8 @@ define([ textLocation: 'Location', textComment: 'Comment', textAddComment: 'Add Comment', - textDone: 'Done' + textDone: 'Done', + textBreak: 'Break' } })(), DE.Views.AddOther || {})) diff --git a/apps/documenteditor/mobile/locale/en.json b/apps/documenteditor/mobile/locale/en.json index a44edb222..f80c28ea9 100644 --- a/apps/documenteditor/mobile/locale/en.json +++ b/apps/documenteditor/mobile/locale/en.json @@ -322,6 +322,7 @@ "DE.Views.AddOther.textComment": "Comment", "DE.Views.AddOther.textAddComment": "Add Comment", "DE.Views.AddOther.textDone": "Done", + "DE.Views.AddOther.textBreak": "Break", "DE.Views.EditChart.textAddCustomColor": "Add Custom Color", "DE.Views.EditChart.textAlign": "Align", "DE.Views.EditChart.textBack": "Back", diff --git a/apps/documenteditor/mobile/resources/css/app-ios.css b/apps/documenteditor/mobile/resources/css/app-ios.css index 3fa73222a..3c06ccd77 100644 --- a/apps/documenteditor/mobile/resources/css/app-ios.css +++ b/apps/documenteditor/mobile/resources/css/app-ios.css @@ -5975,6 +5975,14 @@ html.pixel-ratio-3 .settings.popover .list-block ul:last-child:after { .settings .popover-inner { height: 400px; } +.container-add .categories > .buttons-row .button { + display: flex; + justify-content: center; + align-items: center; +} +.container-add .categories > .buttons-row .button.active i.icon { + background-color: transparent; +} .dataview.page-content { background: #ffffff; } @@ -7535,6 +7543,46 @@ i.icon.icon-insert-comment { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20.1538%209.00708H11.8462C10.8266%209.00708%2010%209.83461%2010%2010.8554V15.1694C10%2016.1902%2010.8266%2017.0177%2011.8462%2017.0177H13.8329C13.9409%2017.0177%2014.0454%2017.0556%2014.1284%2017.1248L18.243%2020.392C18.5436%2020.6428%2019%2020.4288%2019%2020.037V17.4798C19%2017.2246%2019.2066%2017.0177%2019.4615%2017.0177H20.1538C21.1734%2017.0177%2022%2016.1902%2022%2015.1694V10.8554C22%209.83461%2021.1734%209.00708%2020.1538%209.00708ZM20%2010.0083C20.5523%2010.0083%2021%2010.4565%2021%2011.0095V15.0154C21%2015.5683%2020.5523%2016.0165%2020%2016.0165H18.0025L18%2018.8995C18%2019.2912%2018%2019%2018%2019L14.5%2016.0165H12C11.4477%2016.0165%2011%2015.5683%2011%2015.0154V11.0095C11%2010.4565%2011.4477%2010.0083%2012%2010.0083H20Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M14.5%203H4.5C3.18908%203%202%204.2153%202%205.50295V12.0346C2%2013.3222%203.18908%2014.013%204.5%2014.013H5.5C5.82773%2014.013%206%2014.1917%206%2014.5136V17.5183C6%2018.0125%206.6135%2018.3352%207%2018.0189L11%2014.9858V13.5L7%2016.5V13.0118H4.5C3.78992%2013.0118%203%2012.732%203%2012.0346V5.50295C3%204.80547%203.78992%204.00118%204.5%204.00118H14.5C15.2101%204.00118%2016%204.80547%2016%205.50295V8.0059H17V5.50295C17%204.2153%2015.8109%203%2014.5%203Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); } +i.icon.icon-add-table { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M4%205.59998H11.2V8.79998H4V5.59998Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M12.8%205.59998H20V8.79998H12.8V5.59998Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M4%2010.4H11.2V13.6H4V10.4Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M12.8%2010.4H20V13.6H12.8V10.4Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M4%2015.2H11.2V18.4H4V15.2Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M12.8%2015.2H20V18.4H12.8V15.2Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-add-shape { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cellipse%20cx%3D%2215.3333%22%20cy%3D%2214.4002%22%20rx%3D%225.66667%22%20ry%3D%225.60002%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%204.80005C4.44772%204.80005%204%205.24776%204%205.80005V15.8001C4%2016.3524%204.44771%2016.8001%205%2016.8001H9.32787C9.02431%2016.059%208.85714%2015.2488%208.85714%2014.4001C8.85714%2010.8655%2011.7566%208.00012%2015.3333%208.00012C15.8924%208.00012%2016.4349%208.07013%2016.9524%208.20175V5.80005C16.9524%205.24776%2016.5047%204.80005%2015.9524%204.80005H5Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-add-image { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5.79177%2016.6667L8.87529%2013.1667L11.1254%2015.5L14.2089%2012L18.2092%2016.6667H5.79177ZM19.4593%2018.526C19.8204%2018.2101%2020.001%2017.8455%2020.001%2017.4323V6.56771C20.001%206.15451%2019.8204%205.78993%2019.4593%205.47396C19.0981%205.15799%2018.6814%205%2018.2092%205H5.79177C5.31952%205%204.90283%205.15799%204.5417%205.47396C4.18057%205.78993%204%206.15451%204%206.56771V17.4323C4%2017.8455%204.18057%2018.2101%204.5417%2018.526C4.90283%2018.842%205.31952%2019%205.79177%2019H18.2092C18.6814%2019%2019.0981%2018.842%2019.4593%2018.526ZM8.79933%2011.2222C9.68304%2011.2222%2010.3994%2010.5258%2010.3994%209.66667C10.3994%208.80756%209.68304%208.11111%208.79933%208.11111C7.91562%208.11111%207.19923%208.80756%207.19923%209.66667C7.19923%2010.5258%207.91562%2011.2222%208.79933%2011.2222Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-add-other { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M7.00049%2018C7.00049%2018.8284%206.32892%2019.5%205.50049%2019.5C4.67206%2019.5%204.00049%2018.8284%204.00049%2018C4.00049%2017.1716%204.67206%2016.5%205.50049%2016.5C6.32892%2016.5%207.00049%2017.1716%207.00049%2018ZM13.5005%2018C13.5005%2018.8284%2012.8289%2019.5%2012.0005%2019.5C11.1721%2019.5%2010.5005%2018.8284%2010.5005%2018C10.5005%2017.1716%2011.1721%2016.5%2012.0005%2016.5C12.8289%2016.5%2013.5005%2017.1716%2013.5005%2018ZM18.5005%2019.5C19.3289%2019.5%2020.0005%2018.8284%2020.0005%2018C20.0005%2017.1716%2019.3289%2016.5%2018.5005%2016.5C17.6721%2016.5%2017.0005%2017.1716%2017.0005%2018C17.0005%2018.8284%2017.6721%2019.5%2018.5005%2019.5Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); +} +.active i.icon.icon-add-table { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M4%205.59998H11.2V8.79998H4V5.59998Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M12.8%205.59998H20V8.79998H12.8V5.59998Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M4%2010.4H11.2V13.6H4V10.4Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M12.8%2010.4H20V13.6H12.8V10.4Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M4%2015.2H11.2V18.4H4V15.2Z%22%20fill%3D%22white%22%2F%3E%3Cpath%20d%3D%22M12.8%2015.2H20V18.4H12.8V15.2Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); +} +.active i.icon.icon-add-shape { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cellipse%20cx%3D%2215.3333%22%20cy%3D%2214.4002%22%20rx%3D%225.66667%22%20ry%3D%225.60002%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%204.80005C4.44772%204.80005%204%205.24776%204%205.80005V15.8001C4%2016.3524%204.44771%2016.8001%205%2016.8001H9.32787C9.02431%2016.059%208.85714%2015.2488%208.85714%2014.4001C8.85714%2010.8655%2011.7566%208.00012%2015.3333%208.00012C15.8924%208.00012%2016.4349%208.07013%2016.9524%208.20175V5.80005C16.9524%205.24776%2016.5047%204.80005%2015.9524%204.80005H5Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); +} +.active i.icon.icon-add-image { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5.79177%2016.6667L8.87529%2013.1667L11.1254%2015.5L14.2089%2012L18.2092%2016.6667H5.79177ZM19.4593%2018.526C19.8204%2018.2101%2020.001%2017.8455%2020.001%2017.4323V6.56771C20.001%206.15451%2019.8204%205.78993%2019.4593%205.47396C19.0981%205.15799%2018.6814%205%2018.2092%205H5.79177C5.31952%205%204.90283%205.15799%204.5417%205.47396C4.18057%205.78993%204%206.15451%204%206.56771V17.4323C4%2017.8455%204.18057%2018.2101%204.5417%2018.526C4.90283%2018.842%205.31952%2019%205.79177%2019H18.2092C18.6814%2019%2019.0981%2018.842%2019.4593%2018.526ZM8.79933%2011.2222C9.68304%2011.2222%2010.3994%2010.5258%2010.3994%209.66667C10.3994%208.80756%209.68304%208.11111%208.79933%208.11111C7.91562%208.11111%207.19923%208.80756%207.19923%209.66667C7.19923%2010.5258%207.91562%2011.2222%208.79933%2011.2222Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); +} +.active i.icon.icon-add-other { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M7.00049%2018C7.00049%2018.8284%206.32892%2019.5%205.50049%2019.5C4.67206%2019.5%204.00049%2018.8284%204.00049%2018C4.00049%2017.1716%204.67206%2016.5%205.50049%2016.5C6.32892%2016.5%207.00049%2017.1716%207.00049%2018ZM13.5005%2018C13.5005%2018.8284%2012.8289%2019.5%2012.0005%2019.5C11.1721%2019.5%2010.5005%2018.8284%2010.5005%2018C10.5005%2017.1716%2011.1721%2016.5%2012.0005%2016.5C12.8289%2016.5%2013.5005%2017.1716%2013.5005%2018ZM18.5005%2019.5C19.3289%2019.5%2020.0005%2018.8284%2020.0005%2018C20.0005%2017.1716%2019.3289%2016.5%2018.5005%2016.5C17.6721%2016.5%2017.0005%2017.1716%2017.0005%2018C17.0005%2018.8284%2017.6721%2019.5%2018.5005%2019.5Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); +} .label-switch input[type="checkbox"]:checked + .checkbox { background: #446995; } diff --git a/apps/documenteditor/mobile/resources/css/app-material.css b/apps/documenteditor/mobile/resources/css/app-material.css index 16b33a898..67d4bd728 100644 --- a/apps/documenteditor/mobile/resources/css/app-material.css +++ b/apps/documenteditor/mobile/resources/css/app-material.css @@ -6856,32 +6856,32 @@ i.icon.icon-table-remove-row { i.icon.icon-pagebreak { width: 22px; height: 22px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%23446995%22%3E%3Cg%3E%3Cpath%20d%3D%22M8%2C14v1h1v-1H8z%20M6%2C14v1h1v-1H6z%20M18%2C21H3v-6H2v7h17v-7h-1V21z%20M4%2C14v1h1v-1H4z%20M14%2C14v1h1v-1H14z%20M10%2C14v1h1v-1H10z%20M8.2%2C1L2%2C7.6V14h1V9h6V2l0%2C0h9v12h1V1H8.2z%20M8%2C8H3.1L8%2C2.8V8z%20M12%2C14v1h1v-1H12z%20M16%2C14v1h1v-1H16z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0)%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M6%208L10%207.99531V4L6%208ZM10%2010H6V11H4V7L9%202H18C18.5302%202%2018.9864%202.20344%2019.3918%202.61033C19.7661%202.98592%2020%203.46792%2020%204V11H18V4H12V8C12%209.10457%2011.1046%2010%2010%2010ZM6%2017V20.0282L18%2020V17H20V20C20%2020.5321%2019.7973%2021.0297%2019.3918%2021.4366C18.9864%2021.8122%2018.5302%2022%2018%2022H6C5.46979%2022%205.01364%2021.8122%204.60819%2021.4366C4.20273%2021.0297%204%2020.5266%204%2019.9945V17H6Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M3%2013H7V15H3V13Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M9%2013H15V15H9V13Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M17%2013H21V15H17V13Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0%22%3E%3Cpath%20d%3D%22M0.000488281%200H24.0005V24H0.000488281V0Z%22%20fill%3D%22transparent%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E"); } i.icon.icon-sectionbreak { width: 22px; height: 22px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%23446995%22%3E%3Cg%3E%3Cpath%20d%3D%22M20%2C14V2H3v12H2V1h19v13H20z%20M5%2C14v1H4v-1H5z%20M7%2C14v1H6v-1H7z%20M9%2C14v1H8v-1H9z%20M11%2C14v1h-1v-1H11z%20M13%2C14v1h-1v-1H13z%20M15%2C14v1h-1v-1H15z%20M17%2C14v1h-1v-1H17z%20M18%2C14h1v1h-1V14z%20M3%2C21h17v-6h1v7H2v-7h1V21z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0)%22%3E%3Cpath%20d%3D%22M3%2011H7V13H3V11Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M9%2011H15V13H9V11Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M17%2011H21V13H17V11Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M18%204H6V9H4V4C4%202.89543%204.89543%202%206%202H18C18.5302%202%2018.9864%202.20344%2019.3918%202.61033C19.7661%202.98592%2020%203.46792%2020%204V9H18V4ZM6%2015V20.0282L18%2020V15H20V20C20%2020.5321%2019.7973%2021.0297%2019.3918%2021.4366C18.9864%2021.8122%2018.5302%2022%2018%2022H6C5.46979%2022%205.01364%2021.8122%204.60819%2021.4366C4.20273%2021.0297%204%2020.5266%204%2019.9945V15H6Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0%22%3E%3Cpath%20d%3D%22M0%200H24V24H0V0Z%22%20fill%3D%22transparent%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E"); } i.icon.icon-stringbreak { width: 22px; height: 22px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%23446995%22%3E%3Cg%3E%3Cpath%20d%3D%22M18%2C12H5.1L9%2C15.9l-0.7%2C0.7l-4.5-4.5l-0.6-0.6l0.6-0.6l4.5-4.5L9%2C7.1L5.1%2C11H18V5h1v6v1H18z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M10%209.01309L11.4062%2010.4181L7.79688%2014.0241H17.9844V4.00208H20V15.9911H7.79688L11.4062%2019.5971L10%2021.0021L4%2015.0076L10%209.01309Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); } i.icon.icon-pagenumber { width: 22px; height: 22px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%23446995%22%3E%3Cg%3E%3Cpath%20d%3D%22M8.2%2C1L2%2C7.6V22h17V1H8.2z%20M8%2C2.8V8H3.1L8%2C2.8z%20M18%2C21H3V9h6V2l0%2C0h9V21z%20M12%2C19h1v-4h-0.7c0%2C0.2-0.1-0.1-0.1%2C0c-0.1%2C0.1-0.2%2C0-0.3%2C0c-0.1%2C0.1-0.2%2C0.1-0.4%2C0.1c-0.1%2C0-0.3%2C0-0.4%2C0V16H12V19z%20M15.3%2C17.3C15%2C17.9%2C15.1%2C18.4%2C15%2C19h0.9c0-0.3%2C0-0.6%2C0.1-0.9c0.1-0.3%2C0.1-0.6%2C0.3-0.9c0.1-0.3%2C0.3-0.6%2C0.4-0.9c0.2-0.3%2C0.1-0.3%2C0.3-0.5V15h-3v1h1.9C15.6%2C16.4%2C15.5%2C16.7%2C15.3%2C17.3z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M18%204H6V20.0282L18%2020V4ZM4%204.5C4%203.11929%205.11929%202%206.5%202H18C18.5302%202%2018.9864%202.20344%2019.3918%202.61033C19.7661%202.98592%2020%203.46792%2020%204V20C20%2020.5321%2019.7973%2021.0297%2019.3918%2021.4366C18.9864%2021.8122%2018.5302%2022%2018%2022H6C5.46979%2022%205.01364%2021.8122%204.60819%2021.4366C4.20273%2021.0297%204%2020.5266%204%2019.9945V4.5ZM11.5698%2016H10.1836V12.2578H10.1574L9%2013.0686V11.8385L10.1836%2011H11.5698V16ZM14.1593%2016H12.7076L14.6333%2012.1365V12.1088H12.3709V11H16V12.1053L14.1593%2016Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); } i.icon.icon-link { width: 22px; height: 22px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%23446995%22%3E%3Cg%3E%3Cpath%20d%3D%22M12.4%2C9.8c0%2C0-2.1-0.1-3.8%2C1.2c-2.8%2C2-3.3%2C4.3-3.3%2C4.3s1.6-1.7%2C3.5-2.5c1.7-0.7%2C3.7-0.4%2C3.7-0.4v1.9l4.8-3.3V11l-4.8-3.3V9.8z%20M11%2C1C5.5%2C1%2C1%2C5.5%2C1%2C11c0%2C5.5%2C4.5%2C10%2C10%2C10s10-4.5%2C10-10C21%2C5.5%2C16.5%2C1%2C11%2C1z%20M11%2C20c-5%2C0-9-4.1-9-9C2%2C6%2C6%2C2%2C11%2C2s9%2C4.1%2C9%2C9C20%2C16%2C16%2C20%2C11%2C20z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M17.0235%207C18.4006%207%2019.5743%207.49845%2020.5446%208.49534C21.5149%209.46108%2022%2010.6293%2022%2012C22%2013.3708%2021.5149%2014.5546%2020.5446%2015.5515C19.5743%2016.5172%2018.4006%2017.0001%2017.0235%2017.0001H13V15H17C17.8451%2015%2018.5884%2014.7882%2019.1831%2014.1963C19.8091%2013.5733%2020%2012.8411%2020%2012C20%2011.1589%2019.8091%2010.4424%2019.1831%209.85049C18.5884%209.22743%2017.8685%209%2017.0235%209H13V7H17.0235ZM8.00939%2012.9814V11.0187H15.9906V12.9814H8.00939ZM4.76995%209.85049C4.17527%2010.4424%204%2011.1589%204%2012C4%2012.8411%204.17527%2013.5733%204.76995%2014.1963C5.39593%2014.7882%206.15493%2015%207%2015H11.0141V17.0001H6.97653C5.59937%2017.0001%204.42567%2016.5172%203.4554%2015.5515C2.48513%2014.5546%202%2013.3708%202%2012C2%2010.6293%202.48513%209.46108%203.4554%208.49534C4.42567%207.49845%205.59937%207%206.97653%207H11.0141V9H6.97653C6.13146%209%205.39593%209.22743%204.76995%209.85049Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); } i.icon.icon-image-library { - width: 22px; - height: 22px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%2022%2022%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bisolation%3Aisolate%3B%7D.cls-2%7Bopacity%3A0.2%3B%7D.cls-3%7Bfill%3A%23fff%3B%7D.cls-10%2C.cls-11%2C.cls-4%2C.cls-6%2C.cls-7%2C.cls-8%2C.cls-9%7Bmix-blend-mode%3Amultiply%3B%7D.cls-4%7Bfill%3Aurl(%23grad_8)%3B%7D.cls-5%7Bfill%3Aurl(%23grad_10)%3B%7D.cls-6%7Bfill%3Aurl(%23grad_12)%3B%7D.cls-7%7Bfill%3Aurl(%23grad_14)%3B%7D.cls-8%7Bfill%3Aurl(%23grad_79)%3B%7D.cls-9%7Bfill%3Aurl(%23grad_77)%3B%7D.cls-10%7Bfill%3Aurl(%23grad_75)%3B%7D.cls-11%7Bfill%3Aurl(%23grad_81)%3B%7D%3C%2Fstyle%3E%3ClinearGradient%20id%3D%22grad_8%22%20x1%3D%2211.08%22%20y1%3D%2210.26%22%20x2%3D%2211.08%22%20y2%3D%221.26%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23f3e916%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23f89d34%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_10%22%20x1%3D%2211.08%22%20y1%3D%2220.44%22%20x2%3D%2211.08%22%20y2%3D%2211.88%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%235eb6e8%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23958cc3%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_12%22%20x1%3D%221.46%22%20y1%3D%2211.05%22%20x2%3D%2210.46%22%20y2%3D%2211.05%22%20gradientTransform%3D%22translate(17%205.09)%20rotate(90)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23cc8dba%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23f86867%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_14%22%20x1%3D%2211.73%22%20y1%3D%2211.05%22%20x2%3D%2220.73%22%20y2%3D%2211.05%22%20gradientTransform%3D%22translate(27.28%20-5.18)%20rotate(90)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%236ac07f%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23c5da3d%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_79%22%20x1%3D%2211.74%22%20y1%3D%2210.42%22%20x2%3D%2217.52%22%20y2%3D%224.63%22%20gradientTransform%3D%22translate(30.29%202.51)%20rotate(135)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23c5da3d%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23f3e916%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_77%22%20x1%3D%224.7%22%20y1%3D%2217.49%22%20x2%3D%2210.48%22%20y2%3D%2211.71%22%20gradientTransform%3D%22translate(23.24%2019.65)%20rotate(135)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%239595c3%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23cc8dba%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_75%22%20x1%3D%224.69%22%20y1%3D%224.64%22%20x2%3D%2210.47%22%20y2%3D%2210.42%22%20gradientTransform%3D%22translate(7.54%20-3.15)%20rotate(45)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23f86867%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23f89d34%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_81%22%20x1%3D%2211.77%22%20y1%3D%2211.78%22%20x2%3D%2217.55%22%20y2%3D%2217.56%22%20gradientTransform%3D%22translate(14.63%20-6.05)%20rotate(45)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%235ec0e8%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%236ac07f%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Ctitle%3Eicons_for_svg%3C%2Ftitle%3E%3Cg%20class%3D%22cls-1%22%3E%3Cg%20id%3D%22%D0%A1%D0%BB%D0%BE%D0%B9_1%22%20data-name%3D%22%D0%A1%D0%BB%D0%BE%D0%B9%201%22%3E%3Crect%20class%3D%22cls-2%22%20x%3D%220.09%22%20y%3D%220.01%22%20width%3D%2222%22%20height%3D%2222%22%20rx%3D%224%22%20ry%3D%224%22%2F%3E%3Crect%20class%3D%22cls-3%22%20x%3D%220.57%22%20y%3D%220.49%22%20width%3D%2221.04%22%20height%3D%2221.04%22%20rx%3D%223.6%22%20ry%3D%223.6%22%2F%3E%3Crect%20class%3D%22cls-4%22%20x%3D%228.33%22%20y%3D%221.26%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%2F%3E%3Crect%20class%3D%22cls-5%22%20x%3D%228.33%22%20y%3D%2211.76%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%2F%3E%3Crect%20class%3D%22cls-6%22%20x%3D%223.21%22%20y%3D%226.55%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(-5.09%2017)%20rotate(-90)%22%2F%3E%3Crect%20class%3D%22cls-7%22%20x%3D%2213.48%22%20y%3D%226.55%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(5.18%2027.28)%20rotate(-90)%22%2F%3E%3Crect%20class%3D%22cls-8%22%20x%3D%2211.87%22%20y%3D%223.03%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(19.64%2023.19)%20rotate(-135)%22%2F%3E%3Crect%20class%3D%22cls-9%22%20x%3D%224.8%22%20y%3D%2210.14%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(2.54%2030.33)%20rotate(-135)%22%2F%3E%3Crect%20class%3D%22cls-10%22%20x%3D%224.83%22%20y%3D%223.03%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(-3.1%207.56)%20rotate(-45)%22%2F%3E%3Crect%20class%3D%22cls-11%22%20x%3D%2211.87%22%20y%3D%2210.14%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(-6.07%2014.63)%20rotate(-45)%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"); + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0)%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20%205.5H4C3.72386%205.5%203.5%205.72386%203.5%206V15.5822L8.03349%2011.6898C8.47476%2011.3109%209.11904%2011.2865%209.58778%2011.6308L13.5726%2014.5579L15.9619%2012.6774C16.4488%2012.2942%2017.1428%2012.3255%2017.5933%2012.7509L20.5%2015.4962V6C20.5%205.72386%2020.2761%205.5%2020%205.5ZM20.5%2017.5294L20.485%2017.5453L16.7201%2013.9895L14.3509%2015.8542C13.9095%2016.2016%2013.2905%2016.2119%2012.8378%2015.8793L8.85988%2012.9573L3.5%2017.5592V18C3.5%2018.2761%203.72386%2018.5%204%2018.5H20C20.2761%2018.5%2020.5%2018.2761%2020.5%2018V17.5294ZM4%204C2.89543%204%202%204.89543%202%206V18C2%2019.1046%202.89543%2020%204%2020H20C21.1046%2020%2022%2019.1046%2022%2018V6C22%204.89543%2021.1046%204%2020%204H4ZM16.5%209.5C16.5%2011.1569%2015.1569%2012.5%2013.5%2012.5C11.8431%2012.5%2010.5%2011.1569%2010.5%209.5C10.5%207.84315%2011.8431%206.5%2013.5%206.5C15.1569%206.5%2016.5%207.84315%2016.5%209.5ZM13.5%2011C14.3284%2011%2015%2010.3284%2015%209.5C15%208.67157%2014.3284%208%2013.5%208C12.6716%208%2012%208.67157%2012%209.5C12%2010.3284%2012.6716%2011%2013.5%2011Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0%22%3E%3Cpath%20d%3D%22M0%200H24V24H0V0Z%22%20fill%3D%22transparent%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E"); } i.icon.icon-table-borders-all { width: 28px; @@ -7059,7 +7059,7 @@ i.icon.icon-app-settings { i.icon.icon-footnote { width: 24px; height: 24px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M22%208.11133H20.9177V5.15361L20.9282%204.66765L20.9457%204.13624C20.7659%204.31571%2020.641%204.43341%2020.5709%204.48935L19.9825%204.96132L19.4606%204.31105L21.1103%203H22V8.11133Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M10.3363%2018.8514L8.98161%2015.3968H4.61996L3.28021%2018.8514H2L6.3021%207.94526H7.36646L11.6462%2018.8514H10.3363ZM8.58713%2014.2601L7.3218%2010.8947C7.15806%2010.4687%206.98935%209.94621%206.81567%209.32711C6.70651%209.80258%206.5502%2010.3251%206.34676%2010.8947L5.06655%2014.2601H8.58713Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M16.1425%2010.5752C17.2143%2010.5752%2018.0454%2010.9417%2018.6359%2011.6748C19.2313%2012.4028%2019.5291%2013.4355%2019.5291%2014.7728C19.5291%2016.11%2019.2288%2017.1501%2018.6284%2017.893C18.033%2018.631%2017.2043%2019%2016.1425%2019C15.6115%2019%2015.1252%2018.9034%2014.6836%2018.7103C14.2469%2018.5121%2013.8798%2018.21%2013.582%2017.8039H13.4927L13.2322%2018.8514H12.3465V7.29149H13.582V10.0997C13.582%2010.7288%2013.5622%2011.2934%2013.5225%2011.7936H13.582C14.1576%2010.9814%2015.0111%2010.5752%2016.1425%2010.5752ZM15.9638%2011.6079C15.1203%2011.6079%2014.5124%2011.8506%2014.1403%2012.336C13.7681%2012.8164%2013.582%2013.6286%2013.582%2014.7728C13.582%2015.9169%2013.7731%2016.7366%2014.1551%2017.2318C14.5372%2017.7222%2015.15%2017.9673%2015.9936%2017.9673C16.7528%2017.9673%2017.3185%2017.6925%2017.6906%2017.1427C18.0628%2016.588%2018.2488%2015.793%2018.2488%2014.7579C18.2488%2013.698%2018.0628%2012.908%2017.6906%2012.388C17.3185%2011.8679%2016.7429%2011.6079%2015.9638%2011.6079Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M12.1173%2018.7983H10.109L9.36904%2016.6471H4.74829L4.00837%2018.7983H2L5.95633%207.58823H8.161L12.1173%2018.7983ZM8.87072%2014.916L7.05867%209.57143L5.24661%2014.916H8.87072Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M14.7577%2016.3613C14.9288%2016.6639%2015.1906%2016.9216%2015.5429%2017.1345C15.9053%2017.3361%2016.2677%2017.437%2016.6301%2017.437C17.2543%2017.437%2017.7526%2017.1905%2018.1251%2016.6975C18.5076%2016.1933%2018.6989%2015.5434%2018.6989%2014.7479C18.6989%2013.9524%2018.5076%2013.3025%2018.1251%2012.7983C17.7526%2012.2941%2017.2543%2012.042%2016.6301%2012.042C16.2677%2012.042%2015.9103%2012.1485%2015.558%2012.3613C15.2057%2012.5742%2014.9389%2012.8375%2014.7577%2013.1513V16.3613ZM14.7577%2018.7983H13.1721V7.58823H14.7577V11.8067C15.3516%2010.9216%2016.1318%2010.479%2017.0982%2010.479C18.0445%2010.479%2018.8197%2010.8711%2019.4237%2011.6555C20.0277%2012.4286%2020.3298%2013.4594%2020.3298%2014.7479C20.3298%2016.0588%2020.0277%2017.0952%2019.4237%2017.8571C18.8197%2018.619%2018.0445%2019%2017.0982%2019C16.1419%2019%2015.3617%2018.563%2014.7577%2017.6891V18.7983Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M24%2011.7227H22.7769V6.7479L21.7651%207.90756L21.0705%207.08403L22.943%205H24V11.7227Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); } i.icon.icon-cut { width: 24px; @@ -7114,7 +7114,7 @@ i.icon.icon-done-comment { i.icon.icon-insert-comment { width: 24px; height: 24px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20.1538%209.00708H11.8462C10.8266%209.00708%2010%209.83461%2010%2010.8554V15.1694C10%2016.1902%2010.8266%2017.0177%2011.8462%2017.0177H13.8329C13.9409%2017.0177%2014.0454%2017.0556%2014.1284%2017.1248L18.243%2020.392C18.5436%2020.6428%2019%2020.4288%2019%2020.037V17.4798C19%2017.2246%2019.2066%2017.0177%2019.4615%2017.0177H20.1538C21.1734%2017.0177%2022%2016.1902%2022%2015.1694V10.8554C22%209.83461%2021.1734%209.00708%2020.1538%209.00708ZM20%2010.0083C20.5523%2010.0083%2021%2010.4565%2021%2011.0095V15.0154C21%2015.5683%2020.5523%2016.0165%2020%2016.0165H18.0025L18%2018.8995C18%2019.2912%2018%2019%2018%2019L14.5%2016.0165H12C11.4477%2016.0165%2011%2015.5683%2011%2015.0154V11.0095C11%2010.4565%2011.4477%2010.0083%2012%2010.0083H20Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M14.5%203H4.5C3.18908%203%202%204.2153%202%205.50295V12.0346C2%2013.3222%203.18908%2014.013%204.5%2014.013H5.5C5.82773%2014.013%206%2014.1917%206%2014.5136V17.5183C6%2018.0125%206.6135%2018.3352%207%2018.0189L11%2014.9858V13.5L7%2016.5V13.0118H4.5C3.78992%2013.0118%203%2012.732%203%2012.0346V5.50295C3%204.80547%203.78992%204.00118%204.5%204.00118H14.5C15.2101%204.00118%2016%204.80547%2016%205.50295V8.0059H17V5.50295C17%204.2153%2015.8109%203%2014.5%203Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M19.5%203H4.5C3.18908%203%202%204.2153%202%205.50295V15.0346C2%2016.3222%203.18908%2017.013%204.5%2017.013H5.5C5.82773%2017.013%206%2017.1917%206%2017.5136V21L12%2017H20C21.1046%2017%2022%2016.1046%2022%2015V8H20.5V14.5C20.5%2015.0523%2020.0523%2015.5%2019.5%2015.5H11.5L7.5%2018V15.5H4.5C3.94772%2015.5%203.5%2015.0523%203.5%2014.5V5.5C3.5%204.94772%203.94772%204.5%204.5%204.5H19.5C20.0523%204.5%2020.5%204.94772%2020.5%205.5V8H22V5.50295C22%204.2153%2020.8109%203%2019.5%203Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M6%207.5H18V9H6L6%207.5Z%22%20fill%3D%22%23446995%22%2F%3E%3Cpath%20d%3D%22M6%2011H18V12.5H6V11Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); } i.icon.icon-done-comment-white { width: 24px; @@ -7181,6 +7181,26 @@ i.icon.icon-done-comment-white { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M14.9912%206C14.9912%208.18203%2014.4464%209.76912%2013.7789%2010.7492C13.101%2011.7447%2012.4042%2012%2011.9912%2012C11.5782%2012%2010.8814%2011.7447%2010.2035%2010.7492C9.53601%209.76912%208.99121%208.18203%208.99121%206C8.99121%204.23017%2010.4571%203%2011.9912%203C13.5254%203%2014.9912%204.23017%2014.9912%206ZM13.4917%2013.6397C13.0059%2013.8771%2012.4989%2014%2011.9912%2014C11.4861%2014%2010.9817%2013.8784%2010.4983%2013.6434C8.53188%2014.3681%206.94518%2015.0737%205.78927%2015.7768C4.10512%2016.8011%204%2017.4079%204%2017.5C4%2017.7664%204.1014%2018.3077%205.27104%2018.8939C6.50029%2019.5099%208.64545%2019.9999%2012%2020C15.3546%2020%2017.4997%2019.5099%2018.7289%2018.8939C19.8986%2018.3078%2020%2017.7664%2020%2017.5C20%2017.4079%2019.8949%2016.8011%2018.2107%2015.7768C17.0529%2015.0726%2015.4627%2014.3657%2013.4917%2013.6397ZM15.2272%2012.1594C16.2765%2010.7825%2016.9912%208.67814%2016.9912%206C16.9912%203%2014.5%201%2011.9912%201C9.48242%201%206.99121%203%206.99121%206C6.99121%208.68159%207.70777%2010.7879%208.75931%2012.1647C4.60309%2013.7964%202%2015.4951%202%2017.5C2%2019.9852%205%2021.9999%2012%2022C19%2022%2022%2019.9852%2022%2017.5C22%2015.4929%2019.3913%2013.7927%2015.2272%2012.1594Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); } +.navbar i.icon.icon-add-table { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2%204H11V8H2V4Z%22%20fill%3D%22%23fff%22%2F%3E%3Cpath%20d%3D%22M13%204H22V8H13V4Z%22%20fill%3D%22%23fff%22%2F%3E%3Cpath%20d%3D%22M2%2010H11V14H2V10Z%22%20fill%3D%22%23fff%22%2F%3E%3Cpath%20d%3D%22M13%2010H22V14H13V10Z%22%20fill%3D%22%23fff%22%2F%3E%3Cpath%20d%3D%22M2%2016H11V20H2V16Z%22%20fill%3D%22%23fff%22%2F%3E%3Cpath%20d%3D%22M13%2016H22V20H13V16Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); +} +.navbar i.icon.icon-add-shape { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%2215%22%20r%3D%227%22%20fill%3D%22%23fff%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M3%203C2.44772%203%202%203.44772%202%204V17C2%2017.5523%202.44772%2018%203%2018H8.58152C8.20651%2017.0736%208%2016.0609%208%2015C8%2010.5817%2011.5817%207%2016%207C16.6906%207%2017.3608%207.08751%2018%207.25204V4C18%203.44772%2017.5523%203%2017%203H3Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); +} +.navbar i.icon.icon-add-image { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0)%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M4.23958%2018L8.09375%2013.5L10.9062%2016.5L14.7604%2012L19.7604%2018H4.23958ZM21.3229%2020.3906C21.7743%2019.9844%2022%2019.5156%2022%2018.9844V5.01562C22%204.48438%2021.7743%204.01562%2021.3229%203.60938C20.8715%203.20313%2020.3507%203%2019.7604%203H4.23958C3.64931%203%203.12847%203.20313%202.67708%203.60938C2.22569%204.01562%202%204.48438%202%205.01562V18.9844C2%2019.5156%202.22569%2019.9844%202.67708%2020.3906C3.12847%2020.7969%203.64931%2021%204.23958%2021H19.7604C20.3507%2021%2020.8715%2020.7969%2021.3229%2020.3906ZM8%2011C9.10457%2011%2010%2010.1046%2010%209C10%207.89543%209.10457%207%208%207C6.89543%207%206%207.89543%206%209C6%2010.1046%206.89543%2011%208%2011Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0%22%3E%3Cpath%20d%3D%22M0.000477791%200H24.0005V24H0.000477791V0Z%22%20fill%3D%22transparent%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E"); +} +.navbar i.icon.icon-add-other { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M7%2012C7%2013.6569%205.65685%2015%204%2015C2.34315%2015%201%2013.6569%201%2012C1%2010.3431%202.34315%209%204%209C5.65685%209%207%2010.3431%207%2012ZM15%2012C15%2013.6569%2013.6569%2015%2012%2015C10.3431%2015%209%2013.6569%209%2012C9%2010.3431%2010.3431%209%2012%209C13.6569%209%2015%2010.3431%2015%2012ZM20%2015C21.6569%2015%2023%2013.6569%2023%2012C23%2010.3431%2021.6569%209%2020%209C18.3431%209%2017%2010.3431%2017%2012C17%2013.6569%2018.3431%2015%2020%2015Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); +} .sailfish i.icon.icon-text-align-center { background-color: transparent; -webkit-mask-image: none; @@ -7454,6 +7474,12 @@ textarea { #add-shape .page { background-color: #fff; } +.container-add .categories i.icon { + opacity: 0.5; +} +.container-add .categories .active i.icon { + opacity: 1; +} .table-styles .row, .table-styles .row li { margin-bottom: 12px; diff --git a/apps/documenteditor/mobile/resources/less/app-material.less b/apps/documenteditor/mobile/resources/less/app-material.less index 9024b51b5..351b81974 100644 --- a/apps/documenteditor/mobile/resources/less/app-material.less +++ b/apps/documenteditor/mobile/resources/less/app-material.less @@ -113,6 +113,18 @@ input, textarea { background-color: #fff; } } +.container-add { + .categories { + i.icon { + opacity: 0.5; + } + .active { + i.icon { + opacity: 1; + } + } + } +} // Table styles diff --git a/apps/documenteditor/mobile/resources/less/ios/_icons.less b/apps/documenteditor/mobile/resources/less/ios/_icons.less index 3dbeb8ea5..9e331152b 100644 --- a/apps/documenteditor/mobile/resources/less/ios/_icons.less +++ b/apps/documenteditor/mobile/resources/less/ios/_icons.less @@ -503,4 +503,51 @@ i.icon { height: 24px; .encoded-svg-background(''); } + + //Insert + &.icon-add-table { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-shape { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-image { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-other { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } +} + +.active { + i.icon { + &.icon-add-table { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-shape { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-image { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-other { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + } } \ No newline at end of file diff --git a/apps/documenteditor/mobile/resources/less/material/_icons.less b/apps/documenteditor/mobile/resources/less/material/_icons.less index 252119b10..4db39aeac 100644 --- a/apps/documenteditor/mobile/resources/less/material/_icons.less +++ b/apps/documenteditor/mobile/resources/less/material/_icons.less @@ -173,32 +173,32 @@ i.icon { &.icon-pagebreak { width: 22px; height: 22px; - .encoded-svg-background(''); + .encoded-svg-background(''); } &.icon-sectionbreak { width: 22px; height: 22px; - .encoded-svg-background(''); + .encoded-svg-background(''); } &.icon-stringbreak { width: 22px; height: 22px; - .encoded-svg-background(''); + .encoded-svg-background(''); } &.icon-pagenumber { width: 22px; height: 22px; - .encoded-svg-background(''); + .encoded-svg-background(''); } &.icon-link { width: 22px; height: 22px; - .encoded-svg-background(''); + .encoded-svg-background(''); } &.icon-image-library { - width: 22px; - height: 22px; - .encoded-svg-background('icons_for_svg'); + width: 24px; + height: 24px; + .encoded-svg-background(''); } // Presets of table borders @@ -387,7 +387,7 @@ i.icon { &.icon-footnote { width: 24px; height: 24px; - .encoded-svg-background(''); + .encoded-svg-background(''); } &.icon-cut { width: 24px; @@ -442,7 +442,7 @@ i.icon { &.icon-insert-comment { width: 24px; height: 24px; - .encoded-svg-background(''); + .encoded-svg-background(''); } &.icon-done-comment-white { width: 24px; @@ -515,5 +515,25 @@ i.icon { height: 24px; .encoded-svg-background(''); } + &.icon-add-table { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-shape { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-image { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-other { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } } } \ No newline at end of file diff --git a/apps/presentationeditor/mobile/app/controller/DocumentHolder.js b/apps/presentationeditor/mobile/app/controller/DocumentHolder.js index e46b5d68b..742015d6e 100644 --- a/apps/presentationeditor/mobile/app/controller/DocumentHolder.js +++ b/apps/presentationeditor/mobile/app/controller/DocumentHolder.js @@ -156,8 +156,8 @@ define([ _view.hideMenu(); PE.getController('AddContainer').showModal(); - uiApp.showTab('#add-link'); - // PE.getController('AddLink').getView('AddLink').showLink(); + uiApp.showTab('#add-other'); + PE.getController('AddOther').getView('AddOther').showPageLink(); } else if ('openlink' == eventName) { _.some(_stack, function (item) { if (item.get_ObjectType() == Asc.c_oAscTypeSelectElement.Hyperlink) { diff --git a/apps/presentationeditor/mobile/app/controller/add/AddContainer.js b/apps/presentationeditor/mobile/app/controller/add/AddContainer.js index 95fe5aea1..c7ca039ae 100644 --- a/apps/presentationeditor/mobile/app/controller/add/AddContainer.js +++ b/apps/presentationeditor/mobile/app/controller/add/AddContainer.js @@ -47,8 +47,6 @@ define([ PE.Controllers.AddContainer = Backbone.Controller.extend(_.extend((function() { // private - var _canAddHyperlink = false, - _paragraphLocked = false; return { models: [], @@ -61,8 +59,6 @@ define([ setApi: function(api) { this.api = api; - this.api.asc_registerCallback('asc_onCanAddHyperlink', _.bind(this.onApiCanAddHyperlink, this)); - this.api.asc_registerCallback('asc_onFocusObject', _.bind(this.onApiFocusObject, this)); }, onLaunch: function() { @@ -96,22 +92,16 @@ define([ addViews.push({ caption: me.textSlide, id: 'add-slide', + icon: 'icon-add-slide', layout: PE.getController('AddSlide') .getView('AddSlide') .rootLayout() }); - addViews.push({ - caption: me.textTable, - id: 'add-table', - layout: PE.getController('AddTable') - .getView('AddTable') - .rootLayout() - }); - addViews.push({ caption: me.textShape, id: 'add-shape', + icon: 'icon-add-shape', layout: PE.getController('AddShape') .getView('AddShape') .rootLayout() @@ -120,23 +110,16 @@ define([ addViews.push({ caption: me.textImage, id: 'add-image', + icon: 'icon-add-image', layout: PE.getController('AddImage') .getView('AddImage') .rootLayout() }); - if (_canAddHyperlink && !_paragraphLocked) - addViews.push({ - caption: me.textLink, - id: 'add-link', - layout: PE.getController('AddLink') - .getView('AddLink') - .rootLayout() - }); - addViews.push({ caption: me.textOther, id: 'add-other', + icon: 'icon-add-other', layout: PE.getController('AddOther') .getView('AddOther') .rootLayout() @@ -174,7 +157,7 @@ define([ $layoutNavbar .find('.toolbar-inner') .append( - '' + layout.caption + '' + '' ); }); $layoutNavbar @@ -189,7 +172,7 @@ define([ $layoutNavbar .find('.buttons-row') .append( - '' + layout.caption + '' + '' ); }); } @@ -272,25 +255,13 @@ define([ } me.rootView = uiApp.addView('.add-root-view', { - dynamicNavbar: true + dynamicNavbar: true, + domCache: true }); Common.NotificationCenter.trigger('addcontainer:show'); }, - onApiCanAddHyperlink: function(value) { - _canAddHyperlink = value; - }, - - onApiFocusObject: function (objects) { - _paragraphLocked = false; - _.each(objects, function(object) { - if (Asc.c_oAscTypeSelectElement.Paragraph == object.get_ObjectType()) { - _paragraphLocked = object.get_ObjectValue().get_Locked(); - } - }); - }, - textSlide: 'Slide', textTable: 'Table', textShape: 'Shape', diff --git a/apps/presentationeditor/mobile/app/controller/add/AddLink.js b/apps/presentationeditor/mobile/app/controller/add/AddLink.js index 652839f77..c5c9855c2 100644 --- a/apps/presentationeditor/mobile/app/controller/add/AddLink.js +++ b/apps/presentationeditor/mobile/app/controller/add/AddLink.js @@ -41,7 +41,7 @@ define([ 'core', - 'presentationeditor/mobile/app/view/add/AddLink' + 'presentationeditor/mobile/app/view/add/AddOther' ], function (core) { 'use strict'; @@ -63,16 +63,15 @@ define([ models: [], collections: [], views: [ - 'AddLink' + 'AddOther' ], initialize: function () { - Common.NotificationCenter.on('addcontainer:show', _.bind(this.initEvents, this)); - Common.NotificationCenter.on('addcategory:show', _.bind(this.categoryShow, this)); this.addListeners({ - 'AddLink': { - 'page:show' : this.onPageShow + 'AddOther': { + 'category:show': this.categoryShow, + 'page:show' : this.onPageShow } }); @@ -91,19 +90,13 @@ define([ me.api = api; }, - onLaunch: function () { - this.createView('AddLink').render(); - }, - initEvents: function () { var me = this; $('#add-link-insert').single('click', _.buffered(me.onInsertLink, 100, me)); }, - categoryShow: function (e) { - var $target = $(e.currentTarget); - - if ($target && $target.prop('id') === 'add-link') { + categoryShow: function (view, pageId) { + if (pageId === '#addother-insert-link') { this._linkType = c_oHyperlinkType.WebLink; this._slideLink = this._slideNum = 0; var text = this.api.can_AddHyperlink(); @@ -112,6 +105,7 @@ define([ $('#add-link-display').toggleClass('disabled', text === null); } + this.initEvents(); this.initSettings(); } }, diff --git a/apps/presentationeditor/mobile/app/controller/add/AddOther.js b/apps/presentationeditor/mobile/app/controller/add/AddOther.js index 7d5bddd16..1699b6d60 100644 --- a/apps/presentationeditor/mobile/app/controller/add/AddOther.js +++ b/apps/presentationeditor/mobile/app/controller/add/AddOther.js @@ -49,6 +49,8 @@ define([ 'use strict'; PE.Controllers.AddOther = Backbone.Controller.extend(_.extend((function() { + var _canAddHyperlink = false, + _paragraphLocked = false; return { models: [], @@ -70,6 +72,8 @@ define([ setApi: function (api) { var me = this; me.api = api; + me.api.asc_registerCallback('asc_onCanAddHyperlink', _.bind(me.onApiCanAddHyperlink, me)); + me.api.asc_registerCallback('asc_onFocusObject', _.bind(me.onApiFocusObject, me)); }, setMode: function (mode) { @@ -84,6 +88,20 @@ define([ initEvents: function () { var me = this; this.view.hideInsertComments = this.isHideInsertComment(); + this.view.hideInsertLink = !(_canAddHyperlink && !_paragraphLocked); + }, + + onApiCanAddHyperlink: function(value) { + _canAddHyperlink = value; + }, + + onApiFocusObject: function (objects) { + _paragraphLocked = false; + _.each(objects, function(object) { + if (Asc.c_oAscTypeSelectElement.Paragraph == object.get_ObjectType()) { + _paragraphLocked = object.get_ObjectValue().get_Locked(); + } + }); }, isHideInsertComment: function() { diff --git a/apps/presentationeditor/mobile/app/controller/add/AddTable.js b/apps/presentationeditor/mobile/app/controller/add/AddTable.js index 73c5e38c2..5f4e3d8ae 100644 --- a/apps/presentationeditor/mobile/app/controller/add/AddTable.js +++ b/apps/presentationeditor/mobile/app/controller/add/AddTable.js @@ -43,7 +43,6 @@ define([ 'core', - 'presentationeditor/mobile/app/view/add/AddTable' ], function (core) { 'use strict'; @@ -56,7 +55,6 @@ define([ ], initialize: function () { - Common.NotificationCenter.on('addcontainer:show', _.bind(this.initEvents, this)); this._styles = []; this._initDefaultStyles = false; }, @@ -66,13 +64,9 @@ define([ me.api = api; }, - onLaunch: function () { - this.createView('AddTable').render(); - }, - initEvents: function () { var me = this; - $('#add-table li').single('click', _.buffered(me.onStyleClick, 100, me)); + $('.page[data-page="addother-insert-table"] li').single('click', _.buffered(me.onStyleClick, 100, me)); }, onStyleClick: function (e) { diff --git a/apps/presentationeditor/mobile/app/template/AddLink.template b/apps/presentationeditor/mobile/app/template/AddLink.template deleted file mode 100644 index c9ada4f6a..000000000 --- a/apps/presentationeditor/mobile/app/template/AddLink.template +++ /dev/null @@ -1,171 +0,0 @@ - - - - - - - - \ No newline at end of file diff --git a/apps/presentationeditor/mobile/app/template/AddOther.template b/apps/presentationeditor/mobile/app/template/AddOther.template index 6b894f93e..0b85b96ab 100644 --- a/apps/presentationeditor/mobile/app/template/AddOther.template +++ b/apps/presentationeditor/mobile/app/template/AddOther.template @@ -2,6 +2,18 @@ @@ -34,4 +58,203 @@ + + + +
      +
      +
      +
      <% if (!android) { %><%= scope.textBack %><% } %>
      +
      <%= scope.textTable %>
      +
      +
      +
      +
      +
        + +
      +
      +
      +
      + + + + + + + + + \ No newline at end of file diff --git a/apps/presentationeditor/mobile/app/template/AddTable.template b/apps/presentationeditor/mobile/app/template/AddTable.template deleted file mode 100644 index 69398316d..000000000 --- a/apps/presentationeditor/mobile/app/template/AddTable.template +++ /dev/null @@ -1,12 +0,0 @@ - -
      -
      -
        - <% _.each(styles, function(style) { %> -
      • - -
        • - <% }); %> -
      -
      -
      \ No newline at end of file diff --git a/apps/presentationeditor/mobile/app/view/add/AddLink.js b/apps/presentationeditor/mobile/app/view/add/AddLink.js deleted file mode 100644 index 84179e671..000000000 --- a/apps/presentationeditor/mobile/app/view/add/AddLink.js +++ /dev/null @@ -1,137 +0,0 @@ -/* - * - * (c) Copyright Ascensio System SIA 2010-2019 - * - * This program is a free software product. You can redistribute it and/or - * modify it under the terms of the GNU Affero General Public License (AGPL) - * version 3 as published by the Free Software Foundation. In accordance with - * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect - * that Ascensio System SIA expressly excludes the warranty of non-infringement - * of any third-party rights. - * - * This program is distributed WITHOUT ANY WARRANTY; without even the implied - * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. For - * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html - * - * You can contact Ascensio System SIA at 20A-12 Ernesta Birznieka-Upisha - * street, Riga, Latvia, EU, LV-1050. - * - * The interactive user interfaces in modified source and object code versions - * of the Program must display Appropriate Legal Notices, as required under - * Section 5 of the GNU AGPL version 3. - * - * Pursuant to Section 7(b) of the License you must retain the original Product - * logo when distributing the program. Pursuant to Section 7(e) we decline to - * grant you any rights under trademark law for use of our trademarks. - * - * All the Product's GUI elements, including illustrations and icon sets, as - * well as technical writing content are licensed under the terms of the - * Creative Commons Attribution-ShareAlike 4.0 International. See the License - * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode - * - */ - -/** - * AddLink.js - * Presentation Editor - * - * Created by Julia Radzhabova on 12/01/16 - * Copyright (c) 2018 Ascensio System SIA. All rights reserved. - * - */ - -define([ - 'text!presentationeditor/mobile/app/template/AddLink.template', - 'jquery', - 'underscore', - 'backbone' -], function (addTemplate, $, _, Backbone) { - 'use strict'; - - PE.Views.AddLink = Backbone.View.extend(_.extend((function() { - // private - - return { - // el: '.view-main', - - template: _.template(addTemplate), - - events: { - }, - - initialize: function () { - Common.NotificationCenter.on('addcontainer:show', _.bind(this.initEvents, this)); - }, - - initEvents: function () { - var me = this; - - $('#add-link-number').single('click', _.bind(me.showPageNumber, me)); - $('#add-link-type').single('click', _.bind(me.showLinkType, me)); - }, - - // Render layout - render: function () { - this.layout = $('
      ').append(this.template({ - android : Common.SharedSettings.get('android'), - phone : Common.SharedSettings.get('phone'), - scope : this - })); - - return this; - }, - - rootLayout: function () { - if (this.layout) { - return this.layout - .find('#addlink-root-view') - .html(); - } - - return ''; - }, - - showPage: function (templateId) { - var rootView = PE.getController('AddContainer').rootView; - - if (rootView && this.layout) { - var $content = this.layout.find(templateId); - - // Android fix for navigation - if (Framework7.prototype.device.android) { - $content.find('.page').append($content.find('.navbar')); - } - - rootView.router.load({ - content: $content.html() - }); - - this.fireEvent('page:show', [this, templateId]); - } - }, - - showLinkType: function () { - this.showPage('#addlink-type'); - }, - - showPageNumber: function () { - this.showPage('#addlink-slidenumber'); - }, - - textLinkType: 'Link Type', - textExternalLink: 'External Link', - textInternalLink: 'Slide in this Presentation', - textLink: 'Link', - textLinkSlide: 'Link to', - textBack: 'Back', - textDisplay: 'Display', - textTip: 'Screen Tip', - textInsert: 'Insert', - textNext: 'Next Slide', - textPrev: 'Previous Slide', - textFirst: 'First Slide', - textLast: 'Last Slide', - textNumber: 'Slide Number' - } - })(), PE.Views.AddLink || {})) -}); \ No newline at end of file diff --git a/apps/presentationeditor/mobile/app/view/add/AddOther.js b/apps/presentationeditor/mobile/app/view/add/AddOther.js index 34b7a1df9..6aafebc96 100644 --- a/apps/presentationeditor/mobile/app/view/add/AddOther.js +++ b/apps/presentationeditor/mobile/app/view/add/AddOther.js @@ -70,6 +70,13 @@ define([ $('#item-comment').show(); $('#add-other-comment').single('click', _.bind(this.showPageComment, this)); } + $('#add-other-table').single('click', _.bind(this.showPageTable, this)); + if (this.hideInsertLink) { + $('#item-link').hide(); + } else { + $('#item-link').show(); + $('#add-other-link').single('click', _.bind(this.showPageLink, this)); + } this.initControls(); }, @@ -118,7 +125,11 @@ define([ animatePages: animate !== false }); - this.fireEvent('page:show', [this, templateId]); + if (templateId === '#addother-insert-link') { + this.fireEvent('category:show', [this, templateId]); + } else { + this.fireEvent('page:show', [this, templateId]); + } } }, @@ -160,9 +171,61 @@ define([ }, 100); }, + showPageTable: function() { + this.showPage('#addother-insert-table'); + this.renderTableStyles(); + PE.getController('AddTable').initEvents(); + }, + + renderTableStyles: function() { + var $stylesList = $('.table-styles ul'); + var template = [ + '<% _.each(styles, function(style) { %>', + '
    • ', + '', + '
      • ', + '<% }); %>' + ].join(''); + var insert = _.template(template)({ + android : Common.SharedSettings.get('android'), + phone : Common.SharedSettings.get('phone'), + styles : PE.getController('AddTable').getStyles() + }); + $stylesList.html(insert); + }, + + showPageLink: function() { + this.showPage('#addother-insert-link'); + $('#add-link-number').single('click', _.bind(this.showPageNumber, this)); + $('#add-link-type').single('click', _.bind(this.showLinkType, this)); + }, + + showLinkType: function () { + this.showPage('#addlink-type'); + }, + + showPageNumber: function () { + this.showPage('#addlink-slidenumber'); + }, + textComment: 'Comment', textAddComment: 'Add Comment', - textDone: 'Done' + textDone: 'Done', + textTable: 'Table', + textLinkType: 'Link Type', + textExternalLink: 'External Link', + textInternalLink: 'Slide in this Presentation', + textLink: 'Link', + textLinkSlide: 'Link to', + textBack: 'Back', + textDisplay: 'Display', + textTip: 'Screen Tip', + textInsert: 'Insert', + textNext: 'Next Slide', + textPrev: 'Previous Slide', + textFirst: 'First Slide', + textLast: 'Last Slide', + textNumber: 'Slide Number' } })(), PE.Views.AddOther || {})) diff --git a/apps/presentationeditor/mobile/app/view/add/AddTable.js b/apps/presentationeditor/mobile/app/view/add/AddTable.js deleted file mode 100644 index c59f40a0f..000000000 --- a/apps/presentationeditor/mobile/app/view/add/AddTable.js +++ /dev/null @@ -1,104 +0,0 @@ -/* - * - * (c) Copyright Ascensio System SIA 2010-2019 - * - * This program is a free software product. You can redistribute it and/or - * modify it under the terms of the GNU Affero General Public License (AGPL) - * version 3 as published by the Free Software Foundation. In accordance with - * Section 7(a) of the GNU AGPL its Section 15 shall be amended to the effect - * that Ascensio System SIA expressly excludes the warranty of non-infringement - * of any third-party rights. - * - * This program is distributed WITHOUT ANY WARRANTY; without even the implied - * warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. For - * details, see the GNU AGPL at: http://www.gnu.org/licenses/agpl-3.0.html - * - * You can contact Ascensio System SIA at 20A-12 Ernesta Birznieka-Upisha - * street, Riga, Latvia, EU, LV-1050. - * - * The interactive user interfaces in modified source and object code versions - * of the Program must display Appropriate Legal Notices, as required under - * Section 5 of the GNU AGPL version 3. - * - * Pursuant to Section 7(b) of the License you must retain the original Product - * logo when distributing the program. Pursuant to Section 7(e) we decline to - * grant you any rights under trademark law for use of our trademarks. - * - * All the Product's GUI elements, including illustrations and icon sets, as - * well as technical writing content are licensed under the terms of the - * Creative Commons Attribution-ShareAlike 4.0 International. See the License - * terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode - * - */ - -/** - * AddTable.js - * Presentation Editor - * - * Created by Julia Radzhabova on 11/30/16 - * Copyright (c) 2018 Ascensio System SIA. All rights reserved. - * - */ - -define([ - 'text!presentationeditor/mobile/app/template/AddTable.template', - 'jquery', - 'underscore', - 'backbone' -], function (addTemplate, $, _, Backbone) { - 'use strict'; - - PE.Views.AddTable = Backbone.View.extend(_.extend((function() { - // private - - return { - // el: '.view-main', - - template: _.template(addTemplate), - - events: { - }, - - initialize: function () { - Common.NotificationCenter.on('addcontainer:show', _.bind(this.initEvents, this)); - }, - - initEvents: function () { - var me = this; - - Common.Utils.addScrollIfNeed('#add-table .pages', '#add-table .page'); - me.initControls(); - }, - - // Render layout - render: function () { - this.layout = $('
      ').append(this.template({ - android : Common.SharedSettings.get('android'), - phone : Common.SharedSettings.get('phone'), - styles : PE.getController('AddTable').getStyles() - })); - - var $tableStyles = $('.container-add .table-styles'); - if ($tableStyles) { - $tableStyles.replaceWith(this.layout.find('#add-table-root').html()); - } - - return this; - }, - - rootLayout: function () { - if (this.layout) { - return this.layout - .find('#add-table-root') - .html(); - } - - return ''; - }, - - initControls: function () { - // - } - } - })(), PE.Views.AddTable || {})) -}); \ No newline at end of file diff --git a/apps/presentationeditor/mobile/locale/en.json b/apps/presentationeditor/mobile/locale/en.json index 974581605..310b6d726 100644 --- a/apps/presentationeditor/mobile/locale/en.json +++ b/apps/presentationeditor/mobile/locale/en.json @@ -282,6 +282,21 @@ "PE.Views.AddOther.textComment": "Comment", "PE.Views.AddOther.textAddComment": "Add Comment", "PE.Views.AddOther.textDone": "Done", + "PE.Views.AddOther.textTable": "Table", + "PE.Views.AddOther.textLinkType": "Link Type", + "PE.Views.AddOther.textExternalLink": "External Link", + "PE.Views.AddOther.textInternalLink": "Slide in this Presentation", + "PE.Views.AddOther.textLink": "Link", + "PE.Views.AddOther.textLinkSlide": "Link to", + "PE.Views.AddOther.textBack": "Back", + "PE.Views.AddOther.textDisplay": "Display", + "PE.Views.AddOther.textTip": "Screen Tip", + "PE.Views.AddOther.textInsert": "Insert", + "PE.Views.AddOther.textNext": "Next Slide", + "PE.Views.AddOther.textPrev": "Previous Slide", + "PE.Views.AddOther.textFirst": "First Slide", + "PE.Views.AddOther.textLast": "Last Slide", + "PE.Views.AddOther.textNumber": "Slide Number", "PE.Views.EditChart.textAddCustomColor": "Add Custom Color", "PE.Views.EditChart.textAlign": "Align", "PE.Views.EditChart.textAlignBottom": "Align Bottom", diff --git a/apps/presentationeditor/mobile/resources/css/app-ios.css b/apps/presentationeditor/mobile/resources/css/app-ios.css index 44414d9c9..954b546fb 100644 --- a/apps/presentationeditor/mobile/resources/css/app-ios.css +++ b/apps/presentationeditor/mobile/resources/css/app-ios.css @@ -5975,6 +5975,14 @@ html.pixel-ratio-3 .settings.popover .list-block ul:last-child:after { .settings .popover-inner { height: 400px; } +.container-add .categories > .buttons-row .button { + display: flex; + justify-content: center; + align-items: center; +} +.container-add .categories > .buttons-row .button.active i.icon { + background-color: transparent; +} .dataview.page-content { background: #ffffff; } @@ -7476,6 +7484,51 @@ i.icon.icon-insert-comment { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20.1538%209.00708H11.8462C10.8266%209.00708%2010%209.83461%2010%2010.8554V15.1694C10%2016.1902%2010.8266%2017.0177%2011.8462%2017.0177H13.8329C13.9409%2017.0177%2014.0454%2017.0556%2014.1284%2017.1248L18.243%2020.392C18.5436%2020.6428%2019%2020.4288%2019%2020.037V17.4798C19%2017.2246%2019.2066%2017.0177%2019.4615%2017.0177H20.1538C21.1734%2017.0177%2022%2016.1902%2022%2015.1694V10.8554C22%209.83461%2021.1734%209.00708%2020.1538%209.00708ZM20%2010.0083C20.5523%2010.0083%2021%2010.4565%2021%2011.0095V15.0154C21%2015.5683%2020.5523%2016.0165%2020%2016.0165H18.0025L18%2018.8995C18%2019.2912%2018%2019%2018%2019L14.5%2016.0165H12C11.4477%2016.0165%2011%2015.5683%2011%2015.0154V11.0095C11%2010.4565%2011.4477%2010.0083%2012%2010.0083H20Z%22%20fill%3D%22%23aa5252%22%2F%3E%3Cpath%20d%3D%22M14.5%203H4.5C3.18908%203%202%204.2153%202%205.50295V12.0346C2%2013.3222%203.18908%2014.013%204.5%2014.013H5.5C5.82773%2014.013%206%2014.1917%206%2014.5136V17.5183C6%2018.0125%206.6135%2018.3352%207%2018.0189L11%2014.9858V13.5L7%2016.5V13.0118H4.5C3.78992%2013.0118%203%2012.732%203%2012.0346V5.50295C3%204.80547%203.78992%204.00118%204.5%204.00118H14.5C15.2101%204.00118%2016%204.80547%2016%205.50295V8.0059H17V5.50295C17%204.2153%2015.8109%203%2014.5%203Z%22%20fill%3D%22%23aa5252%22%2F%3E%3C%2Fsvg%3E"); } +i.icon.icon-add-slide { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M4%206C4%204.89543%204.89543%204%206%204H18C19.1046%204%2020%204.89543%2020%206V18C20%2019.1046%2019.1046%2020%2018%2020H6C4.89543%2020%204%2019.1046%204%2018V6ZM11%2010.9333V8H13V10.9333H16V12.9333H13V16H11V12.9333H8V10.9333H11Z%22%20fill%3D%22%23aa5252%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-add-shape { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cellipse%20cx%3D%2215.3333%22%20cy%3D%2214.4002%22%20rx%3D%225.66667%22%20ry%3D%225.60002%22%20fill%3D%22%23aa5252%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%204.80005C4.44772%204.80005%204%205.24776%204%205.80005V15.8001C4%2016.3524%204.44771%2016.8001%205%2016.8001H9.32787C9.02431%2016.059%208.85714%2015.2488%208.85714%2014.4001C8.85714%2010.8655%2011.7566%208.00012%2015.3333%208.00012C15.8924%208.00012%2016.4349%208.07013%2016.9524%208.20175V5.80005C16.9524%205.24776%2016.5047%204.80005%2015.9524%204.80005H5Z%22%20fill%3D%22%23aa5252%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-add-image { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5.79177%2016.6667L8.87529%2013.1667L11.1254%2015.5L14.2089%2012L18.2092%2016.6667H5.79177ZM19.4593%2018.526C19.8204%2018.2101%2020.001%2017.8455%2020.001%2017.4323V6.56771C20.001%206.15451%2019.8204%205.78993%2019.4593%205.47396C19.0981%205.15799%2018.6814%205%2018.2092%205H5.79177C5.31952%205%204.90283%205.15799%204.5417%205.47396C4.18057%205.78993%204%206.15451%204%206.56771V17.4323C4%2017.8455%204.18057%2018.2101%204.5417%2018.526C4.90283%2018.842%205.31952%2019%205.79177%2019H18.2092C18.6814%2019%2019.0981%2018.842%2019.4593%2018.526ZM8.79933%2011.2222C9.68304%2011.2222%2010.3994%2010.5258%2010.3994%209.66667C10.3994%208.80756%209.68304%208.11111%208.79933%208.11111C7.91562%208.11111%207.19923%208.80756%207.19923%209.66667C7.19923%2010.5258%207.91562%2011.2222%208.79933%2011.2222Z%22%20fill%3D%22%23aa5252%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-add-other { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M7.00049%2018C7.00049%2018.8284%206.32892%2019.5%205.50049%2019.5C4.67206%2019.5%204.00049%2018.8284%204.00049%2018C4.00049%2017.1716%204.67206%2016.5%205.50049%2016.5C6.32892%2016.5%207.00049%2017.1716%207.00049%2018ZM13.5005%2018C13.5005%2018.8284%2012.8289%2019.5%2012.0005%2019.5C11.1721%2019.5%2010.5005%2018.8284%2010.5005%2018C10.5005%2017.1716%2011.1721%2016.5%2012.0005%2016.5C12.8289%2016.5%2013.5005%2017.1716%2013.5005%2018ZM18.5005%2019.5C19.3289%2019.5%2020.0005%2018.8284%2020.0005%2018C20.0005%2017.1716%2019.3289%2016.5%2018.5005%2016.5C17.6721%2016.5%2017.0005%2017.1716%2017.0005%2018C17.0005%2018.8284%2017.6721%2019.5%2018.5005%2019.5Z%22%20fill%3D%22%23aa5252%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-add-table { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M1%202H22V21H1V2ZM12%203H21V8H12V3ZM12%209H21V14H12V9ZM11%2014V9H2V14H11ZM2%2015V20H11V15H2ZM12%2015H21V20H12V15ZM11%203V8H2V3H11Z%22%20fill%3D%22%23aa5252%22%2F%3E%3C%2Fsvg%3E"); +} +.active i.icon.icon-add-slide { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M4%206C4%204.89543%204.89543%204%206%204H18C19.1046%204%2020%204.89543%2020%206V18C20%2019.1046%2019.1046%2020%2018%2020H6C4.89543%2020%204%2019.1046%204%2018V6ZM11%2010.9333V8H13V10.9333H16V12.9333H13V16H11V12.9333H8V10.9333H11Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); +} +.active i.icon.icon-add-shape { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cellipse%20cx%3D%2215.3333%22%20cy%3D%2214.4002%22%20rx%3D%225.66667%22%20ry%3D%225.60002%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%204.80005C4.44772%204.80005%204%205.24776%204%205.80005V15.8001C4%2016.3524%204.44771%2016.8001%205%2016.8001H9.32787C9.02431%2016.059%208.85714%2015.2488%208.85714%2014.4001C8.85714%2010.8655%2011.7566%208.00012%2015.3333%208.00012C15.8924%208.00012%2016.4349%208.07013%2016.9524%208.20175V5.80005C16.9524%205.24776%2016.5047%204.80005%2015.9524%204.80005H5Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); +} +.active i.icon.icon-add-image { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5.79177%2016.6667L8.87529%2013.1667L11.1254%2015.5L14.2089%2012L18.2092%2016.6667H5.79177ZM19.4593%2018.526C19.8204%2018.2101%2020.001%2017.8455%2020.001%2017.4323V6.56771C20.001%206.15451%2019.8204%205.78993%2019.4593%205.47396C19.0981%205.15799%2018.6814%205%2018.2092%205H5.79177C5.31952%205%204.90283%205.15799%204.5417%205.47396C4.18057%205.78993%204%206.15451%204%206.56771V17.4323C4%2017.8455%204.18057%2018.2101%204.5417%2018.526C4.90283%2018.842%205.31952%2019%205.79177%2019H18.2092C18.6814%2019%2019.0981%2018.842%2019.4593%2018.526ZM8.79933%2011.2222C9.68304%2011.2222%2010.3994%2010.5258%2010.3994%209.66667C10.3994%208.80756%209.68304%208.11111%208.79933%208.11111C7.91562%208.11111%207.19923%208.80756%207.19923%209.66667C7.19923%2010.5258%207.91562%2011.2222%208.79933%2011.2222Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); +} +.active i.icon.icon-add-other { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M7.00049%2018C7.00049%2018.8284%206.32892%2019.5%205.50049%2019.5C4.67206%2019.5%204.00049%2018.8284%204.00049%2018C4.00049%2017.1716%204.67206%2016.5%205.50049%2016.5C6.32892%2016.5%207.00049%2017.1716%207.00049%2018ZM13.5005%2018C13.5005%2018.8284%2012.8289%2019.5%2012.0005%2019.5C11.1721%2019.5%2010.5005%2018.8284%2010.5005%2018C10.5005%2017.1716%2011.1721%2016.5%2012.0005%2016.5C12.8289%2016.5%2013.5005%2017.1716%2013.5005%2018ZM18.5005%2019.5C19.3289%2019.5%2020.0005%2018.8284%2020.0005%2018C20.0005%2017.1716%2019.3289%2016.5%2018.5005%2016.5C17.6721%2016.5%2017.0005%2017.1716%2017.0005%2018C17.0005%2018.8284%2017.6721%2019.5%2018.5005%2019.5Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); +} .label-switch input[type="checkbox"]:checked + .checkbox { background: #aa5252; } diff --git a/apps/presentationeditor/mobile/resources/css/app-material.css b/apps/presentationeditor/mobile/resources/css/app-material.css index eb23f750c..bf6b594e0 100644 --- a/apps/presentationeditor/mobile/resources/css/app-material.css +++ b/apps/presentationeditor/mobile/resources/css/app-material.css @@ -6868,15 +6868,10 @@ i.icon.icon-pagenumber { height: 22px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%23aa5252%22%3E%3Cg%3E%3Cpath%20d%3D%22M8.2%2C1L2%2C7.6V22h17V1H8.2z%20M8%2C2.8V8H3.1L8%2C2.8z%20M18%2C21H3V9h6V2l0%2C0h9V21z%20M12%2C19h1v-4h-0.7c0%2C0.2-0.1-0.1-0.1%2C0c-0.1%2C0.1-0.2%2C0-0.3%2C0c-0.1%2C0.1-0.2%2C0.1-0.4%2C0.1c-0.1%2C0-0.3%2C0-0.4%2C0V16H12V19z%20M15.3%2C17.3C15%2C17.9%2C15.1%2C18.4%2C15%2C19h0.9c0-0.3%2C0-0.6%2C0.1-0.9c0.1-0.3%2C0.1-0.6%2C0.3-0.9c0.1-0.3%2C0.3-0.6%2C0.4-0.9c0.2-0.3%2C0.1-0.3%2C0.3-0.5V15h-3v1h1.9C15.6%2C16.4%2C15.5%2C16.7%2C15.3%2C17.3z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); } -i.icon.icon-link { - width: 22px; - height: 22px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%23aa5252%22%3E%3Cg%3E%3Cpath%20d%3D%22M12.4%2C9.8c0%2C0-2.1-0.1-3.8%2C1.2c-2.8%2C2-3.3%2C4.3-3.3%2C4.3s1.6-1.7%2C3.5-2.5c1.7-0.7%2C3.7-0.4%2C3.7-0.4v1.9l4.8-3.3V11l-4.8-3.3V9.8z%20M11%2C1C5.5%2C1%2C1%2C5.5%2C1%2C11c0%2C5.5%2C4.5%2C10%2C10%2C10s10-4.5%2C10-10C21%2C5.5%2C16.5%2C1%2C11%2C1z%20M11%2C20c-5%2C0-9-4.1-9-9C2%2C6%2C6%2C2%2C11%2C2s9%2C4.1%2C9%2C9C20%2C16%2C16%2C20%2C11%2C20z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); -} i.icon.icon-image-library { - width: 22px; - height: 22px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%2022%2022%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bisolation%3Aisolate%3B%7D.cls-2%7Bopacity%3A0.2%3B%7D.cls-3%7Bfill%3A%23fff%3B%7D.cls-10%2C.cls-11%2C.cls-4%2C.cls-6%2C.cls-7%2C.cls-8%2C.cls-9%7Bmix-blend-mode%3Amultiply%3B%7D.cls-4%7Bfill%3Aurl(%23grad_8)%3B%7D.cls-5%7Bfill%3Aurl(%23grad_10)%3B%7D.cls-6%7Bfill%3Aurl(%23grad_12)%3B%7D.cls-7%7Bfill%3Aurl(%23grad_14)%3B%7D.cls-8%7Bfill%3Aurl(%23grad_79)%3B%7D.cls-9%7Bfill%3Aurl(%23grad_77)%3B%7D.cls-10%7Bfill%3Aurl(%23grad_75)%3B%7D.cls-11%7Bfill%3Aurl(%23grad_81)%3B%7D%3C%2Fstyle%3E%3ClinearGradient%20id%3D%22grad_8%22%20x1%3D%2211.08%22%20y1%3D%2210.26%22%20x2%3D%2211.08%22%20y2%3D%221.26%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23f3e916%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23f89d34%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_10%22%20x1%3D%2211.08%22%20y1%3D%2220.44%22%20x2%3D%2211.08%22%20y2%3D%2211.88%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%235eb6e8%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23958cc3%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_12%22%20x1%3D%221.46%22%20y1%3D%2211.05%22%20x2%3D%2210.46%22%20y2%3D%2211.05%22%20gradientTransform%3D%22translate(17%205.09)%20rotate(90)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23cc8dba%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23f86867%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_14%22%20x1%3D%2211.73%22%20y1%3D%2211.05%22%20x2%3D%2220.73%22%20y2%3D%2211.05%22%20gradientTransform%3D%22translate(27.28%20-5.18)%20rotate(90)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%236ac07f%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23c5da3d%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_79%22%20x1%3D%2211.74%22%20y1%3D%2210.42%22%20x2%3D%2217.52%22%20y2%3D%224.63%22%20gradientTransform%3D%22translate(30.29%202.51)%20rotate(135)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23c5da3d%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23f3e916%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_77%22%20x1%3D%224.7%22%20y1%3D%2217.49%22%20x2%3D%2210.48%22%20y2%3D%2211.71%22%20gradientTransform%3D%22translate(23.24%2019.65)%20rotate(135)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%239595c3%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23cc8dba%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_75%22%20x1%3D%224.69%22%20y1%3D%224.64%22%20x2%3D%2210.47%22%20y2%3D%2210.42%22%20gradientTransform%3D%22translate(7.54%20-3.15)%20rotate(45)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23f86867%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23f89d34%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_81%22%20x1%3D%2211.77%22%20y1%3D%2211.78%22%20x2%3D%2217.55%22%20y2%3D%2217.56%22%20gradientTransform%3D%22translate(14.63%20-6.05)%20rotate(45)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%235ec0e8%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%236ac07f%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Ctitle%3Eicons_for_svg%3C%2Ftitle%3E%3Cg%20class%3D%22cls-1%22%3E%3Cg%20id%3D%22%D0%A1%D0%BB%D0%BE%D0%B9_1%22%20data-name%3D%22%D0%A1%D0%BB%D0%BE%D0%B9%201%22%3E%3Crect%20class%3D%22cls-2%22%20x%3D%220.09%22%20y%3D%220.01%22%20width%3D%2222%22%20height%3D%2222%22%20rx%3D%224%22%20ry%3D%224%22%2F%3E%3Crect%20class%3D%22cls-3%22%20x%3D%220.57%22%20y%3D%220.49%22%20width%3D%2221.04%22%20height%3D%2221.04%22%20rx%3D%223.6%22%20ry%3D%223.6%22%2F%3E%3Crect%20class%3D%22cls-4%22%20x%3D%228.33%22%20y%3D%221.26%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%2F%3E%3Crect%20class%3D%22cls-5%22%20x%3D%228.33%22%20y%3D%2211.76%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%2F%3E%3Crect%20class%3D%22cls-6%22%20x%3D%223.21%22%20y%3D%226.55%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(-5.09%2017)%20rotate(-90)%22%2F%3E%3Crect%20class%3D%22cls-7%22%20x%3D%2213.48%22%20y%3D%226.55%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(5.18%2027.28)%20rotate(-90)%22%2F%3E%3Crect%20class%3D%22cls-8%22%20x%3D%2211.87%22%20y%3D%223.03%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(19.64%2023.19)%20rotate(-135)%22%2F%3E%3Crect%20class%3D%22cls-9%22%20x%3D%224.8%22%20y%3D%2210.14%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(2.54%2030.33)%20rotate(-135)%22%2F%3E%3Crect%20class%3D%22cls-10%22%20x%3D%224.83%22%20y%3D%223.03%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(-3.1%207.56)%20rotate(-45)%22%2F%3E%3Crect%20class%3D%22cls-11%22%20x%3D%2211.87%22%20y%3D%2210.14%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(-6.07%2014.63)%20rotate(-45)%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"); + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0)%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20%205.5H4C3.72386%205.5%203.5%205.72386%203.5%206V15.5822L8.03349%2011.6898C8.47476%2011.3109%209.11904%2011.2865%209.58778%2011.6308L13.5726%2014.5579L15.9619%2012.6774C16.4488%2012.2942%2017.1428%2012.3255%2017.5933%2012.7509L20.5%2015.4962V6C20.5%205.72386%2020.2761%205.5%2020%205.5ZM20.5%2017.5294L20.485%2017.5453L16.7201%2013.9895L14.3509%2015.8542C13.9095%2016.2016%2013.2905%2016.2119%2012.8378%2015.8793L8.85988%2012.9573L3.5%2017.5592V18C3.5%2018.2761%203.72386%2018.5%204%2018.5H20C20.2761%2018.5%2020.5%2018.2761%2020.5%2018V17.5294ZM4%204C2.89543%204%202%204.89543%202%206V18C2%2019.1046%202.89543%2020%204%2020H20C21.1046%2020%2022%2019.1046%2022%2018V6C22%204.89543%2021.1046%204%2020%204H4ZM16.5%209.5C16.5%2011.1569%2015.1569%2012.5%2013.5%2012.5C11.8431%2012.5%2010.5%2011.1569%2010.5%209.5C10.5%207.84315%2011.8431%206.5%2013.5%206.5C15.1569%206.5%2016.5%207.84315%2016.5%209.5ZM13.5%2011C14.3284%2011%2015%2010.3284%2015%209.5C15%208.67157%2014.3284%208%2013.5%208C12.6716%208%2012%208.67157%2012%209.5C12%2010.3284%2012.6716%2011%2013.5%2011Z%22%20fill%3D%22%23aa5252%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0%22%3E%3Cpath%20d%3D%22M0%200H24V24H0V0Z%22%20fill%3D%22transparent%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E"); } i.icon.icon-text-valign-top { width: 22px; @@ -7099,13 +7094,23 @@ i.icon.icon-done-comment { i.icon.icon-insert-comment { width: 24px; height: 24px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20.1538%209.00708H11.8462C10.8266%209.00708%2010%209.83461%2010%2010.8554V15.1694C10%2016.1902%2010.8266%2017.0177%2011.8462%2017.0177H13.8329C13.9409%2017.0177%2014.0454%2017.0556%2014.1284%2017.1248L18.243%2020.392C18.5436%2020.6428%2019%2020.4288%2019%2020.037V17.4798C19%2017.2246%2019.2066%2017.0177%2019.4615%2017.0177H20.1538C21.1734%2017.0177%2022%2016.1902%2022%2015.1694V10.8554C22%209.83461%2021.1734%209.00708%2020.1538%209.00708ZM20%2010.0083C20.5523%2010.0083%2021%2010.4565%2021%2011.0095V15.0154C21%2015.5683%2020.5523%2016.0165%2020%2016.0165H18.0025L18%2018.8995C18%2019.2912%2018%2019%2018%2019L14.5%2016.0165H12C11.4477%2016.0165%2011%2015.5683%2011%2015.0154V11.0095C11%2010.4565%2011.4477%2010.0083%2012%2010.0083H20Z%22%20fill%3D%22%23aa5252%22%2F%3E%3Cpath%20d%3D%22M14.5%203H4.5C3.18908%203%202%204.2153%202%205.50295V12.0346C2%2013.3222%203.18908%2014.013%204.5%2014.013H5.5C5.82773%2014.013%206%2014.1917%206%2014.5136V17.5183C6%2018.0125%206.6135%2018.3352%207%2018.0189L11%2014.9858V13.5L7%2016.5V13.0118H4.5C3.78992%2013.0118%203%2012.732%203%2012.0346V5.50295C3%204.80547%203.78992%204.00118%204.5%204.00118H14.5C15.2101%204.00118%2016%204.80547%2016%205.50295V8.0059H17V5.50295C17%204.2153%2015.8109%203%2014.5%203Z%22%20fill%3D%22%23aa5252%22%2F%3E%3C%2Fsvg%3E"); + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M19.5%203H4.5C3.18908%203%202%204.2153%202%205.50295V15.0346C2%2016.3222%203.18908%2017.013%204.5%2017.013H5.5C5.82773%2017.013%206%2017.1917%206%2017.5136V21L12%2017H20C21.1046%2017%2022%2016.1046%2022%2015V8H20.5V14.5C20.5%2015.0523%2020.0523%2015.5%2019.5%2015.5H11.5L7.5%2018V15.5H4.5C3.94772%2015.5%203.5%2015.0523%203.5%2014.5V5.5C3.5%204.94772%203.94772%204.5%204.5%204.5H19.5C20.0523%204.5%2020.5%204.94772%2020.5%205.5V8H22V5.50295C22%204.2153%2020.8109%203%2019.5%203Z%22%20fill%3D%22%23aa5252%22%2F%3E%3Cpath%20d%3D%22M6%207.5H18V9H6L6%207.5Z%22%20fill%3D%22%23aa5252%22%2F%3E%3Cpath%20d%3D%22M6%2011H18V12.5H6V11Z%22%20fill%3D%22%23aa5252%22%2F%3E%3C%2Fsvg%3E"); } i.icon.icon-done-comment-white { width: 24px; height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9%2016.1719L19.5938%205.57812L21%206.98438L9%2018.9844L3.42188%2013.4062L4.82812%2012L9%2016.1719Z%22%20fill%3D%22%23FFFFFF%22%2F%3E%3C%2Fsvg%3E"); } +i.icon.icon-add-table { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M4%205.59961H11.2V8.79961H4V5.59961Z%22%20fill%3D%22%23aa5252%22%2F%3E%3Cpath%20d%3D%22M12.8%205.59961H20V8.79961H12.8V5.59961Z%22%20fill%3D%22%23aa5252%22%2F%3E%3Cpath%20d%3D%22M4%2010.3996H11.2V13.5996H4V10.3996Z%22%20fill%3D%22%23aa5252%22%2F%3E%3Cpath%20d%3D%22M12.8%2010.3996H20V13.5996H12.8V10.3996Z%22%20fill%3D%22%23aa5252%22%2F%3E%3Cpath%20d%3D%22M4%2015.1996H11.2V18.3996H4V15.1996Z%22%20fill%3D%22%23aa5252%22%2F%3E%3Cpath%20d%3D%22M12.8%2015.1996H20V18.3996H12.8V15.1996Z%22%20fill%3D%22%23aa5252%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-link { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M17.0235%207C18.4006%207%2019.5743%207.49845%2020.5446%208.49534C21.5149%209.46108%2022%2010.6293%2022%2012C22%2013.3708%2021.5149%2014.5546%2020.5446%2015.5515C19.5743%2016.5172%2018.4006%2017.0001%2017.0235%2017.0001H13V15H17C17.8451%2015%2018.5884%2014.7882%2019.1831%2014.1963C19.8091%2013.5733%2020%2012.8411%2020%2012C20%2011.1589%2019.8091%2010.4424%2019.1831%209.85049C18.5884%209.22743%2017.8685%209%2017.0235%209H13V7H17.0235ZM8.00939%2012.9814V11.0187H15.9906V12.9814H8.00939ZM4.76995%209.85049C4.17527%2010.4424%204%2011.1589%204%2012C4%2012.8411%204.17527%2013.5733%204.76995%2014.1963C5.39593%2014.7882%206.15493%2015%207%2015H11.0141V17.0001H6.97653C5.59937%2017.0001%204.42567%2016.5172%203.4554%2015.5515C2.48513%2014.5546%202%2013.3708%202%2012C2%2010.6293%202.48513%209.46108%203.4554%208.49534C4.42567%207.49845%205.59937%207%206.97653%207H11.0141V9H6.97653C6.13146%209%205.39593%209.22743%204.76995%209.85049Z%22%20fill%3D%22%23aa5252%22%2F%3E%3C%2Fsvg%3E"); +} .navbar i.icon.icon-logo { width: 100px; height: 14px; @@ -7171,6 +7176,26 @@ i.icon.icon-done-comment-white { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M14.9912%206C14.9912%208.18203%2014.4464%209.76912%2013.7789%2010.7492C13.101%2011.7447%2012.4042%2012%2011.9912%2012C11.5782%2012%2010.8814%2011.7447%2010.2035%2010.7492C9.53601%209.76912%208.99121%208.18203%208.99121%206C8.99121%204.23017%2010.4571%203%2011.9912%203C13.5254%203%2014.9912%204.23017%2014.9912%206ZM13.4917%2013.6397C13.0059%2013.8771%2012.4989%2014%2011.9912%2014C11.4861%2014%2010.9817%2013.8784%2010.4983%2013.6434C8.53188%2014.3681%206.94518%2015.0737%205.78927%2015.7768C4.10512%2016.8011%204%2017.4079%204%2017.5C4%2017.7664%204.1014%2018.3077%205.27104%2018.8939C6.50029%2019.5099%208.64545%2019.9999%2012%2020C15.3546%2020%2017.4997%2019.5099%2018.7289%2018.8939C19.8986%2018.3078%2020%2017.7664%2020%2017.5C20%2017.4079%2019.8949%2016.8011%2018.2107%2015.7768C17.0529%2015.0726%2015.4627%2014.3657%2013.4917%2013.6397ZM15.2272%2012.1594C16.2765%2010.7825%2016.9912%208.67814%2016.9912%206C16.9912%203%2014.5%201%2011.9912%201C9.48242%201%206.99121%203%206.99121%206C6.99121%208.68159%207.70777%2010.7879%208.75931%2012.1647C4.60309%2013.7964%202%2015.4951%202%2017.5C2%2019.9852%205%2021.9999%2012%2022C19%2022%2022%2019.9852%2022%2017.5C22%2015.4929%2019.3913%2013.7927%2015.2272%2012.1594Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); } +.navbar i.icon.icon-add-slide { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M2%204C2%202.89543%202.89543%202%204%202H20C21.1046%202%2022%202.89543%2022%204V20C22%2021.1046%2021.1046%2022%2020%2022H4C2.89543%2022%202%2021.1046%202%2020V4ZM11%2011V7.00001H13V11H17V13H13V17H11V13H7V11H11Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); +} +.navbar i.icon.icon-add-shape { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%2215%22%20r%3D%227%22%20fill%3D%22%23fff%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M3%203C2.44772%203%202%203.44772%202%204V17C2%2017.5523%202.44772%2018%203%2018H8.58152C8.20651%2017.0736%208%2016.0609%208%2015C8%2010.5817%2011.5817%207%2016%207C16.6906%207%2017.3608%207.08751%2018%207.25204V4C18%203.44772%2017.5523%203%2017%203H3Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); +} +.navbar i.icon.icon-add-image { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0)%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M4.23958%2018L8.09375%2013.5L10.9062%2016.5L14.7604%2012L19.7604%2018H4.23958ZM21.3229%2020.3906C21.7743%2019.9844%2022%2019.5156%2022%2018.9844V5.01562C22%204.48438%2021.7743%204.01562%2021.3229%203.60938C20.8715%203.20313%2020.3507%203%2019.7604%203H4.23958C3.64931%203%203.12847%203.20313%202.67708%203.60938C2.22569%204.01562%202%204.48438%202%205.01562V18.9844C2%2019.5156%202.22569%2019.9844%202.67708%2020.3906C3.12847%2020.7969%203.64931%2021%204.23958%2021H19.7604C20.3507%2021%2020.8715%2020.7969%2021.3229%2020.3906ZM8%2011C9.10457%2011%2010%2010.1046%2010%209C10%207.89543%209.10457%207%208%207C6.89543%207%206%207.89543%206%209C6%2010.1046%206.89543%2011%208%2011Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0%22%3E%3Cpath%20d%3D%22M0.000477791%200H24.0005V24H0.000477791V0Z%22%20fill%3D%22transparent%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E"); +} +.navbar i.icon.icon-add-other { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M7%2012C7%2013.6569%205.65685%2015%204%2015C2.34315%2015%201%2013.6569%201%2012C1%2010.3431%202.34315%209%204%209C5.65685%209%207%2010.3431%207%2012ZM15%2012C15%2013.6569%2013.6569%2015%2012%2015C10.3431%2015%209%2013.6569%209%2012C9%2010.3431%2010.3431%209%2012%209C13.6569%209%2015%2010.3431%2015%2012ZM20%2015C21.6569%2015%2023%2013.6569%2023%2012C23%2010.3431%2021.6569%209%2020%209C18.3431%209%2017%2010.3431%2017%2012C17%2013.6569%2018.3431%2015%2020%2015Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); +} .sailfish i.icon.icon-text-align-center { background-color: transparent; -webkit-mask-image: none; @@ -7444,6 +7469,12 @@ textarea { #add-shape .page { background-color: #fff; } +.container-add .categories i.icon { + opacity: 0.5; +} +.container-add .categories .active i.icon { + opacity: 1; +} .table-styles .row, .table-styles .row li { margin-bottom: 12px; diff --git a/apps/presentationeditor/mobile/resources/less/app-material.less b/apps/presentationeditor/mobile/resources/less/app-material.less index 0e9e4c5d7..6ac442771 100644 --- a/apps/presentationeditor/mobile/resources/less/app-material.less +++ b/apps/presentationeditor/mobile/resources/less/app-material.less @@ -114,6 +114,18 @@ input, textarea { background-color: #fff; } } +.container-add { + .categories { + i.icon { + opacity: 0.5; + } + .active { + i.icon { + opacity: 1; + } + } + } +} // Table styles diff --git a/apps/presentationeditor/mobile/resources/less/ios/_icons.less b/apps/presentationeditor/mobile/resources/less/ios/_icons.less index 719330b78..20146fcda 100644 --- a/apps/presentationeditor/mobile/resources/less/ios/_icons.less +++ b/apps/presentationeditor/mobile/resources/less/ios/_icons.less @@ -451,4 +451,55 @@ i.icon { height: 24px; .encoded-svg-background(''); } + //Insert + &.icon-add-slide { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-shape { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-image { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-other { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-table { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } +} + +.active { + i.icon { + &.icon-add-slide { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-shape { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-image { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-other { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + } } \ No newline at end of file diff --git a/apps/presentationeditor/mobile/resources/less/material/_icons.less b/apps/presentationeditor/mobile/resources/less/material/_icons.less index b8dcb4460..d998fdfa3 100644 --- a/apps/presentationeditor/mobile/resources/less/material/_icons.less +++ b/apps/presentationeditor/mobile/resources/less/material/_icons.less @@ -185,15 +185,10 @@ i.icon { height: 22px; .encoded-svg-background(''); } - &.icon-link { - width: 22px; - height: 22px; - .encoded-svg-background(''); - } &.icon-image-library { - width: 22px; - height: 22px; - .encoded-svg-background('icons_for_svg'); + width: 24px; + height: 24px; + .encoded-svg-background(''); } &.icon-text-valign-top { @@ -434,13 +429,23 @@ i.icon { &.icon-insert-comment { width: 24px; height: 24px; - .encoded-svg-background(''); + .encoded-svg-background(''); } &.icon-done-comment-white { width: 24px; height: 24px; .encoded-svg-background(''); } + &.icon-add-table { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-link { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } } // Overwrite color for toolbar @@ -511,5 +516,25 @@ i.icon { height: 24px; .encoded-svg-background(''); } + &.icon-add-slide { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-shape { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-image { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-other { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } } } \ No newline at end of file diff --git a/apps/spreadsheeteditor/mobile/app/controller/add/AddContainer.js b/apps/spreadsheeteditor/mobile/app/controller/add/AddContainer.js index 4db297c43..70c6a8adf 100644 --- a/apps/spreadsheeteditor/mobile/app/controller/add/AddContainer.js +++ b/apps/spreadsheeteditor/mobile/app/controller/add/AddContainer.js @@ -129,6 +129,7 @@ define([ addViews.push({ caption: me.textChart, id: 'add-chart', + icon: 'icon-add-chart', layout: SSE.getController('AddChart').getView('AddChart').rootLayout() }); @@ -137,6 +138,7 @@ define([ addViews.push({ caption: me.textFormula, id: 'add-formula', + icon: 'icon-add-formula', layout: options ? view.rootLayout() : view.layoutPanel() }); } @@ -145,6 +147,7 @@ define([ addViews.push({ caption: me.textShape, id: 'add-shape', + icon: 'icon-add-shape', layout: SSE.getController('AddShape').getView('AddShape').rootLayout() }); @@ -152,6 +155,7 @@ define([ addViews.push({ caption: me.textOther, id: 'add-other', + icon: 'icon-add-other', layout: SSE.getController('AddOther').getView('AddOther').rootLayout() }); @@ -168,6 +172,7 @@ define([ addViews.push({ caption: me.textImage, id: 'add-image', + icon: 'icon-add-image', layout: SSE.getController('AddOther').getView('AddOther').childLayout('image') }); } @@ -214,7 +219,7 @@ define([ $layoutNavbar .find('.toolbar-inner') .append( - '' + layout.caption + '' + '' ); }); $layoutNavbar @@ -229,7 +234,7 @@ define([ $layoutNavbar .find('.buttons-row') .append( - '' + layout.caption + '' + '' ); }); } diff --git a/apps/spreadsheeteditor/mobile/app/template/AddOther.template b/apps/spreadsheeteditor/mobile/app/template/AddOther.template index 4089e161e..dd247de8e 100644 --- a/apps/spreadsheeteditor/mobile/app/template/AddOther.template +++ b/apps/spreadsheeteditor/mobile/app/template/AddOther.template @@ -2,6 +2,18 @@
    diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css index 596615b11..828087606 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css @@ -5968,6 +5968,14 @@ html.pixel-ratio-3 .settings.popover .list-block ul:last-child:after { .settings .popover-inner { height: 400px; } +.container-add .categories > .buttons-row .button { + display: flex; + justify-content: center; + align-items: center; +} +.container-add .categories > .buttons-row .button.active i.icon { + background-color: transparent; +} .dataview.page-content { background: #ffffff; } @@ -7360,6 +7368,56 @@ i.icon.icon-insert-comment { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20.1538%209.00708H11.8462C10.8266%209.00708%2010%209.83461%2010%2010.8554V15.1694C10%2016.1902%2010.8266%2017.0177%2011.8462%2017.0177H13.8329C13.9409%2017.0177%2014.0454%2017.0556%2014.1284%2017.1248L18.243%2020.392C18.5436%2020.6428%2019%2020.4288%2019%2020.037V17.4798C19%2017.2246%2019.2066%2017.0177%2019.4615%2017.0177H20.1538C21.1734%2017.0177%2022%2016.1902%2022%2015.1694V10.8554C22%209.83461%2021.1734%209.00708%2020.1538%209.00708ZM20%2010.0083C20.5523%2010.0083%2021%2010.4565%2021%2011.0095V15.0154C21%2015.5683%2020.5523%2016.0165%2020%2016.0165H18.0025L18%2018.8995C18%2019.2912%2018%2019%2018%2019L14.5%2016.0165H12C11.4477%2016.0165%2011%2015.5683%2011%2015.0154V11.0095C11%2010.4565%2011.4477%2010.0083%2012%2010.0083H20Z%22%20fill%3D%22%2340865c%22%2F%3E%3Cpath%20d%3D%22M14.5%203H4.5C3.18908%203%202%204.2153%202%205.50295V12.0346C2%2013.3222%203.18908%2014.013%204.5%2014.013H5.5C5.82773%2014.013%206%2014.1917%206%2014.5136V17.5183C6%2018.0125%206.6135%2018.3352%207%2018.0189L11%2014.9858V13.5L7%2016.5V13.0118H4.5C3.78992%2013.0118%203%2012.732%203%2012.0346V5.50295C3%204.80547%203.78992%204.00118%204.5%204.00118H14.5C15.2101%204.00118%2016%204.80547%2016%205.50295V8.0059H17V5.50295C17%204.2153%2015.8109%203%2014.5%203Z%22%20fill%3D%22%2340865c%22%2F%3E%3C%2Fsvg%3E"); } +i.icon.icon-add-chart { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20%205H16V20H20V5ZM10%2011H14V20H10V11ZM4%2014H8V20H4V14Z%22%20fill%3D%22%2340865c%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-add-formula { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%205H19V9.11765H16.375V7.47059H8.9375L11.5625%2012L8.9375%2016.5294H16.375V14.8824H19V19H5V17.7647L8.5%2012L5%206.23529V5Z%22%20fill%3D%22%2340865c%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-add-shape { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cellipse%20cx%3D%2215.3333%22%20cy%3D%2214.4002%22%20rx%3D%225.66667%22%20ry%3D%225.60002%22%20fill%3D%22%2340865c%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%204.80005C4.44772%204.80005%204%205.24776%204%205.80005V15.8001C4%2016.3524%204.44771%2016.8001%205%2016.8001H9.32787C9.02431%2016.059%208.85714%2015.2488%208.85714%2014.4001C8.85714%2010.8655%2011.7566%208.00012%2015.3333%208.00012C15.8924%208.00012%2016.4349%208.07013%2016.9524%208.20175V5.80005C16.9524%205.24776%2016.5047%204.80005%2015.9524%204.80005H5Z%22%20fill%3D%22%2340865c%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-add-image { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5.79177%2016.6667L8.87529%2013.1667L11.1254%2015.5L14.2089%2012L18.2092%2016.6667H5.79177ZM19.4593%2018.526C19.8204%2018.2101%2020.001%2017.8455%2020.001%2017.4323V6.56771C20.001%206.15451%2019.8204%205.78993%2019.4593%205.47396C19.0981%205.15799%2018.6814%205%2018.2092%205H5.79177C5.31952%205%204.90283%205.15799%204.5417%205.47396C4.18057%205.78993%204%206.15451%204%206.56771V17.4323C4%2017.8455%204.18057%2018.2101%204.5417%2018.526C4.90283%2018.842%205.31952%2019%205.79177%2019H18.2092C18.6814%2019%2019.0981%2018.842%2019.4593%2018.526ZM8.79933%2011.2222C9.68304%2011.2222%2010.3994%2010.5258%2010.3994%209.66667C10.3994%208.80756%209.68304%208.11111%208.79933%208.11111C7.91562%208.11111%207.19923%208.80756%207.19923%209.66667C7.19923%2010.5258%207.91562%2011.2222%208.79933%2011.2222Z%22%20fill%3D%22%2340865c%22%2F%3E%3C%2Fsvg%3E"); +} +i.icon.icon-add-other { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M7.00049%2018C7.00049%2018.8284%206.32892%2019.5%205.50049%2019.5C4.67206%2019.5%204.00049%2018.8284%204.00049%2018C4.00049%2017.1716%204.67206%2016.5%205.50049%2016.5C6.32892%2016.5%207.00049%2017.1716%207.00049%2018ZM13.5005%2018C13.5005%2018.8284%2012.8289%2019.5%2012.0005%2019.5C11.1721%2019.5%2010.5005%2018.8284%2010.5005%2018C10.5005%2017.1716%2011.1721%2016.5%2012.0005%2016.5C12.8289%2016.5%2013.5005%2017.1716%2013.5005%2018ZM18.5005%2019.5C19.3289%2019.5%2020.0005%2018.8284%2020.0005%2018C20.0005%2017.1716%2019.3289%2016.5%2018.5005%2016.5C17.6721%2016.5%2017.0005%2017.1716%2017.0005%2018C17.0005%2018.8284%2017.6721%2019.5%2018.5005%2019.5Z%22%20fill%3D%22%2340865c%22%2F%3E%3C%2Fsvg%3E"); +} +.active i.icon.icon-add-chart { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20%205H16V20H20V5ZM10%2011H14V20H10V11ZM4%2014H8V20H4V14Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); +} +.active i.icon.icon-add-formula { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%205H19V9.11765H16.375V7.47059H8.9375L11.5625%2012L8.9375%2016.5294H16.375V14.8824H19V19H5V17.7647L8.5%2012L5%206.23529V5Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); +} +.active i.icon.icon-add-shape { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cellipse%20cx%3D%2215.3333%22%20cy%3D%2214.4002%22%20rx%3D%225.66667%22%20ry%3D%225.60002%22%20fill%3D%22white%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5%204.80005C4.44772%204.80005%204%205.24776%204%205.80005V15.8001C4%2016.3524%204.44771%2016.8001%205%2016.8001H9.32787C9.02431%2016.059%208.85714%2015.2488%208.85714%2014.4001C8.85714%2010.8655%2011.7566%208.00012%2015.3333%208.00012C15.8924%208.00012%2016.4349%208.07013%2016.9524%208.20175V5.80005C16.9524%205.24776%2016.5047%204.80005%2015.9524%204.80005H5Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); +} +.active i.icon.icon-add-image { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M5.79177%2016.6667L8.87529%2013.1667L11.1254%2015.5L14.2089%2012L18.2092%2016.6667H5.79177ZM19.4593%2018.526C19.8204%2018.2101%2020.001%2017.8455%2020.001%2017.4323V6.56771C20.001%206.15451%2019.8204%205.78993%2019.4593%205.47396C19.0981%205.15799%2018.6814%205%2018.2092%205H5.79177C5.31952%205%204.90283%205.15799%204.5417%205.47396C4.18057%205.78993%204%206.15451%204%206.56771V17.4323C4%2017.8455%204.18057%2018.2101%204.5417%2018.526C4.90283%2018.842%205.31952%2019%205.79177%2019H18.2092C18.6814%2019%2019.0981%2018.842%2019.4593%2018.526ZM8.79933%2011.2222C9.68304%2011.2222%2010.3994%2010.5258%2010.3994%209.66667C10.3994%208.80756%209.68304%208.11111%208.79933%208.11111C7.91562%208.11111%207.19923%208.80756%207.19923%209.66667C7.19923%2010.5258%207.91562%2011.2222%208.79933%2011.2222Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); +} +.active i.icon.icon-add-other { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M7.00049%2018C7.00049%2018.8284%206.32892%2019.5%205.50049%2019.5C4.67206%2019.5%204.00049%2018.8284%204.00049%2018C4.00049%2017.1716%204.67206%2016.5%205.50049%2016.5C6.32892%2016.5%207.00049%2017.1716%207.00049%2018ZM13.5005%2018C13.5005%2018.8284%2012.8289%2019.5%2012.0005%2019.5C11.1721%2019.5%2010.5005%2018.8284%2010.5005%2018C10.5005%2017.1716%2011.1721%2016.5%2012.0005%2016.5C12.8289%2016.5%2013.5005%2017.1716%2013.5005%2018ZM18.5005%2019.5C19.3289%2019.5%2020.0005%2018.8284%2020.0005%2018C20.0005%2017.1716%2019.3289%2016.5%2018.5005%2016.5C17.6721%2016.5%2017.0005%2017.1716%2017.0005%2018C17.0005%2018.8284%2017.6721%2019.5%2018.5005%2019.5Z%22%20fill%3D%22white%22%2F%3E%3C%2Fsvg%3E"); +} .chart-types .thumb.bar-normal { background-image: url('../img/charts/chart-03.png'); } diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-material.css b/apps/spreadsheeteditor/mobile/resources/css/app-material.css index 4291b0a43..dfaba16c0 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-material.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-material.css @@ -6825,25 +6825,21 @@ i.icon.icon-text-valign-bottom { -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%2340865c%22%3E%3Cg%3E%3Crect%20class%3D%22cls-1%22%20x%3D%222%22%20y%3D%2218%22%20width%3D%2219%22%20height%3D%221%22%2F%3E%3Crect%20class%3D%22cls-1%22%20x%3D%222%22%20y%3D%2220%22%20width%3D%2219%22%20height%3D%221%22%2F%3E%3Cpolygon%20class%3D%22cls-1%22%20points%3D%2211%204%2012%204%2012%2015.17%2014.35%2013.2%2015%2014.06%2011.5%2017%208%2014%208.65%2013.2%2011%2015.17%2011%204%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); } i.icon.icon-link { - width: 22px; - height: 22px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%2340865c%22%3E%3Cg%3E%3Cpath%20d%3D%22M12.4%2C9.8c0%2C0-2.1-0.1-3.8%2C1.2c-2.8%2C2-3.3%2C4.3-3.3%2C4.3s1.6-1.7%2C3.5-2.5c1.7-0.7%2C3.7-0.4%2C3.7-0.4v1.9l4.8-3.3V11l-4.8-3.3V9.8z%20M11%2C1C5.5%2C1%2C1%2C5.5%2C1%2C11c0%2C5.5%2C4.5%2C10%2C10%2C10s10-4.5%2C10-10C21%2C5.5%2C16.5%2C1%2C11%2C1z%20M11%2C20c-5%2C0-9-4.1-9-9C2%2C6%2C6%2C2%2C11%2C2s9%2C4.1%2C9%2C9C20%2C16%2C16%2C20%2C11%2C20z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M17.0235%207C18.4006%207%2019.5743%207.49845%2020.5446%208.49534C21.5149%209.46108%2022%2010.6293%2022%2012C22%2013.3708%2021.5149%2014.5546%2020.5446%2015.5515C19.5743%2016.5172%2018.4006%2017.0001%2017.0235%2017.0001H13V15H17C17.8451%2015%2018.5884%2014.7882%2019.1831%2014.1963C19.8091%2013.5733%2020%2012.8411%2020%2012C20%2011.1589%2019.8091%2010.4424%2019.1831%209.85049C18.5884%209.22743%2017.8685%209%2017.0235%209H13V7H17.0235ZM8.00939%2012.9814V11.0187H15.9906V12.9814H8.00939ZM4.76995%209.85049C4.17527%2010.4424%204%2011.1589%204%2012C4%2012.8411%204.17527%2013.5733%204.76995%2014.1963C5.39593%2014.7882%206.15493%2015%207%2015H11.0141V17.0001H6.97653C5.59937%2017.0001%204.42567%2016.5172%203.4554%2015.5515C2.48513%2014.5546%202%2013.3708%202%2012C2%2010.6293%202.48513%209.46108%203.4554%208.49534C4.42567%207.49845%205.59937%207%206.97653%207H11.0141V9H6.97653C6.13146%209%205.39593%209.22743%204.76995%209.85049Z%22%20fill%3D%22%2340865c%22%2F%3E%3C%2Fsvg%3E"); } -i.icon.icon-insimage { - width: 22px; - height: 22px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%2340865c%22%3E%3Cpath%20id%3D%22XMLID_43_%22%20d%3D%22M19%2C4L19%2C4H3v15l0%2C0l0%2C0l0%2C0h17V4H19z%20M7.5%2C7C8.3%2C7%2C9%2C7.7%2C9%2C8.5S8.3%2C10%2C7.5%2C10S6%2C9.3%2C6%2C8.5S6.7%2C7%2C7.5%2C7zM5.2%2C18l5.5-5.5l5.5%2C5.5H5.2z%20M19%2C18h-1.5l-4.3-4.3l4-4l1.8%2C1.8V18z%22%2F%3E%3C%2Fsvg%3E"); +i.icon.icon-insimage, +i.icon.icon-image-library { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0)%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20%205.5H4C3.72386%205.5%203.5%205.72386%203.5%206V15.5822L8.03349%2011.6898C8.47476%2011.3109%209.11904%2011.2865%209.58778%2011.6308L13.5726%2014.5579L15.9619%2012.6774C16.4488%2012.2942%2017.1428%2012.3255%2017.5933%2012.7509L20.5%2015.4962V6C20.5%205.72386%2020.2761%205.5%2020%205.5ZM20.5%2017.5294L20.485%2017.5453L16.7201%2013.9895L14.3509%2015.8542C13.9095%2016.2016%2013.2905%2016.2119%2012.8378%2015.8793L8.85988%2012.9573L3.5%2017.5592V18C3.5%2018.2761%203.72386%2018.5%204%2018.5H20C20.2761%2018.5%2020.5%2018.2761%2020.5%2018V17.5294ZM4%204C2.89543%204%202%204.89543%202%206V18C2%2019.1046%202.89543%2020%204%2020H20C21.1046%2020%2022%2019.1046%2022%2018V6C22%204.89543%2021.1046%204%2020%204H4ZM16.5%209.5C16.5%2011.1569%2015.1569%2012.5%2013.5%2012.5C11.8431%2012.5%2010.5%2011.1569%2010.5%209.5C10.5%207.84315%2011.8431%206.5%2013.5%206.5C15.1569%206.5%2016.5%207.84315%2016.5%209.5ZM13.5%2011C14.3284%2011%2015%2010.3284%2015%209.5C15%208.67157%2014.3284%208%2013.5%208C12.6716%208%2012%208.67157%2012%209.5C12%2010.3284%2012.6716%2011%2013.5%2011Z%22%20fill%3D%22%2340865c%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0%22%3E%3Cpath%20d%3D%22M0%200H24V24H0V0Z%22%20fill%3D%22transparent%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E"); } i.icon.icon-sort { width: 22px; height: 22px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22%2340865c%22%3E%3Cpolygon%20points%3D%228%2C16.4%207.3%2C15.7%205%2C18.1%205%2C2%204%2C2%204%2C18.1%201.7%2C15.7%201%2C16.4%204.5%2C20%204.5%2C20%204.5%2C20%20%22%2F%3E%3Cpath%20d%3D%22M19.3%2C4H8.7C8.1%2C4%2C7.8%2C4.6%2C8.1%2C5.1l3.9%2C5.9v4.7l2.8%2C1.5c0.5%2C0.3%2C1.1-0.1%2C1.1-0.7V11h0l3.9-5.9C20.2%2C4.6%2C19.9%2C4%2C19.3%2C4z%22%2F%3E%3C%2Fsvg%3E"); } -i.icon.icon-image-library { - width: 22px; - height: 22px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20viewBox%3D%220%200%2022%2022%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bisolation%3Aisolate%3B%7D.cls-2%7Bopacity%3A0.2%3B%7D.cls-3%7Bfill%3A%23fff%3B%7D.cls-10%2C.cls-11%2C.cls-4%2C.cls-6%2C.cls-7%2C.cls-8%2C.cls-9%7Bmix-blend-mode%3Amultiply%3B%7D.cls-4%7Bfill%3Aurl(%23grad_8)%3B%7D.cls-5%7Bfill%3Aurl(%23grad_10)%3B%7D.cls-6%7Bfill%3Aurl(%23grad_12)%3B%7D.cls-7%7Bfill%3Aurl(%23grad_14)%3B%7D.cls-8%7Bfill%3Aurl(%23grad_79)%3B%7D.cls-9%7Bfill%3Aurl(%23grad_77)%3B%7D.cls-10%7Bfill%3Aurl(%23grad_75)%3B%7D.cls-11%7Bfill%3Aurl(%23grad_81)%3B%7D%3C%2Fstyle%3E%3ClinearGradient%20id%3D%22grad_8%22%20x1%3D%2211.08%22%20y1%3D%2210.26%22%20x2%3D%2211.08%22%20y2%3D%221.26%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23f3e916%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23f89d34%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_10%22%20x1%3D%2211.08%22%20y1%3D%2220.44%22%20x2%3D%2211.08%22%20y2%3D%2211.88%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%235eb6e8%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23958cc3%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_12%22%20x1%3D%221.46%22%20y1%3D%2211.05%22%20x2%3D%2210.46%22%20y2%3D%2211.05%22%20gradientTransform%3D%22translate(17%205.09)%20rotate(90)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23cc8dba%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23f86867%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_14%22%20x1%3D%2211.73%22%20y1%3D%2211.05%22%20x2%3D%2220.73%22%20y2%3D%2211.05%22%20gradientTransform%3D%22translate(27.28%20-5.18)%20rotate(90)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%236ac07f%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23c5da3d%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_79%22%20x1%3D%2211.74%22%20y1%3D%2210.42%22%20x2%3D%2217.52%22%20y2%3D%224.63%22%20gradientTransform%3D%22translate(30.29%202.51)%20rotate(135)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23c5da3d%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23f3e916%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_77%22%20x1%3D%224.7%22%20y1%3D%2217.49%22%20x2%3D%2210.48%22%20y2%3D%2211.71%22%20gradientTransform%3D%22translate(23.24%2019.65)%20rotate(135)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%239595c3%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23cc8dba%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_75%22%20x1%3D%224.69%22%20y1%3D%224.64%22%20x2%3D%2210.47%22%20y2%3D%2210.42%22%20gradientTransform%3D%22translate(7.54%20-3.15)%20rotate(45)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23f86867%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%23f89d34%22%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%22grad_81%22%20x1%3D%2211.77%22%20y1%3D%2211.78%22%20x2%3D%2217.55%22%20y2%3D%2217.56%22%20gradientTransform%3D%22translate(14.63%20-6.05)%20rotate(45)%22%20gradientUnits%3D%22userSpaceOnUse%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%235ec0e8%22%2F%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22%236ac07f%22%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Ctitle%3Eicons_for_svg%3C%2Ftitle%3E%3Cg%20class%3D%22cls-1%22%3E%3Cg%20id%3D%22%D0%A1%D0%BB%D0%BE%D0%B9_1%22%20data-name%3D%22%D0%A1%D0%BB%D0%BE%D0%B9%201%22%3E%3Crect%20class%3D%22cls-2%22%20x%3D%220.09%22%20y%3D%220.01%22%20width%3D%2222%22%20height%3D%2222%22%20rx%3D%224%22%20ry%3D%224%22%2F%3E%3Crect%20class%3D%22cls-3%22%20x%3D%220.57%22%20y%3D%220.49%22%20width%3D%2221.04%22%20height%3D%2221.04%22%20rx%3D%223.6%22%20ry%3D%223.6%22%2F%3E%3Crect%20class%3D%22cls-4%22%20x%3D%228.33%22%20y%3D%221.26%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%2F%3E%3Crect%20class%3D%22cls-5%22%20x%3D%228.33%22%20y%3D%2211.76%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%2F%3E%3Crect%20class%3D%22cls-6%22%20x%3D%223.21%22%20y%3D%226.55%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(-5.09%2017)%20rotate(-90)%22%2F%3E%3Crect%20class%3D%22cls-7%22%20x%3D%2213.48%22%20y%3D%226.55%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(5.18%2027.28)%20rotate(-90)%22%2F%3E%3Crect%20class%3D%22cls-8%22%20x%3D%2211.87%22%20y%3D%223.03%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(19.64%2023.19)%20rotate(-135)%22%2F%3E%3Crect%20class%3D%22cls-9%22%20x%3D%224.8%22%20y%3D%2210.14%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(2.54%2030.33)%20rotate(-135)%22%2F%3E%3Crect%20class%3D%22cls-10%22%20x%3D%224.83%22%20y%3D%223.03%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(-3.1%207.56)%20rotate(-45)%22%2F%3E%3Crect%20class%3D%22cls-11%22%20x%3D%2211.87%22%20y%3D%2210.14%22%20width%3D%225.5%22%20height%3D%229%22%20rx%3D%222.5%22%20ry%3D%222.5%22%20transform%3D%22translate(-6.07%2014.63)%20rotate(-45)%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"); -} i.icon.icon-function { width: 22px; height: 22px; @@ -7092,7 +7088,7 @@ i.icon.icon-done-comment { i.icon.icon-insert-comment { width: 24px; height: 24px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M20.1538%209.00708H11.8462C10.8266%209.00708%2010%209.83461%2010%2010.8554V15.1694C10%2016.1902%2010.8266%2017.0177%2011.8462%2017.0177H13.8329C13.9409%2017.0177%2014.0454%2017.0556%2014.1284%2017.1248L18.243%2020.392C18.5436%2020.6428%2019%2020.4288%2019%2020.037V17.4798C19%2017.2246%2019.2066%2017.0177%2019.4615%2017.0177H20.1538C21.1734%2017.0177%2022%2016.1902%2022%2015.1694V10.8554C22%209.83461%2021.1734%209.00708%2020.1538%209.00708ZM20%2010.0083C20.5523%2010.0083%2021%2010.4565%2021%2011.0095V15.0154C21%2015.5683%2020.5523%2016.0165%2020%2016.0165H18.0025L18%2018.8995C18%2019.2912%2018%2019%2018%2019L14.5%2016.0165H12C11.4477%2016.0165%2011%2015.5683%2011%2015.0154V11.0095C11%2010.4565%2011.4477%2010.0083%2012%2010.0083H20Z%22%20fill%3D%22%2340865c%22%2F%3E%3Cpath%20d%3D%22M14.5%203H4.5C3.18908%203%202%204.2153%202%205.50295V12.0346C2%2013.3222%203.18908%2014.013%204.5%2014.013H5.5C5.82773%2014.013%206%2014.1917%206%2014.5136V17.5183C6%2018.0125%206.6135%2018.3352%207%2018.0189L11%2014.9858V13.5L7%2016.5V13.0118H4.5C3.78992%2013.0118%203%2012.732%203%2012.0346V5.50295C3%204.80547%203.78992%204.00118%204.5%204.00118H14.5C15.2101%204.00118%2016%204.80547%2016%205.50295V8.0059H17V5.50295C17%204.2153%2015.8109%203%2014.5%203Z%22%20fill%3D%22%2340865c%22%2F%3E%3C%2Fsvg%3E"); + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M19.5%203H4.5C3.18908%203%202%204.2153%202%205.50295V15.0346C2%2016.3222%203.18908%2017.013%204.5%2017.013H5.5C5.82773%2017.013%206%2017.1917%206%2017.5136V21L12%2017H20C21.1046%2017%2022%2016.1046%2022%2015V8H20.5V14.5C20.5%2015.0523%2020.0523%2015.5%2019.5%2015.5H11.5L7.5%2018V15.5H4.5C3.94772%2015.5%203.5%2015.0523%203.5%2014.5V5.5C3.5%204.94772%203.94772%204.5%204.5%204.5H19.5C20.0523%204.5%2020.5%204.94772%2020.5%205.5V8H22V5.50295C22%204.2153%2020.8109%203%2019.5%203Z%22%20fill%3D%22%2340865c%22%2F%3E%3Cpath%20d%3D%22M6%207.5H18V9H6L6%207.5Z%22%20fill%3D%22%2340865c%22%2F%3E%3Cpath%20d%3D%22M6%2011H18V12.5H6V11Z%22%20fill%3D%22%2340865c%22%2F%3E%3C%2Fsvg%3E"); } i.icon.icon-done-comment-white { width: 24px; @@ -7159,6 +7155,31 @@ i.icon.icon-done-comment-white { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M14.9912%206C14.9912%208.18203%2014.4464%209.76912%2013.7789%2010.7492C13.101%2011.7447%2012.4042%2012%2011.9912%2012C11.5782%2012%2010.8814%2011.7447%2010.2035%2010.7492C9.53601%209.76912%208.99121%208.18203%208.99121%206C8.99121%204.23017%2010.4571%203%2011.9912%203C13.5254%203%2014.9912%204.23017%2014.9912%206ZM13.4917%2013.6397C13.0059%2013.8771%2012.4989%2014%2011.9912%2014C11.4861%2014%2010.9817%2013.8784%2010.4983%2013.6434C8.53188%2014.3681%206.94518%2015.0737%205.78927%2015.7768C4.10512%2016.8011%204%2017.4079%204%2017.5C4%2017.7664%204.1014%2018.3077%205.27104%2018.8939C6.50029%2019.5099%208.64545%2019.9999%2012%2020C15.3546%2020%2017.4997%2019.5099%2018.7289%2018.8939C19.8986%2018.3078%2020%2017.7664%2020%2017.5C20%2017.4079%2019.8949%2016.8011%2018.2107%2015.7768C17.0529%2015.0726%2015.4627%2014.3657%2013.4917%2013.6397ZM15.2272%2012.1594C16.2765%2010.7825%2016.9912%208.67814%2016.9912%206C16.9912%203%2014.5%201%2011.9912%201C9.48242%201%206.99121%203%206.99121%206C6.99121%208.68159%207.70777%2010.7879%208.75931%2012.1647C4.60309%2013.7964%202%2015.4951%202%2017.5C2%2019.9852%205%2021.9999%2012%2022C19%2022%2022%2019.9852%2022%2017.5C22%2015.4929%2019.3913%2013.7927%2015.2272%2012.1594Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); } +.navbar i.icon.icon-add-chart { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M22%203H17V21H22V3ZM9.5%209.00012H14.5V21.0001H9.5V9.00012ZM2%2013H7V21H2V13Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); +} +.navbar i.icon.icon-add-formula { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M4%204H20V9H17V7H8.5L11.5%2012.5L8.5%2018H17V16H20V21H4V19.5L8%2012.5L4%205.5V4Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); +} +.navbar i.icon.icon-add-shape { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Ccircle%20cx%3D%2216%22%20cy%3D%2215%22%20r%3D%227%22%20fill%3D%22%23fff%22%2F%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M3%203C2.44772%203%202%203.44772%202%204V17C2%2017.5523%202.44772%2018%203%2018H8.58152C8.20651%2017.0736%208%2016.0609%208%2015C8%2010.5817%2011.5817%207%2016%207C16.6906%207%2017.3608%207.08751%2018%207.25204V4C18%203.44772%2017.5523%203%2017%203H3Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); +} +.navbar i.icon.icon-add-image { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0)%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M4.23958%2018L8.09375%2013.5L10.9062%2016.5L14.7604%2012L19.7604%2018H4.23958ZM21.3229%2020.3906C21.7743%2019.9844%2022%2019.5156%2022%2018.9844V5.01562C22%204.48438%2021.7743%204.01562%2021.3229%203.60938C20.8715%203.20313%2020.3507%203%2019.7604%203H4.23958C3.64931%203%203.12847%203.20313%202.67708%203.60938C2.22569%204.01562%202%204.48438%202%205.01562V18.9844C2%2019.5156%202.22569%2019.9844%202.67708%2020.3906C3.12847%2020.7969%203.64931%2021%204.23958%2021H19.7604C20.3507%2021%2020.8715%2020.7969%2021.3229%2020.3906ZM8%2011C9.10457%2011%2010%2010.1046%2010%209C10%207.89543%209.10457%207%208%207C6.89543%207%206%207.89543%206%209C6%2010.1046%206.89543%2011%208%2011Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0%22%3E%3Cpath%20d%3D%22M0.000477791%200H24.0005V24H0.000477791V0Z%22%20fill%3D%22transparent%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E"); +} +.navbar i.icon.icon-add-other { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M7%2012C7%2013.6569%205.65685%2015%204%2015C2.34315%2015%201%2013.6569%201%2012C1%2010.3431%202.34315%209%204%209C5.65685%209%207%2010.3431%207%2012ZM15%2012C15%2013.6569%2013.6569%2015%2012%2015C10.3431%2015%209%2013.6569%209%2012C9%2010.3431%2010.3431%209%2012%209C13.6569%209%2015%2010.3431%2015%2012ZM20%2015C21.6569%2015%2023%2013.6569%2023%2012C23%2010.3431%2021.6569%209%2020%209C18.3431%209%2017%2010.3431%2017%2012C17%2013.6569%2018.3431%2015%2020%2015Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); +} .chart-types .thumb.bar-normal { background-image: url('../img/charts/chart-03.png'); } @@ -7868,6 +7889,12 @@ html.pixel-ratio-3 .box-tabs ul > li:after { #add-shape .page { background-color: #fff; } +.container-add .categories i.icon { + opacity: 0.5; +} +.container-add .categories .active i.icon { + opacity: 1; +} .table-styles .row, .table-styles .row li { margin-bottom: 12px; diff --git a/apps/spreadsheeteditor/mobile/resources/less/app-material.less b/apps/spreadsheeteditor/mobile/resources/less/app-material.less index 897d5eb15..da83d5662 100644 --- a/apps/spreadsheeteditor/mobile/resources/less/app-material.less +++ b/apps/spreadsheeteditor/mobile/resources/less/app-material.less @@ -109,6 +109,18 @@ input, textarea { background-color: #fff; } } +.container-add { + .categories { + i.icon { + opacity: 0.5; + } + .active { + i.icon { + opacity: 1; + } + } + } +} // Table styles diff --git a/apps/spreadsheeteditor/mobile/resources/less/ios/_icons.less b/apps/spreadsheeteditor/mobile/resources/less/ios/_icons.less index 8f314eb15..2d8dab753 100644 --- a/apps/spreadsheeteditor/mobile/resources/less/ios/_icons.less +++ b/apps/spreadsheeteditor/mobile/resources/less/ios/_icons.less @@ -409,6 +409,62 @@ i.icon { height: 24px; .encoded-svg-background(''); } + //Insert + &.icon-add-chart { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-formula { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-shape { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-image { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-other { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } +} + +.active { + i.icon { + &.icon-add-chart { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-formula { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-shape { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-image { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-other { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + } } .chart-types .thumb { diff --git a/apps/spreadsheeteditor/mobile/resources/less/material/_icons.less b/apps/spreadsheeteditor/mobile/resources/less/material/_icons.less index 8a8250db9..f75328c16 100644 --- a/apps/spreadsheeteditor/mobile/resources/less/material/_icons.less +++ b/apps/spreadsheeteditor/mobile/resources/less/material/_icons.less @@ -101,25 +101,20 @@ i.icon { .encoded-svg-mask(''); } &.icon-link { - width: 22px; - height: 22px; - .encoded-svg-background(''); + width: 24px; + height: 24px; + .encoded-svg-background(''); } - &.icon-insimage { - width: 22px; - height: 22px; - .encoded-svg-background(''); + &.icon-insimage, &.icon-image-library { + width: 24px; + height: 24px; + .encoded-svg-background(''); } &.icon-sort { width: 22px; height: 22px; .encoded-svg-background(''); } - &.icon-image-library { - width: 22px; - height: 22px; - .encoded-svg-background('icons_for_svg'); - } &.icon-function { width: 22px; height: 22px; @@ -386,7 +381,7 @@ i.icon { &.icon-insert-comment { width: 24px; height: 24px; - .encoded-svg-background(''); + .encoded-svg-background(''); } &.icon-done-comment-white { width: 24px; @@ -458,6 +453,31 @@ i.icon { height: 24px; .encoded-svg-background(''); } + &.icon-add-chart { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-formula { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-shape { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-image { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } + &.icon-add-other { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } } } From add8ec86219c69ba73c9c4556d7ae7f1da6fe746 Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Wed, 6 May 2020 15:46:12 +0300 Subject: [PATCH 22/23] [mobile] Fix comments --- .../mobile/lib/controller/Collaboration.js | 12 ++++++++---- apps/common/mobile/lib/view/Collaboration.js | 6 +++--- .../resources/less/ios/_collaboration.less | 4 ---- .../less/material/_collaboration.less | 9 --------- .../mobile/app/controller/Main.js | 2 +- .../mobile/app/controller/Settings.js | 6 +++--- .../mobile/app/controller/add/AddContainer.js | 2 +- .../mobile/resources/css/app-ios.css | 6 ------ .../mobile/resources/css/app-material.css | 19 +++++-------------- .../resources/less/material/_icons.less | 10 +++++----- .../mobile/resources/css/app-ios.css | 6 ------ .../mobile/resources/css/app-material.css | 19 +++++-------------- .../resources/less/material/_icons.less | 10 +++++----- .../mobile/app/controller/Main.js | 2 +- .../mobile/app/controller/Settings.js | 6 +++--- .../mobile/resources/css/app-ios.css | 6 ------ .../mobile/resources/css/app-material.css | 19 +++++-------------- .../resources/less/material/_icons.less | 10 +++++----- 18 files changed, 50 insertions(+), 104 deletions(-) diff --git a/apps/common/mobile/lib/controller/Collaboration.js b/apps/common/mobile/lib/controller/Collaboration.js index 3f2694a0a..2b00c0b13 100644 --- a/apps/common/mobile/lib/controller/Collaboration.js +++ b/apps/common/mobile/lib/controller/Collaboration.js @@ -786,7 +786,7 @@ define([ disabledViewComments: function(disabled) { if ($('.container-view-comment').length > 0) { if (disabled) { - $('.comment-resolve, .comment-menu, .add-reply').addClass('disabled'); + $('.comment-resolve, .comment-menu, .add-reply, .reply-menu').addClass('disabled'); if (!$('.prev-comment').hasClass('disabled')) { $('.prev-comment').addClass('disabled'); } @@ -794,7 +794,7 @@ define([ $('.next-comment').addClass('disabled'); } } else { - $('.comment-resolve, .comment-menu, .add-reply').removeClass('disabled'); + $('.comment-resolve, .comment-menu, .add-reply, .reply-menu').removeClass('disabled'); if (this.showComments.length > 1) { $('.prev-comment, .next-comment').removeClass('disabled'); } @@ -1268,6 +1268,7 @@ define([ $textarea.selectionStart = $textarea.value.length; }, 100); } else { + me.disabledViewComments(true); if ($('.comment-textarea').length === 0) { var $viewComment = $('.container-view-comment'); var oldComment = $viewComment.find('.comment-text span').text(); @@ -1348,6 +1349,7 @@ define([ }); $('.popup').css('z-index', '20000'); } else { + me.disabledViewComments(true); var $reply = $('.reply-item[data-ind=' + indReply + ']'); var $viewComment = $('.container-view-comment'); $reply.find('.reply-text').css('display', 'none'); @@ -1369,7 +1371,7 @@ define([ $textarea.selectionStart = $textarea.value.length; }); $('#edit-reply').single('click', _.bind(me.onEditReply, me, comment, indReply)); - $('.cancel-reply').single('click', _.bind(me.onCancelEditReply, me)); + $('.cancel-reply').single('click', _.bind(me.onCancelEditReply, me, indReply)); } } }, @@ -1404,7 +1406,9 @@ define([ } }, - onCancelEditReply: function() { + onCancelEditReply: function(indReply) { + var $viewComment = $('.container-view-comment'), + $reply = $('.reply-item[data-ind=' + indReply + ']'); $viewComment.find('a#edit-reply, a.cancel-reply, .edit-reply-textarea').remove(); $reply.find('.reply-text').css('display', 'block'); $viewComment.find('a.prev-comment, a.next-comment, a.add-reply').css('display', 'flex'); diff --git a/apps/common/mobile/lib/view/Collaboration.js b/apps/common/mobile/lib/view/Collaboration.js index 13a47f164..66b26c2d9 100644 --- a/apps/common/mobile/lib/view/Collaboration.js +++ b/apps/common/mobile/lib/view/Collaboration.js @@ -344,7 +344,7 @@ define([ '
    ' + '
    ' + (isAndroid ? '' : '' + this.textCancel + '') + '
    ' + '
    ' + this.textAddReply + '
    ' + - '
    ' + (isAndroid ? '' : '' + this.textDone + '') + '
    ' + + '
    ' + (isAndroid ? '' : '' + this.textDone + '') + '
    ' + '
    ' + '' + '
    ' + @@ -392,7 +392,7 @@ define([ '
    ' + '
    ' + (isAndroid ? ' ' : '' + this.textCancel + '') + '
    ' + '
    ' + this.textEditСomment + '
    ' + - '
    ' + (isAndroid ? '' : '' + this.textDone + '') + '
    ' + + '
    ' + (isAndroid ? '' : '' + this.textDone + '') + '
    ' + '
    ' + '
    ' + '
    ' + @@ -417,7 +417,7 @@ define([ '
    ' + '
    ' + (isAndroid ? '' : '' + this.textCancel + '') + '
    ' + '
    ' + this.textEditReply + '
    ' + - '
    ' + (isAndroid ? '' : '' + this.textDone + '') + '
    ' + + '
    ' + (isAndroid ? '' : '' + this.textDone + '') + '
    ' + '
    ' + '
    ' + '
    ' + diff --git a/apps/common/mobile/resources/less/ios/_collaboration.less b/apps/common/mobile/resources/less/ios/_collaboration.less index d3a89c340..698a6d96a 100644 --- a/apps/common/mobile/resources/less/ios/_collaboration.less +++ b/apps/common/mobile/resources/less/ios/_collaboration.less @@ -195,9 +195,6 @@ } .container-edit-comment { - .navbar { - background-color: #FFFFFF; - } .page { background-color: #FFFFFF; } @@ -378,7 +375,6 @@ .container-add-reply { height: 100%; .navbar { - background-color: #FFFFFF; a.link i + span { margin-left: 0; } diff --git a/apps/common/mobile/resources/less/material/_collaboration.less b/apps/common/mobile/resources/less/material/_collaboration.less index d58a5a7ee..0f0e93925 100644 --- a/apps/common/mobile/resources/less/material/_collaboration.less +++ b/apps/common/mobile/resources/less/material/_collaboration.less @@ -220,13 +220,6 @@ display: none; } -.container-edit-comment { - .navbar { - background-color: #FFFFFF; - color: @themeColor; - } -} - //view comment .container-view-comment { position: fixed; @@ -407,8 +400,6 @@ .container-edit-comment, .container-add-reply { height: 100%; .navbar { - background-color: #FFFFFF; - color: #000; &:after { content: ''; position: absolute; diff --git a/apps/documenteditor/mobile/app/controller/Main.js b/apps/documenteditor/mobile/app/controller/Main.js index 2f0351f5b..a630bb57c 100644 --- a/apps/documenteditor/mobile/app/controller/Main.js +++ b/apps/documenteditor/mobile/app/controller/Main.js @@ -528,7 +528,7 @@ define([ me.api.asc_SetTrackRevisions(me.appOptions.isReviewOnly || Common.localStorage.getBool("de-mobile-track-changes-" + (me.appOptions.fileKey || ''))); /** coauthoring begin **/ - this.isLiveCommenting = Common.localStorage.getBool("de-settings-livecomment", true); + this.isLiveCommenting = Common.localStorage.getBool("de-mobile-settings-livecomment", true); var resolved = Common.localStorage.getBool("de-settings-resolvedcomment", true); this.isLiveCommenting ? this.api.asc_showComments(resolved) : this.api.asc_hideComments(); /** coauthoring end **/ diff --git a/apps/documenteditor/mobile/app/controller/Settings.js b/apps/documenteditor/mobile/app/controller/Settings.js index a1205cd8f..c058d65bd 100644 --- a/apps/documenteditor/mobile/app/controller/Settings.js +++ b/apps/documenteditor/mobile/app/controller/Settings.js @@ -237,7 +237,7 @@ define([ $('#settings-hidden-borders input:checkbox').attr('checked', (Common.localStorage.getItem("de-mobile-hidden-borders") == 'true') ? true : false); $('#settings-hidden-borders input:checkbox').single('change', _.bind(me.onShowTableEmptyLine, me)); $('#settings-orthography').single('click', _.bind(me.onOrthographyCheck, me)); - var displayComments = Common.localStorage.getBool("de-settings-livecomment", true); + var displayComments = Common.localStorage.getBool("de-mobile-settings-livecomment", true); $('#settings-display-comments input:checkbox').attr('checked', displayComments); $('#settings-display-comments input:checkbox').single('change', _.bind(me.onChangeDisplayComments, me)); var displayResolved = Common.localStorage.getBool("de-settings-resolvedcomment", true); @@ -285,11 +285,11 @@ define([ this.api.asc_showComments(resolved); $("#settings-display-resolved").removeClass("disabled"); } - Common.localStorage.setBool("de-settings-livecomment", displayComments); + Common.localStorage.setBool("de-mobile-settings-livecomment", displayComments); }, onChangeDisplayResolved: function(e) { - var displayComments = Common.localStorage.getBool("de-settings-livecomment"); + var displayComments = Common.localStorage.getBool("de-mobile-settings-livecomment"); if (displayComments) { var resolved = $(e.currentTarget).is(':checked'); if (this.api) { diff --git a/apps/documenteditor/mobile/app/controller/add/AddContainer.js b/apps/documenteditor/mobile/app/controller/add/AddContainer.js index 6a5975fef..265a0412b 100644 --- a/apps/documenteditor/mobile/app/controller/add/AddContainer.js +++ b/apps/documenteditor/mobile/app/controller/add/AddContainer.js @@ -75,7 +75,7 @@ define([ uiApp.closeModal(); me._showByStack(Common.SharedSettings.get('phone')); - uiApp.showTab('#add-other'); + //uiApp.showTab('#add-other'); DE.getController('Toolbar').getView('Toolbar').hideSearch(); }, diff --git a/apps/documenteditor/mobile/resources/css/app-ios.css b/apps/documenteditor/mobile/resources/css/app-ios.css index 3c06ccd77..9d6be9bf5 100644 --- a/apps/documenteditor/mobile/resources/css/app-ios.css +++ b/apps/documenteditor/mobile/resources/css/app-ios.css @@ -6757,9 +6757,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .settings.popover .list-block ul.list-reply:last-child:after { display: none; } -.container-edit-comment .navbar { - background-color: #FFFFFF; -} .container-edit-comment .page { background-color: #FFFFFF; } @@ -6930,9 +6927,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-add-reply { height: 100%; } -.container-add-reply .navbar { - background-color: #FFFFFF; -} .container-add-reply .navbar a.link i + span { margin-left: 0; } diff --git a/apps/documenteditor/mobile/resources/css/app-material.css b/apps/documenteditor/mobile/resources/css/app-material.css index 67d4bd728..0beb5df9f 100644 --- a/apps/documenteditor/mobile/resources/css/app-material.css +++ b/apps/documenteditor/mobile/resources/css/app-material.css @@ -6387,10 +6387,6 @@ html.phone .document-menu .list-block .item-link { .settings.popover .list-block ul.list-reply:last-child:after { display: none; } -.container-edit-comment .navbar { - background-color: #FFFFFF; - color: #446995; -} .container-view-comment { position: fixed; -webkit-transition: height 100ms; @@ -6559,11 +6555,6 @@ html.phone .document-menu .list-block .item-link { .container-add-reply { height: 100%; } -.container-edit-comment .navbar, -.container-add-reply .navbar { - background-color: #FFFFFF; - color: #000; -} .container-edit-comment .navbar:after, .container-add-reply .navbar:after { content: ''; @@ -7101,11 +7092,6 @@ i.icon.icon-next-comment { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9.98438%206L15.9844%2012L9.98438%2018L8.57812%2016.5938L13.1719%2012L8.57812%207.40625L9.98438%206Z%22%20fill%3D%22%23446995%22%2F%3E%3C%2Fsvg%3E"); } -i.icon.icon-close-comment { - width: 24px; - height: 24px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18.9844%206.42188L13.4062%2012L18.9844%2017.5781L17.5781%2018.9844L12%2013.4062L6.42188%2018.9844L5.01562%2017.5781L10.5938%2012L5.01562%206.42188L6.42188%205.01562L12%2010.5938L17.5781%205.01562L18.9844%206.42188Z%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%200.6)%22%2F%3E%3C%2Fsvg%3E"); -} i.icon.icon-done-comment { width: 24px; height: 24px; @@ -7201,6 +7187,11 @@ i.icon.icon-done-comment-white { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M7%2012C7%2013.6569%205.65685%2015%204%2015C2.34315%2015%201%2013.6569%201%2012C1%2010.3431%202.34315%209%204%209C5.65685%209%207%2010.3431%207%2012ZM15%2012C15%2013.6569%2013.6569%2015%2012%2015C10.3431%2015%209%2013.6569%209%2012C9%2010.3431%2010.3431%209%2012%209C13.6569%209%2015%2010.3431%2015%2012ZM20%2015C21.6569%2015%2023%2013.6569%2023%2012C23%2010.3431%2021.6569%209%2020%209C18.3431%209%2017%2010.3431%2017%2012C17%2013.6569%2018.3431%2015%2020%2015Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); } +.navbar i.icon.icon-close-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18.9844%206.42188L13.4062%2012L18.9844%2017.5781L17.5781%2018.9844L12%2013.4062L6.42188%2018.9844L5.01562%2017.5781L10.5938%2012L5.01562%206.42188L6.42188%205.01562L12%2010.5938L17.5781%205.01562L18.9844%206.42188Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); +} .sailfish i.icon.icon-text-align-center { background-color: transparent; -webkit-mask-image: none; diff --git a/apps/documenteditor/mobile/resources/less/material/_icons.less b/apps/documenteditor/mobile/resources/less/material/_icons.less index 4db39aeac..8e6ee9569 100644 --- a/apps/documenteditor/mobile/resources/less/material/_icons.less +++ b/apps/documenteditor/mobile/resources/less/material/_icons.less @@ -429,11 +429,6 @@ i.icon { height: 24px; .encoded-svg-background(''); } - &.icon-close-comment { - width: 24px; - height: 24px; - .encoded-svg-background(''); - } &.icon-done-comment { width: 24px; height: 24px; @@ -535,5 +530,10 @@ i.icon { height: 24px; .encoded-svg-background(''); } + &.icon-close-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } } } \ No newline at end of file diff --git a/apps/presentationeditor/mobile/resources/css/app-ios.css b/apps/presentationeditor/mobile/resources/css/app-ios.css index 954b546fb..4c53197da 100644 --- a/apps/presentationeditor/mobile/resources/css/app-ios.css +++ b/apps/presentationeditor/mobile/resources/css/app-ios.css @@ -6757,9 +6757,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .settings.popover .list-block ul.list-reply:last-child:after { display: none; } -.container-edit-comment .navbar { - background-color: #FFFFFF; -} .container-edit-comment .page { background-color: #FFFFFF; } @@ -6930,9 +6927,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-add-reply { height: 100%; } -.container-add-reply .navbar { - background-color: #FFFFFF; -} .container-add-reply .navbar a.link i + span { margin-left: 0; } diff --git a/apps/presentationeditor/mobile/resources/css/app-material.css b/apps/presentationeditor/mobile/resources/css/app-material.css index bf6b594e0..db85e3b04 100644 --- a/apps/presentationeditor/mobile/resources/css/app-material.css +++ b/apps/presentationeditor/mobile/resources/css/app-material.css @@ -6387,10 +6387,6 @@ html.phone .document-menu .list-block .item-link { .settings.popover .list-block ul.list-reply:last-child:after { display: none; } -.container-edit-comment .navbar { - background-color: #FFFFFF; - color: #aa5252; -} .container-view-comment { position: fixed; -webkit-transition: height 100ms; @@ -6559,11 +6555,6 @@ html.phone .document-menu .list-block .item-link { .container-add-reply { height: 100%; } -.container-edit-comment .navbar, -.container-add-reply .navbar { - background-color: #FFFFFF; - color: #000; -} .container-edit-comment .navbar:after, .container-add-reply .navbar:after { content: ''; @@ -7081,11 +7072,6 @@ i.icon.icon-next-comment { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9.98438%206L15.9844%2012L9.98438%2018L8.57812%2016.5938L13.1719%2012L8.57812%207.40625L9.98438%206Z%22%20fill%3D%22%23aa5252%22%2F%3E%3C%2Fsvg%3E"); } -i.icon.icon-close-comment { - width: 24px; - height: 24px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18.9844%206.42188L13.4062%2012L18.9844%2017.5781L17.5781%2018.9844L12%2013.4062L6.42188%2018.9844L5.01562%2017.5781L10.5938%2012L5.01562%206.42188L6.42188%205.01562L12%2010.5938L17.5781%205.01562L18.9844%206.42188Z%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%200.6)%22%2F%3E%3C%2Fsvg%3E"); -} i.icon.icon-done-comment { width: 24px; height: 24px; @@ -7196,6 +7182,11 @@ i.icon.icon-link { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M7%2012C7%2013.6569%205.65685%2015%204%2015C2.34315%2015%201%2013.6569%201%2012C1%2010.3431%202.34315%209%204%209C5.65685%209%207%2010.3431%207%2012ZM15%2012C15%2013.6569%2013.6569%2015%2012%2015C10.3431%2015%209%2013.6569%209%2012C9%2010.3431%2010.3431%209%2012%209C13.6569%209%2015%2010.3431%2015%2012ZM20%2015C21.6569%2015%2023%2013.6569%2023%2012C23%2010.3431%2021.6569%209%2020%209C18.3431%209%2017%2010.3431%2017%2012C17%2013.6569%2018.3431%2015%2020%2015Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); } +.navbar i.icon.icon-close-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18.9844%206.42188L13.4062%2012L18.9844%2017.5781L17.5781%2018.9844L12%2013.4062L6.42188%2018.9844L5.01562%2017.5781L10.5938%2012L5.01562%206.42188L6.42188%205.01562L12%2010.5938L17.5781%205.01562L18.9844%206.42188Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); +} .sailfish i.icon.icon-text-align-center { background-color: transparent; -webkit-mask-image: none; diff --git a/apps/presentationeditor/mobile/resources/less/material/_icons.less b/apps/presentationeditor/mobile/resources/less/material/_icons.less index d998fdfa3..ef2e2e839 100644 --- a/apps/presentationeditor/mobile/resources/less/material/_icons.less +++ b/apps/presentationeditor/mobile/resources/less/material/_icons.less @@ -416,11 +416,6 @@ i.icon { height: 24px; .encoded-svg-background(''); } - &.icon-close-comment { - width: 24px; - height: 24px; - .encoded-svg-background(''); - } &.icon-done-comment { width: 24px; height: 24px; @@ -536,5 +531,10 @@ i.icon { height: 24px; .encoded-svg-background(''); } + &.icon-close-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } } } \ No newline at end of file diff --git a/apps/spreadsheeteditor/mobile/app/controller/Main.js b/apps/spreadsheeteditor/mobile/app/controller/Main.js index 2f38c4a03..bf5493a3c 100644 --- a/apps/spreadsheeteditor/mobile/app/controller/Main.js +++ b/apps/spreadsheeteditor/mobile/app/controller/Main.js @@ -526,7 +526,7 @@ define([ this.api.asc_setZoom(zf>0 ? zf : 1); /** coauthoring begin **/ - this.isLiveCommenting = Common.localStorage.getBool("sse-settings-livecomment", true); + this.isLiveCommenting = Common.localStorage.getBool("sse-mobile-settings-livecomment", true); var resolved = Common.localStorage.getBool("sse-settings-resolvedcomment", true); this.isLiveCommenting ? this.api.asc_showComments(resolved) : this.api.asc_hideComments(); diff --git a/apps/spreadsheeteditor/mobile/app/controller/Settings.js b/apps/spreadsheeteditor/mobile/app/controller/Settings.js index bb74e6fc9..847826eed 100644 --- a/apps/spreadsheeteditor/mobile/app/controller/Settings.js +++ b/apps/spreadsheeteditor/mobile/app/controller/Settings.js @@ -595,7 +595,7 @@ define([ $r1c1Style.single('change', _.bind(me.clickR1C1Style, me)); //init Commenting Display - var displayComments = Common.localStorage.getBool("sse-settings-livecomment", true); + var displayComments = Common.localStorage.getBool("sse-mobile-settings-livecomment", true); $('#settings-display-comments input:checkbox').attr('checked', displayComments); $('#settings-display-comments input:checkbox').single('change', _.bind(me.onChangeDisplayComments, me)); var displayResolved = Common.localStorage.getBool("sse-settings-resolvedcomment", true); @@ -619,11 +619,11 @@ define([ this.api.asc_showComments(resolved); $("#settings-display-resolved").removeClass("disabled"); } - Common.localStorage.setBool("sse-settings-livecomment", displayComments); + Common.localStorage.setBool("sse-mobile-settings-livecomment", displayComments); }, onChangeDisplayResolved: function(e) { - var displayComments = Common.localStorage.getBool("sse-settings-livecomment"); + var displayComments = Common.localStorage.getBool("sse-mobile-settings-livecomment"); if (displayComments) { var resolved = $(e.currentTarget).is(':checked'); if (this.api) { diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css index 828087606..b18dcba25 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css @@ -6750,9 +6750,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .settings.popover .list-block ul.list-reply:last-child:after { display: none; } -.container-edit-comment .navbar { - background-color: #FFFFFF; -} .container-edit-comment .page { background-color: #FFFFFF; } @@ -6923,9 +6920,6 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .container-add-reply { height: 100%; } -.container-add-reply .navbar { - background-color: #FFFFFF; -} .container-add-reply .navbar a.link i + span { margin-left: 0; } diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-material.css b/apps/spreadsheeteditor/mobile/resources/css/app-material.css index dfaba16c0..8d86bf5ee 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-material.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-material.css @@ -6397,10 +6397,6 @@ html.phone .document-menu .list-block .item-link { .settings.popover .list-block ul.list-reply:last-child:after { display: none; } -.container-edit-comment .navbar { - background-color: #FFFFFF; - color: #40865c; -} .container-view-comment { position: fixed; -webkit-transition: height 100ms; @@ -6569,11 +6565,6 @@ html.phone .document-menu .list-block .item-link { .container-add-reply { height: 100%; } -.container-edit-comment .navbar, -.container-add-reply .navbar { - background-color: #FFFFFF; - color: #000; -} .container-edit-comment .navbar:after, .container-add-reply .navbar:after { content: ''; @@ -7075,11 +7066,6 @@ i.icon.icon-next-comment { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M9.98438%206L15.9844%2012L9.98438%2018L8.57812%2016.5938L13.1719%2012L8.57812%207.40625L9.98438%206Z%22%20fill%3D%22%2340865c%22%2F%3E%3C%2Fsvg%3E"); } -i.icon.icon-close-comment { - width: 24px; - height: 24px; - background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18.9844%206.42188L13.4062%2012L18.9844%2017.5781L17.5781%2018.9844L12%2013.4062L6.42188%2018.9844L5.01562%2017.5781L10.5938%2012L5.01562%206.42188L6.42188%205.01562L12%2010.5938L17.5781%205.01562L18.9844%206.42188Z%22%20fill%3D%22rgba(0%2C%200%2C%200%2C%200.6)%22%2F%3E%3C%2Fsvg%3E"); -} i.icon.icon-done-comment { width: 24px; height: 24px; @@ -7180,6 +7166,11 @@ i.icon.icon-done-comment-white { height: 24px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M7%2012C7%2013.6569%205.65685%2015%204%2015C2.34315%2015%201%2013.6569%201%2012C1%2010.3431%202.34315%209%204%209C5.65685%209%207%2010.3431%207%2012ZM15%2012C15%2013.6569%2013.6569%2015%2012%2015C10.3431%2015%209%2013.6569%209%2012C9%2010.3431%2010.3431%209%2012%209C13.6569%209%2015%2010.3431%2015%2012ZM20%2015C21.6569%2015%2023%2013.6569%2023%2012C23%2010.3431%2021.6569%209%2020%209C18.3431%209%2017%2010.3431%2017%2012C17%2013.6569%2018.3431%2015%2020%2015Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); } +.navbar i.icon.icon-close-comment { + width: 24px; + height: 24px; + background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18.9844%206.42188L13.4062%2012L18.9844%2017.5781L17.5781%2018.9844L12%2013.4062L6.42188%2018.9844L5.01562%2017.5781L10.5938%2012L5.01562%206.42188L6.42188%205.01562L12%2010.5938L17.5781%205.01562L18.9844%206.42188Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E"); +} .chart-types .thumb.bar-normal { background-image: url('../img/charts/chart-03.png'); } diff --git a/apps/spreadsheeteditor/mobile/resources/less/material/_icons.less b/apps/spreadsheeteditor/mobile/resources/less/material/_icons.less index f75328c16..2cc96f141 100644 --- a/apps/spreadsheeteditor/mobile/resources/less/material/_icons.less +++ b/apps/spreadsheeteditor/mobile/resources/less/material/_icons.less @@ -368,11 +368,6 @@ i.icon { height: 24px; .encoded-svg-background(''); } - &.icon-close-comment { - width: 24px; - height: 24px; - .encoded-svg-background(''); - } &.icon-done-comment { width: 24px; height: 24px; @@ -478,6 +473,11 @@ i.icon { height: 24px; .encoded-svg-background(''); } + &.icon-close-comment { + width: 24px; + height: 24px; + .encoded-svg-background(''); + } } } From b944ddccfcb44be3f14207791c46d9b41a4547c5 Mon Sep 17 00:00:00 2001 From: JuliaSvinareva Date: Thu, 7 May 2020 19:28:58 +0300 Subject: [PATCH 23/23] [mobile] Comments (remove textarea border, increased font, remove tabs animation, add placeholder, changed modal window of delete comment draft) --- apps/common/mobile/lib/view/Collaboration.js | 2 +- .../resources/less/ios/_collaboration.less | 19 +++++++++++++----- .../less/material/_collaboration.less | 10 ++++++++-- .../mobile/app/controller/add/AddContainer.js | 7 ++----- .../mobile/app/controller/add/AddOther.js | 8 +++++--- .../app/controller/edit/EditContainer.js | 5 +---- .../mobile/app/template/EditChart.template | 8 ++++---- .../mobile/app/template/EditShape.template | 4 +--- .../mobile/app/template/EditTable.template | 4 +--- .../mobile/app/view/add/AddOther.js | 6 ++++-- apps/documenteditor/mobile/locale/en.json | 1 + .../mobile/resources/css/app-ios.css | 20 ++++++++++++++----- .../mobile/resources/css/app-material.css | 11 ++++++++-- .../mobile/app/controller/add/AddContainer.js | 5 +---- .../mobile/app/controller/add/AddOther.js | 6 ++++-- .../app/controller/edit/EditContainer.js | 5 +---- .../mobile/app/template/EditChart.template | 6 ++---- .../mobile/app/template/EditShape.template | 4 +--- .../mobile/app/template/EditTable.template | 4 +--- .../mobile/app/view/add/AddOther.js | 6 ++++-- apps/presentationeditor/mobile/locale/en.json | 1 + .../mobile/resources/css/app-ios.css | 20 ++++++++++++++----- .../mobile/resources/css/app-material.css | 11 ++++++++-- .../mobile/app/controller/add/AddContainer.js | 6 +----- .../mobile/app/controller/add/AddOther.js | 6 ++++-- .../app/controller/edit/EditContainer.js | 5 +---- .../mobile/app/template/EditChart.template | 6 ++---- .../mobile/app/template/EditShape.template | 4 +--- .../mobile/app/view/add/AddOther.js | 6 ++++-- apps/spreadsheeteditor/mobile/locale/en.json | 1 + .../mobile/resources/css/app-ios.css | 20 ++++++++++++++----- .../mobile/resources/css/app-material.css | 11 ++++++++-- 32 files changed, 143 insertions(+), 95 deletions(-) diff --git a/apps/common/mobile/lib/view/Collaboration.js b/apps/common/mobile/lib/view/Collaboration.js index 66b26c2d9..1b228d5d9 100644 --- a/apps/common/mobile/lib/view/Collaboration.js +++ b/apps/common/mobile/lib/view/Collaboration.js @@ -355,7 +355,7 @@ define([ '
    ' + name + '
    ' + '
    ' + date + '
    ' + (isAndroid ? '
    ' : '') + - '
    ' + + '
    ' + '' + '' + '' + diff --git a/apps/common/mobile/resources/less/ios/_collaboration.less b/apps/common/mobile/resources/less/ios/_collaboration.less index 698a6d96a..7a6cf1ebc 100644 --- a/apps/common/mobile/resources/less/ios/_collaboration.less +++ b/apps/common/mobile/resources/less/ios/_collaboration.less @@ -126,7 +126,7 @@ font-weight: bold; } .comment-date, .reply-date { - font-size: 12px; + font-size: 13px; line-height: 18px; color: #6d6d72; margin: 0; @@ -184,8 +184,8 @@ background:transparent; outline:none; width: 100%; - font-size: 15px; - border: 1px solid #c4c4c4; + font-size: 17px; + border: none; border-radius: 3px; min-height: 100px; } @@ -354,20 +354,29 @@ } .user-name { font-weight: bold; + font-size: 17px; + padding-left: 5px; } .comment-date { - font-size: 12px; + font-size: 13px; color: #6d6d72; + padding-left: 5px; } .wrap-textarea { margin-top: 16px; padding-right: 6px; .comment-textarea { - border: 1px solid #c4c4c4; + font-size: 17px; + border: none; margin-top: 0; min-height: 100px; border-radius: 4px; width: 100%; + padding-left: 5px; + &::placeholder { + color: @gray; + font-size: 17px; + } } } } diff --git a/apps/common/mobile/resources/less/material/_collaboration.less b/apps/common/mobile/resources/less/material/_collaboration.less index 0f0e93925..38a9ef3b9 100644 --- a/apps/common/mobile/resources/less/material/_collaboration.less +++ b/apps/common/mobile/resources/less/material/_collaboration.less @@ -378,20 +378,26 @@ justify-content: flex-start; } .user-name { + font-size: 17px; font-weight: bold; } .comment-date { - font-size: 12px; + font-size: 13px; color: #6d6d72; } .wrap-textarea { margin-top: 16px; padding-right: 6px; .comment-textarea { - border: 1px solid #c4c4c4; + font-size: 17px; + border: none; margin-top: 0; min-height: 100px; border-radius: 4px; + &::placeholder { + color: @gray; + font-size: 17px; + } } } } diff --git a/apps/documenteditor/mobile/app/controller/add/AddContainer.js b/apps/documenteditor/mobile/app/controller/add/AddContainer.js index 265a0412b..c1d6bc969 100644 --- a/apps/documenteditor/mobile/app/controller/add/AddContainer.js +++ b/apps/documenteditor/mobile/app/controller/add/AddContainer.js @@ -75,7 +75,7 @@ define([ uiApp.closeModal(); me._showByStack(Common.SharedSettings.get('phone')); - //uiApp.showTab('#add-other'); + uiApp.showTab('#add-other'); DE.getController('Toolbar').getView('Toolbar').hideSearch(); }, @@ -184,10 +184,7 @@ define([ var $layoutPages = $( '
    ' + '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + + '
    ' + '
    ' + '
    ' + '
    ' diff --git a/apps/documenteditor/mobile/app/controller/add/AddOther.js b/apps/documenteditor/mobile/app/controller/add/AddOther.js index 7ab12a1e3..24f9b2553 100644 --- a/apps/documenteditor/mobile/app/controller/add/AddOther.js +++ b/apps/documenteditor/mobile/app/controller/add/AddOther.js @@ -179,7 +179,8 @@ define([ text: this.textCancel }, { - text: this.textContinue, + text: this.textDelete, + bold: true, onClick: function () { DE.getController('AddContainer').rootView.router.back(); } @@ -188,7 +189,7 @@ define([ } else { DE.getController('AddContainer').rootView.router.back(); } - }, this)) + }, this)); } }, @@ -457,7 +458,8 @@ define([ textBelowText: 'Below Text', textDeleteDraft: 'Do you really want to delete draft?', textCancel: 'Cancel', - textContinue: 'Continue' + //textContinue: 'Continue', + textDelete: 'Delete' } })(), DE.Controllers.AddOther || {})) diff --git a/apps/documenteditor/mobile/app/controller/edit/EditContainer.js b/apps/documenteditor/mobile/app/controller/edit/EditContainer.js index e9196532d..699bc2bc0 100644 --- a/apps/documenteditor/mobile/app/controller/edit/EditContainer.js +++ b/apps/documenteditor/mobile/app/controller/edit/EditContainer.js @@ -238,10 +238,7 @@ define([ var $layoutPages = $( '
    ' + '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + + '
    ' + '
    ' + '
    ' + '
    ' diff --git a/apps/documenteditor/mobile/app/template/EditChart.template b/apps/documenteditor/mobile/app/template/EditChart.template index c420cb543..9041d6a12 100644 --- a/apps/documenteditor/mobile/app/template/EditChart.template +++ b/apps/documenteditor/mobile/app/template/EditChart.template @@ -303,9 +303,9 @@
    <% if (phone) { %><% } %>
    +
    -
    -
    +
    <% _.each(types, function(row) { %>
      @@ -317,7 +317,7 @@
    <% }); %>
    -
    +
    @@ -353,7 +353,7 @@
    -
    +
    diff --git a/apps/documenteditor/mobile/app/template/EditShape.template b/apps/documenteditor/mobile/app/template/EditShape.template index 06c6c5dee..9817a01c9 100644 --- a/apps/documenteditor/mobile/app/template/EditShape.template +++ b/apps/documenteditor/mobile/app/template/EditShape.template @@ -335,8 +335,7 @@
    -
    -
    +
    @@ -389,7 +388,6 @@
    -
    diff --git a/apps/documenteditor/mobile/app/template/EditTable.template b/apps/documenteditor/mobile/app/template/EditTable.template index 825b2fdff..45d5b1fe0 100644 --- a/apps/documenteditor/mobile/app/template/EditTable.template +++ b/apps/documenteditor/mobile/app/template/EditTable.template @@ -250,8 +250,7 @@
    -
    -
    +
      @@ -331,7 +330,6 @@
    -
    diff --git a/apps/documenteditor/mobile/app/view/add/AddOther.js b/apps/documenteditor/mobile/app/view/add/AddOther.js index ce0261455..61947bff8 100644 --- a/apps/documenteditor/mobile/app/view/add/AddOther.js +++ b/apps/documenteditor/mobile/app/view/add/AddOther.js @@ -162,6 +162,7 @@ define([ }, renderComment: function(comment) { + var me = this; _.delay(function () { var $commentInfo = $('#comment-info'); var template = [ @@ -169,11 +170,12 @@ define([ '
    <%= comment.username %>
    ', '
    <%= comment.date %>
    ', '<% if (android) { %><% } %>', - '
    ' + '
    ' ].join(''); var insert = _.template(template)({ android: Framework7.prototype.device.android, - comment: comment + comment: comment, + textAddComment: me.textAddComment }); $commentInfo.html(insert); _.defer(function () { diff --git a/apps/documenteditor/mobile/locale/en.json b/apps/documenteditor/mobile/locale/en.json index f80c28ea9..7b392a88d 100644 --- a/apps/documenteditor/mobile/locale/en.json +++ b/apps/documenteditor/mobile/locale/en.json @@ -105,6 +105,7 @@ "DE.Controllers.AddOther.textDeleteDraft": "Do you really want to delete draft?", "DE.Controllers.AddOther.textCancel": "Cancel", "DE.Controllers.AddOther.textContinue": "Continue", + "DE.Controllers.AddOther.textDelete": "Delete", "DE.Controllers.AddTable.textCancel": "Cancel", "DE.Controllers.AddTable.textColumns": "Columns", "DE.Controllers.AddTable.textRows": "Rows", diff --git a/apps/documenteditor/mobile/resources/css/app-ios.css b/apps/documenteditor/mobile/resources/css/app-ios.css index 9d6be9bf5..b63c03cf7 100644 --- a/apps/documenteditor/mobile/resources/css/app-ios.css +++ b/apps/documenteditor/mobile/resources/css/app-ios.css @@ -6603,7 +6603,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-edit-comment .reply-date, .page-add-reply .reply-date, .page-edit-reply .reply-date { - font-size: 12px; + font-size: 13px; line-height: 18px; color: #6d6d72; margin: 0; @@ -6748,8 +6748,8 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after background: transparent; outline: none; width: 100%; - font-size: 15px; - border: 1px solid #c4c4c4; + font-size: 17px; + border: none; border-radius: 3px; min-height: 100px; } @@ -6905,11 +6905,14 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-add-comment .wrap-comment .user-name, .page-add-comment .wrap-reply .user-name { font-weight: bold; + font-size: 17px; + padding-left: 5px; } .page-add-comment .wrap-comment .comment-date, .page-add-comment .wrap-reply .comment-date { - font-size: 12px; + font-size: 13px; color: #6d6d72; + padding-left: 5px; } .page-add-comment .wrap-comment .wrap-textarea, .page-add-comment .wrap-reply .wrap-textarea { @@ -6918,11 +6921,18 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after } .page-add-comment .wrap-comment .wrap-textarea .comment-textarea, .page-add-comment .wrap-reply .wrap-textarea .comment-textarea { - border: 1px solid #c4c4c4; + font-size: 17px; + border: none; margin-top: 0; min-height: 100px; border-radius: 4px; width: 100%; + padding-left: 5px; +} +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea::placeholder, +.page-add-comment .wrap-reply .wrap-textarea .comment-textarea::placeholder { + color: #8e8e93; + font-size: 17px; } .container-add-reply { height: 100%; diff --git a/apps/documenteditor/mobile/resources/css/app-material.css b/apps/documenteditor/mobile/resources/css/app-material.css index 0beb5df9f..7d6f7b7b2 100644 --- a/apps/documenteditor/mobile/resources/css/app-material.css +++ b/apps/documenteditor/mobile/resources/css/app-material.css @@ -6532,11 +6532,12 @@ html.phone .document-menu .list-block .item-link { } .page-add-comment .wrap-comment .user-name, .page-add-comment .wrap-reply .user-name { + font-size: 17px; font-weight: bold; } .page-add-comment .wrap-comment .comment-date, .page-add-comment .wrap-reply .comment-date { - font-size: 12px; + font-size: 13px; color: #6d6d72; } .page-add-comment .wrap-comment .wrap-textarea, @@ -6546,11 +6547,17 @@ html.phone .document-menu .list-block .item-link { } .page-add-comment .wrap-comment .wrap-textarea .comment-textarea, .page-add-comment .wrap-reply .wrap-textarea .comment-textarea { - border: 1px solid #c4c4c4; + font-size: 17px; + border: none; margin-top: 0; min-height: 100px; border-radius: 4px; } +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea::placeholder, +.page-add-comment .wrap-reply .wrap-textarea .comment-textarea::placeholder { + color: #9e9e9e; + font-size: 17px; +} .container-edit-comment, .container-add-reply { height: 100%; diff --git a/apps/presentationeditor/mobile/app/controller/add/AddContainer.js b/apps/presentationeditor/mobile/app/controller/add/AddContainer.js index c7ca039ae..f0d1c59d4 100644 --- a/apps/presentationeditor/mobile/app/controller/add/AddContainer.js +++ b/apps/presentationeditor/mobile/app/controller/add/AddContainer.js @@ -183,10 +183,7 @@ define([ var $layoutPages = $( '
    ' + '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + + '
    ' + '
    ' + '
    ' + '
    ' diff --git a/apps/presentationeditor/mobile/app/controller/add/AddOther.js b/apps/presentationeditor/mobile/app/controller/add/AddOther.js index 1699b6d60..77308a714 100644 --- a/apps/presentationeditor/mobile/app/controller/add/AddOther.js +++ b/apps/presentationeditor/mobile/app/controller/add/AddOther.js @@ -153,7 +153,8 @@ define([ text: this.textCancel }, { - text: this.textContinue, + text: this.textDelete, + bold: true, onClick: function () { PE.getController('AddContainer').rootView.router.back(); } @@ -176,7 +177,8 @@ define([ textDeleteDraft: 'Do you really want to delete draft?', textCancel: 'Cancel', - textContinue: 'Continue' + //textContinue: 'Continue', + textDelete: 'Delete' } })(), PE.Controllers.AddOther || {})) diff --git a/apps/presentationeditor/mobile/app/controller/edit/EditContainer.js b/apps/presentationeditor/mobile/app/controller/edit/EditContainer.js index 5281fd7df..722f33e5d 100644 --- a/apps/presentationeditor/mobile/app/controller/edit/EditContainer.js +++ b/apps/presentationeditor/mobile/app/controller/edit/EditContainer.js @@ -230,10 +230,7 @@ define([ var $layoutPages = $( '
    ' + '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + + '
    ' + '
    ' + '
    ' + '
    ' diff --git a/apps/presentationeditor/mobile/app/template/EditChart.template b/apps/presentationeditor/mobile/app/template/EditChart.template index 6c9ec42f5..64e193d10 100644 --- a/apps/presentationeditor/mobile/app/template/EditChart.template +++ b/apps/presentationeditor/mobile/app/template/EditChart.template @@ -131,8 +131,7 @@
    -
    -
    +
    <% _.each(types, function(row) { %>
      @@ -144,7 +143,7 @@
    <% }); %>
    -
    +
    @@ -180,7 +179,6 @@
    -
    diff --git a/apps/presentationeditor/mobile/app/template/EditShape.template b/apps/presentationeditor/mobile/app/template/EditShape.template index e8a7579af..1c330e770 100644 --- a/apps/presentationeditor/mobile/app/template/EditShape.template +++ b/apps/presentationeditor/mobile/app/template/EditShape.template @@ -162,8 +162,7 @@
    -
    -
    +
    @@ -216,7 +215,6 @@
    -
    diff --git a/apps/presentationeditor/mobile/app/template/EditTable.template b/apps/presentationeditor/mobile/app/template/EditTable.template index 8b6d3b379..2846e673f 100644 --- a/apps/presentationeditor/mobile/app/template/EditTable.template +++ b/apps/presentationeditor/mobile/app/template/EditTable.template @@ -110,8 +110,7 @@
    -
    -
    +
      @@ -191,7 +190,6 @@
    -
    diff --git a/apps/presentationeditor/mobile/app/view/add/AddOther.js b/apps/presentationeditor/mobile/app/view/add/AddOther.js index 6aafebc96..5748aeb36 100644 --- a/apps/presentationeditor/mobile/app/view/add/AddOther.js +++ b/apps/presentationeditor/mobile/app/view/add/AddOther.js @@ -138,6 +138,7 @@ define([ }, renderComment: function(comment) { + var me = this; _.delay(function () { var $commentInfo = $('#comment-info'); var template = [ @@ -145,11 +146,12 @@ define([ '
    <%= comment.username %>
    ', '
    <%= comment.date %>
    ', '<% if (android) { %><% } %>', - '
    ' + '
    ' ].join(''); var insert = _.template(template)({ android: Framework7.prototype.device.android, - comment: comment + comment: comment, + textAddComment: me.textAddComment }); $commentInfo.html(insert); _.defer(function () { diff --git a/apps/presentationeditor/mobile/locale/en.json b/apps/presentationeditor/mobile/locale/en.json index 310b6d726..cc3f490f2 100644 --- a/apps/presentationeditor/mobile/locale/en.json +++ b/apps/presentationeditor/mobile/locale/en.json @@ -50,6 +50,7 @@ "PE.Controllers.AddOther.textDeleteDraft": "Do you really want to delete draft?", "PE.Controllers.AddOther.textCancel": "Cancel", "PE.Controllers.AddOther.textContinue": "Continue", + "PE.Controllers.AddOther.textDelete": "Delete", "PE.Controllers.DocumentHolder.menuAddLink": "Add Link", "PE.Controllers.DocumentHolder.menuCopy": "Copy", "PE.Controllers.DocumentHolder.menuCut": "Cut", diff --git a/apps/presentationeditor/mobile/resources/css/app-ios.css b/apps/presentationeditor/mobile/resources/css/app-ios.css index 4c53197da..c7c2a84e9 100644 --- a/apps/presentationeditor/mobile/resources/css/app-ios.css +++ b/apps/presentationeditor/mobile/resources/css/app-ios.css @@ -6603,7 +6603,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-edit-comment .reply-date, .page-add-reply .reply-date, .page-edit-reply .reply-date { - font-size: 12px; + font-size: 13px; line-height: 18px; color: #6d6d72; margin: 0; @@ -6748,8 +6748,8 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after background: transparent; outline: none; width: 100%; - font-size: 15px; - border: 1px solid #c4c4c4; + font-size: 17px; + border: none; border-radius: 3px; min-height: 100px; } @@ -6905,11 +6905,14 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-add-comment .wrap-comment .user-name, .page-add-comment .wrap-reply .user-name { font-weight: bold; + font-size: 17px; + padding-left: 5px; } .page-add-comment .wrap-comment .comment-date, .page-add-comment .wrap-reply .comment-date { - font-size: 12px; + font-size: 13px; color: #6d6d72; + padding-left: 5px; } .page-add-comment .wrap-comment .wrap-textarea, .page-add-comment .wrap-reply .wrap-textarea { @@ -6918,11 +6921,18 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after } .page-add-comment .wrap-comment .wrap-textarea .comment-textarea, .page-add-comment .wrap-reply .wrap-textarea .comment-textarea { - border: 1px solid #c4c4c4; + font-size: 17px; + border: none; margin-top: 0; min-height: 100px; border-radius: 4px; width: 100%; + padding-left: 5px; +} +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea::placeholder, +.page-add-comment .wrap-reply .wrap-textarea .comment-textarea::placeholder { + color: #8e8e93; + font-size: 17px; } .container-add-reply { height: 100%; diff --git a/apps/presentationeditor/mobile/resources/css/app-material.css b/apps/presentationeditor/mobile/resources/css/app-material.css index db85e3b04..351416bdf 100644 --- a/apps/presentationeditor/mobile/resources/css/app-material.css +++ b/apps/presentationeditor/mobile/resources/css/app-material.css @@ -6532,11 +6532,12 @@ html.phone .document-menu .list-block .item-link { } .page-add-comment .wrap-comment .user-name, .page-add-comment .wrap-reply .user-name { + font-size: 17px; font-weight: bold; } .page-add-comment .wrap-comment .comment-date, .page-add-comment .wrap-reply .comment-date { - font-size: 12px; + font-size: 13px; color: #6d6d72; } .page-add-comment .wrap-comment .wrap-textarea, @@ -6546,11 +6547,17 @@ html.phone .document-menu .list-block .item-link { } .page-add-comment .wrap-comment .wrap-textarea .comment-textarea, .page-add-comment .wrap-reply .wrap-textarea .comment-textarea { - border: 1px solid #c4c4c4; + font-size: 17px; + border: none; margin-top: 0; min-height: 100px; border-radius: 4px; } +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea::placeholder, +.page-add-comment .wrap-reply .wrap-textarea .comment-textarea::placeholder { + color: #9e9e9e; + font-size: 17px; +} .container-edit-comment, .container-add-reply { height: 100%; diff --git a/apps/spreadsheeteditor/mobile/app/controller/add/AddContainer.js b/apps/spreadsheeteditor/mobile/app/controller/add/AddContainer.js index 70c6a8adf..9581680ad 100644 --- a/apps/spreadsheeteditor/mobile/app/controller/add/AddContainer.js +++ b/apps/spreadsheeteditor/mobile/app/controller/add/AddContainer.js @@ -256,12 +256,8 @@ define([ var $layoutPages = $('
    ' + '
    ' + - '
    ' + - '
    ' + - '
    ' + + '
    ' + _arrangePages({pages: layoutAdds}) + - '
    ' + - '
    ' + '
    ' + '
    ' + '
    '); diff --git a/apps/spreadsheeteditor/mobile/app/controller/add/AddOther.js b/apps/spreadsheeteditor/mobile/app/controller/add/AddOther.js index e62a322e1..70605b823 100644 --- a/apps/spreadsheeteditor/mobile/app/controller/add/AddOther.js +++ b/apps/spreadsheeteditor/mobile/app/controller/add/AddOther.js @@ -142,7 +142,8 @@ define([ text: this.textCancel }, { - text: this.textContinue, + text: this.textDelete, + bold: true, onClick: function () { SSE.getController('AddContainer').rootView.router.back(); } @@ -200,7 +201,8 @@ define([ txtNotUrl: 'This field should be a URL in the format \"http://www.example.com\"', textDeleteDraft: 'Do you really want to delete draft?', textCancel: 'Cancel', - textContinue: 'Continue' + //textContinue: 'Continue', + textDelete: 'Delete' } })(), SSE.Controllers.AddOther || {})) }); \ No newline at end of file diff --git a/apps/spreadsheeteditor/mobile/app/controller/edit/EditContainer.js b/apps/spreadsheeteditor/mobile/app/controller/edit/EditContainer.js index f60bfcead..24b694b84 100644 --- a/apps/spreadsheeteditor/mobile/app/controller/edit/EditContainer.js +++ b/apps/spreadsheeteditor/mobile/app/controller/edit/EditContainer.js @@ -231,10 +231,7 @@ define([ var $layoutPages = $( '
    ' + '
    ' + - '
    ' + - '
    ' + - '
    ' + - '
    ' + + '
    ' + '
    ' + '
    ' + '
    ' diff --git a/apps/spreadsheeteditor/mobile/app/template/EditChart.template b/apps/spreadsheeteditor/mobile/app/template/EditChart.template index 54c2da199..8cee747c5 100644 --- a/apps/spreadsheeteditor/mobile/app/template/EditChart.template +++ b/apps/spreadsheeteditor/mobile/app/template/EditChart.template @@ -153,8 +153,7 @@ <% } %>
    -
    -
    +
    <% _.each(types, function(row) { %>
      @@ -166,7 +165,7 @@
    <% }); %>
    -
    +
    @@ -202,7 +201,6 @@
    -
    diff --git a/apps/spreadsheeteditor/mobile/app/template/EditShape.template b/apps/spreadsheeteditor/mobile/app/template/EditShape.template index 30844ae54..cb5026491 100644 --- a/apps/spreadsheeteditor/mobile/app/template/EditShape.template +++ b/apps/spreadsheeteditor/mobile/app/template/EditShape.template @@ -153,8 +153,7 @@
    -
    -
    +
    @@ -207,7 +206,6 @@
    -
    diff --git a/apps/spreadsheeteditor/mobile/app/view/add/AddOther.js b/apps/spreadsheeteditor/mobile/app/view/add/AddOther.js index fbc7d6967..96d7d37bc 100644 --- a/apps/spreadsheeteditor/mobile/app/view/add/AddOther.js +++ b/apps/spreadsheeteditor/mobile/app/view/add/AddOther.js @@ -212,6 +212,7 @@ define([ }, renderComment: function(comment) { + var me = this; _.delay(function () { var $commentInfo = $('#comment-info'); var template = [ @@ -219,11 +220,12 @@ define([ '
    <%= comment.username %>
    ', '
    <%= comment.date %>
    ', '<% if (android) { %><% } %>', - '
    ' + '
    ' ].join(''); var insert = _.template(template)({ android: Framework7.prototype.device.android, - comment: comment + comment: comment, + textAddComment: me.textAddComment }); $commentInfo.html(insert); _.defer(function () { diff --git a/apps/spreadsheeteditor/mobile/locale/en.json b/apps/spreadsheeteditor/mobile/locale/en.json index 65cf7a6b6..dd1ba534c 100644 --- a/apps/spreadsheeteditor/mobile/locale/en.json +++ b/apps/spreadsheeteditor/mobile/locale/en.json @@ -42,6 +42,7 @@ "SSE.Controllers.AddOther.textDeleteDraft": "Do you really want to delete draft?", "SSE.Controllers.AddOther.textCancel": "Cancel", "SSE.Controllers.AddOther.textContinue": "Continue", + "SSE.Controllers.AddOther.textDelete": "Delete", "SSE.Controllers.DocumentHolder.menuAddLink": "Add Link", "SSE.Controllers.DocumentHolder.menuCell": "Cell", "SSE.Controllers.DocumentHolder.menuCopy": "Copy", diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css index b18dcba25..d27b028a1 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css @@ -6596,7 +6596,7 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-edit-comment .reply-date, .page-add-reply .reply-date, .page-edit-reply .reply-date { - font-size: 12px; + font-size: 13px; line-height: 18px; color: #6d6d72; margin: 0; @@ -6741,8 +6741,8 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after background: transparent; outline: none; width: 100%; - font-size: 15px; - border: 1px solid #c4c4c4; + font-size: 17px; + border: none; border-radius: 3px; min-height: 100px; } @@ -6898,11 +6898,14 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after .page-add-comment .wrap-comment .user-name, .page-add-comment .wrap-reply .user-name { font-weight: bold; + font-size: 17px; + padding-left: 5px; } .page-add-comment .wrap-comment .comment-date, .page-add-comment .wrap-reply .comment-date { - font-size: 12px; + font-size: 13px; color: #6d6d72; + padding-left: 5px; } .page-add-comment .wrap-comment .wrap-textarea, .page-add-comment .wrap-reply .wrap-textarea { @@ -6911,11 +6914,18 @@ html.pixel-ratio-3 .document-menu .list-block li:last-child li .item-inner:after } .page-add-comment .wrap-comment .wrap-textarea .comment-textarea, .page-add-comment .wrap-reply .wrap-textarea .comment-textarea { - border: 1px solid #c4c4c4; + font-size: 17px; + border: none; margin-top: 0; min-height: 100px; border-radius: 4px; width: 100%; + padding-left: 5px; +} +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea::placeholder, +.page-add-comment .wrap-reply .wrap-textarea .comment-textarea::placeholder { + color: #8e8e93; + font-size: 17px; } .container-add-reply { height: 100%; diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-material.css b/apps/spreadsheeteditor/mobile/resources/css/app-material.css index 8d86bf5ee..441eb853b 100644 --- a/apps/spreadsheeteditor/mobile/resources/css/app-material.css +++ b/apps/spreadsheeteditor/mobile/resources/css/app-material.css @@ -6542,11 +6542,12 @@ html.phone .document-menu .list-block .item-link { } .page-add-comment .wrap-comment .user-name, .page-add-comment .wrap-reply .user-name { + font-size: 17px; font-weight: bold; } .page-add-comment .wrap-comment .comment-date, .page-add-comment .wrap-reply .comment-date { - font-size: 12px; + font-size: 13px; color: #6d6d72; } .page-add-comment .wrap-comment .wrap-textarea, @@ -6556,11 +6557,17 @@ html.phone .document-menu .list-block .item-link { } .page-add-comment .wrap-comment .wrap-textarea .comment-textarea, .page-add-comment .wrap-reply .wrap-textarea .comment-textarea { - border: 1px solid #c4c4c4; + font-size: 17px; + border: none; margin-top: 0; min-height: 100px; border-radius: 4px; } +.page-add-comment .wrap-comment .wrap-textarea .comment-textarea::placeholder, +.page-add-comment .wrap-reply .wrap-textarea .comment-textarea::placeholder { + color: #9e9e9e; + font-size: 17px; +} .container-edit-comment, .container-add-reply { height: 100%;