Replace HStyle singleton by global Theme in Window

This commit is contained in:
miruka 2019-07-06 17:50:55 -04:00
parent 6db870a372
commit d83508742c
30 changed files with 71 additions and 71 deletions

View File

@ -5,7 +5,7 @@ import "../utils.js" as Utils
Rectangle { Rectangle {
property var name: null property var name: null
property var imageUrl: null property var imageUrl: null
property int dimension: HStyle.avatar.size property int dimension: theme.avatar.size
property bool hidden: false property bool hidden: false
width: dimension width: dimension
@ -15,7 +15,7 @@ Rectangle {
opacity: hidden ? 0 : 1 opacity: hidden ? 0 : 1
color: name ? Utils.avatarColor(name) : HStyle.avatar.background.unknown color: name ? Utils.avatarColor(name) : theme.avatar.background.unknown
HLabel { HLabel {
z: 1 z: 1
@ -23,7 +23,7 @@ Rectangle {
visible: ! hidden visible: ! hidden
text: name ? name.charAt(0) : "?" text: name ? name.charAt(0) : "?"
color: HStyle.avatar.letter color: theme.avatar.letter
font.pixelSize: parent.height / 1.4 font.pixelSize: parent.height / 1.4
} }

View File

@ -11,8 +11,8 @@ Button {
property var iconTransform: null property var iconTransform: null
property bool circle: false property bool circle: false
property int fontSize: HStyle.fontSize.normal property int fontSize: theme.fontSize.normal
property color backgroundColor: HStyle.controls.button.background property color backgroundColor: theme.controls.button.background
property alias overlayOpacity: buttonBackgroundOverlay.opacity property alias overlayOpacity: buttonBackgroundOverlay.opacity
property bool checkedLightens: false property bool checkedLightens: false
@ -42,7 +42,7 @@ Button {
radius: circle ? height : 0 radius: circle ? height : 0
Behavior on color { Behavior on color {
ColorAnimation { duration: HStyle.animationDuration / 2 } ColorAnimation { duration: theme.animationDuration / 2 }
} }
Rectangle { Rectangle {
@ -53,7 +53,7 @@ Button {
opacity: 0 opacity: 0
Behavior on opacity { Behavior on opacity {
HNumberAnimation { duration: HStyle.animationDuration / 2 } HNumberAnimation { duration: theme.animationDuration / 2 }
} }
} }
} }

View File

@ -28,7 +28,7 @@ HScalingBox {
HLabel { HLabel {
id: interfaceTitle id: interfaceTitle
font.pixelSize: HStyle.fontSize.big font.pixelSize: theme.fontSize.big
} }
} }
@ -52,7 +52,7 @@ HScalingBox {
onClicked: buttonCallbacks[modelData.name](button) onClicked: buttonCallbacks[modelData.name](button)
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: HStyle.avatar.size Layout.preferredHeight: theme.avatar.size
} }
} }
} }

View File

@ -1,11 +1,11 @@
import QtQuick.Controls 2.2 import QtQuick.Controls 2.2
Label { Label {
font.family: HStyle.fontFamily.sans font.family: theme.fontFamily.sans
font.pixelSize: HStyle.fontSize.normal font.pixelSize: theme.fontSize.normal
textFormat: Label.PlainText textFormat: Label.PlainText
color: HStyle.colors.foreground color: theme.colors.foreground
style: Label.Outline style: Label.Outline
styleColor: HStyle.colors.textBorder styleColor: theme.colors.textBorder
} }

View File

@ -27,8 +27,8 @@ HRowLayout {
background: Rectangle { background: Rectangle {
id: noticeLabelBackground id: noticeLabelBackground
color: HStyle.box.background color: theme.box.background
radius: HStyle.box.radius radius: theme.box.radius
} }
} }
} }

View File

@ -1,5 +1,5 @@
import QtQuick 2.7 import QtQuick 2.7
NumberAnimation { NumberAnimation {
duration: HStyle.animationDuration duration: theme.animationDuration
} }

View File

@ -2,5 +2,5 @@ import QtQuick 2.7
Rectangle { Rectangle {
id: rectangle id: rectangle
color: HStyle.sidePane.background color: theme.sidePane.background
} }

View File

@ -8,7 +8,7 @@ HRectangle {
readonly property int baseWidth: baseHeight * widthForHeight readonly property int baseWidth: baseHeight * widthForHeight
readonly property int margins: baseHeight * 0.03 readonly property int margins: baseHeight * 0.03
color: HStyle.box.background color: theme.box.background
height: Math.min(parent.height, baseHeight) height: Math.min(parent.height, baseHeight)
width: Math.min(parent.width, baseWidth) width: Math.min(parent.width, baseWidth)
scale: Math.max(1, parent.height / startScalingUpAboveHeight) scale: Math.max(1, parent.height / startScalingUpAboveHeight)

View File

@ -18,13 +18,13 @@ ScrollView {
selectByMouse: true selectByMouse: true
wrapMode: TextEdit.Wrap wrapMode: TextEdit.Wrap
font.family: HStyle.fontFamily.sans font.family: theme.fontFamily.sans
font.pixelSize: HStyle.fontSize.normal font.pixelSize: theme.fontSize.normal
color: HStyle.colors.foreground color: theme.colors.foreground
background: Rectangle { background: Rectangle {
id: textAreaBackground id: textAreaBackground
color: HStyle.controls.textArea.background color: theme.controls.textArea.background
} }
} }
} }

View File

@ -4,13 +4,13 @@ import QtQuick.Controls 2.2
TextField { TextField {
property alias backgroundColor: textFieldBackground.color property alias backgroundColor: textFieldBackground.color
font.family: HStyle.fontFamily.sans font.family: theme.fontFamily.sans
font.pixelSize: HStyle.fontSize.normal font.pixelSize: theme.fontSize.normal
color: HStyle.colors.foreground color: theme.colors.foreground
background: Rectangle { background: Rectangle {
id: textFieldBackground id: textFieldBackground
color: HStyle.controls.textField.background color: theme.controls.textField.background
} }
selectByMouse: true selectByMouse: true

View File

@ -1 +0,0 @@
singleton HStyle 1.0 HStyle.qml

View File

@ -5,7 +5,7 @@ import "../../Base"
HRectangle { HRectangle {
id: banner id: banner
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: HStyle.bottomElementsHeight Layout.preferredHeight: theme.bottomElementsHeight
property alias avatar: bannerAvatar property alias avatar: bannerAvatar
property alias icon: bannerIcon property alias icon: bannerIcon

View File

@ -8,7 +8,7 @@ Banner {
readonly property var inviterInfo: readonly property var inviterInfo:
inviterId ? users.getUser(inviterId) : null inviterId ? users.getUser(inviterId) : null
color: HStyle.chat.inviteBanner.background color: theme.chat.inviteBanner.background
avatar.name: inviterId ? inviterInfo.displayName : "" avatar.name: inviterId ? inviterInfo.displayName : ""
avatar.imageUrl: inviterId ? inviterInfo.avatarUrl : "" avatar.imageUrl: inviterId ? inviterInfo.avatarUrl : ""

View File

@ -5,7 +5,7 @@ import "../utils.js" as ChatJS
Banner { Banner {
property var leftEvent: null property var leftEvent: null
color: HStyle.chat.leftBanner.background color: theme.chat.leftBanner.background
avatar.name: ChatJS.getLeftBannerAvatarName(leftEvent, chatPage.userId) avatar.name: ChatJS.getLeftBannerAvatarName(leftEvent, chatPage.userId)
labelText: ChatJS.getLeftBannerText(leftEvent) labelText: ChatJS.getLeftBannerText(leftEvent)

View File

@ -3,7 +3,7 @@ import "../../Base"
import "../utils.js" as ChatJS import "../utils.js" as ChatJS
Banner { Banner {
color: HStyle.chat.unknownDevices.background color: theme.chat.unknownDevices.background
avatar.visible: false avatar.visible: false
icon.svgName: "unknown_devices_warning" icon.svgName: "unknown_devices_warning"

View File

@ -38,7 +38,7 @@ HColumnLayout {
topic: roomInfo.topic topic: roomInfo.topic
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: HStyle.avatar.size Layout.preferredHeight: theme.avatar.size
} }
@ -109,11 +109,11 @@ HColumnLayout {
//to: target.oldWidth //to: target.oldWidth
//onStopped: target.Layout.minimumWidth = Qt.binding( //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 bool wasSnapped: false
//property int referenceWidth: roomHeader.buttonsWidth //property int referenceWidth: roomHeader.buttonsWidth
@ -142,7 +142,7 @@ HColumnLayout {
//} //}
//width: referenceWidth // Initial width //width: referenceWidth // Initial width
//Layout.minimumWidth: HStyle.avatar.size //Layout.minimumWidth: theme.avatar.size
//Layout.maximumWidth: parent.width //Layout.maximumWidth: parent.width
//} //}
} }

View File

@ -14,7 +14,7 @@ HRectangle {
property bool collapseButtons: width < 400 property bool collapseButtons: width < 400
id: roomHeader id: roomHeader
color: HStyle.chat.roomHeader.background color: theme.chat.roomHeader.background
HRowLayout { HRowLayout {
id: row id: row
@ -31,7 +31,7 @@ HRectangle {
HLabel { HLabel {
id: roomName id: roomName
text: displayName text: displayName
font.pixelSize: HStyle.fontSize.big font.pixelSize: theme.fontSize.big
elide: Text.ElideRight elide: Text.ElideRight
maximumLineCount: 1 maximumLineCount: 1
@ -46,7 +46,7 @@ HRectangle {
HLabel { HLabel {
id: roomTopic id: roomTopic
text: topic text: topic
font.pixelSize: HStyle.fontSize.small font.pixelSize: theme.fontSize.small
elide: Text.ElideRight elide: Text.ElideRight
maximumLineCount: 1 maximumLineCount: 1

View File

@ -28,7 +28,7 @@ HColumnLayout {
HTextField { HTextField {
id: filterField id: filterField
placeholderText: qsTr("Filter members") 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 // 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. // comes back, the field will be empty but the filter still applied.
@ -42,6 +42,6 @@ HColumnLayout {
) )
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: HStyle.bottomElementsHeight Layout.preferredHeight: theme.bottomElementsHeight
} }
} }

View File

@ -8,11 +8,11 @@ HRectangle {
id: root id: root
Layout.fillWidth: true Layout.fillWidth: true
Layout.minimumHeight: HStyle.bottomElementsHeight Layout.minimumHeight: theme.bottomElementsHeight
Layout.preferredHeight: textArea.implicitHeight Layout.preferredHeight: textArea.implicitHeight
// parent.height / 2 causes binding loop? // parent.height / 2 causes binding loop?
Layout.maximumHeight: pageStack.height / 2 Layout.maximumHeight: pageStack.height / 2
color: HStyle.chat.sendBox.background color: theme.chat.sendBox.background
HRowLayout { HRowLayout {
anchors.fill: parent anchors.fill: parent

View File

@ -3,7 +3,7 @@ import "../../Base"
HNoticePage { HNoticePage {
text: model.date.toLocaleDateString() text: model.date.toLocaleDateString()
color: HStyle.chat.daybreak.foreground color: theme.chat.daybreak.foreground
backgroundColor: HStyle.chat.daybreak.background backgroundColor: theme.chat.daybreak.background
radius: HStyle.chat.daybreak.radius radius: theme.chat.daybreak.radius
} }

View File

@ -18,13 +18,13 @@ Row {
Rectangle { Rectangle {
color: isOwn? color: isOwn?
HStyle.chat.message.ownBackground : theme.chat.message.ownBackground :
HStyle.chat.message.background theme.chat.message.background
//width: nameLabel.implicitWidth //width: nameLabel.implicitWidth
width: Math.min( width: Math.min(
roomEventListView.width - avatar.width - messageContent.spacing, 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( Math.max(
nameLabel.visible ? nameLabel.implicitWidth : 0, nameLabel.visible ? nameLabel.implicitWidth : 0,
contentLabel.implicitWidth contentLabel.implicitWidth
@ -60,16 +60,16 @@ Row {
id: contentLabel id: contentLabel
text: Utils.translatedEventContent(model) + text: Utils.translatedEventContent(model) +
// time // time
"&nbsp;&nbsp;<font size=" + HStyle.fontSize.small + "&nbsp;&nbsp;<font size=" + theme.fontSize.small +
"px color=" + HStyle.chat.message.date + ">" + "px color=" + theme.chat.message.date + ">" +
Qt.formatDateTime(model.date, "hh:mm:ss") + Qt.formatDateTime(model.date, "hh:mm:ss") +
"</font>" + "</font>" +
// local echo icon // local echo icon
(model.isLocalEcho ? (model.isLocalEcho ?
"&nbsp;<font size=" + HStyle.fontSize.small + "&nbsp;<font size=" + theme.fontSize.small +
"px>⏳</font>" : "") "px>⏳</font>" : "")
color: HStyle.chat.message.body color: theme.chat.message.body
wrapMode: Text.Wrap wrapMode: Text.Wrap
leftPadding: horizontalPadding leftPadding: horizontalPadding

View File

@ -7,7 +7,7 @@ HRectangle {
property int space: 8 property int space: 8
color: HStyle.chat.roomEventList.background color: theme.chat.roomEventList.background
HListView { HListView {
id: roomEventListView id: roomEventListView

View File

@ -5,7 +5,7 @@ import "../Base"
HRectangle { HRectangle {
property alias label: typingLabel property alias label: typingLabel
color: HStyle.chat.typingMembers.background color: theme.chat.typingMembers.background
implicitWidth: childrenRect.width implicitWidth: childrenRect.width
implicitHeight: typingLabel.text ? childrenRect.height : 0 implicitHeight: typingLabel.text ? childrenRect.height : 0

View File

@ -42,7 +42,7 @@ Column {
id: statusEdit id: statusEdit
text: user.statusMessage text: user.statusMessage
placeholderText: qsTr("Set status message") placeholderText: qsTr("Set status message")
font.pixelSize: HStyle.fontSize.small font.pixelSize: theme.fontSize.small
background: null background: null
padding: 0 padding: 0

View File

@ -7,18 +7,18 @@ HRowLayout {
property alias roomFilter: filterField.text property alias roomFilter: filterField.text
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: HStyle.bottomElementsHeight Layout.preferredHeight: theme.bottomElementsHeight
HButton { HButton {
iconName: "settings" iconName: "settings"
backgroundColor: HStyle.sidePane.settingsButton.background backgroundColor: theme.sidePane.settingsButton.background
Layout.preferredHeight: parent.height Layout.preferredHeight: parent.height
} }
HTextField { HTextField {
id: filterField id: filterField
placeholderText: qsTr("Filter rooms") placeholderText: qsTr("Filter rooms")
backgroundColor: HStyle.sidePane.filterRooms.background backgroundColor: theme.sidePane.filterRooms.background
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: parent.height Layout.preferredHeight: parent.height

View File

@ -58,7 +58,7 @@ MouseArea {
visible: Boolean(text) visible: Boolean(text)
textFormat: Text.StyledText textFormat: Text.StyledText
font.pixelSize: HStyle.fontSize.small font.pixelSize: theme.fontSize.small
elide: Text.ElideRight elide: Text.ElideRight
maximumLineCount: 1 maximumLineCount: 1

View File

@ -1,8 +1,7 @@
pragma Singleton
import QtQuick 2.7 import QtQuick 2.7
QtObject { QtObject {
id: style id: theme
property int animationDuration: 100 property int animationDuration: 100
@ -82,7 +81,7 @@ QtObject {
readonly property QtObject daybreak: QtObject { readonly property QtObject daybreak: QtObject {
property color background: colors.background1 property color background: colors.background1
property color foreground: colors.foreground property color foreground: colors.foreground
property int radius: style.radius property int radius: theme.radius
} }
readonly property QtObject inviteBanner: QtObject { readonly property QtObject inviteBanner: QtObject {
@ -108,12 +107,12 @@ QtObject {
readonly property QtObject box: QtObject { readonly property QtObject box: QtObject {
property color background: colors.background0 property color background: colors.background0
property int radius: style.radius property int radius: theme.radius
} }
readonly property QtObject avatar: QtObject { readonly property QtObject avatar: QtObject {
property int size: 36 property int size: 36
property int radius: style.radius property int radius: theme.radius
property color letter: "white" property color letter: "white"
readonly property QtObject background: QtObject { readonly property QtObject background: QtObject {

View File

@ -48,7 +48,7 @@ Item {
onParentWidthChanged: if (uiSplitView.canAutoSize) { set_width() } onParentWidthChanged: if (uiSplitView.canAutoSize) { set_width() }
width: set_width() // Initial width width: set_width() // Initial width
Layout.minimumWidth: HStyle.avatar.size Layout.minimumWidth: theme.avatar.size
Layout.maximumWidth: parent.width Layout.maximumWidth: parent.width
Behavior on width { Behavior on width {
@ -57,7 +57,7 @@ Item {
duration: duration:
(uiSplitView.canAutoSize && (uiSplitView.canAutoSize &&
parent.width * 0.3 < sidePane.collapseBelow * 1.2) ? parent.width * 0.3 < sidePane.collapseBelow * 1.2) ?
HStyle.animationDuration : 0 theme.animationDuration : 0
} }
} }
} }

View File

@ -21,6 +21,8 @@ ApplicationWindow {
window.ready = true window.ready = true
} }
Theme { id: theme }
Python { id: py } Python { id: py }
Accounts { id: accounts } Accounts { id: accounts }

View File

@ -37,9 +37,9 @@ function hueFrom(string) {
function avatarColor(name) { function avatarColor(name) {
return Qt.hsla( return Qt.hsla(
hueFrom(name), hueFrom(name),
HStyle.avatar.background.saturation, theme.avatar.background.saturation,
HStyle.avatar.background.lightness, theme.avatar.background.lightness,
HStyle.avatar.background.alpha theme.avatar.background.alpha
) )
} }
@ -47,8 +47,8 @@ function avatarColor(name) {
function nameColor(name) { function nameColor(name) {
return Qt.hsla( return Qt.hsla(
hueFrom(name), hueFrom(name),
HStyle.displayName.saturation, theme.displayName.saturation,
HStyle.displayName.lightness, theme.displayName.lightness,
1 1
) )
} }