diff --git a/src/gui/Base/HUserAvatar.qml b/src/gui/Base/HUserAvatar.qml
index 768d0ba3..82a6bc6a 100644
--- a/src/gui/Base/HUserAvatar.qml
+++ b/src/gui/Base/HUserAvatar.qml
@@ -35,9 +35,9 @@ HAvatar {
"user-power-50"
colorize:
- invited ? theme.chat.roomPane.member.invitedIcon :
- admin ? theme.chat.roomPane.member.adminIcon :
- theme.chat.roomPane.member.moderatorIcon
+ invited ? theme.chat.roomPane.listView.member.invitedIcon :
+ admin ? theme.chat.roomPane.listView.member.adminIcon :
+ theme.chat.roomPane.listView.member.moderatorIcon
HoverHandler { id: membershipIcon }
diff --git a/src/gui/Base/MultiviewPane.qml b/src/gui/Base/MultiviewPane.qml
index fd37145f..1dedca69 100644
--- a/src/gui/Base/MultiviewPane.qml
+++ b/src/gui/Base/MultiviewPane.qml
@@ -6,32 +6,12 @@ import QtQuick.Layouts 1.12
HDrawer {
id: pane
-
defaultSize: buttonRepeater.summedImplicitWidth
minimumSize:
buttonRepeater.count > 0 ? buttonRepeater.itemAt(0).implicitWidth : 0
- background: HColumnLayout{
- Rectangle {
- color: buttonsBackgroundColor
-
- Layout.fillWidth: true
- Layout.preferredHeight: buttonFlow.height
-
- Behavior on Layout.preferredHeight { HNumberAnimation {} }
- }
-
- Rectangle {
- color: backgroundColor
-
- Layout.fillWidth: true
- Layout.fillHeight: true
- }
- }
-
property color buttonsBackgroundColor
- property color backgroundColor
readonly property alias buttonRepeater: buttonRepeater
readonly property alias swipeView: swipeView
@@ -42,14 +22,20 @@ HDrawer {
HColumnLayout {
anchors.fill: parent
- HFlow {
- id: buttonFlow
- populate: null
+ Rectangle {
+ color: buttonsBackgroundColor
Layout.fillWidth: true
+ Layout.preferredHeight: childrenRect.height
- HRepeater {
- id: buttonRepeater
+ HFlow {
+ id: buttonFlow
+ width: parent.width
+ populate: null
+
+ HRepeater {
+ id: buttonRepeater
+ }
}
}
diff --git a/src/gui/MainPane/Account.qml b/src/gui/MainPane/Account.qml
index da77ffae..299b1439 100644
--- a/src/gui/MainPane/Account.qml
+++ b/src/gui/MainPane/Account.qml
@@ -8,16 +8,16 @@ import "../Base"
HTileDelegate {
id: account
rightPadding: 0
- backgroundColor: theme.mainPane.account.background
+ backgroundColor: theme.mainPane.listView.account.background
opacity: collapsed && ! mainPane.filter ?
- theme.mainPane.account.collapsedOpacity : 1
+ theme.mainPane.listView.account.collapsedOpacity : 1
title.text: model.display_name || model.id
title.font.pixelSize: theme.fontSize.big
title.color:
hovered ?
utils.nameColor(model.display_name || model.id.substring(1)) :
- theme.mainPane.account.name
+ theme.mainPane.listView.account.name
image: HUserAvatar {
userId: model.id
diff --git a/src/gui/MainPane/AccountRoomsDelegate.qml b/src/gui/MainPane/AccountRoomsDelegate.qml
index e8d3d786..6afe1a39 100644
--- a/src/gui/MainPane/AccountRoomsDelegate.qml
+++ b/src/gui/MainPane/AccountRoomsDelegate.qml
@@ -27,7 +27,7 @@ Column {
view: accountRooms.view
opacity: collapsed || noFilterResults ?
- theme.mainPane.account.collapsedOpacity : 1
+ theme.mainPane.listView.account.collapsedOpacity : 1
}
HListView {
diff --git a/src/gui/MainPane/AccountRoomsList.qml b/src/gui/MainPane/AccountRoomsList.qml
index 11f75c59..bc504d34 100644
--- a/src/gui/MainPane/AccountRoomsList.qml
+++ b/src/gui/MainPane/AccountRoomsList.qml
@@ -231,4 +231,10 @@ HListView {
interval: 200
onTriggered: activate()
}
+
+ Rectangle {
+ anchors.fill: parent
+ z: -100
+ color: theme.mainPane.listView.background
+ }
}
diff --git a/src/gui/MainPane/BottomBar.qml b/src/gui/MainPane/BottomBar.qml
index ddae296b..100f7e0a 100644
--- a/src/gui/MainPane/BottomBar.qml
+++ b/src/gui/MainPane/BottomBar.qml
@@ -4,60 +4,67 @@ import QtQuick 2.12
import QtQuick.Layouts 1.12
import "../Base"
-HRowLayout {
+Rectangle {
// Hide filter field overflowing for a sec on size changes
clip: true
+ color: theme.mainPane.bottomBar.background
+
property AccountRoomsList mainPaneList
readonly property alias addAccountButton: addAccountButton
readonly property alias filterField: filterField
property alias roomFilter: filterField.text
- HButton {
- id: addAccountButton
- icon.name: "add-account"
- toolTip.text: qsTr("Add another account")
- backgroundColor: theme.mainPane.settingsButton.background
- onClicked: pageLoader.showPage("AddAccount/AddAccount")
- Layout.fillHeight: true
- }
+ HRowLayout {
+ anchors.fill: parent
- HTextField {
- id: filterField
- saveName: "roomFilterField"
+ HButton {
+ id: addAccountButton
+ icon.name: "add-account"
+ toolTip.text: qsTr("Add another account")
+ backgroundColor: theme.mainPane.bottomBar.settingsButtonBackground
+ onClicked: pageLoader.showPage("AddAccount/AddAccount")
- placeholderText: qsTr("Filter rooms")
- backgroundColor: theme.mainPane.filterRooms.background
- bordered: false
- opacity: width >= 16 * theme.uiScale ? 1 : 0
-
- Layout.fillWidth: true
- Layout.fillHeight: true
-
- Keys.onUpPressed: mainPaneList.previous(false) // do not activate
- Keys.onDownPressed: mainPaneList.next(false)
-
- Keys.onEnterPressed: Keys.onReturnPressed(event)
- Keys.onReturnPressed: {
- if (event.modifiers & Qt.ShiftModifier) {
- mainPaneList.toggleCollapseAccount()
- return
- }
-
- if (window.settings.clearRoomFilterOnEnter) {
- mainPaneList.setCollapseAccount(false)
- text = ""
- }
-
- mainPaneList.requestActivate()
+ Layout.fillHeight: true
}
- Keys.onEscapePressed: {
- if (window.settings.clearRoomFilterOnEscape) text = ""
- mainUI.pageLoader.forceActiveFocus()
- }
+ HTextField {
+ id: filterField
+ saveName: "roomFilterField"
- Behavior on opacity { HNumberAnimation {} }
+ placeholderText: qsTr("Filter rooms")
+ backgroundColor: theme.mainPane.bottomBar.filterFieldBackground
+ bordered: false
+ opacity: width >= 16 * theme.uiScale ? 1 : 0
+
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+
+ Keys.onUpPressed: mainPaneList.previous(false) // do not activate
+ Keys.onDownPressed: mainPaneList.next(false)
+
+ Keys.onEnterPressed: Keys.onReturnPressed(event)
+ Keys.onReturnPressed: {
+ if (event.modifiers & Qt.ShiftModifier) {
+ mainPaneList.toggleCollapseAccount()
+ return
+ }
+
+ if (window.settings.clearRoomFilterOnEnter) {
+ mainPaneList.setCollapseAccount(false)
+ text = ""
+ }
+
+ mainPaneList.requestActivate()
+ }
+
+ Keys.onEscapePressed: {
+ if (window.settings.clearRoomFilterOnEscape) text = ""
+ mainUI.pageLoader.forceActiveFocus()
+ }
+
+ Behavior on opacity { HNumberAnimation {} }
+ }
}
}
diff --git a/src/gui/MainPane/Room.qml b/src/gui/MainPane/Room.qml
index 4689edf6..74619c78 100644
--- a/src/gui/MainPane/Room.qml
+++ b/src/gui/MainPane/Room.qml
@@ -7,8 +7,8 @@ import ".."
import "../Base"
HTileDelegate {
- backgroundColor: theme.mainPane.room.background
- opacity: model.left ? theme.mainPane.room.leftRoomOpacity : 1
+ backgroundColor: theme.mainPane.listView.room.background
+ opacity: model.left ? theme.mainPane.listView.room.leftRoomOpacity : 1
topPadding: theme.spacing / (model.index === 0 ? 1 : 1.5)
bottomPadding: theme.spacing / (model.index === view.count - 1 ? 1 : 1.5)
@@ -21,7 +21,7 @@ HTileDelegate {
mxc: model.avatar_url
}
- title.color: theme.mainPane.room.name
+ title.color: theme.mainPane.listView.room.name
title.text: model.display_name || qsTr("Empty room")
additionalInfo.children: HIcon {
@@ -33,7 +33,7 @@ HTileDelegate {
Behavior on Layout.maximumWidth { HNumberAnimation {} }
}
- subtitle.color: theme.mainPane.room.subtitle
+ subtitle.color: theme.mainPane.listView.room.subtitle
subtitle.textFormat: Text.StyledText
subtitle.font.italic:
lastEvent && lastEvent.event_type === "RoomMessageEmote"
@@ -55,11 +55,12 @@ HTileDelegate {
return text.replace(
/< *span +class=['"]?quote['"]? *>(.+?)<\/ *span *>/g,
- `$1`,
+ `` +
+ `$1`,
)
}
- rightInfo.color: theme.mainPane.room.lastEventDate
+ rightInfo.color: theme.mainPane.listView.room.lastEventDate
rightInfo.text: {
model.last_event_date < new Date(1) ?
"" :
diff --git a/src/gui/MainPane/TopBar.qml b/src/gui/MainPane/TopBar.qml
index b2903ab5..1d90d472 100644
--- a/src/gui/MainPane/TopBar.qml
+++ b/src/gui/MainPane/TopBar.qml
@@ -12,6 +12,7 @@ Rectangle {
anchors.fill: parent
HButton {
+ backgroundColor: "transparent"
icon.name: "placeholder-logo"
icon.color: theme.mainPane.topBar.placeholderLogo
@@ -29,6 +30,7 @@ Rectangle {
}
HButton {
+ backgroundColor: "transparent"
icon.name: "developper-console"
toolTip.text: qsTr("Developper console")
@@ -38,6 +40,7 @@ Rectangle {
}
HButton {
+ backgroundColor: "transparent"
icon.name: "reload-config-files"
toolTip.text: qsTr("Reload config files")
@@ -47,6 +50,7 @@ Rectangle {
}
HButton {
+ backgroundColor: "transparent"
icon.name: "settings"
toolTip.text: qsTr("Open config folder")
diff --git a/src/gui/Pages/Chat/RoomPane/MemberDelegate.qml b/src/gui/Pages/Chat/RoomPane/MemberDelegate.qml
index 19cc9482..3a293d01 100644
--- a/src/gui/Pages/Chat/RoomPane/MemberDelegate.qml
+++ b/src/gui/Pages/Chat/RoomPane/MemberDelegate.qml
@@ -6,9 +6,9 @@ import "../../../Base"
HTileDelegate {
id: memberDelegate
- backgroundColor: theme.chat.roomPane.member.background
+ backgroundColor: theme.chat.roomPane.listView.member.background
contentOpacity:
- model.invited ? theme.chat.roomPane.member.invitedOpacity : 1
+ model.invited ? theme.chat.roomPane.listView.member.invitedOpacity : 1
image: HUserAvatar {
userId: model.id
@@ -23,10 +23,10 @@ HTileDelegate {
title.color:
memberDelegate.hovered ?
utils.nameColor(model.display_name || model.id.substring(1)) :
- theme.chat.roomPane.member.name
+ theme.chat.roomPane.listView.member.name
subtitle.text: model.display_name ? model.id : ""
- subtitle.color: theme.chat.roomPane.member.subtitle
+ subtitle.color: theme.chat.roomPane.listView.member.subtitle
contextMenu: HMenu {
HMenuItem {
diff --git a/src/gui/Pages/Chat/RoomPane/MemberView.qml b/src/gui/Pages/Chat/RoomPane/MemberView.qml
index 98f328c6..7c0e1681 100644
--- a/src/gui/Pages/Chat/RoomPane/MemberView.qml
+++ b/src/gui/Pages/Chat/RoomPane/MemberView.qml
@@ -27,56 +27,72 @@ HColumnLayout {
Layout.fillWidth: true
Layout.fillHeight: true
+
+ Rectangle {
+ anchors.fill: parent
+ z: -100
+ color: theme.chat.roomPane.listView.background
+ }
}
- HRowLayout {
+ Rectangle {
+ color: theme.chat.roomPane.bottomBar.background
+
+ Layout.fillWidth: true
Layout.minimumHeight: theme.baseElementsHeight
Layout.maximumHeight: Layout.minimumHeight
- HTextField {
- id: filterField
- saveName: "memberFilterField"
- saveId: chat.roomId
+ HRowLayout {
+ anchors.fill: parent
- placeholderText: qsTr("Filter members")
- backgroundColor: theme.chat.roomPane.filterMembers.background
- bordered: false
- opacity: width >= 16 * theme.uiScale ? 1 : 0
+ HTextField {
+ id: filterField
+ saveName: "memberFilterField"
+ saveId: chat.roomId
- Layout.fillWidth: true
- Layout.fillHeight: true
+ placeholderText: qsTr("Filter members")
+ backgroundColor:
+ theme.chat.roomPane.bottomBar.filterMembers.background
+ bordered: false
+ opacity: width >= 16 * theme.uiScale ? 1 : 0
- Behavior on opacity { HNumberAnimation {} }
- }
+ Layout.fillWidth: true
+ Layout.fillHeight: true
- HButton {
- id: inviteButton
- icon.name: "room-send-invite"
- backgroundColor: theme.chat.roomPane.inviteButton.background
- enabled: chat.roomInfo.can_invite
+ Behavior on opacity { HNumberAnimation {} }
+ }
- toolTip.text:
- enabled ?
- qsTr("Invite members to this room") :
- qsTr("No permission to invite members to this room")
+ HButton {
+ id: inviteButton
+ icon.name: "room-send-invite"
+ backgroundColor:
+ theme.chat.roomPane.bottomBar.inviteButton.background
+ enabled: chat.roomInfo.can_invite
- topPadding: 0 // XXX
- bottomPadding: 0
+ toolTip.text:
+ enabled ?
+ qsTr("Invite members to this room") :
+ qsTr("No permission to invite members to this room")
- onClicked: utils.makePopup(
- "Popups/InviteToRoomPopup.qml",
- chat,
- {
- userId: chat.userId,
- roomId: chat.roomId,
- roomName: chat.roomInfo.display_name,
- invitingAllowed: Qt.binding(() => inviteButton.enabled),
- },
- )
+ topPadding: 0 // XXX
+ bottomPadding: 0
- // onEnabledChanged: if (openedPopup && ! enabled)
+ onClicked: utils.makePopup(
+ "Popups/InviteToRoomPopup.qml",
+ chat,
+ {
+ userId: chat.userId,
+ roomId: chat.roomId,
+ roomName: chat.roomInfo.display_name,
+ invitingAllowed:
+ Qt.binding(() => inviteButton.enabled),
+ },
+ )
- Layout.fillHeight: true
+ // onEnabledChanged: if (openedPopup && ! enabled)
+
+ Layout.fillHeight: true
+ }
}
}
}
diff --git a/src/gui/Pages/Chat/RoomPane/RoomPane.qml b/src/gui/Pages/Chat/RoomPane/RoomPane.qml
index 5ab0f722..7ee51748 100644
--- a/src/gui/Pages/Chat/RoomPane/RoomPane.qml
+++ b/src/gui/Pages/Chat/RoomPane/RoomPane.qml
@@ -9,8 +9,8 @@ MultiviewPane {
saveName: "roomPane"
edge: Qt.RightEdge
- buttonsBackgroundColor: theme.chat.roomPaneButtons.background
- backgroundColor: theme.chat.roomPane.background
+ buttonsBackgroundColor: theme.chat.roomPane.topBar.background
+ background: Rectangle { color: theme.chat.roomPane.background }
buttonRepeater.model: [
diff --git a/src/gui/Pages/Chat/Timeline/EventContent.qml b/src/gui/Pages/Chat/Timeline/EventContent.qml
index c5cf5ee8..636bb31e 100644
--- a/src/gui/Pages/Chat/Timeline/EventContent.qml
+++ b/src/gui/Pages/Chat/Timeline/EventContent.qml
@@ -154,7 +154,7 @@ HRowLayout {
(pureMedia ? 0 : parent.leftPadding + parent.rightPadding),
)
height: contentColumn.height
- z: -1
+ z: -100
color: isOwn?
theme.chat.message.ownBackground :
theme.chat.message.background
diff --git a/src/themes/Glass.qpl b/src/themes/Glass.qpl
index 2f318627..e8c13826 100644
--- a/src/themes/Glass.qpl
+++ b/src/themes/Glass.qpl
@@ -30,49 +30,47 @@ fontFamily:
string mono: "Hack"
colors:
- int hue: 240
- int saturation: 60
- int bgSaturation: saturation / 1.5
- real intensity: 1.0
- real opacity: 0.7
- real bgOpacity: 0.5
+ int hue: 240
+
+ real intensity: 1.0
+ real coloredTextIntensity: intensity * 75
+
+ int saturation: 60
+ int bgSaturation: saturation / 1.5
+ int coloredTextSaturation: saturation + 20
+
+ real opacity: 0.7
color weakBackground: hsluv(hue, bgSaturation, intensity * 9, opacity)
color mediumBackground: hsluv(hue, bgSaturation, intensity * 6.8, opacity)
- color strongBackground:
- hsluv(hue, bgSaturation * 2, intensity * 2, Math.max(0.6, opacity))
+ color strongBackground: hsluv(hue, bgSaturation * 2, 0, opacity)
- color accentBackground:
- hsluv(hue, saturation * 1.5, intensity * 42, 1)
-
- color accentElement:
- hsluv(hue, saturation * 1.5, intensity * 52, 1)
-
- color strongAccentElement:
- hsluv(hue, saturation * 1.5, intensity * 72, 1)
+ color accentBackground: hsluv(hue, saturation, intensity * 42, 1)
+ color accentElement: hsluv(hue, saturation * 1.5, intensity * 52, 1)
+ color strongAccentElement: hsluv(hue, saturation * 1.5, intensity * 72, 1)
color positiveBackground:
- hsluv(155, saturation * 1.5, intensity * 52, Math.max(0.6, opacity))
+ hsluv(155, saturation * 1.5, intensity * 52, opacity)
color middleBackground:
- hsluv(60, saturation * 1.5, intensity * 52, Math.max(0.6, opacity))
+ hsluv(60, saturation * 1.5, intensity * 52, opacity)
color negativeBackground:
- hsluv(0, saturation * 1.5, intensity * 52, Math.max(0.6, opacity))
+ hsluv(0, saturation * 1.5, intensity * 52, opacity)
color alertBackground: negativeBackground
-
color brightText: hsluv(0, 0, intensity * 100)
color text: hsluv(0, 0, intensity * 85)
color halfDimText: hsluv(0, 0, intensity * 72)
color dimText: hsluv(0, 0, intensity * 60)
- color warningText: hsluv(60, saturation * 1.5, 72)
- color errorText: hsluv(0, saturation * 1.5, 72)
- color accentText: hsluv(hue, saturation * 1.5, 72)
- color link: accentText
- color code: hsluv(hue + 5, saturation * 1.5, intensity * 60)
+ color warningText: hsluv(60, coloredTextSaturation, coloredTextIntensity)
+ color errorText: hsluv(0, coloredTextSaturation, coloredTextIntensity)
+ color accentText: hsluv(hue, coloredTextSaturation, coloredTextIntensity)
+
+ color link: hsluv(hue, coloredTextSaturation, coloredTextIntensity)
+ color code: hsluv(hue + 10, coloredTextSaturation, coloredTextIntensity)
// Example of an animation, set running: true to enable
NumberAnimation on hue
@@ -156,7 +154,9 @@ controls:
color subtitle: colors.dimText
listView:
- color highlight: colors.strongBackground
+ color highlight: hsluv(
+ colors.hue, colors.bgSaturation * 2, 0, colors.opacity / 2,
+ )
color smallPaneHighlight: colors.accentBackground
textField:
@@ -234,8 +234,8 @@ controls:
real opacity: 1.0
displayName:
- int saturation: colors.saturation + 12
- int lightness: Math.min(72, colors.intensity * 72)
+ int saturation: colors.coloredTextSaturation
+ int lightness: colors.coloredTextIntensity - 4
// Specific interface parts
@@ -249,39 +249,40 @@ ui:
point gradientStart: Qt.point(0, 0)
point gradientEnd: Qt.point(window.width, window.height)
- color gradientStartColor: hsluv(0, 0, 0, colors.bgOpacity)
- color gradientEndColor: hsluv(0, 0, 0, colors.bgOpacity)
-
+ color gradientStartColor: hsluv(0, 0, 0, 0.5)
+ color gradientEndColor: hsluv(0, 0, 0, 0.5)
mainPane:
- color background: colors.mediumBackground
+ color background: "transparent"
topBar:
color background: colors.strongBackground
- color placeholderLogo: colors.strongAccentElement
+ color placeholderLogo: icons.colorize
color nameVersionLabel: colors.text
- account:
- real collapsedOpacity: 0.3
- color background: "transparent"
- color name: colors.text
+ listView:
+ color background: colors.mediumBackground
- room:
- real leftRoomOpacity: 0.65
+ account:
+ real collapsedOpacity: 0.3
+ color background: "transparent"
+ color name: colors.text
- color background: "transparent"
- color name: colors.text
- color lastEventDate: colors.halfDimText
+ room:
+ real leftRoomOpacity: 0.65
- color subtitle: colors.dimText
- color subtitleQuote: hsluv(135, colors.saturation * 2.25, 65)
+ color background: "transparent"
+ color name: colors.text
+ color lastEventDate: colors.halfDimText
- settingsButton:
- color background: colors.strongBackground
-
- filterRooms:
+ color subtitle: colors.dimText
+ color subtitleQuote: chat.message.quote
+
+ bottomBar:
color background: colors.strongBackground
+ color settingsButtonBackground: "transparent"
+ color filterFieldBackground: "transparent"
chat:
@@ -290,29 +291,35 @@ chat:
color name: colors.text
color topic: colors.dimText
- roomPaneButtons:
- color background: chat.roomHeader.background
-
roomPane:
- color background: colors.mediumBackground
+ color background: "transparent"
- member:
- real invitedOpacity: 0.5
-
- color background: "transparent"
- color name: colors.text
- color subtitle: colors.dimText
-
- color adminIcon: hsluv(60, colors.saturation * 2.25, 60)
- color moderatorIcon: adminIcon
- color invitedIcon: hsluv(0, colors.saturation * 2.25, 60)
-
- inviteButton:
+ topBar:
color background: colors.strongBackground
- filterMembers:
+ listView:
+ color background: colors.mediumBackground
+
+ member:
+ real invitedOpacity: 0.5
+
+ color background: "transparent"
+ color name: colors.text
+ color subtitle: colors.dimText
+
+ color adminIcon: hsluv(60, colors.saturation * 2.25, 60)
+ color moderatorIcon: adminIcon
+ color invitedIcon: hsluv(0, colors.saturation * 2.25, 60)
+
+ bottomBar:
color background: colors.strongBackground
+ inviteButton:
+ color background: "transparent"
+
+ filterMembers:
+ color background: "transparent"
+
eventList:
int ownEventsOnRightUnderWidth: 768 * theme.uiScale
color background: "transparent"
@@ -323,12 +330,7 @@ chat:
int radius: theme.radius
color background: colors.mediumBackground
- color ownBackground: hsluv(
- colors.hue,
- colors.bgSaturation * 2,
- colors.intensity * 5,
- Math.max(0.6, opacity),
- )
+ color ownBackground: colors.strongBackground
color body: colors.text
color date: colors.dimText
@@ -336,7 +338,9 @@ chat:
color noticeBody: colors.halfDimText
int noticeLineWidth: 1
- color quote: hsluv(135, colors.saturation * 1.5, colors.intensity * 80)
+ color quote: hsluv(
+ 135, colors.coloredTextSaturation, colors.coloredTextIntensity,
+ )
color link: colors.link
color code: colors.code
diff --git a/src/themes/Midnight.qpl b/src/themes/Midnight.qpl
index 9b08dded..c0328b13 100644
--- a/src/themes/Midnight.qpl
+++ b/src/themes/Midnight.qpl
@@ -30,49 +30,47 @@ fontFamily:
string mono: "Hack"
colors:
- int hue: 240
- int saturation: 60
- int bgSaturation: saturation
- real intensity: 1.0
- real opacity: 1.0
- real bgOpacity: 1.0
+ int hue: 240
+
+ real intensity: 1.0
+ real coloredTextIntensity: intensity * 75
+
+ int saturation: 60
+ int bgSaturation: saturation
+ int coloredTextSaturation: saturation + 20
+
+ real opacity: 1.0
color weakBackground: hsluv(hue, bgSaturation, intensity * 9, opacity)
color mediumBackground: hsluv(hue, bgSaturation, intensity * 6.8, opacity)
- color strongBackground:
- hsluv(hue, bgSaturation * 2, intensity * 2, Math.max(0.6, opacity))
+ color strongBackground: hsluv(hue, bgSaturation * 2,intensity * 2, opacity)
- color accentBackground:
- hsluv(hue, saturation * 1.5, intensity * 32, Math.max(0.9, opacity))
-
- color accentElement:
- hsluv(hue, saturation * 1.5, intensity * 52, Math.max(0.6, opacity))
-
- color strongAccentElement:
- hsluv(hue, saturation * 1.5, intensity * 72, Math.max(0.6, opacity))
+ color accentBackground: hsluv(hue, saturation, intensity * 32, 1)
+ color accentElement: hsluv(hue, saturation * 1.5, intensity * 52, 1)
+ color strongAccentElement: hsluv(hue, saturation * 1.5, intensity * 72, 1)
color positiveBackground:
- hsluv(155, saturation * 1.5, intensity * 52, Math.max(0.6, opacity))
+ hsluv(155, saturation * 1.5, intensity * 52, opacity)
color middleBackground:
- hsluv(60, saturation * 1.5, intensity * 52, Math.max(0.6, opacity))
+ hsluv(60, saturation * 1.5, intensity * 52, opacity)
color negativeBackground:
- hsluv(0, saturation * 1.5, intensity * 52, Math.max(0.6, opacity))
+ hsluv(0, saturation * 1.5, intensity * 52, opacity)
color alertBackground: negativeBackground
-
color brightText: hsluv(0, 0, intensity * 100)
color text: hsluv(0, 0, intensity * 85)
color halfDimText: hsluv(0, 0, intensity * 72)
color dimText: hsluv(0, 0, intensity * 60)
- color warningText: hsluv(60, saturation * 1.5, 72)
- color errorText: hsluv(0, saturation * 1.5, 72)
- color accentText: hsluv(hue, saturation * 1.5, 72)
- color link: accentText
- color code: hsluv(hue + 5, saturation * 1.5, intensity * 60)
+ color warningText: hsluv(60, coloredTextSaturation, coloredTextIntensity)
+ color errorText: hsluv(0, coloredTextSaturation, coloredTextIntensity)
+ color accentText: hsluv(hue, coloredTextSaturation, coloredTextIntensity)
+
+ color link: hsluv(hue, coloredTextSaturation, coloredTextIntensity)
+ color code: hsluv(hue + 10, coloredTextSaturation, coloredTextIntensity)
// Example of an animation, set running: true to enable
NumberAnimation on hue
@@ -152,11 +150,16 @@ controls:
color boxHoveredBorder: colors.accentElement
color boxPressedBorder: colors.strongAccentElement
- color text: controls.button.text
+ color text: controls.button.text
color subtitle: colors.dimText
listView:
- color highlight: colors.strongBackground
+ color highlight: hsluv(
+ colors.hue,
+ colors.bgSaturation * 2,
+ colors.intensity * 2,
+ colors.opacity / 2,
+ )
color smallPaneHighlight: colors.accentBackground
textField:
@@ -234,8 +237,8 @@ controls:
real opacity: 1.0
displayName:
- int saturation: colors.saturation + 12
- int lightness: Math.min(72, colors.intensity * 72)
+ int saturation: colors.coloredTextSaturation
+ int lightness: colors.coloredTextIntensity - 4
// Specific interface parts
@@ -250,45 +253,46 @@ ui:
point gradientEnd: Qt.point(window.width, window.height)
color gradientStartColor:
- hsluv(colors.hue - 50, 100, colors.intensity * 8, colors.bgOpacity)
+ hsluv(colors.hue - 50, 100, colors.intensity * 8)
color gradientEndColor:
- hsluv(colors.hue + 20, 30, colors.intensity * 22, colors.bgOpacity)
+ hsluv(colors.hue + 20, 30, colors.intensity * 22)
// To have a solid color instead,
// set gradientStartColor and gradientEndColor to the same value, e.g.:
- // color gradientStartColor: hsluv(0, 0, 0, colors.bgOpacity)
- // color gradientEndColor: hsluv(0, 0, 0, colors.bgOpacity)
-
+ // color gradientStartColor: hsluv(0, 0, 0, 0.5)
+ // color gradientEndColor: hsluv(0, 0, 0, 0.5)
mainPane:
- color background: colors.mediumBackground
+ color background: "transparent"
topBar:
color background: colors.strongBackground
- color placeholderLogo: colors.strongAccentElement
+ color placeholderLogo: icons.colorize
color nameVersionLabel: colors.text
- account:
- real collapsedOpacity: 0.3
- color background: "transparent"
- color name: colors.text
+ listView:
+ color background: colors.mediumBackground
- room:
- real leftRoomOpacity: 0.65
+ account:
+ real collapsedOpacity: 0.3
+ color background: "transparent"
+ color name: colors.text
- color background: "transparent"
- color name: colors.text
- color lastEventDate: colors.halfDimText
+ room:
+ real leftRoomOpacity: 0.65
- color subtitle: colors.dimText
- color subtitleQuote: hsluv(135, colors.saturation * 2.25, 65)
+ color background: "transparent"
+ color name: colors.text
+ color lastEventDate: colors.halfDimText
- settingsButton:
- color background: colors.strongBackground
-
- filterRooms:
+ color subtitle: colors.dimText
+ color subtitleQuote: chat.message.quote
+
+ bottomBar:
color background: colors.strongBackground
+ color settingsButtonBackground: "transparent"
+ color filterFieldBackground: "transparent"
chat:
@@ -297,29 +301,35 @@ chat:
color name: colors.text
color topic: colors.dimText
- roomPaneButtons:
- color background: chat.roomHeader.background
-
roomPane:
- color background: colors.mediumBackground
+ color background: "transparent"
- member:
- real invitedOpacity: 0.5
-
- color background: "transparent"
- color name: colors.text
- color subtitle: colors.dimText
-
- color adminIcon: hsluv(60, colors.saturation * 2.25, 60)
- color moderatorIcon: adminIcon
- color invitedIcon: hsluv(0, colors.saturation * 2.25, 60)
-
- inviteButton:
+ topBar:
color background: colors.strongBackground
- filterMembers:
+ listView:
+ color background: colors.mediumBackground
+
+ member:
+ real invitedOpacity: 0.5
+
+ color background: "transparent"
+ color name: colors.text
+ color subtitle: colors.dimText
+
+ color adminIcon: hsluv(60, colors.saturation * 2.25, 60)
+ color moderatorIcon: adminIcon
+ color invitedIcon: hsluv(0, colors.saturation * 2.25, 60)
+
+ bottomBar:
color background: colors.strongBackground
+ inviteButton:
+ color background: "transparent"
+
+ filterMembers:
+ color background: "transparent"
+
eventList:
int ownEventsOnRightUnderWidth: 768 * theme.uiScale
color background: "transparent"
@@ -330,12 +340,7 @@ chat:
int radius: theme.radius
color background: colors.mediumBackground
- color ownBackground: hsluv(
- colors.hue,
- colors.bgSaturation * 2,
- colors.intensity * 5,
- Math.max(0.6, opacity),
- )
+ color ownBackground: colors.strongBackground
color body: colors.text
color date: colors.dimText
@@ -343,7 +348,9 @@ chat:
color noticeBody: colors.halfDimText
int noticeLineWidth: 1
- color quote: hsluv(135, colors.saturation * 1.5, colors.intensity * 80)
+ color quote: hsluv(
+ 135, colors.coloredTextSaturation, colors.coloredTextIntensity,
+ )
color link: colors.link
color code: colors.code