diff --git a/client/components/boards/boardBody.css b/client/components/boards/boardBody.css index cb091b57d..f928e721d 100644 --- a/client/components/boards/boardBody.css +++ b/client/components/boards/boardBody.css @@ -19,6 +19,7 @@ .board-wrapper .board-canvas.is-sibling-sidebar-open { margin-right: 248px; } +.board-wrapper .board-canvas.overlayed {overflow:hidden} .board-wrapper .board-canvas .board-overlay { position: fixed; left: 0; diff --git a/client/components/boards/boardBody.jade b/client/components/boards/boardBody.jade index edeb25464..aab03d40a 100644 --- a/client/components/boards/boardBody.jade +++ b/client/components/boards/boardBody.jade @@ -21,7 +21,8 @@ template(name="boardBody") .board-canvas.js-swimlanes( class="{{#if Sidebar.isOpen}}is-sibling-sidebar-open{{/if}}" class="{{#if MultiSelection.isActive}}is-multiselection-active{{/if}}" - class="{{#if draggingActive.get}}is-dragging-active{{/if}}") + class="{{#if draggingActive.get}}is-dragging-active{{/if}}" + class="{{#if showOverlay.get}}overlayed{{/if}}") if showOverlay.get .board-overlay if currentBoard.isTemplatesBoard diff --git a/client/components/cards/cardDetails.css b/client/components/cards/cardDetails.css index 402568a14..52f109882 100644 --- a/client/components/cards/cardDetails.css +++ b/client/components/cards/cardDetails.css @@ -245,10 +245,10 @@ padding-top: 10px; } @media screen and (min-width: 801px) { - .card-details { + .card-details-maximized { top: 97px; left: 0; - width: 600px; + right:0; bottom: 0; position: fixed; resize: both; @@ -267,11 +267,6 @@ box-shadow: 0 0 7px 0 #b3b3b3; transition: flex-basis 0.1s; box-sizing: border-box; - position: absolute; - top: 0; - left: 0; - height: calc(100% - 20px); - width: calc(100% - 20px); float: left; } .card-details-maximized .card-details-left { diff --git a/client/components/cards/cardDetails.js b/client/components/cards/cardDetails.js index e88bcdbbf..928ae180a 100644 --- a/client/components/cards/cardDetails.js +++ b/client/components/cards/cardDetails.js @@ -79,15 +79,19 @@ BlazeComponent.extendComponent({ scrollParentContainer() { const cardPanelWidth = 600; const parentComponent = this.parentComponent(); - /* // Incomplete fix about bug where opening card scrolls to wrong place // https://github.com/wekan/wekan/issues/4572#issuecomment-1184149395 // TODO sometimes parentComponent is not available, maybe because it's not // yet created?! - if (!parentComponent) return; - const bodyBoardComponent = parentComponent.parentComponent(); + // + // uncommented again by chrisi51 + // only with that, the autoscroll feature is working properly + // after my fixes, all scrollings where correct */ + if (!parentComponent) return; + const bodyBoardComponent = parentComponent.parentComponent(); + //On Mobile View Parent is Board, Not Board Body. I cant see how this funciton should work then. if (bodyBoardComponent === null) return; @@ -217,6 +221,12 @@ BlazeComponent.extendComponent({ //------------- } + if (!Utils.isMiniScreen()) { + Meteor.setTimeout(() => { + this.scrollParentContainer(); + }, 500); + } + const $checklistsDom = this.$('.card-checklist-items'); $checklistsDom.sortable({ @@ -442,11 +452,11 @@ BlazeComponent.extendComponent({ 'click .js-maximize-card-details'() { Meteor.call('toggleCardMaximized'); autosize($('.card-details')); - if (!Utils.isMiniScreen()) { - Meteor.setTimeout(() => { - this.scrollParentContainer(); - }, 500); - } +// if (!Utils.isMiniScreen()) { +// Meteor.setTimeout(() => { +// this.scrollParentContainer(); +// }, 500); +// } }, 'click .js-minimize-card-details'() { Meteor.call('toggleCardMaximized'); diff --git a/client/components/main/popup.css b/client/components/main/popup.css index 41c178904..8d5f6d615 100644 --- a/client/components/main/popup.css +++ b/client/components/main/popup.css @@ -88,7 +88,7 @@ height: 20px; } .pop-over .quiet { - padding: 6px 6px 4px; +/* padding: 6px 6px 4px;*/ } .pop-over.search-over { background: #f0f0f0; @@ -152,6 +152,14 @@ text-decoration: none; overflow: hidden; line-height: 33px; + display:flex; +/* flex-wrap:wrap;*/ + gap:5px; + align-items: center; +} +.pop-over-list li > a > .member{ + align-self: flex-start; + flex:0 0 auto; } .pop-over-list li > a .item-name { display: block;