From 93a24aaef86949fc6454f837c8ad8ebcfd30f285 Mon Sep 17 00:00:00 2001 From: Martin Filser Date: Tue, 29 Dec 2020 13:34:27 +0100 Subject: [PATCH] Checklist-Items, Drag-Drop Handle now at the left side - Drag handle is not visible at long checklists, even with: padding-right: 20px Depending of all the screen sizes out there this is the most secure way to get around this and the drag handle is always visible - first fix was at this commit: a8453657c95a4bde2ae86b4c77e55bb2174adf26 --- client/components/cards/checklists.jade | 4 ++-- client/components/cards/checklists.styl | 8 +++----- 2 files changed, 5 insertions(+), 7 deletions(-) diff --git a/client/components/cards/checklists.jade b/client/components/cards/checklists.jade index a3695a5ea..75cb716fa 100644 --- a/client/components/cards/checklists.jade +++ b/client/components/cards/checklists.jade @@ -102,9 +102,9 @@ template(name='checklistItemDetail') if canModifyCard .check-box-container .check-box.materialCheckBox(class="{{#if item.isFinished }}is-checked{{/if}}") + if isMiniScreenOrShowDesktopDragHandles + span.fa.checklistitem-handle(class="fa-arrows" title="{{_ 'dragChecklistItem'}}") .item-title.js-open-inlined-form.is-editable(class="{{#if item.isFinished }}is-checked{{/if}}") - if isMiniScreenOrShowDesktopDragHandles - span.fa.checklistitem-handle(class="fa-arrows" title="{{_ 'dragChecklistItem'}}") +viewer = item.title else diff --git a/client/components/cards/checklists.styl b/client/components/cards/checklists.styl index f6e4f5fd5..8d6afaffb 100644 --- a/client/components/cards/checklists.styl +++ b/client/components/cards/checklists.styl @@ -134,7 +134,7 @@ textarea.js-add-checklist-item, textarea.js-edit-checklist-item background-color: darken(white, 8%) .check-box-container - padding-right: 1px; + padding-right: 10px; .check-box margin: 0.1em 0 0 0; @@ -144,7 +144,6 @@ textarea.js-add-checklist-item, textarea.js-edit-checklist-item .item-title flex: 1 - margin-left: 10px; &.is-checked color: #8c8c8c font-style: italic @@ -157,9 +156,8 @@ textarea.js-add-checklist-item, textarea.js-edit-checklist-item max-width: 420px span.fa.checklistitem-handle - float: right - padding-right: 20px - padding-top: 6px + padding-top: 2px + padding-right: 10px; .js-delete-checklist-item margin: 0 0 0.5em 1.33em