diff --git a/src/qml/Base/HAvatar.qml b/src/qml/Base/HAvatar.qml index 1ede68cc..e35f6000 100644 --- a/src/qml/Base/HAvatar.qml +++ b/src/qml/Base/HAvatar.qml @@ -5,7 +5,7 @@ import "../utils.js" as Utils Rectangle { property var name: null property var imageUrl: null - property int dimension: HStyle.avatar.size + property int dimension: theme.avatar.size property bool hidden: false width: dimension @@ -15,7 +15,7 @@ Rectangle { opacity: hidden ? 0 : 1 - color: name ? Utils.avatarColor(name) : HStyle.avatar.background.unknown + color: name ? Utils.avatarColor(name) : theme.avatar.background.unknown HLabel { z: 1 @@ -23,7 +23,7 @@ Rectangle { visible: ! hidden text: name ? name.charAt(0) : "?" - color: HStyle.avatar.letter + color: theme.avatar.letter font.pixelSize: parent.height / 1.4 } diff --git a/src/qml/Base/HButton.qml b/src/qml/Base/HButton.qml index 617fc0c6..34e3d32b 100644 --- a/src/qml/Base/HButton.qml +++ b/src/qml/Base/HButton.qml @@ -11,8 +11,8 @@ Button { property var iconTransform: null property bool circle: false - property int fontSize: HStyle.fontSize.normal - property color backgroundColor: HStyle.controls.button.background + property int fontSize: theme.fontSize.normal + property color backgroundColor: theme.controls.button.background property alias overlayOpacity: buttonBackgroundOverlay.opacity property bool checkedLightens: false @@ -42,7 +42,7 @@ Button { radius: circle ? height : 0 Behavior on color { - ColorAnimation { duration: HStyle.animationDuration / 2 } + ColorAnimation { duration: theme.animationDuration / 2 } } Rectangle { @@ -53,7 +53,7 @@ Button { opacity: 0 Behavior on opacity { - HNumberAnimation { duration: HStyle.animationDuration / 2 } + HNumberAnimation { duration: theme.animationDuration / 2 } } } } diff --git a/src/qml/Base/HInterfaceBox.qml b/src/qml/Base/HInterfaceBox.qml index b282c65d..f6e71f30 100644 --- a/src/qml/Base/HInterfaceBox.qml +++ b/src/qml/Base/HInterfaceBox.qml @@ -28,7 +28,7 @@ HScalingBox { HLabel { id: interfaceTitle - font.pixelSize: HStyle.fontSize.big + font.pixelSize: theme.fontSize.big } } @@ -52,7 +52,7 @@ HScalingBox { onClicked: buttonCallbacks[modelData.name](button) Layout.fillWidth: true - Layout.preferredHeight: HStyle.avatar.size + Layout.preferredHeight: theme.avatar.size } } } diff --git a/src/qml/Base/HLabel.qml b/src/qml/Base/HLabel.qml index a264ad24..c460a119 100644 --- a/src/qml/Base/HLabel.qml +++ b/src/qml/Base/HLabel.qml @@ -1,11 +1,11 @@ import QtQuick.Controls 2.2 Label { - font.family: HStyle.fontFamily.sans - font.pixelSize: HStyle.fontSize.normal + font.family: theme.fontFamily.sans + font.pixelSize: theme.fontSize.normal textFormat: Label.PlainText - color: HStyle.colors.foreground + color: theme.colors.foreground style: Label.Outline - styleColor: HStyle.colors.textBorder + styleColor: theme.colors.textBorder } diff --git a/src/qml/Base/HNoticePage.qml b/src/qml/Base/HNoticePage.qml index 0cde9191..6de7544d 100644 --- a/src/qml/Base/HNoticePage.qml +++ b/src/qml/Base/HNoticePage.qml @@ -27,8 +27,8 @@ HRowLayout { background: Rectangle { id: noticeLabelBackground - color: HStyle.box.background - radius: HStyle.box.radius + color: theme.box.background + radius: theme.box.radius } } } diff --git a/src/qml/Base/HNumberAnimation.qml b/src/qml/Base/HNumberAnimation.qml index f741cb9d..90b01bc8 100644 --- a/src/qml/Base/HNumberAnimation.qml +++ b/src/qml/Base/HNumberAnimation.qml @@ -1,5 +1,5 @@ import QtQuick 2.7 NumberAnimation { - duration: HStyle.animationDuration + duration: theme.animationDuration } diff --git a/src/qml/Base/HRectangle.qml b/src/qml/Base/HRectangle.qml index 9cd18189..ccf58ce8 100644 --- a/src/qml/Base/HRectangle.qml +++ b/src/qml/Base/HRectangle.qml @@ -2,5 +2,5 @@ import QtQuick 2.7 Rectangle { id: rectangle - color: HStyle.sidePane.background + color: theme.sidePane.background } diff --git a/src/qml/Base/HScalingBox.qml b/src/qml/Base/HScalingBox.qml index f1eb3b9a..ef23fe90 100644 --- a/src/qml/Base/HScalingBox.qml +++ b/src/qml/Base/HScalingBox.qml @@ -8,7 +8,7 @@ HRectangle { readonly property int baseWidth: baseHeight * widthForHeight readonly property int margins: baseHeight * 0.03 - color: HStyle.box.background + color: theme.box.background height: Math.min(parent.height, baseHeight) width: Math.min(parent.width, baseWidth) scale: Math.max(1, parent.height / startScalingUpAboveHeight) diff --git a/src/qml/Base/HScrollableTextArea.qml b/src/qml/Base/HScrollableTextArea.qml index 94d317de..fe9e05de 100644 --- a/src/qml/Base/HScrollableTextArea.qml +++ b/src/qml/Base/HScrollableTextArea.qml @@ -18,13 +18,13 @@ ScrollView { selectByMouse: true wrapMode: TextEdit.Wrap - font.family: HStyle.fontFamily.sans - font.pixelSize: HStyle.fontSize.normal + font.family: theme.fontFamily.sans + font.pixelSize: theme.fontSize.normal - color: HStyle.colors.foreground + color: theme.colors.foreground background: Rectangle { id: textAreaBackground - color: HStyle.controls.textArea.background + color: theme.controls.textArea.background } } } diff --git a/src/qml/Base/HTextField.qml b/src/qml/Base/HTextField.qml index 238a9bfc..9904314d 100644 --- a/src/qml/Base/HTextField.qml +++ b/src/qml/Base/HTextField.qml @@ -4,13 +4,13 @@ import QtQuick.Controls 2.2 TextField { property alias backgroundColor: textFieldBackground.color - font.family: HStyle.fontFamily.sans - font.pixelSize: HStyle.fontSize.normal + font.family: theme.fontFamily.sans + font.pixelSize: theme.fontSize.normal - color: HStyle.colors.foreground + color: theme.colors.foreground background: Rectangle { id: textFieldBackground - color: HStyle.controls.textField.background + color: theme.controls.textField.background } selectByMouse: true diff --git a/src/qml/Base/qmldir b/src/qml/Base/qmldir deleted file mode 100644 index 2c618068..00000000 --- a/src/qml/Base/qmldir +++ /dev/null @@ -1 +0,0 @@ -singleton HStyle 1.0 HStyle.qml diff --git a/src/qml/Chat/Banners/Banner.qml b/src/qml/Chat/Banners/Banner.qml index ddfd33f6..4014f3c6 100644 --- a/src/qml/Chat/Banners/Banner.qml +++ b/src/qml/Chat/Banners/Banner.qml @@ -5,7 +5,7 @@ import "../../Base" HRectangle { id: banner Layout.fillWidth: true - Layout.preferredHeight: HStyle.bottomElementsHeight + Layout.preferredHeight: theme.bottomElementsHeight property alias avatar: bannerAvatar property alias icon: bannerIcon diff --git a/src/qml/Chat/Banners/InviteBanner.qml b/src/qml/Chat/Banners/InviteBanner.qml index 48426563..3e14c389 100644 --- a/src/qml/Chat/Banners/InviteBanner.qml +++ b/src/qml/Chat/Banners/InviteBanner.qml @@ -8,7 +8,7 @@ Banner { readonly property var inviterInfo: inviterId ? users.getUser(inviterId) : null - color: HStyle.chat.inviteBanner.background + color: theme.chat.inviteBanner.background avatar.name: inviterId ? inviterInfo.displayName : "" avatar.imageUrl: inviterId ? inviterInfo.avatarUrl : "" diff --git a/src/qml/Chat/Banners/LeftBanner.qml b/src/qml/Chat/Banners/LeftBanner.qml index 1c5be78b..7f4a0ff8 100644 --- a/src/qml/Chat/Banners/LeftBanner.qml +++ b/src/qml/Chat/Banners/LeftBanner.qml @@ -5,7 +5,7 @@ import "../utils.js" as ChatJS Banner { property var leftEvent: null - color: HStyle.chat.leftBanner.background + color: theme.chat.leftBanner.background avatar.name: ChatJS.getLeftBannerAvatarName(leftEvent, chatPage.userId) labelText: ChatJS.getLeftBannerText(leftEvent) diff --git a/src/qml/Chat/Banners/UnknownDevicesBanner.qml b/src/qml/Chat/Banners/UnknownDevicesBanner.qml index fdb8a677..700cef23 100644 --- a/src/qml/Chat/Banners/UnknownDevicesBanner.qml +++ b/src/qml/Chat/Banners/UnknownDevicesBanner.qml @@ -3,7 +3,7 @@ import "../../Base" import "../utils.js" as ChatJS Banner { - color: HStyle.chat.unknownDevices.background + color: theme.chat.unknownDevices.background avatar.visible: false icon.svgName: "unknown_devices_warning" diff --git a/src/qml/Chat/Chat.qml b/src/qml/Chat/Chat.qml index 699a15e1..7776f421 100644 --- a/src/qml/Chat/Chat.qml +++ b/src/qml/Chat/Chat.qml @@ -38,7 +38,7 @@ HColumnLayout { topic: roomInfo.topic Layout.fillWidth: true - Layout.preferredHeight: HStyle.avatar.size + Layout.preferredHeight: theme.avatar.size } @@ -109,11 +109,11 @@ HColumnLayout { //to: target.oldWidth //onStopped: target.Layout.minimumWidth = Qt.binding( - //function() { return HStyle.avatar.size } + //function() { return theme.avatar.size } //) //} - //collapsed: width < HStyle.avatar.size + 8 + //collapsed: width < theme.avatar.size + 8 //property bool wasSnapped: false //property int referenceWidth: roomHeader.buttonsWidth @@ -142,7 +142,7 @@ HColumnLayout { //} //width: referenceWidth // Initial width - //Layout.minimumWidth: HStyle.avatar.size + //Layout.minimumWidth: theme.avatar.size //Layout.maximumWidth: parent.width //} } diff --git a/src/qml/Chat/RoomHeader.qml b/src/qml/Chat/RoomHeader.qml index bd921d51..372022fa 100644 --- a/src/qml/Chat/RoomHeader.qml +++ b/src/qml/Chat/RoomHeader.qml @@ -14,7 +14,7 @@ HRectangle { property bool collapseButtons: width < 400 id: roomHeader - color: HStyle.chat.roomHeader.background + color: theme.chat.roomHeader.background HRowLayout { id: row @@ -31,7 +31,7 @@ HRectangle { HLabel { id: roomName text: displayName - font.pixelSize: HStyle.fontSize.big + font.pixelSize: theme.fontSize.big elide: Text.ElideRight maximumLineCount: 1 @@ -46,7 +46,7 @@ HRectangle { HLabel { id: roomTopic text: topic - font.pixelSize: HStyle.fontSize.small + font.pixelSize: theme.fontSize.small elide: Text.ElideRight maximumLineCount: 1 diff --git a/src/qml/Chat/RoomSidePane/MembersView.qml b/src/qml/Chat/RoomSidePane/MembersView.qml index 759649bf..c54a0253 100644 --- a/src/qml/Chat/RoomSidePane/MembersView.qml +++ b/src/qml/Chat/RoomSidePane/MembersView.qml @@ -28,7 +28,7 @@ HColumnLayout { HTextField { id: filterField placeholderText: qsTr("Filter members") - backgroundColor: HStyle.sidePane.filterRooms.background + backgroundColor: theme.sidePane.filterRooms.background // Without this, if the user types in the field, changes of room, then // comes back, the field will be empty but the filter still applied. @@ -42,6 +42,6 @@ HColumnLayout { ) Layout.fillWidth: true - Layout.preferredHeight: HStyle.bottomElementsHeight + Layout.preferredHeight: theme.bottomElementsHeight } } diff --git a/src/qml/Chat/SendBox.qml b/src/qml/Chat/SendBox.qml index 958ec90d..757cdcfb 100644 --- a/src/qml/Chat/SendBox.qml +++ b/src/qml/Chat/SendBox.qml @@ -8,11 +8,11 @@ HRectangle { id: root Layout.fillWidth: true - Layout.minimumHeight: HStyle.bottomElementsHeight + Layout.minimumHeight: theme.bottomElementsHeight Layout.preferredHeight: textArea.implicitHeight // parent.height / 2 causes binding loop? Layout.maximumHeight: pageStack.height / 2 - color: HStyle.chat.sendBox.background + color: theme.chat.sendBox.background HRowLayout { anchors.fill: parent diff --git a/src/qml/Chat/Timeline/Daybreak.qml b/src/qml/Chat/Timeline/Daybreak.qml index 71319dbd..bab00e56 100644 --- a/src/qml/Chat/Timeline/Daybreak.qml +++ b/src/qml/Chat/Timeline/Daybreak.qml @@ -3,7 +3,7 @@ import "../../Base" HNoticePage { text: model.date.toLocaleDateString() - color: HStyle.chat.daybreak.foreground - backgroundColor: HStyle.chat.daybreak.background - radius: HStyle.chat.daybreak.radius + color: theme.chat.daybreak.foreground + backgroundColor: theme.chat.daybreak.background + radius: theme.chat.daybreak.radius } diff --git a/src/qml/Chat/Timeline/EventContent.qml b/src/qml/Chat/Timeline/EventContent.qml index 209c2755..cbc84be3 100644 --- a/src/qml/Chat/Timeline/EventContent.qml +++ b/src/qml/Chat/Timeline/EventContent.qml @@ -18,13 +18,13 @@ Row { Rectangle { color: isOwn? - HStyle.chat.message.ownBackground : - HStyle.chat.message.background + theme.chat.message.ownBackground : + theme.chat.message.background //width: nameLabel.implicitWidth width: Math.min( roomEventListView.width - avatar.width - messageContent.spacing, - HStyle.fontSize.normal * 0.5 * 75, // 600 with 16px font + theme.fontSize.normal * 0.5 * 75, // 600 with 16px font Math.max( nameLabel.visible ? nameLabel.implicitWidth : 0, contentLabel.implicitWidth @@ -60,16 +60,16 @@ Row { id: contentLabel text: Utils.translatedEventContent(model) + // time - "  " + + "  " + Qt.formatDateTime(model.date, "hh:mm:ss") + "" + // local echo icon (model.isLocalEcho ? - " " : "") - color: HStyle.chat.message.body + color: theme.chat.message.body wrapMode: Text.Wrap leftPadding: horizontalPadding diff --git a/src/qml/Chat/Timeline/EventList.qml b/src/qml/Chat/Timeline/EventList.qml index 66816d88..8af24e92 100644 --- a/src/qml/Chat/Timeline/EventList.qml +++ b/src/qml/Chat/Timeline/EventList.qml @@ -7,7 +7,7 @@ HRectangle { property int space: 8 - color: HStyle.chat.roomEventList.background + color: theme.chat.roomEventList.background HListView { id: roomEventListView diff --git a/src/qml/Chat/TypingMembersBar.qml b/src/qml/Chat/TypingMembersBar.qml index 7a120213..36325e2a 100644 --- a/src/qml/Chat/TypingMembersBar.qml +++ b/src/qml/Chat/TypingMembersBar.qml @@ -5,7 +5,7 @@ import "../Base" HRectangle { property alias label: typingLabel - color: HStyle.chat.typingMembers.background + color: theme.chat.typingMembers.background implicitWidth: childrenRect.width implicitHeight: typingLabel.text ? childrenRect.height : 0 diff --git a/src/qml/SidePane/AccountDelegate.qml b/src/qml/SidePane/AccountDelegate.qml index d141c6cb..0568842e 100644 --- a/src/qml/SidePane/AccountDelegate.qml +++ b/src/qml/SidePane/AccountDelegate.qml @@ -42,7 +42,7 @@ Column { id: statusEdit text: user.statusMessage placeholderText: qsTr("Set status message") - font.pixelSize: HStyle.fontSize.small + font.pixelSize: theme.fontSize.small background: null padding: 0 diff --git a/src/qml/SidePane/PaneToolBar.qml b/src/qml/SidePane/PaneToolBar.qml index d807b09c..22f9ac18 100644 --- a/src/qml/SidePane/PaneToolBar.qml +++ b/src/qml/SidePane/PaneToolBar.qml @@ -7,18 +7,18 @@ HRowLayout { property alias roomFilter: filterField.text Layout.fillWidth: true - Layout.preferredHeight: HStyle.bottomElementsHeight + Layout.preferredHeight: theme.bottomElementsHeight HButton { iconName: "settings" - backgroundColor: HStyle.sidePane.settingsButton.background + backgroundColor: theme.sidePane.settingsButton.background Layout.preferredHeight: parent.height } HTextField { id: filterField placeholderText: qsTr("Filter rooms") - backgroundColor: HStyle.sidePane.filterRooms.background + backgroundColor: theme.sidePane.filterRooms.background Layout.fillWidth: true Layout.preferredHeight: parent.height diff --git a/src/qml/SidePane/RoomDelegate.qml b/src/qml/SidePane/RoomDelegate.qml index 5f67459c..bbf1665c 100644 --- a/src/qml/SidePane/RoomDelegate.qml +++ b/src/qml/SidePane/RoomDelegate.qml @@ -58,7 +58,7 @@ MouseArea { visible: Boolean(text) textFormat: Text.StyledText - font.pixelSize: HStyle.fontSize.small + font.pixelSize: theme.fontSize.small elide: Text.ElideRight maximumLineCount: 1 diff --git a/src/qml/Base/HStyle.qml b/src/qml/Theme.qml similarity index 96% rename from src/qml/Base/HStyle.qml rename to src/qml/Theme.qml index 2ed31e99..046030e2 100644 --- a/src/qml/Base/HStyle.qml +++ b/src/qml/Theme.qml @@ -1,8 +1,7 @@ -pragma Singleton import QtQuick 2.7 QtObject { - id: style + id: theme property int animationDuration: 100 @@ -82,7 +81,7 @@ QtObject { readonly property QtObject daybreak: QtObject { property color background: colors.background1 property color foreground: colors.foreground - property int radius: style.radius + property int radius: theme.radius } readonly property QtObject inviteBanner: QtObject { @@ -108,12 +107,12 @@ QtObject { readonly property QtObject box: QtObject { property color background: colors.background0 - property int radius: style.radius + property int radius: theme.radius } readonly property QtObject avatar: QtObject { property int size: 36 - property int radius: style.radius + property int radius: theme.radius property color letter: "white" readonly property QtObject background: QtObject { diff --git a/src/qml/UI.qml b/src/qml/UI.qml index 9c783741..f177dc39 100644 --- a/src/qml/UI.qml +++ b/src/qml/UI.qml @@ -48,7 +48,7 @@ Item { onParentWidthChanged: if (uiSplitView.canAutoSize) { set_width() } width: set_width() // Initial width - Layout.minimumWidth: HStyle.avatar.size + Layout.minimumWidth: theme.avatar.size Layout.maximumWidth: parent.width Behavior on width { @@ -57,7 +57,7 @@ Item { duration: (uiSplitView.canAutoSize && parent.width * 0.3 < sidePane.collapseBelow * 1.2) ? - HStyle.animationDuration : 0 + theme.animationDuration : 0 } } } diff --git a/src/qml/Window.qml b/src/qml/Window.qml index 376e2135..d347598f 100644 --- a/src/qml/Window.qml +++ b/src/qml/Window.qml @@ -21,6 +21,8 @@ ApplicationWindow { window.ready = true } + Theme { id: theme } + Python { id: py } Accounts { id: accounts } diff --git a/src/qml/utils.js b/src/qml/utils.js index 8f4b4240..add9365e 100644 --- a/src/qml/utils.js +++ b/src/qml/utils.js @@ -37,9 +37,9 @@ function hueFrom(string) { function avatarColor(name) { return Qt.hsla( hueFrom(name), - HStyle.avatar.background.saturation, - HStyle.avatar.background.lightness, - HStyle.avatar.background.alpha + theme.avatar.background.saturation, + theme.avatar.background.lightness, + theme.avatar.background.alpha ) } @@ -47,8 +47,8 @@ function avatarColor(name) { function nameColor(name) { return Qt.hsla( hueFrom(name), - HStyle.displayName.saturation, - HStyle.displayName.lightness, + theme.displayName.saturation, + theme.displayName.lightness, 1 ) }