From 5b3b6298a710b92058b55d9a1d34174c25540c02 Mon Sep 17 00:00:00 2001 From: Claudio Cambra Date: Thu, 16 Sep 2021 19:05:25 +0200 Subject: [PATCH 1/6] Fixed alignment and spacing in the sidebar --- src/contents/ui/Sidebar.qml | 132 ++++++++++++++++++++++-------------- 1 file changed, 81 insertions(+), 51 deletions(-) diff --git a/src/contents/ui/Sidebar.qml b/src/contents/ui/Sidebar.qml index fca02473..ba922da8 100644 --- a/src/contents/ui/Sidebar.qml +++ b/src/contents/ui/Sidebar.qml @@ -75,19 +75,17 @@ Kirigami.OverlayDrawer { Kirigami.Action { icon.name: "edit-undo" text: CalendarManager.undoRedoData.undoAvailable ? - i18n("Undo: ") + CalendarManager.undoRedoData.nextUndoDescription : - undoAction.text + i18n("Undo: ") + CalendarManager.undoRedoData.nextUndoDescription : undoAction.text shortcut: undoAction.shortcut - enabled: CalendarManager.undoRedoData.undoAvailable && !(root.activeFocusItem instanceof TextEdit || root.activeFocusItem instanceof TextInput) + enabled: CalendarManager.undoRedoData.undoAvailable onTriggered: CalendarManager.undoAction(); }, Kirigami.Action { icon.name: KalendarApplication.iconName(redoAction.icon) text: CalendarManager.undoRedoData.redoAvailable ? - i18n("Redo: ") + CalendarManager.undoRedoData.nextRedoDescription : - redoAction.text + i18n("Redo: ") + CalendarManager.undoRedoData.nextRedoDescription : redoAction.text shortcut: redoAction.shortcut - enabled: CalendarManager.undoRedoData.redoAvailable && !(root.activeFocusItem instanceof TextEdit || root.activeFocusItem instanceof TextInput) + enabled: CalendarManager.undoRedoData.redoAvailable onTriggered: CalendarManager.redoAction(); }, Kirigami.Action { @@ -179,17 +177,15 @@ Kirigami.OverlayDrawer { Kirigami.Action { icon.name: "edit-undo" text: CalendarManager.undoRedoData.undoAvailable ? - i18n("Undo: ") + CalendarManager.undoRedoData.nextUndoDescription : - i18n("Undo") - enabled: CalendarManager.undoRedoData.undoAvailable && !(root.activeFocusItem instanceof TextEdit || root.activeFocusItem instanceof TextInput) + i18n("Undo: ") + CalendarManager.undoRedoData.nextUndoDescription : i18n("Undo") + enabled: CalendarManager.undoRedoData.undoAvailable onTriggered: CalendarManager.undoAction(); }, Kirigami.Action { icon.name: KalendarApplication.iconName(redoAction.icon) text: CalendarManager.undoRedoData.redoAvailable ? - i18n("Redo: ") + CalendarManager.undoRedoData.nextRedoDescription : - i18n("Redo") - enabled: CalendarManager.undoRedoData.redoAvailable && !(root.activeFocusItem instanceof TextEdit || root.activeFocusItem instanceof TextInput) + i18n("Redo: ") + CalendarManager.undoRedoData.nextRedoDescription : i18n("Redo") + enabled: CalendarManager.undoRedoData.redoAvailable onTriggered: CalendarManager.redoAction(); }, Kirigami.Action { @@ -225,20 +221,31 @@ Kirigami.OverlayDrawer { anchors.fill: parent spacing: 0 - Kirigami.Heading { - id: tagsHeading - Layout.fillWidth: true - anchors.left: parent.left - anchors.right: parent.right - leftPadding: Kirigami.Units.largeSpacing - text: i18n("Tags") - color: Kirigami.Theme.disabledTextColor - - font.weight: Font.Bold - level: 5 + RowLayout { + id: tagsHeadingLayout + Layout.leftMargin: Kirigami.Settings.isMobile ? Kirigami.Units.largeSpacing * 2 : Kirigami.Units.largeSpacing + spacing: Kirigami.Settings.isMobile ? Kirigami.Units.largeSpacing * 2 : Kirigami.Units.largeSpacing visible: tagList.count > 0 - z: 10 - background: Rectangle {color: Kirigami.Theme.backgroundColor} + + Kirigami.Icon { + implicitWidth: Kirigami.Units.iconSizes.smallMedium + implicitHeight: Kirigami.Units.iconSizes.smallMedium + color: Kirigami.Theme.disabledTextColor + isMask: true + source: "action-rss_tag" + } + Kirigami.Heading { + id: tagsHeading + Layout.fillWidth: true + Layout.alignment: Qt.AlignVCenter + text: i18n("Tags") + color: Kirigami.Theme.disabledTextColor + + font.weight: Font.Bold + level: 5 + z: 10 + background: Rectangle {color: Kirigami.Theme.backgroundColor} + } } Repeater { @@ -249,8 +256,10 @@ Kirigami.OverlayDrawer { delegate: Kirigami.BasicListItem { Layout.fillWidth: true + label: display labelItem.color: Kirigami.Theme.textColor + reserveSpaceForIcon: true hoverEnabled: sidebar.todoMode separatorVisible: false @@ -259,18 +268,29 @@ Kirigami.OverlayDrawer { } } - Kirigami.Heading { - id: calendarsHeading - anchors.left: parent.left - anchors.right: parent.right + RowLayout { Layout.topMargin: tagsHeading.visible ? Kirigami.Units.largeSpacing * 2 : 0 - leftPadding: Kirigami.Units.largeSpacing - text: i18n("Calendars") - color: Kirigami.Theme.disabledTextColor - font.weight: Font.Bold - level: 5 - z: 10 - background: Rectangle {color: Kirigami.Theme.backgroundColor} + Layout.leftMargin: Kirigami.Settings.isMobile ? Kirigami.Units.largeSpacing * 2 : Kirigami.Units.largeSpacing + spacing: Kirigami.Settings.isMobile ? Kirigami.Units.largeSpacing * 2 : Kirigami.Units.largeSpacing + + Kirigami.Icon { + implicitWidth: Kirigami.Units.iconSizes.smallMedium + implicitHeight: Kirigami.Units.iconSizes.smallMedium + color: Kirigami.Theme.disabledTextColor + isMask: true + source: "view-calendar" + } + Kirigami.Heading { + id: calendarsHeading + Layout.alignment: Qt.AlignVCenter + Layout.fillWidth: true + text: i18n("Calendars") + color: Kirigami.Theme.disabledTextColor + font.weight: Font.Bold + level: 5 + z: 10 + background: Rectangle {color: Kirigami.Theme.backgroundColor} + } } Repeater { @@ -291,14 +311,24 @@ Kirigami.OverlayDrawer { labelItem.color: Kirigami.Theme.disabledTextColor labelItem.font.weight: Font.DemiBold topPadding: 2 * Kirigami.Units.largeSpacing + leftPadding: Kirigami.Settings.isMobile ? Kirigami.Units.largeSpacing * 2 : Kirigami.Units.largeSpacing hoverEnabled: false background: Item {} separatorVisible: false + leading: Kirigami.Icon { + implicitWidth: Kirigami.Units.iconSizes.smallMedium + implicitHeight: Kirigami.Units.iconSizes.smallMedium + color: Kirigami.Theme.disabledTextColor + isMask: true + source: model.decoration + } + leadingPadding: Kirigami.Settings.isMobile ? Kirigami.Units.largeSpacing * 2 : Kirigami.Units.largeSpacing + trailing: Kirigami.Icon { - width: Kirigami.Units.iconSizes.small - height: Kirigami.Units.iconSizes.small + implicitWidth: Kirigami.Units.iconSizes.small + implicitHeight: Kirigami.Units.iconSizes.small source: model.kDescendantExpanded ? 'arrow-up' : 'arrow-down' } @@ -311,23 +341,25 @@ Kirigami.OverlayDrawer { Kirigami.BasicListItem { label: display labelItem.color: Kirigami.Theme.textColor - + leftPadding: Kirigami.Settings.isMobile ? Kirigami.Units.largeSpacing * 2.3 : Kirigami.Units.largeSpacing * 1.3 hoverEnabled: sidebar.todoMode - separatorVisible: false - trailing: ColoredCheckbox { + leading: ColoredCheckbox { id: calendarCheckbox - visible: model.checkState != null - color: model.collectionColor - checked: model.checkState === 2 - onCheckedChanged: calendarCheckChanged(collectionId, checked) - onClicked: { - model.checkState = model.checkState === 0 ? 2 : 0 - calendarCheckChanged(collectionId, checked) + visible: model.checkState != null + color: model.collectionColor + checked: model.checkState === 2 + onCheckedChanged: calendarCheckChanged(collectionId, checked) + onClicked: { + model.checkState = model.checkState === 0 ? 2 : 0 + calendarCheckChanged(collectionId, checked) + } } - } + leadingPadding: Kirigami.Settings.isMobile ? + (Kirigami.Units.largeSpacing * 2) + Kirigami.Units.smallSpacing : + Kirigami.Units.largeSpacing + Kirigami.Units.smallSpacing onClicked: { calendarClicked(collectionId) @@ -357,6 +389,4 @@ Kirigami.OverlayDrawer { if(sidebar.modal && sidebar.todoMode) sidebar.close() } } - - } -- GitLab From 1090f8c8735fbb9806b6caf00b6a41cd4249cb86 Mon Sep 17 00:00:00 2001 From: Claudio Cambra Date: Thu, 16 Sep 2021 19:21:10 +0200 Subject: [PATCH 2/6] Increased padding of todo view items --- src/contents/ui/TodoTreeView.qml | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/src/contents/ui/TodoTreeView.qml b/src/contents/ui/TodoTreeView.qml index 2e875fee..45887e64 100644 --- a/src/contents/ui/TodoTreeView.qml +++ b/src/contents/ui/TodoTreeView.qml @@ -85,7 +85,8 @@ KirigamiAddonsTreeView.TreeListView { contentItem: IncidenceMouseArea { implicitWidth: todoItemContents.implicitWidth - implicitHeight: todoItemContents.implicitHeight + implicitHeight: Kirigami.Settings.isMobile ? + todoItemContents.implicitHeight + Kirigami.Units.largeSpacing : todoItemContents.implicitHeight + Kirigami.Units.smallSpacing incidenceData: model collectionId: model.collectionId @@ -99,7 +100,9 @@ KirigamiAddonsTreeView.TreeListView { id: todoItemContents anchors.verticalCenter: parent.verticalCenter - width: parent.width + anchors.horizontalCenter: parent.horizontalCenter + width: Kirigami.Settings.isMobile ? + parent.width - (Kirigami.Units.largeSpacing * 2) : parent.width - (Kirigami.Units.smallSpacing * 2) columns: 4 rows: 2 -- GitLab From 46cf0825e8efefdd3d8e78a4ccb80ce7623aeab6 Mon Sep 17 00:00:00 2001 From: Felipe Kinoshita Date: Thu, 16 Sep 2021 17:44:54 +0000 Subject: [PATCH 3/6] Apply 1 suggestion(s) to 1 file(s) --- src/contents/ui/Sidebar.qml | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/contents/ui/Sidebar.qml b/src/contents/ui/Sidebar.qml index ba922da8..ce08f2b3 100644 --- a/src/contents/ui/Sidebar.qml +++ b/src/contents/ui/Sidebar.qml @@ -241,8 +241,7 @@ Kirigami.OverlayDrawer { text: i18n("Tags") color: Kirigami.Theme.disabledTextColor - font.weight: Font.Bold - level: 5 + level: 4 z: 10 background: Rectangle {color: Kirigami.Theme.backgroundColor} } -- GitLab From 177f616aba2fc7b4361809af4a33e06a78e931c6 Mon Sep 17 00:00:00 2001 From: Claudio Cambra Date: Thu, 16 Sep 2021 19:46:11 +0200 Subject: [PATCH 4/6] Enlargened and unboldened Calendars --- src/contents/ui/Sidebar.qml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/contents/ui/Sidebar.qml b/src/contents/ui/Sidebar.qml index ce08f2b3..c2226555 100644 --- a/src/contents/ui/Sidebar.qml +++ b/src/contents/ui/Sidebar.qml @@ -285,8 +285,8 @@ Kirigami.OverlayDrawer { Layout.fillWidth: true text: i18n("Calendars") color: Kirigami.Theme.disabledTextColor - font.weight: Font.Bold - level: 5 + + level: 4 z: 10 background: Rectangle {color: Kirigami.Theme.backgroundColor} } -- GitLab From e82c8b754fff2b3aa61a89a2683c43d0f35a3787 Mon Sep 17 00:00:00 2001 From: Claudio Cambra Date: Fri, 17 Sep 2021 19:17:12 +0200 Subject: [PATCH 5/6] Made checkbox alignment less hacky --- src/contents/ui/ColoredCheckbox.qml | 2 ++ src/contents/ui/Sidebar.qml | 7 +++---- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/src/contents/ui/ColoredCheckbox.qml b/src/contents/ui/ColoredCheckbox.qml index 2ecad0a0..8dc93593 100644 --- a/src/contents/ui/ColoredCheckbox.qml +++ b/src/contents/ui/ColoredCheckbox.qml @@ -11,6 +11,8 @@ QQC2.CheckBox { property real radius: 3 indicator: Rectangle { + anchors.horizontalCenter: parent.horizontalCenter + anchors.verticalCenter: parent.verticalCenter height: parent.height * 0.8 width: height x: checkbox.leftPadding diff --git a/src/contents/ui/Sidebar.qml b/src/contents/ui/Sidebar.qml index c2226555..9f792445 100644 --- a/src/contents/ui/Sidebar.qml +++ b/src/contents/ui/Sidebar.qml @@ -340,13 +340,14 @@ Kirigami.OverlayDrawer { Kirigami.BasicListItem { label: display labelItem.color: Kirigami.Theme.textColor - leftPadding: Kirigami.Settings.isMobile ? Kirigami.Units.largeSpacing * 2.3 : Kirigami.Units.largeSpacing * 1.3 + leftPadding: Kirigami.Settings.isMobile ? Kirigami.Units.largeSpacing * 2 : Kirigami.Units.largeSpacing hoverEnabled: sidebar.todoMode separatorVisible: false leading: ColoredCheckbox { id: calendarCheckbox + width: Kirigami.Units.iconSizes.smallMedium visible: model.checkState != null color: model.collectionColor checked: model.checkState === 2 @@ -356,9 +357,7 @@ Kirigami.OverlayDrawer { calendarCheckChanged(collectionId, checked) } } - leadingPadding: Kirigami.Settings.isMobile ? - (Kirigami.Units.largeSpacing * 2) + Kirigami.Units.smallSpacing : - Kirigami.Units.largeSpacing + Kirigami.Units.smallSpacing + leadingPadding: Kirigami.Settings.isMobile ? Kirigami.Units.largeSpacing * 2 : Kirigami.Units.largeSpacing onClicked: { calendarClicked(collectionId) -- GitLab From e039f421f01e88130914a5470d99578c3f5f0757 Mon Sep 17 00:00:00 2001 From: Claudio Cambra Date: Fri, 17 Sep 2021 22:24:42 +0200 Subject: [PATCH 6/6] Placed checkboxes for sidebar on right --- src/contents/ui/Sidebar.qml | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/src/contents/ui/Sidebar.qml b/src/contents/ui/Sidebar.qml index 9f792445..87b87334 100644 --- a/src/contents/ui/Sidebar.qml +++ b/src/contents/ui/Sidebar.qml @@ -343,11 +343,11 @@ Kirigami.OverlayDrawer { leftPadding: Kirigami.Settings.isMobile ? Kirigami.Units.largeSpacing * 2 : Kirigami.Units.largeSpacing hoverEnabled: sidebar.todoMode separatorVisible: false + reserveSpaceForIcon: true - leading: ColoredCheckbox { + trailing: ColoredCheckbox { id: calendarCheckbox - width: Kirigami.Units.iconSizes.smallMedium visible: model.checkState != null color: model.collectionColor checked: model.checkState === 2 @@ -357,7 +357,6 @@ Kirigami.OverlayDrawer { calendarCheckChanged(collectionId, checked) } } - leadingPadding: Kirigami.Settings.isMobile ? Kirigami.Units.largeSpacing * 2 : Kirigami.Units.largeSpacing onClicked: { calendarClicked(collectionId) -- GitLab