diff --git a/client/components/sidebar/sidebar.css b/client/components/sidebar/sidebar.css index 831719f36..7867aec6d 100644 --- a/client/components/sidebar/sidebar.css +++ b/client/components/sidebar/sidebar.css @@ -48,6 +48,59 @@ display: flex; flex-direction: column; } + +/* Use checklist-style green checkboxes for all sidebar checkboxes */ +.sidebar .materialCheckBox.is-checked, +.boardCardSettingsPopup .materialCheckBox.is-checked, +.boardSubtaskSettingsPopup .materialCheckBox.is-checked { + top: -4px !important; + left: -3px !important; + width: 7px !important; + height: 15px !important; + margin-right: 6px !important; + border-top: 2px solid transparent !important; + border-left: 2px solid transparent !important; + border-bottom: 2px solid #3cb500 !important; + border-right: 2px solid #3cb500 !important; + transform: rotate(40deg) !important; + -webkit-backface-visibility: hidden !important; + backface-visibility: hidden !important; + transform-origin: 100% 100% !important; +} + +/* Card Settings 3-column grid layout */ +.card-settings-grid { + display: grid; + grid-template-columns: 1fr 1fr 2fr; + gap: 10px; + margin-bottom: 10px; +} + +.card-settings-row { + display: grid; + grid-template-columns: 1fr 1fr 2fr; + gap: 10px; + align-items: center; + padding: 5px 0; + border-bottom: 1px solid #eee; +} + +.card-settings-column { + display: flex; + align-items: center; + justify-content: center; +} + +.card-settings-column:last-child { + justify-content: flex-start; +} + +.card-settings-column h4 { + margin: 0; + font-size: 12px; + font-weight: bold; + text-align: center; +} .sidebar .sidebar-content ul.sidebar-list li > a { display: flex; height: 30px; diff --git a/client/components/sidebar/sidebar.jade b/client/components/sidebar/sidebar.jade index 023b01b9e..fdc4e6b07 100644 --- a/client/components/sidebar/sidebar.jade +++ b/client/components/sidebar/sidebar.jade @@ -34,32 +34,26 @@ template(name='homeSidebar') hr ul#cards.label-text-hidden a.flex.js-toggle-minicard-label-text(title="{{_ 'hide-minicard-label-text'}}") + span {{#if hiddenMinicardLabelText}}✅{{else}}⬜{{/if}} span {{_ 'hide-minicard-label-text'}} - b   - .materialCheckBox(class="{{#if hiddenMinicardLabelText}}is-checked{{/if}}") if currentUser ul#cards.vertical-scrollbars-toggle a.flex.js-vertical-scrollbars-toggle(title="{{_ 'enable-vertical-scrollbars'}}") + span {{#if isVerticalScrollbars}}✅{{else}}⬜{{/if}} span {{_ 'enable-vertical-scrollbars'}} - b   - .materialCheckBox(class="{{#if isVerticalScrollbars}}is-checked{{/if}}") ul#cards.show-week-of-year-toggle a.flex.js-show-week-of-year-toggle(title="{{_ 'show-week-of-year'}}") + span {{#if isShowWeekOfYear}}✅{{else}}⬜{{/if}} span {{_ 'show-week-of-year'}} - b   - .materialCheckBox(class="{{#if isShowWeekOfYear}}is-checked{{/if}}") hr unless currentUser.isNoComments h3.activity-title | 💬 | {{_ 'activities'}} - .material-toggle-switch(title="{{_ 'show-activities'}}") - if showActivities - input.toggle-switch(type="checkbox" id="toggleShowActivitiesBoard" checked="checked") - else - input.toggle-switch(type="checkbox" id="toggleShowActivitiesBoard") - label.toggle-label(for="toggleShowActivitiesBoard") + a.flex.js-toggle-show-activities(title="{{_ 'show-activities'}}") + span {{#if showActivities}}✅{{else}}⬜{{/if}} + span {{_ 'show-activities'}} +activities(mode="board") template(name="membersWidget") @@ -185,165 +179,282 @@ template(name="boardInfoOnMyBoardsPopup") unless currentSetting.hideCardCounterList div.check-div a.flex.js-field-has-cardcounterlist(class="{{#if allowsCardCounterList}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsCardCounterList}}is-checked{{/if}}") + span {{#if allowsCardCounterList}}✅{{else}}⬜{{/if}} span | 🚪 | {{_ 'show-card-counter-per-list'}} unless currentSetting.hideBoardMemberList div.check-div a.flex.js-field-has-boardmemberlist(class="{{#if allowsBoardMemberList}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsBoardMemberList}}is-checked{{/if}}") + span {{#if allowsBoardMemberList}}✅{{else}}⬜{{/if}} span | ⏳ | {{_ 'show-board_members-avatar'}} template(name="boardCardSettingsPopup") form.board-card-settings - h3 {{_ 'show-on-card'}}, {{_ 'show-on-minicard'}} - div.check-div - a.flex.js-field-has-receiveddate(class="{{#if allowsReceivedDate}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsReceivedDate}}is-checked{{/if}}") + .card-settings-grid + .card-settings-column + h4 {{_ 'show-on-card'}} + .card-settings-column + h4 {{_ 'show-on-minicard'}} + .card-settings-column + h4 {{_ 'description'}} + .card-settings-row + .card-settings-column + a.flex.js-field-has-receiveddate(title="{{_ 'card-received'}}" class="{{#if allowsReceivedDate}}is-checked{{/if}}") + span {{#if allowsReceivedDate}}✅{{else}}⬜{{/if}} + .card-settings-column + a.flex.js-field-has-receiveddate(title="{{_ 'card-received'}}" class="{{#if allowsReceivedDate}}is-checked{{/if}}") + span {{#if allowsReceivedDate}}✅{{else}}⬜{{/if}} + .card-settings-column span | 🚪 | {{_ 'card-received'}} - div.check-div - a.flex.js-field-has-startdate(class="{{#if allowsStartDate}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsStartDate}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + a.flex.js-field-has-startdate(title="{{_ 'card-start'}}" class="{{#if allowsStartDate}}is-checked{{/if}}") + span {{#if allowsStartDate}}✅{{else}}⬜{{/if}} + .card-settings-column + a.flex.js-field-has-startdate(title="{{_ 'card-start'}}" class="{{#if allowsStartDate}}is-checked{{/if}}") + span {{#if allowsStartDate}}✅{{else}}⬜{{/if}} + .card-settings-column span | ⏳ | {{_ 'card-start'}} - div.check-div - a.flex.js-field-has-duedate(class="{{#if allowsDueDate}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsDueDate}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + a.flex.js-field-has-duedate(title="{{_ 'card-due'}}" class="{{#if allowsDueDate}}is-checked{{/if}}") + span {{#if allowsDueDate}}✅{{else}}⬜{{/if}} + .card-settings-column + a.flex.js-field-has-duedate(title="{{_ 'card-due'}}" class="{{#if allowsDueDate}}is-checked{{/if}}") + span {{#if allowsDueDate}}✅{{else}}⬜{{/if}} + .card-settings-column span | 🚪 | {{_ 'card-due'}} - div.check-div - a.flex.js-field-has-enddate(class="{{#if allowsEndDate}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsEndDate}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + a.flex.js-field-has-enddate(title="{{_ 'card-end'}}" class="{{#if allowsEndDate}}is-checked{{/if}}") + span {{#if allowsEndDate}}✅{{else}}⬜{{/if}} + .card-settings-column + a.flex.js-field-has-enddate(title="{{_ 'card-end'}}" class="{{#if allowsEndDate}}is-checked{{/if}}") + span {{#if allowsEndDate}}✅{{else}}⬜{{/if}} + .card-settings-column span | ⏰ | {{_ 'card-end'}} - div.check-div - a.flex.js-field-has-members(class="{{#if allowsMembers}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsMembers}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + a.flex.js-field-has-members(title="{{_ 'members'}}" class="{{#if allowsMembers}}is-checked{{/if}}") + span {{#if allowsMembers}}✅{{else}}⬜{{/if}} + .card-settings-column + a.flex.js-field-has-members(title="{{_ 'members'}}" class="{{#if allowsMembers}}is-checked{{/if}}") + span {{#if allowsMembers}}✅{{else}}⬜{{/if}} + .card-settings-column span | 👥 | {{_ 'members'}} - div.check-div - a.flex.js-field-has-creator(class="{{#if allowsCreator}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsCreator}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + a.flex.js-field-has-creator(title="{{_ 'creator'}}" class="{{#if allowsCreator}}is-checked{{/if}}") + span {{#if allowsCreator}}✅{{else}}⬜{{/if}} + .card-settings-column + span + .card-settings-column span | 👤 | {{_ 'creator'}} - div.check-div - a.flex.js-field-has-creator-on-minicard(class="{{#if allowsCreatorOnMinicard}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsCreatorOnMinicard}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + span + .card-settings-column + a.flex.js-field-has-creator-on-minicard(title="{{_ 'creator-on-minicard'}}" class="{{#if allowsCreatorOnMinicard}}is-checked{{/if}}") + span {{#if allowsCreatorOnMinicard}}✅{{else}}⬜{{/if}} + .card-settings-column span | 👤 | {{_ 'creator-on-minicard'}} - div.check-div - a.flex.js-field-has-assignee(class="{{#if allowsAssignee}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsAssignee}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + a.flex.js-field-has-assignee(title="{{_ 'assignee'}}" class="{{#if allowsAssignee}}is-checked{{/if}}") + span {{#if allowsAssignee}}✅{{else}}⬜{{/if}} + .card-settings-column + a.flex.js-field-has-assignee(title="{{_ 'assignee'}}" class="{{#if allowsAssignee}}is-checked{{/if}}") + span {{#if allowsAssignee}}✅{{else}}⬜{{/if}} + .card-settings-column span | 👤 | {{_ 'assignee'}} - div.check-div - a.flex.js-field-has-assigned-by(class="{{#if allowsAssignedBy}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsAssignedBy}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + a.flex.js-field-has-assigned-by(title="{{_ 'assigned-by'}}" class="{{#if allowsAssignedBy}}is-checked{{/if}}") + span {{#if allowsAssignedBy}}✅{{else}}⬜{{/if}} + .card-settings-column + a.flex.js-field-has-assigned-by(title="{{_ 'assigned-by'}}" class="{{#if allowsAssignedBy}}is-checked{{/if}}") + span {{#if allowsAssignedBy}}✅{{else}}⬜{{/if}} + .card-settings-column span | 🛒 | {{_ 'assigned-by'}} - div.check-div - a.flex.js-field-has-requested-by(class="{{#if allowsRequestedBy}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsRequestedBy}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + a.flex.js-field-has-requested-by(title="{{_ 'requested-by'}}" class="{{#if allowsRequestedBy}}is-checked{{/if}}") + span {{#if allowsRequestedBy}}✅{{else}}⬜{{/if}} + .card-settings-column + a.flex.js-field-has-requested-by(title="{{_ 'requested-by'}}" class="{{#if allowsRequestedBy}}is-checked{{/if}}") + span {{#if allowsRequestedBy}}✅{{else}}⬜{{/if}} + .card-settings-column span | 👤➕ | {{_ 'requested-by'}} - div.check-div - a.flex.js-field-has-card-sorting-by-number(class="{{#if allowsCardSortingByNumber}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsCardSortingByNumber}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + a.flex.js-field-has-card-sorting-by-number(title="{{_ 'card-sorting-by-number'}}" class="{{#if allowsCardSortingByNumber}}is-checked{{/if}}") + span {{#if allowsCardSortingByNumber}}✅{{else}}⬜{{/if}} + .card-settings-column + span + .card-settings-column span | 🔢 | {{_ 'card-sorting-by-number'}} - div.check-div - a.flex.js-field-has-card-sorting-by-number-on-minicard(class="{{#if allowsCardSortingByNumberOnMinicard}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsCardSortingByNumberOnMinicard}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + span + .card-settings-column + a.flex.js-field-has-card-sorting-by-number-on-minicard(title="{{_ 'card-sorting-by-number-on-minicard'}}" class="{{#if allowsCardSortingByNumberOnMinicard}}is-checked{{/if}}") + span {{#if allowsCardSortingByNumberOnMinicard}}✅{{else}}⬜{{/if}} + .card-settings-column span | 🔢 | {{_ 'card-sorting-by-number-on-minicard'}} - div.check-div - a.flex.js-field-has-card-show-lists(class="{{#if allowsShowLists}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsShowLists}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + a.flex.js-field-has-card-show-lists(title="{{_ 'card-show-lists'}}" class="{{#if allowsShowLists}}is-checked{{/if}}") + span {{#if allowsShowLists}}✅{{else}}⬜{{/if}} + .card-settings-column + span + .card-settings-column span | 📋 | {{_ 'card-show-lists'}} - div.check-div - a.flex.js-field-has-labels(class="{{#if allowsLabels}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsLabels}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + a.flex.js-field-has-labels(title="{{_ 'labels'}}" class="{{#if allowsLabels}}is-checked{{/if}}") + span {{#if allowsLabels}}✅{{else}}⬜{{/if}} + .card-settings-column + a.flex.js-field-has-labels(title="{{_ 'labels'}}" class="{{#if allowsLabels}}is-checked{{/if}}") + span {{#if allowsLabels}}✅{{else}}⬜{{/if}} + .card-settings-column span | 🏷️ | {{_ 'labels'}} - div.check-div - a.flex.js-field-has-card-show-lists-on-minicard(class="{{#if allowsShowListsOnMinicard}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsShowListsOnMinicard}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + span + .card-settings-column + a.flex.js-field-has-card-show-lists-on-minicard(title="{{_ 'card-show-lists-on-minicard'}}" class="{{#if allowsShowListsOnMinicard}}is-checked{{/if}}") + span {{#if allowsShowListsOnMinicard}}✅{{else}}⬜{{/if}} + .card-settings-column span | 📋 | {{_ 'card-show-lists-on-minicard'}} - div.check-div - a.flex.js-field-has-card-number(class="{{#if allowsCardNumber}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsCardNumber}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + a.flex.js-field-has-card-number(title="{{_ 'card'}} {{_ 'number'}}" class="{{#if allowsCardNumber}}is-checked{{/if}}") + span {{#if allowsCardNumber}}✅{{else}}⬜{{/if}} + .card-settings-column + a.flex.js-field-has-card-number(title="{{_ 'card'}} {{_ 'number'}}" class="{{#if allowsCardNumber}}is-checked{{/if}}") + span {{#if allowsCardNumber}}✅{{else}}⬜{{/if}} + .card-settings-column span | #️⃣ | {{_ 'card'}} | {{_ 'number'}} - div.check-div - a.flex.js-field-has-description-title(class="{{#if allowsDescriptionTitle}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsDescriptionTitle}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + a.flex.js-field-has-description-title(title="{{_ 'description'}} {{_ 'title'}}" class="{{#if allowsDescriptionTitle}}is-checked{{/if}}") + span {{#if allowsDescriptionTitle}}✅{{else}}⬜{{/if}} + .card-settings-column + a.flex.js-field-has-description-title(title="{{_ 'description'}} {{_ 'title'}}" class="{{#if allowsDescriptionTitle}}is-checked{{/if}}") + span {{#if allowsDescriptionTitle}}✅{{else}}⬜{{/if}} + .card-settings-column span | 📝 | {{_ 'description'}} | {{_ 'title'}} - div.check-div - a.flex.js-field-has-description-text(class="{{#if allowsDescriptionText}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsDescriptionText}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + a.flex.js-field-has-description-text(title="{{_ 'description'}} {{_ 'custom-field-text'}}" class="{{#if allowsDescriptionText}}is-checked{{/if}}") + span {{#if allowsDescriptionText}}✅{{else}}⬜{{/if}} + .card-settings-column + a.flex.js-field-has-description-text(title="{{_ 'description'}} {{_ 'custom-field-text'}}" class="{{#if allowsDescriptionText}}is-checked{{/if}}") + span {{#if allowsDescriptionText}}✅{{else}}⬜{{/if}} + .card-settings-column span | 📝 | {{_ 'description'}} | {{_ 'custom-field-text'}} - div.check-div - a.flex.js-field-has-description-text-on-minicard(class="{{#if allowsDescriptionTextOnMinicard}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsDescriptionTextOnMinicard}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + span + .card-settings-column + a.flex.js-field-has-description-text-on-minicard(title="{{_ 'description-on-minicard'}}" class="{{#if allowsDescriptionTextOnMinicard}}is-checked{{/if}}") + span {{#if allowsDescriptionTextOnMinicard}}✅{{else}}⬜{{/if}} + .card-settings-column span | 📝 | {{_ 'description-on-minicard'}} - div.check-div - a.flex.js-field-has-checklists(class="{{#if allowsChecklists}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsChecklists}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + a.flex.js-field-has-checklists(title="{{_ 'checklists'}}" class="{{#if allowsChecklists}}is-checked{{/if}}") + span {{#if allowsChecklists}}✅{{else}}⬜{{/if}} + .card-settings-column + a.flex.js-field-has-checklists(title="{{_ 'checklists'}}" class="{{#if allowsChecklists}}is-checked{{/if}}") + span {{#if allowsChecklists}}✅{{else}}⬜{{/if}} + .card-settings-column span | ✅ | {{_ 'checklists'}} - div.check-div - a.flex.js-field-has-subtasks(class="{{#if allowsSubtasks}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsSubtasks}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + a.flex.js-field-has-subtasks(title="{{_ 'subtasks'}}" class="{{#if allowsSubtasks}}is-checked{{/if}}") + span {{#if allowsSubtasks}}✅{{else}}⬜{{/if}} + .card-settings-column + a.flex.js-field-has-subtasks(title="{{_ 'subtasks'}}" class="{{#if allowsSubtasks}}is-checked{{/if}}") + span {{#if allowsSubtasks}}✅{{else}}⬜{{/if}} + .card-settings-column span | 🌐 | {{_ 'subtasks'}} - div.check-div - a.flex.js-field-has-attachments(class="{{#if allowsAttachments}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsAttachments}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + a.flex.js-field-has-attachments(title="{{_ 'attachments'}}" class="{{#if allowsAttachments}}is-checked{{/if}}") + span {{#if allowsAttachments}}✅{{else}}⬜{{/if}} + .card-settings-column + a.flex.js-field-has-attachments(title="{{_ 'attachments'}}" class="{{#if allowsAttachments}}is-checked{{/if}}") + span {{#if allowsAttachments}}✅{{else}}⬜{{/if}} + .card-settings-column span | 📎 | {{_ 'attachments'}} - div.check-div - a.flex.js-field-has-badge-attachment-on-minicard(class="{{#if allowsBadgeAttachmentOnMinicard}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsBadgeAttachmentOnMinicard}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + span + .card-settings-column + a.flex.js-field-has-badge-attachment-on-minicard(title="{{_ 'badge-attachment-on-minicard'}}" class="{{#if allowsBadgeAttachmentOnMinicard}}is-checked{{/if}}") + span {{#if allowsBadgeAttachmentOnMinicard}}✅{{else}}⬜{{/if}} + .card-settings-column span | 📎 | {{_ 'badge-attachment-on-minicard'}} - div.check-div - a.flex.js-field-has-cover-attachment-on-minicard(class="{{#if allowsCoverAttachmentOnMinicard}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsCoverAttachmentOnMinicard}}is-checked{{/if}}") + .card-settings-row + .card-settings-column + span + .card-settings-column + a.flex.js-field-has-cover-attachment-on-minicard(title="{{_ 'cover-attachment-on-minicard'}}" class="{{#if allowsCoverAttachmentOnMinicard}}is-checked{{/if}}") + span {{#if allowsCoverAttachmentOnMinicard}}✅{{else}}⬜{{/if}} + .card-settings-column span | 📖 | 🖼️ @@ -364,27 +475,27 @@ template(name="boardCardSettingsPopup") template(name="boardSubtaskSettingsPopup") form.board-subtask-settings h3 {{_ 'show-parent-in-minicard'}} - a#prefix-with-full-path.flex.js-field-show-parent-in-minicard(class="{{#if $eq presentParentTask 'prefix-with-full-path'}}is-checked{{/if}}") - .materialCheckBox(class="{{#if $eq presentParentTask 'prefix-with-full-path'}}is-checked{{/if}}") + a#prefix-with-full-path.flex.js-field-show-parent-in-minicard(title="{{_ 'prefix-with-full-path'}}" class="{{#if $eq presentParentTask 'prefix-with-full-path'}}is-checked{{/if}}") + span {{#if $eq presentParentTask 'prefix-with-full-path'}}✅{{else}}⬜{{/if}} span {{_ 'prefix-with-full-path'}} - a#prefix-with-parent.flex.js-field-show-parent-in-minicard(class="{{#if $eq presentParentTask 'prefix-with-parent'}}is-checked{{/if}}") - .materialCheckBox(class="{{#if $eq presentParentTask 'prefix-with-parent'}}is-checked{{/if}}") + a#prefix-with-parent.flex.js-field-show-parent-in-minicard(title="{{_ 'prefix-with-parent'}}" class="{{#if $eq presentParentTask 'prefix-with-parent'}}is-checked{{/if}}") + span {{#if $eq presentParentTask 'prefix-with-parent'}}✅{{else}}⬜{{/if}} span {{_ 'prefix-with-parent'}} - a#subtext-with-full-path.flex.js-field-show-parent-in-minicard(class="{{#if $eq presentParentTask 'subtext-with-full-path'}}is-checked{{/if}}") - .materialCheckBox(class="{{#if $eq presentParentTask 'subtext-with-full-path'}}is-checked{{/if}}") + a#subtext-with-full-path.flex.js-field-show-parent-in-minicard(title="{{_ 'subtext-with-full-path'}}" class="{{#if $eq presentParentTask 'subtext-with-full-path'}}is-checked{{/if}}") + span {{#if $eq presentParentTask 'subtext-with-full-path'}}✅{{else}}⬜{{/if}} span {{_ 'subtext-with-full-path'}} - a#subtext-with-parent.flex.js-field-show-parent-in-minicard(class="{{#if $eq presentParentTask 'subtext-with-parent'}}is-checked{{/if}}") - .materialCheckBox(class="{{#if $eq presentParentTask 'subtext-with-parent'}}is-checked{{/if}}") + a#subtext-with-parent.flex.js-field-show-parent-in-minicard(title="{{_ 'subtext-with-parent'}}" class="{{#if $eq presentParentTask 'subtext-with-parent'}}is-checked{{/if}}") + span {{#if $eq presentParentTask 'subtext-with-parent'}}✅{{else}}⬜{{/if}} span {{_ 'subtext-with-parent'}} - a#no-parent.flex.js-field-show-parent-in-minicard(class="{{#if $eq presentParentTask 'no-parent'}}is-checked{{/if}}") - .materialCheckBox(class="{{#if $eq presentParentTask 'no-parent'}}is-checked{{/if}}") + a#no-parent.flex.js-field-show-parent-in-minicard(title="{{_ 'no-parent'}}" class="{{#if $eq presentParentTask 'no-parent'}}is-checked{{/if}}") + span {{#if $eq presentParentTask 'no-parent'}}✅{{else}}⬜{{/if}} span {{_ 'no-parent'}} div hr div.check-div - a.flex.js-field-has-subtasks(class="{{#if allowsSubtasks}}is-checked{{/if}}") - .materialCheckBox(class="{{#if allowsSubtasks}}is-checked{{/if}}") + a.flex.js-field-has-subtasks(title="{{_ 'show-subtasks-field'}}" class="{{#if allowsSubtasks}}is-checked{{/if}}") + span {{#if allowsSubtasks}}✅{{else}}⬜{{/if}} span {{_ 'show-subtasks-field'}} label @@ -430,9 +541,8 @@ template(name="outgoingWebhooksPopup") each integrations form.integration-form a.flex + span {{#unless enabled}}✅{{else}}⬜{{/unless}} span {{_ 'disable-webhook'}} - b   - .materialCheckBox(class="{{#unless enabled}}is-checked{{/unless}}") input.js-outgoing-webhooks-title(placeholder="{{_ 'webhook-title'}}" type="text" name="title" value=title) input.js-outgoing-webhooks-url(type="text" name="url" value=url) input.js-outgoing-webhooks-token(placeholder="{{_ 'webhook-token' }}" type="text" value=token name="token") diff --git a/client/components/sidebar/sidebar.js b/client/components/sidebar/sidebar.js index 273df70a5..3d507ff8c 100644 --- a/client/components/sidebar/sidebar.js +++ b/client/components/sidebar/sidebar.js @@ -195,7 +195,7 @@ BlazeComponent.extendComponent({ events() { return [ { - 'click #toggleShowActivitiesBoard'() { + 'click .js-toggle-show-activities'() { Utils.getCurrentBoard().toggleShowActivities(); }, }, @@ -822,7 +822,11 @@ BlazeComponent.extendComponent({ }, allowsSubtasks() { - return this.currentBoard.allowsSubtasks; + // Get the current board reactively using board ID from Session + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + const result = currentBoard ? currentBoard.allowsSubtasks : false; + return result; }, allowsReceivedDate() { @@ -874,7 +878,11 @@ BlazeComponent.extendComponent({ }, presentParentTask() { - let result = this.currentBoard.presentParentTask; + // Get the current board reactively using board ID from Session + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + + let result = currentBoard ? currentBoard.presentParentTask : null; if (result === null || result === undefined) { result = 'no-parent'; } @@ -886,19 +894,11 @@ BlazeComponent.extendComponent({ { 'click .js-field-has-subtasks'(evt) { evt.preventDefault(); - this.currentBoard.allowsSubtasks = !this.currentBoard.allowsSubtasks; - this.currentBoard.setAllowsSubtasks(this.currentBoard.allowsSubtasks); - $(`.js-field-has-subtasks ${MCB}`).toggleClass( - CKCLS, - this.currentBoard.allowsSubtasks, - ); - $('.js-field-has-subtasks').toggleClass( - CKCLS, - this.currentBoard.allowsSubtasks, - ); + const newValue = !this.currentBoard.allowsSubtasks; + Boards.update(this.currentBoard._id, { $set: { allowsSubtasks: newValue } }); $('.js-field-deposit-board').prop( 'disabled', - !this.currentBoard.allowsSubtasks, + !newValue, ); }, 'change .js-field-deposit-board'(evt) { @@ -914,28 +914,13 @@ BlazeComponent.extendComponent({ evt.preventDefault(); }, 'click .js-field-show-parent-in-minicard'(evt) { - const value = - evt.target.id || - $(evt.target).parent()[0].id || - $(evt.target) - .parent()[0] - .parent()[0].id; - const options = [ - 'prefix-with-full-path', - 'prefix-with-parent', - 'subtext-with-full-path', - 'subtext-with-parent', - 'no-parent', - ]; - options.forEach(function(element) { - if (element !== value) { - $(`#${element} ${MCB}`).toggleClass(CKCLS, false); - $(`#${element}`).toggleClass(CKCLS, false); - } - }); - $(`#${value} ${MCB}`).toggleClass(CKCLS, true); - $(`#${value}`).toggleClass(CKCLS, true); - this.currentBoard.setPresentParentTask(value); + // Get the ID from the anchor element, not the span + const anchorElement = $(evt.target).closest('.js-field-show-parent-in-minicard')[0]; + const value = anchorElement ? anchorElement.id : null; + + if (value) { + Boards.update(this.currentBoard._id, { $set: { presentParentTask: value } }); + } evt.preventDefault(); }, }, @@ -949,115 +934,168 @@ BlazeComponent.extendComponent({ }, allowsReceivedDate() { - return this.currentBoard.allowsReceivedDate; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsReceivedDate : false; }, allowsStartDate() { - return this.currentBoard.allowsStartDate; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsStartDate : false; }, allowsDueDate() { - return this.currentBoard.allowsDueDate; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsDueDate : false; }, allowsEndDate() { - return this.currentBoard.allowsEndDate; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsEndDate : false; }, allowsSubtasks() { - return this.currentBoard.allowsSubtasks; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsSubtasks : false; }, allowsCreator() { - return this.currentBoard.allowsCreator ?? false; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? (currentBoard.allowsCreator ?? false) : false; }, allowsCreatorOnMinicard() { - return this.currentBoard.allowsCreatorOnMinicard ?? false; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? (currentBoard.allowsCreatorOnMinicard ?? false) : false; }, allowsMembers() { - return this.currentBoard.allowsMembers; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsMembers : false; }, allowsAssignee() { - return this.currentBoard.allowsAssignee; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsAssignee : false; }, allowsAssignedBy() { - return this.currentBoard.allowsAssignedBy; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsAssignedBy : false; }, allowsRequestedBy() { - return this.currentBoard.allowsRequestedBy; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsRequestedBy : false; }, allowsCardSortingByNumber() { - return this.currentBoard.allowsCardSortingByNumber; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsCardSortingByNumber : false; }, allowsShowLists() { - return this.currentBoard.allowsShowLists; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsShowLists : false; }, - allowsLabels() { - return this.currentBoard.allowsLabels; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsLabels : false; }, allowsShowListsOnMinicard() { - return this.currentBoard.allowsShowListsOnMinicard; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsShowListsOnMinicard : false; }, allowsChecklists() { - return this.currentBoard.allowsChecklists; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsChecklists : false; }, allowsAttachments() { - return this.currentBoard.allowsAttachments; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsAttachments : false; }, allowsComments() { - return this.currentBoard.allowsComments; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsComments : false; }, allowsCardNumber() { - return this.currentBoard.allowsCardNumber; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsCardNumber : false; }, allowsDescriptionTitle() { - return this.currentBoard.allowsDescriptionTitle; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsDescriptionTitle : false; }, allowsDescriptionText() { - return this.currentBoard.allowsDescriptionText; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsDescriptionText : false; }, isBoardSelected() { - return this.currentBoard.dateSettingsDefaultBoardID; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.dateSettingsDefaultBoardID : false; }, isNullBoardSelected() { - return ( - this.currentBoard.dateSettingsDefaultBoardId === null || - this.currentBoard.dateSettingsDefaultBoardId === undefined - ); + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? ( + currentBoard.dateSettingsDefaultBoardId === null || + currentBoard.dateSettingsDefaultBoardId === undefined + ) : true; }, allowsDescriptionTextOnMinicard() { - return this.currentBoard.allowsDescriptionTextOnMinicard; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsDescriptionTextOnMinicard : false; }, allowsCoverAttachmentOnMinicard() { - return this.currentBoard.allowsCoverAttachmentOnMinicard; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsCoverAttachmentOnMinicard : false; }, allowsBadgeAttachmentOnMinicard() { - return this.currentBoard.allowsBadgeAttachmentOnMinicard; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsBadgeAttachmentOnMinicard : false; }, allowsCardSortingByNumberOnMinicard() { - return this.currentBoard.allowsCardSortingByNumberOnMinicard; + const boardId = Session.get('currentBoard'); + const currentBoard = ReactiveCache.getBoard(boardId); + return currentBoard ? currentBoard.allowsCardSortingByNumberOnMinicard : false; }, boards() { @@ -1100,203 +1138,73 @@ BlazeComponent.extendComponent({ { 'click .js-field-has-receiveddate'(evt) { evt.preventDefault(); - this.currentBoard.allowsReceivedDate = !this.currentBoard - .allowsReceivedDate; - this.currentBoard.setAllowsReceivedDate( - this.currentBoard.allowsReceivedDate, - ); - $(`.js-field-has-receiveddate ${MCB}`).toggleClass( - CKCLS, - this.currentBoard.allowsReceivedDate, - ); - $('.js-field-has-receiveddate').toggleClass( - CKCLS, - this.currentBoard.allowsReceivedDate, - ); + const newValue = !this.currentBoard.allowsReceivedDate; + Boards.update(this.currentBoard._id, { $set: { allowsReceivedDate: newValue } }); }, 'click .js-field-has-startdate'(evt) { evt.preventDefault(); - this.currentBoard.allowsStartDate = !this.currentBoard - .allowsStartDate; - this.currentBoard.setAllowsStartDate( - this.currentBoard.allowsStartDate, - ); - $(`.js-field-has-startdate ${MCB}`).toggleClass( - CKCLS, - this.currentBoard.allowsStartDate, - ); - $('.js-field-has-startdate').toggleClass( - CKCLS, - this.currentBoard.allowsStartDate, - ); + const newValue = !this.currentBoard.allowsStartDate; + Boards.update(this.currentBoard._id, { $set: { allowsStartDate: newValue } }); }, 'click .js-field-has-enddate'(evt) { evt.preventDefault(); - this.currentBoard.allowsEndDate = !this.currentBoard.allowsEndDate; - this.currentBoard.setAllowsEndDate(this.currentBoard.allowsEndDate); - $(`.js-field-has-enddate ${MCB}`).toggleClass( - CKCLS, - this.currentBoard.allowsEndDate, - ); - $('.js-field-has-enddate').toggleClass( - CKCLS, - this.currentBoard.allowsEndDate, - ); + const newValue = !this.currentBoard.allowsEndDate; + Boards.update(this.currentBoard._id, { $set: { allowsEndDate: newValue } }); }, 'click .js-field-has-duedate'(evt) { evt.preventDefault(); - this.currentBoard.allowsDueDate = !this.currentBoard.allowsDueDate; - this.currentBoard.setAllowsDueDate(this.currentBoard.allowsDueDate); - $(`.js-field-has-duedate ${MCB}`).toggleClass( - CKCLS, - this.currentBoard.allowsDueDate, - ); - $('.js-field-has-duedate').toggleClass( - CKCLS, - this.currentBoard.allowsDueDate, - ); + const newValue = !this.currentBoard.allowsDueDate; + Boards.update(this.currentBoard._id, { $set: { allowsDueDate: newValue } }); }, 'click .js-field-has-subtasks'(evt) { evt.preventDefault(); - this.currentBoard.allowsSubtasks = !this.currentBoard.allowsSubtasks; - this.currentBoard.setAllowsSubtasks(this.currentBoard.allowsSubtasks); - $(`.js-field-has-subtasks ${MCB}`).toggleClass( - CKCLS, - this.currentBoard.allowsSubtasks, - ); - $('.js-field-has-subtasks').toggleClass( - CKCLS, - this.currentBoard.allowsSubtasks, - ); + const newValue = !this.currentBoard.allowsSubtasks; + Boards.update(this.currentBoard._id, { $set: { allowsSubtasks: newValue } }); }, 'click .js-field-has-creator'(evt) { evt.preventDefault(); - this.currentBoard.allowsCreator = !this.currentBoard.allowsCreator; - this.currentBoard.setAllowsCreator(this.currentBoard.allowsCreator); - $(`.js-field-has-creator ${MCB}`).toggleClass( - CKCLS, - this.currentBoard.allowsCreator, - ); - $('.js-field-has-creator').toggleClass( - CKCLS, - this.currentBoard.allowsCreator, - ); + const newValue = !this.currentBoard.allowsCreator; + Boards.update(this.currentBoard._id, { $set: { allowsCreator: newValue } }); }, 'click .js-field-has-creator-on-minicard'(evt) { evt.preventDefault(); - this.currentBoard.allowsCreatorOnMinicard = !this.currentBoard.allowsCreatorOnMinicard; - this.currentBoard.setAllowsCreatorOnMinicard(this.currentBoard.allowsCreatorOnMinicard); - $(`.js-field-has-creator-on-minicard ${MCB}`).toggleClass( - CKCLS, - this.currentBoard.allowsCreatorOnMinicard, - ); - $('.js-field-has-creator-on-minicard').toggleClass( - CKCLS, - this.currentBoard.allowsCreatorOnMinicard, - ); + const newValue = !this.currentBoard.allowsCreatorOnMinicard; + Boards.update(this.currentBoard._id, { $set: { allowsCreatorOnMinicard: newValue } }); }, 'click .js-field-has-members'(evt) { evt.preventDefault(); - this.currentBoard.allowsMembers = !this.currentBoard.allowsMembers; - this.currentBoard.setAllowsMembers(this.currentBoard.allowsMembers); - $(`.js-field-has-members ${MCB}`).toggleClass( - CKCLS, - this.currentBoard.allowsMembers, - ); - $('.js-field-has-members').toggleClass( - CKCLS, - this.currentBoard.allowsMembers, - ); + const newValue = !this.currentBoard.allowsMembers; + Boards.update(this.currentBoard._id, { $set: { allowsMembers: newValue } }); }, 'click .js-field-has-assignee'(evt) { evt.preventDefault(); - this.currentBoard.allowsAssignee = !this.currentBoard.allowsAssignee; - this.currentBoard.setAllowsAssignee(this.currentBoard.allowsAssignee); - $(`.js-field-has-assignee ${MCB}`).toggleClass( - CKCLS, - this.currentBoard.allowsAssignee, - ); - $('.js-field-has-assignee').toggleClass( - CKCLS, - this.currentBoard.allowsAssignee, - ); + const newValue = !this.currentBoard.allowsAssignee; + Boards.update(this.currentBoard._id, { $set: { allowsAssignee: newValue } }); }, 'click .js-field-has-assigned-by'(evt) { evt.preventDefault(); - this.currentBoard.allowsAssignedBy = !this.currentBoard - .allowsAssignedBy; - this.currentBoard.setAllowsAssignedBy( - this.currentBoard.allowsAssignedBy, - ); - $(`.js-field-has-assigned-by ${MCB}`).toggleClass( - CKCLS, - this.currentBoard.allowsAssignedBy, - ); - $('.js-field-has-assigned-by').toggleClass( - CKCLS, - this.currentBoard.allowsAssignedBy, - ); + const newValue = !this.currentBoard.allowsAssignedBy; + Boards.update(this.currentBoard._id, { $set: { allowsAssignedBy: newValue } }); }, 'click .js-field-has-requested-by'(evt) { evt.preventDefault(); - this.currentBoard.allowsRequestedBy = !this.currentBoard - .allowsRequestedBy; - this.currentBoard.setAllowsRequestedBy( - this.currentBoard.allowsRequestedBy, - ); - $(`.js-field-has-requested-by ${MCB}`).toggleClass( - CKCLS, - this.currentBoard.allowsRequestedBy, - ); - $('.js-field-has-requested-by').toggleClass( - CKCLS, - this.currentBoard.allowsRequestedBy, - ); + const newValue = !this.currentBoard.allowsRequestedBy; + Boards.update(this.currentBoard._id, { $set: { allowsRequestedBy: newValue } }); }, 'click .js-field-has-card-sorting-by-number'(evt) { evt.preventDefault(); - this.currentBoard.allowsCardSortingByNumber = !this.currentBoard - .allowsCardSortingByNumber; - this.currentBoard.setAllowsCardSortingByNumber( - this.currentBoard.allowsCardSortingByNumber, - ); - $(`.js-field-has-card-sorting-by-number ${MCB}`).toggleClass( - CKCLS, - this.currentBoard.allowsCardSortingByNumber, - ); - $('.js-field-has-card-sorting-by-number').toggleClass( - CKCLS, - this.currentBoard.allowsCardSortingByNumber, - ); + const newValue = !this.currentBoard.allowsCardSortingByNumber; + Boards.update(this.currentBoard._id, { $set: { allowsCardSortingByNumber: newValue } }); }, 'click .js-field-has-card-show-lists'(evt) { evt.preventDefault(); - this.currentBoard.allowsShowLists = !this.currentBoard - .allowsShowLists; - this.currentBoard.setAllowsShowLists( - this.currentBoard.allowsShowLists, - ); - $(`.js-field-has-card-show-lists ${MCB}`).toggleClass( - CKCLS, - this.currentBoard.allowsShowLists, - ); - $('.js-field-has-card-show-lists').toggleClass( - CKCLS, - this.currentBoard.allowsShowLists, - ); + const newValue = !this.currentBoard.allowsShowLists; + Boards.update(this.currentBoard._id, { $set: { allowsShowLists: newValue } }); }, 'click .js-field-has-labels'(evt) { evt.preventDefault(); - this.currentBoard.allowsLabels = !this.currentBoard.allowsLabels; - this.currentBoard.setAllowsLabels(this.currentBoard.allowsLabels); - $(`.js-field-has-labels ${MCB}`).toggleClass( - CKCLS, - this.currentBoard.allowsLabels, - ); - $('.js-field-has-labels').toggleClass( - CKCLS, - this.currentBoard.allowsLabels, - ); + const newValue = !this.currentBoard.allowsLabels; + Boards.update(this.currentBoard._id, { $set: { allowsLabels: newValue } }); }, 'click .js-field-has-card-show-lists-on-minicard'(evt) { evt.preventDefault(); @@ -1499,7 +1407,6 @@ Session.setDefault('addMemberPopup.noResults', false); Session.setDefault('addMemberPopup.loading', false); Session.setDefault('addMemberPopup.error', ''); -console.log('addMemberPopup Session variables initialized'); BlazeComponent.extendComponent({ onCreated() { diff --git a/imports/i18n/data/en.i18n.json b/imports/i18n/data/en.i18n.json index 0162afe25..bcdd00061 100644 --- a/imports/i18n/data/en.i18n.json +++ b/imports/i18n/data/en.i18n.json @@ -762,7 +762,7 @@ "subtask-settings": "Subtasks Settings", "card-settings": "Card Settings", "minicard-settings": "Minicard Settings", - "boardSubtaskSettingsPopup-title": "Board Subtasks Settings", + "boardSubtaskSettingsPopup-title": "Subtasks Settings", "boardCardSettingsPopup-title": "Card Settings", "boardMinicardSettingsPopup-title": "Minicard Settings", "deposit-subtasks-board": "Deposit subtasks to this board:",