diff --git a/resources/qml/Avatar.qml b/resources/qml/Avatar.qml
index a247bffe..34b029a6 100644
--- a/resources/qml/Avatar.qml
+++ b/resources/qml/Avatar.qml
@@ -13,7 +13,7 @@ Rectangle {
width: 48
height: 48
radius: Settings.avatarCircles ? height / 2 : 3
- color: colors.base
+ color: colors.alternateBase
Label {
anchors.fill: parent
diff --git a/resources/qml/Reactions.qml b/resources/qml/Reactions.qml
index 6487f512..836087ef 100644
--- a/resources/qml/Reactions.qml
+++ b/resources/qml/Reactions.qml
@@ -83,7 +83,7 @@ Flow {
implicitWidth: reaction.implicitWidth
implicitHeight: reaction.implicitHeight
border.color: (reaction.hovered || modelData.selfReactedEvent !== '') ? colors.highlight : colors.text
- color: modelData.selfReactedEvent !== '' ? Qt.hsla(highlightHue, highlightSat, highlightLight, 0.2) : colors.base
+ color: modelData.selfReactedEvent !== '' ? Qt.hsla(highlightHue, highlightSat, highlightLight, 0.2) : colors.window
border.width: 1
radius: reaction.height / 2
}
diff --git a/resources/qml/TimelineRow.qml b/resources/qml/TimelineRow.qml
index 38597673..57fded90 100644
--- a/resources/qml/TimelineRow.qml
+++ b/resources/qml/TimelineRow.qml
@@ -48,7 +48,7 @@ Item {
Reply {
visible: model.replyTo
modelData: chat.model.getDump(model.replyTo, model.id)
- userColor: TimelineManager.userColor(modelData.userId, colors.window)
+ userColor: TimelineManager.userColor(modelData.userId, colors.base)
}
// actual message content
diff --git a/resources/qml/TimelineView.qml b/resources/qml/TimelineView.qml
index 1f5f406a..3124d462 100644
--- a/resources/qml/TimelineView.qml
+++ b/resources/qml/TimelineView.qml
@@ -161,6 +161,7 @@ Page {
ColumnLayout {
visible: TimelineManager.timeline != null
anchors.fill: parent
+ spacing: 0
Rectangle {
id: topBar
@@ -168,7 +169,7 @@ Page {
Layout.fillWidth: true
implicitHeight: topLayout.height + 16
z: 3
- color: colors.base
+ color: colors.window
MouseArea {
anchors.fill: parent
@@ -283,143 +284,156 @@ Page {
}
- ListView {
- id: chat
-
- property int delegateMaxWidth: (Settings.timelineMaxWidth > 100 && (parent.width - Settings.timelineMaxWidth) > scrollbar.width * 2) ? Settings.timelineMaxWidth : (parent.width - scrollbar.width * 2)
+ Rectangle {
+ Layout.fillWidth: true
+ height: 1
+ z: 3
+ color: colors.mid
+ }
- cacheBuffer: 400
+ Rectangle {
Layout.fillWidth: true
Layout.fillHeight: true
- model: TimelineManager.timeline
- boundsBehavior: Flickable.StopAtBounds
- pixelAligned: true
- spacing: 4
- verticalLayoutDirection: ListView.BottomToTop
- onCountChanged: {
- if (atYEnd)
- model.currentIndex = 0;
-
- } // Mark last event as read, since we are at the bottom
-
- ScrollHelper {
- flickable: parent
- anchors.fill: parent
- }
+ color: colors.base
- Shortcut {
- sequence: StandardKey.MoveToPreviousPage
- onActivated: {
- chat.contentY = chat.contentY - chat.height / 2;
- chat.returnToBounds();
- }
- }
+ ListView {
+ id: chat
- Shortcut {
- sequence: StandardKey.MoveToNextPage
- onActivated: {
- chat.contentY = chat.contentY + chat.height / 2;
- chat.returnToBounds();
+ property int delegateMaxWidth: (Settings.timelineMaxWidth > 100 && (parent.width - Settings.timelineMaxWidth) > scrollbar.width * 2) ? Settings.timelineMaxWidth : (parent.width - scrollbar.width * 2)
+
+ cacheBuffer: 400
+ anchors.fill: parent
+ model: TimelineManager.timeline
+ boundsBehavior: Flickable.StopAtBounds
+ pixelAligned: true
+ spacing: 4
+ verticalLayoutDirection: ListView.BottomToTop
+ onCountChanged: {
+ if (atYEnd)
+ model.currentIndex = 0;
+
+ } // Mark last event as read, since we are at the bottom
+
+ ScrollHelper {
+ flickable: parent
+ anchors.fill: parent
}
- }
- Shortcut {
- sequence: StandardKey.Cancel
- onActivated: chat.model.reply = undefined
- }
+ Shortcut {
+ sequence: StandardKey.MoveToPreviousPage
+ onActivated: {
+ chat.contentY = chat.contentY - chat.height / 2;
+ chat.returnToBounds();
+ }
+ }
- Shortcut {
- sequence: "Alt+Up"
- onActivated: chat.model.reply = chat.model.indexToId(chat.model.reply ? chat.model.idToIndex(chat.model.reply) + 1 : 0)
- }
+ Shortcut {
+ sequence: StandardKey.MoveToNextPage
+ onActivated: {
+ chat.contentY = chat.contentY + chat.height / 2;
+ chat.returnToBounds();
+ }
+ }
- Shortcut {
- sequence: "Alt+Down"
- onActivated: {
- var idx = chat.model.reply ? chat.model.idToIndex(chat.model.reply) - 1 : -1;
- chat.model.reply = idx >= 0 ? chat.model.indexToId(idx) : undefined;
+ Shortcut {
+ sequence: StandardKey.Cancel
+ onActivated: chat.model.reply = undefined
}
- }
- Component {
- id: userProfileComponent
+ Shortcut {
+ sequence: "Alt+Up"
+ onActivated: chat.model.reply = chat.model.indexToId(chat.model.reply ? chat.model.idToIndex(chat.model.reply) + 1 : 0)
+ }
- UserProfile {
+ Shortcut {
+ sequence: "Alt+Down"
+ onActivated: {
+ var idx = chat.model.reply ? chat.model.idToIndex(chat.model.reply) - 1 : -1;
+ chat.model.reply = idx >= 0 ? chat.model.indexToId(idx) : undefined;
+ }
}
- }
+ Component {
+ id: userProfileComponent
- section {
- property: "section"
- }
+ UserProfile {
+ }
- Component {
- id: sectionHeader
+ }
- Column {
- property var modelData
- property string section
- property string nextSection
+ section {
+ property: "section"
+ }
- topPadding: 4
- bottomPadding: 4
- spacing: 8
- visible: !!modelData
- width: parent.width
- height: (section.includes(" ") ? dateBubble.height + 8 + userName.height : userName.height) + 8
+ Component {
+ id: sectionHeader
- Label {
- id: dateBubble
+ Column {
+ property var modelData
+ property string section
+ property string nextSection
- anchors.horizontalCenter: parent ? parent.horizontalCenter : undefined
- visible: section.includes(" ")
- text: chat.model.formatDateSeparator(modelData.timestamp)
- color: colors.text
- height: fontMetrics.height * 1.4
- width: contentWidth * 1.2
- horizontalAlignment: Text.AlignHCenter
- verticalAlignment: Text.AlignVCenter
+ topPadding: 4
+ bottomPadding: 4
+ spacing: 8
+ visible: !!modelData
+ width: parent.width
+ height: (section.includes(" ") ? dateBubble.height + 8 + userName.height : userName.height) + 8
+
+ Label {
+ id: dateBubble
+
+ anchors.horizontalCenter: parent ? parent.horizontalCenter : undefined
+ visible: section.includes(" ")
+ text: chat.model.formatDateSeparator(modelData.timestamp)
+ color: colors.text
+ height: fontMetrics.height * 1.4
+ width: contentWidth * 1.2
+ horizontalAlignment: Text.AlignHCenter
+ verticalAlignment: Text.AlignVCenter
+
+ background: Rectangle {
+ radius: parent.height / 2
+ color: colors.window
+ }
- background: Rectangle {
- radius: parent.height / 2
- color: colors.base
}
- }
+ Row {
+ height: userName.height
+ spacing: 8
- Row {
- height: userName.height
- spacing: 8
+ Avatar {
+ width: avatarSize
+ height: avatarSize
+ url: chat.model.avatarUrl(modelData.userId).replace("mxc://", "image://MxcImage/")
+ displayName: modelData.userName
+ userid: modelData.userId
+
+ MouseArea {
+ anchors.fill: parent
+ onClicked: chat.model.openUserProfile(modelData.userId)
+ cursorShape: Qt.PointingHandCursor
+ propagateComposedEvents: true
+ }
- Avatar {
- width: avatarSize
- height: avatarSize
- url: chat.model.avatarUrl(modelData.userId).replace("mxc://", "image://MxcImage/")
- displayName: modelData.userName
- userid: modelData.userId
-
- MouseArea {
- anchors.fill: parent
- onClicked: chat.model.openUserProfile(modelData.userId)
- cursorShape: Qt.PointingHandCursor
- propagateComposedEvents: true
}
- }
+ Label {
+ id: userName
+
+ text: TimelineManager.escapeEmoji(modelData.userName)
+ color: TimelineManager.userColor(modelData.userId, colors.window)
+ textFormat: Text.RichText
+
+ MouseArea {
+ anchors.fill: parent
+ Layout.alignment: Qt.AlignHCenter
+ onClicked: chat.model.openUserProfile(modelData.userId)
+ cursorShape: Qt.PointingHandCursor
+ propagateComposedEvents: true
+ }
- Label {
- id: userName
-
- text: TimelineManager.escapeEmoji(modelData.userName)
- color: TimelineManager.userColor(modelData.userId, colors.window)
- textFormat: Text.RichText
-
- MouseArea {
- anchors.fill: parent
- Layout.alignment: Qt.AlignHCenter
- onClicked: chat.model.openUserProfile(modelData.userId)
- cursorShape: Qt.PointingHandCursor
- propagateComposedEvents: true
}
}
@@ -428,140 +442,130 @@ Page {
}
- }
-
- ScrollBar.vertical: ScrollBar {
- id: scrollbar
- }
+ ScrollBar.vertical: ScrollBar {
+ id: scrollbar
+ }
- delegate: Item {
- id: wrapper
-
- // This would normally be previousSection, but our model's order is inverted.
- property bool sectionBoundary: (ListView.nextSection != "" && ListView.nextSection !== ListView.section) || model.index === chat.count - 1
- property Item section
-
- anchors.horizontalCenter: parent ? parent.horizontalCenter : undefined
- width: chat.delegateMaxWidth
- height: section ? section.height + timelinerow.height : timelinerow.height
- onSectionBoundaryChanged: {
- if (sectionBoundary) {
- var properties = {
- "modelData": model.dump,
- "section": ListView.section,
- "nextSection": ListView.nextSection
- };
- section = sectionHeader.createObject(wrapper, properties);
- } else {
- section.destroy();
- section = null;
+ delegate: Item {
+ id: wrapper
+
+ // This would normally be previousSection, but our model's order is inverted.
+ property bool sectionBoundary: (ListView.nextSection != "" && ListView.nextSection !== ListView.section) || model.index === chat.count - 1
+ property Item section
+
+ anchors.horizontalCenter: parent ? parent.horizontalCenter : undefined
+ width: chat.delegateMaxWidth
+ height: section ? section.height + timelinerow.height : timelinerow.height
+ onSectionBoundaryChanged: {
+ if (sectionBoundary) {
+ var properties = {
+ "modelData": model.dump,
+ "section": ListView.section,
+ "nextSection": ListView.nextSection
+ };
+ section = sectionHeader.createObject(wrapper, properties);
+ } else {
+ section.destroy();
+ section = null;
+ }
}
- }
- TimelineRow {
- id: timelinerow
+ TimelineRow {
+ id: timelinerow
- y: section ? section.y + section.height : 0
- }
+ y: section ? section.y + section.height : 0
+ }
- Connections {
- function onMovementEnded() {
- if (y + height + 2 * chat.spacing > chat.contentY + chat.height && y < chat.contentY + chat.height)
- chat.model.currentIndex = index;
+ Connections {
+ function onMovementEnded() {
+ if (y + height + 2 * chat.spacing > chat.contentY + chat.height && y < chat.contentY + chat.height)
+ chat.model.currentIndex = index;
+ }
+
+ target: chat
}
- target: chat
}
- }
+ footer: BusyIndicator {
+ anchors.horizontalCenter: parent.horizontalCenter
+ running: chat.model && chat.model.paginationInProgress
+ height: 50
+ width: 50
+ z: 3
+ }
- footer: BusyIndicator {
- anchors.horizontalCenter: parent.horizontalCenter
- running: chat.model && chat.model.paginationInProgress
- height: 50
- width: 50
- z: 3
}
}
Item {
- id: chatFooter
-
- implicitHeight: Math.max(fontMetrics.height * 1.2, footerContent.height)
+ implicitHeight: Math.max(fontMetrics.height * 1.2, typingDisplay.height)
Layout.fillWidth: true
- z: 3
- Column {
- id: footerContent
+ Rectangle {
+ id: typingRect
+ color: colors.base
anchors.left: parent.left
anchors.right: parent.right
- anchors.bottom: parent.bottom
+ height: (chat.model && chat.model.typingUsers.length > 0) ? typingDisplay.height : 0
+ z: 3
- Rectangle {
- id: typingRect
+ Label {
+ id: typingDisplay
anchors.left: parent.left
+ anchors.leftMargin: 10
anchors.right: parent.right
- color: (chat.model && chat.model.typingUsers.length > 0) ? colors.window : "transparent"
- height: typingDisplay.height
-
- Label {
- id: typingDisplay
+ anchors.rightMargin: 10
+ anchors.bottom: parent.bottom
+ color: colors.text
+ text: chat.model ? chat.model.formatTypingUsers(chat.model.typingUsers, colors.base) : ""
+ textFormat: Text.RichText
+ }
- anchors.left: parent.left
- anchors.leftMargin: 10
- anchors.right: parent.right
- anchors.rightMargin: 10
- color: colors.text
- text: chat.model ? chat.model.formatTypingUsers(chat.model.typingUsers, colors.window) : ""
- textFormat: Text.RichText
- }
+ }
- }
+ }
- Rectangle {
- id: replyPopup
+ Rectangle {
+ id: replyPopup
- anchors.left: parent.left
- anchors.right: parent.right
- visible: chat.model && chat.model.reply
- // Height of child, plus margins, plus border
- height: replyPreview.height + 10
- color: colors.base
-
- Reply {
- id: replyPreview
-
- anchors.left: parent.left
- anchors.leftMargin: 10
- anchors.right: closeReplyButton.left
- anchors.rightMargin: 20
- anchors.bottom: parent.bottom
- modelData: chat.model ? chat.model.getDump(chat.model.reply, chat.model.id) : {
- }
- userColor: TimelineManager.userColor(modelData.userId, colors.window)
- }
+ Layout.fillWidth: true
+ visible: chat.model && chat.model.reply
+ // Height of child, plus margins, plus border
+ implicitHeight: replyPreview.height + 10
+ color: colors.window
+ z: 3
- ImageButton {
- id: closeReplyButton
-
- anchors.right: parent.right
- anchors.rightMargin: 15
- anchors.top: replyPreview.top
- hoverEnabled: true
- width: 16
- height: 16
- image: ":/icons/icons/ui/remove-symbol.png"
- ToolTip.visible: closeReplyButton.hovered
- ToolTip.text: qsTr("Close")
- onClicked: chat.model.reply = undefined
- }
+ Reply {
+ id: replyPreview
+ anchors.left: parent.left
+ anchors.leftMargin: 10
+ anchors.right: closeReplyButton.left
+ anchors.rightMargin: 20
+ anchors.bottom: parent.bottom
+ modelData: chat.model ? chat.model.getDump(chat.model.reply, chat.model.id) : {
}
+ userColor: TimelineManager.userColor(modelData.userId, colors.window)
+ }
+ ImageButton {
+ id: closeReplyButton
+
+ anchors.right: parent.right
+ anchors.rightMargin: 15
+ anchors.top: replyPreview.top
+ hoverEnabled: true
+ width: 16
+ height: 16
+ image: ":/icons/icons/ui/remove-symbol.png"
+ ToolTip.visible: closeReplyButton.hovered
+ ToolTip.text: qsTr("Close")
+ onClicked: chat.model.reply = undefined
}
}
@@ -571,6 +575,99 @@ Page {
z: 3
}
+ Rectangle {
+ Layout.fillWidth: true
+ z: 3
+ height: 1
+ color: colors.mid
+ }
+
+ Rectangle {
+ color: colors.window
+ Layout.fillWidth: true
+ Layout.preferredHeight: textInput.height
+ Layout.minimumHeight: 40
+
+ RowLayout {
+ id: inputBar
+
+ anchors.fill: parent
+ spacing: 16
+
+ ImageButton {
+ Layout.alignment: Qt.AlignBottom
+ hoverEnabled: true
+ width: 22
+ height: 22
+ image: ":/icons/icons/ui/place-call.png"
+ Layout.topMargin: 8
+ Layout.bottomMargin: 8
+ Layout.leftMargin: 16
+ }
+
+ ImageButton {
+ Layout.alignment: Qt.AlignBottom
+ hoverEnabled: true
+ width: 22
+ height: 22
+ image: ":/icons/icons/ui/paper-clip-outline.png"
+ Layout.topMargin: 8
+ Layout.bottomMargin: 8
+ }
+
+ ScrollView {
+ id: textInput
+
+ Layout.alignment: Qt.AlignBottom
+ Layout.maximumHeight: Window.height / 4
+ Layout.fillWidth: true
+
+ TextArea {
+ placeholderText: qsTr("Write a message...")
+ placeholderTextColor: colors.buttonText
+ color: colors.text
+ wrapMode: TextEdit.Wrap
+
+ MouseArea {
+ // workaround for wrong cursor shape on some platforms
+ anchors.fill: parent
+ acceptedButtons: Qt.NoButton
+ cursorShape: Qt.IBeamCursor
+ }
+
+ background: Rectangle {
+ color: colors.window
+ }
+
+ }
+
+ }
+
+ ImageButton {
+ Layout.alignment: Qt.AlignRight | Qt.AlignBottom
+ hoverEnabled: true
+ width: 22
+ height: 22
+ image: ":/icons/icons/ui/smile.png"
+ Layout.topMargin: 8
+ Layout.bottomMargin: 8
+ }
+
+ ImageButton {
+ Layout.alignment: Qt.AlignRight | Qt.AlignBottom
+ hoverEnabled: true
+ width: 22
+ height: 22
+ image: ":/icons/icons/ui/cursor.png"
+ Layout.topMargin: 8
+ Layout.bottomMargin: 8
+ Layout.rightMargin: 16
+ }
+
+ }
+
+ }
+
}
}
diff --git a/resources/qml/delegates/FileMessage.qml b/resources/qml/delegates/FileMessage.qml
index c6f213ee..ffd1e82b 100644
--- a/resources/qml/delegates/FileMessage.qml
+++ b/resources/qml/delegates/FileMessage.qml
@@ -65,7 +65,7 @@ Item {
}
Rectangle {
- color: colors.dark
+ color: colors.alternateBase
z: -1
radius: 10
height: row.height + 24
diff --git a/resources/qml/delegates/Pill.qml b/resources/qml/delegates/Pill.qml
index 4acf2bef..88f6c7fd 100644
--- a/resources/qml/delegates/Pill.qml
+++ b/resources/qml/delegates/Pill.qml
@@ -9,7 +9,7 @@ Label {
background: Rectangle {
radius: parent.height / 2
- color: colors.dark
+ color: colors.alternateBase
}
}
diff --git a/resources/qml/delegates/PlayableMediaMessage.qml b/resources/qml/delegates/PlayableMediaMessage.qml
index 9ad115c7..be22687f 100644
--- a/resources/qml/delegates/PlayableMediaMessage.qml
+++ b/resources/qml/delegates/PlayableMediaMessage.qml
@@ -8,7 +8,7 @@ Rectangle {
id: bg
radius: 10
- color: colors.dark
+ color: colors.alternateBase
height: Math.round(content.height + 24)
width: parent ? parent.width : undefined
diff --git a/resources/qml/emoji/EmojiPicker.qml b/resources/qml/emoji/EmojiPicker.qml
index 0e277415..afe16350 100644
--- a/resources/qml/emoji/EmojiPicker.qml
+++ b/resources/qml/emoji/EmojiPicker.qml
@@ -161,7 +161,7 @@ Popup {
Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: 1
- color: emojiPopup.colors.dark
+ color: emojiPopup.colors.alternateBase
}
// Category picker row
@@ -281,7 +281,7 @@ Popup {
Layout.preferredWidth: 1
implicitWidth: 1
height: parent.height
- color: emojiPopup.colors.dark
+ color: emojiPopup.colors.alternateBase
}
// Search Button is special
diff --git a/src/UserSettingsPage.cpp b/src/UserSettingsPage.cpp
index 53539407..d4d5dcb9 100644
--- a/src/UserSettingsPage.cpp
+++ b/src/UserSettingsPage.cpp
@@ -339,17 +339,18 @@ UserSettings::applyTheme()
/*windowText*/ QColor("#333"),
/*button*/ QColor("#333"),
/*light*/ QColor(0xef, 0xef, 0xef),
- /*dark*/ QColor(220, 220, 220),
- /*mid*/ QColor(110, 110, 110),
+ /*dark*/ QColor(110, 110, 110),
+ /*mid*/ QColor(220, 220, 220),
/*text*/ QColor("#333"),
/*bright_text*/ QColor("#333"),
- /*base*/ QColor("#eee"),
+ /*base*/ QColor("#fff"),
/*window*/ QColor("white"));
+ lightActive.setColor(QPalette::AlternateBase, QColor("#eee"));
lightActive.setColor(QPalette::Highlight, QColor("#38a3d8"));
lightActive.setColor(QPalette::ToolTipBase, lightActive.base().color());
lightActive.setColor(QPalette::ToolTipText, lightActive.text().color());
lightActive.setColor(QPalette::Link, QColor("#0077b5"));
- lightActive.setColor(QPalette::ButtonText, QColor(Qt::gray));
+ lightActive.setColor(QPalette::ButtonText, QColor("#495057"));
QApplication::setPalette(lightActive);
} else if (this->theme() == "dark") {
stylefile.setFileName(":/styles/styles/nheko-dark.qss");
@@ -357,17 +358,18 @@ UserSettings::applyTheme()
/*windowText*/ QColor("#caccd1"),
/*button*/ QColor(0xff, 0xff, 0xff),
/*light*/ QColor("#caccd1"),
- /*dark*/ QColor("#2d3139"),
- /*mid*/ QColor(110, 110, 110),
+ /*dark*/ QColor(110, 110, 110),
+ /*mid*/ QColor("#202228"),
/*text*/ QColor("#caccd1"),
/*bright_text*/ QColor(0xff, 0xff, 0xff),
- /*base*/ QColor("#2d3139"),
- /*window*/ QColor("#202228"));
+ /*base*/ QColor("#202228"),
+ /*window*/ QColor("#2d3139"));
+ darkActive.setColor(QPalette::AlternateBase, QColor("#2d3139"));
darkActive.setColor(QPalette::Highlight, QColor("#38a3d8"));
darkActive.setColor(QPalette::ToolTipBase, darkActive.base().color());
darkActive.setColor(QPalette::ToolTipText, darkActive.text().color());
darkActive.setColor(QPalette::Link, QColor("#38a3d8"));
- darkActive.setColor(QPalette::ButtonText, QColor(0x90, 0x90, 0x90));
+ darkActive.setColor(QPalette::ButtonText, "#727274");
QApplication::setPalette(darkActive);
} else {
stylefile.setFileName(":/styles/styles/system.qss");
|