From 2209da9fd92858927a3d6fa517c6fc29da5f0623 Mon Sep 17 00:00:00 2001 From: Stefano Pigozzi Date: Fri, 4 Aug 2023 17:10:56 +0200 Subject: [PATCH] Tweak graphics a bit --- .../[board]/BoardMainTaskGroups.module.css | 10 ++- .../app/board/[board]/TaskDisplay.module.css | 3 +- .../src/app/board/[board]/doTaskSorting.tsx | 61 ++++++++++++++++++- 3 files changed, 69 insertions(+), 5 deletions(-) diff --git a/todoblue/src/app/board/[board]/BoardMainTaskGroups.module.css b/todoblue/src/app/board/[board]/BoardMainTaskGroups.module.css index 72e243d..363d84e 100644 --- a/todoblue/src/app/board/[board]/BoardMainTaskGroups.module.css +++ b/todoblue/src/app/board/[board]/BoardMainTaskGroups.module.css @@ -1,6 +1,5 @@ .boardMainTaskGroups { display: flex; - gap: 8px; justify-content: start; flex-wrap: nowrap; @@ -11,6 +10,12 @@ .boardMainTaskGroups > div { flex-basis: 240px; flex-shrink: 0; + flex-grow: 1; + + margin-right: auto; + margin-left: auto; + + max-width: 480px; } .boardMainTaskGroups > div > div { @@ -18,4 +23,7 @@ flex-direction: column; gap: 8px; overflow-y: scroll; + padding-left: 4px; + padding-right: 4px; + padding-bottom: 8px; } diff --git a/todoblue/src/app/board/[board]/TaskDisplay.module.css b/todoblue/src/app/board/[board]/TaskDisplay.module.css index 7a9c2e5..ca1d08f 100644 --- a/todoblue/src/app/board/[board]/TaskDisplay.module.css +++ b/todoblue/src/app/board/[board]/TaskDisplay.module.css @@ -1,8 +1,7 @@ .taskDiv { display: grid; align-items: center; - min-width: unset; - width: 240px; + min-width: 240px; min-height: 44px; cursor: pointer; diff --git a/todoblue/src/app/board/[board]/doTaskSorting.tsx b/todoblue/src/app/board/[board]/doTaskSorting.tsx index 5a680be..7c381c5 100644 --- a/todoblue/src/app/board/[board]/doTaskSorting.tsx +++ b/todoblue/src/app/board/[board]/doTaskSorting.tsx @@ -1,14 +1,71 @@ import {TaskWithId} from "@/app/board/[board]/Types" import {TaskSortingFunction} from "@/app/board/[board]/useBoardTaskArranger" +/** + * **Mapping** from {@link TaskImportance} to a {@link number}. + */ +const IMPORTANCE_TO_NUMBER = { + "Highest": 5, + "High": 4, + "Normal": 3, + "Low": 2, + "Lowest": 1, +} + +/** + * **Mapping** from {@link TaskPriority} to a {@link number}. + */ +const PRIORITY_TO_NUMBER = { + "Highest": 5, + "High": 4, + "Normal": 3, + "Low": 2, + "Lowest": 1, +} /** * **Function** comparing {@link Task}s by their text, following the order proposed by {@link string.localeCompare}. * @param a The first task to compare. * @param b The second task to compare. */ -function compareTasksByText(a: TaskWithId, b: TaskWithId) {return a.text.localeCompare(b.text)} +function compareText(a: TaskWithId, b: TaskWithId) {return a.text.localeCompare(b.text)} + +/** + * **Function** comparing {@link Task}s by their {@link TaskPriority}, sorting highest priorities before the lowest. + * @param a The first task to compare. + * @param b The second task to compare. + */ +function comparePriority(a: TaskWithId, b: TaskWithId) {return PRIORITY_TO_NUMBER[b.priority] - PRIORITY_TO_NUMBER[a.priority]} + +/** + * **Function** comparing {@link Task}s by their {@link TaskImportance}, sorting highest priorities before the lowest. + * @param a The first task to compare. + * @param b The second task to compare. + */ +function compareImportance(a: TaskWithId, b: TaskWithId) {return IMPORTANCE_TO_NUMBER[b.importance] - IMPORTANCE_TO_NUMBER[a.importance]} + +function comparePriorityImportanceText(a: TaskWithId, b: TaskWithId) { + let diff; + diff = comparePriority(a, b) + if(diff != 0) return diff; + diff = compareImportance(a, b) + if(diff != 0) return diff + diff = compareText(a, b) + return diff +} + +function compareImportancePriorityText(a: TaskWithId, b: TaskWithId) { + let diff; + diff = compareImportance(a, b) + if(diff != 0) return diff + diff = comparePriority(a, b) + if(diff != 0) return diff; + diff = compareText(a, b) + return diff +} export const TASK_SORTERS: TaskSortingFunction[] = [ - compareTasksByText, + compareText, + comparePriorityImportanceText, + compareImportancePriorityText, ];