diff --git a/src/app/commoncomponents/MessageBubble.qml b/src/app/commoncomponents/MessageBubble.qml
index 34e8e068c567f2b8464d363f8baeac6370b17150..e62030ac59245dba1de1fbfa307232084d40ed7b 100644
--- a/src/app/commoncomponents/MessageBubble.qml
+++ b/src/app/commoncomponents/MessageBubble.qml
@@ -18,29 +18,26 @@
import QtQuick
import Qt5Compat.GraphicalEffects
-
import net.jami.Constants 1.1
+
+
Rectangle {
id: root
-
property bool out: true
property int type: MsgSeq.single
-
Rectangle {
id: mask
-
visible: type !== MsgSeq.single
z: -1
- radius: 2
+ radius: 5
color: root.color
-
anchors {
fill: parent
- leftMargin: out ? root.width - root.radius : 0
- rightMargin: out ? 0 : root.width - root.radius
- topMargin: type === MsgSeq.first ? root.height - root.radius : 0
- bottomMargin: type === MsgSeq.last ? root.height - root.radius : 0
+ leftMargin: out ? root.width/2 : 0
+ rightMargin: out ? 0 : root.width/2
+ topMargin: type === MsgSeq.first ? root.height /2 : 0
+ bottomMargin: type === MsgSeq.last ? root.height /2 : 0
}
}
}
diff --git a/src/app/commoncomponents/SBSMessageBase.qml b/src/app/commoncomponents/SBSMessageBase.qml
index d2ed10e6018c7f2d8fe8bb5a6fda07ba45cee2f0..7a251ea7f59b39679311ed363a643da0278881d0 100644
--- a/src/app/commoncomponents/SBSMessageBase.qml
+++ b/src/app/commoncomponents/SBSMessageBase.qml
@@ -25,6 +25,7 @@ import net.jami.Models 1.1
import net.jami.Adapters 1.1
import net.jami.Constants 1.1
+
Control {
id: root
@@ -39,6 +40,7 @@ Control {
property int seq
property string author
property string transferId
+ property string registeredNameText
property string transferName
property string formattedTime
property string location
@@ -46,8 +48,8 @@ Control {
property var readers: []
readonly property real senderMargin: 64
- readonly property real avatarSize: 32
- readonly property real msgRadius: 18
+ readonly property real avatarSize: 20
+ readonly property real msgRadius: 20
readonly property real hPadding: JamiTheme.sbsMessageBasePreferredPadding
width: ListView.view ? ListView.view.width : 0
@@ -63,15 +65,35 @@ Control {
width: parent.width - hPadding * 2
- spacing: 2
+ spacing: 0
+
+ Item {
+
+ id: usernameblock
+ Layout.preferredHeight: (seq === MsgSeq.first || seq === MsgSeq.single) ? 10 : 0
+
+ Label {
+ id: username
+ text: chatView.headerUserUserNameLabelText
+ font.bold: true
+ visible: (seq === MsgSeq.first || seq === MsgSeq.single) && !isOutgoing
+ font.pixelSize: JamiTheme.usernameBlockFontSize
+ font.family: JamiTheme.chatviewFontFamily
+ color: JamiTheme.chatviewUsernameColor
+ lineHeight: JamiTheme.usernameBlockLineHeight
+ leftPadding: JamiTheme.usernameBlockPadding
+ }
+ }
+
RowLayout {
Layout.preferredHeight: innerContent.height + root.extraHeight
Layout.topMargin: (seq === MsgSeq.first || seq === MsgSeq.single) ? 6 : 0
- spacing: 0
+
+
Item {
id: avatarBlock
- Layout.preferredWidth: isOutgoing ? 0 : avatar.width + hPadding
+ Layout.preferredWidth: isOutgoing ? 0 : avatar.width + hPadding/3
Layout.preferredHeight: isOutgoing ? 0 : bubble.height
Avatar {
id: avatar
@@ -90,6 +112,7 @@ Control {
Column {
id: innerContent
width: parent.width
+
// place actual content here
}
MessageBubble {
@@ -102,11 +125,13 @@ Control {
CurrentConversation.isCoreDialog ? JamiTheme.messageInBgColor : Qt.lighter(CurrentConversation.color, 1.5)
radius: msgRadius
anchors.right: isOutgoing ? parent.right : undefined
+ anchors.top: parent.top
width: innerContent.childrenRect.width
height: innerContent.childrenRect.height + (visible ? root.extraHeight : 0)
}
}
}
+
ListView {
id: infoCell
@@ -120,6 +145,7 @@ Control {
return 0
}
+
Label {
id: formattedTimeLabel
@@ -128,13 +154,15 @@ Control {
visible: showTime || seq === MsgSeq.last
height: visible * implicitHeight
font.pointSize: 9
-
+ topPadding : 4
anchors.right: !isOutgoing ? undefined : reads.left
anchors.rightMargin: 8
anchors.left: isOutgoing ? undefined : parent.left
anchors.leftMargin: avatarBlockWidth + 6
}
+
ReadStatus {
+
id: reads
visible: root.readers.length !== 0 && CurrentAccount.sendReadReceipt
width: {
@@ -144,7 +172,10 @@ Control {
var margin = JamiTheme.avatarReadReceiptSize / 3
return nbAvatars * JamiTheme.avatarReadReceiptSize - (nbAvatars - 1) * margin
}
+
anchors.right: parent.right
+ anchors.top : parent.top
+ anchors.topMargin: 1
readers: root.readers
}
}
diff --git a/src/app/commoncomponents/TextMessageDelegate.qml b/src/app/commoncomponents/TextMessageDelegate.qml
index abe8e3feb14801666291833da5d0841971ee0e71..c816673f1ef3d5c6f9b04da6d215e90966ccf04c 100644
--- a/src/app/commoncomponents/TextMessageDelegate.qml
+++ b/src/app/commoncomponents/TextMessageDelegate.qml
@@ -31,6 +31,7 @@ SBSMessageBase {
id : root
property bool isRemoteImage
+
property real maxMsgWidth: root.width - senderMargin - 2 * hPadding - avatarBlockWidth
isOutgoing: Author === ""
@@ -38,23 +39,31 @@ SBSMessageBase {
readers: Readers
formattedTime: MessagesAdapter.getFormattedTime(Timestamp)
extraHeight: extraContent.active && !isRemoteImage ? msgRadius : -isRemoteImage
+
innerContent.children: [
TextEdit {
- padding: 10
+
+ padding: JamiTheme.chatviewPadding
anchors.right: isOutgoing ? parent.right : undefined
+
text: Body
+
+ horizontalAlignment: isOutgoing ? Text.AlignRight : Text.AlignLeft
+
width: {
if (extraContent.active)
Math.max(extraContent.width,
Math.min(implicitWidth - avatarBlockWidth,
- extraContent.minSize) - senderMargin)
+ extraContent.minSize) - senderMargin )
else
Math.min(implicitWidth, innerContent.width - senderMargin)
}
+
height: implicitHeight
wrapMode: Label.WrapAtWordBoundaryOrAnywhere
selectByMouse: true
- font.pointSize: 11
+ font.pixelSize: 15
+ font.family: 'Ubuntu'
font.hintingPreference: Font.PreferNoHinting
renderType: Text.NativeRendering
textFormat: Text.MarkdownText
diff --git a/src/app/constant/JamiTheme.qml b/src/app/constant/JamiTheme.qml
index e8dfc606ceec680469c3e65601b0d380d10ceb9f..a654aee73947026f334aa4f0e85528235758da51 100644
--- a/src/app/constant/JamiTheme.qml
+++ b/src/app/constant/JamiTheme.qml
@@ -157,14 +157,14 @@ Item {
// Chatview
property color jamiLightBlue: darkTheme ? "#003b4e" : Qt.rgba(59, 193, 211, 0.3)
property color jamiDarkBlue: darkTheme ? "#28b1ed" : "#003b4e"
- property color chatviewTextColor: darkTheme ? "#f0f0f0" : "#353637"
+ property color chatviewTextColor: darkTheme ? "#f0f0f0" : "#000000"
property color chatviewTextColorLight: "#f0f0f0"
property color chatviewTextColorDark: "#353637"
property color timestampColor: darkTheme ? "#bbb" : "#777"
- property color messageOutTxtColor: chatviewTextColor
- property color messageInBgColor: darkTheme ? "#28b1ed" : "#cfd8dc"
- property color messageOutBgColor: darkTheme? "#616161" : "#cfebf5"
- property color messageInTxtColor: chatviewTextColor
+ property color messageOutTxtColor: "#000000"
+ property color messageInBgColor: darkTheme ? "#28b1ed" : "#e5e5e5"
+ property color messageOutBgColor: darkTheme? "#616161" : "#005699"
+ property color messageInTxtColor: "#FFFFFF"
property color fileOutTimestampColor: darkTheme ? "#eee" : "#555"
property color fileInTimestampColor: darkTheme ? "#999" : "#555"
property color chatviewBgColor: darkTheme ? bgDarkMode_ : whiteColor
@@ -179,6 +179,7 @@ Item {
property color previewCardContainerColor : darkTheme ? blackColor : whiteColor
property color previewUrlColor : darkTheme ? "#eeeeee" : "#333"
property color messageWebViewFooterButtonImageColor: darkTheme ? "#838383" : "#656565"
+ property color chatviewUsernameColor : "#A7A7A7"
// Files To Send Container
property color removeFileButtonColor: Qt.rgba(96, 95, 97, 0.5)
@@ -191,6 +192,7 @@ Item {
property color typingDotsEnlargeColor: darkTheme ? "white" : Qt.darker("lightgrey", 3.0)
// Font.
+
property color faddedFontColor: darkTheme? "#c0c0c0" : "#a0a0a0"
property color faddedLastInteractionFontColor: darkTheme ? "#c0c0c0" : "#505050"
@@ -213,6 +215,9 @@ Item {
property int overlayFadeDuration: 250
property int smartListTransitionDuration: 120
+ property string chatviewFontFamily : 'Ubuntu'
+
+
// Sizes
property real qrCodeImageSize: 256
property real splitViewHandlePreferredWidth: 4
@@ -283,6 +288,8 @@ Item {
property real lineEditContextMenuItemsWidth: 100
property real lineEditContextMenuSeparatorsHeight: 2
+
+
// Jami switch
property real switchIndicatorRadius: 30
property real switchPreferredHeight: 25
@@ -294,8 +301,10 @@ Item {
// MessageWebView
property real chatViewHairLineSize: 1
+ property real chatviewPadding : 16
property real chatViewMaximumWidth: 900
property real chatViewHeaderPreferredHeight: 64
+ property real chatViewHeaderMinimumWidth: 200
property real chatViewFooterPreferredHeight: 50
property real chatViewFooterMaximumHeight: 280
property real chatViewFooterRowSpacing: 1
@@ -306,6 +315,10 @@ Item {
property real chatViewFooterTextAreaMaximumHeight: 130
property real chatViewScrollToBottomButtonBottomMargin: 8
+ property real usernameBlockFontSize : 12
+ property real usernameBlockLineHeight : 14
+ property real usernameBlockPadding : contactMessageAvatarSize + 8
+
// TypingDots
property real typingDotsAnimationInterval: 500
property real typingDotsRadius: 30
diff --git a/src/app/mainview/components/ChatView.qml b/src/app/mainview/components/ChatView.qml
index 3b038bb38756790117d8dbaf7cbe7d2532818bcb..213cd4a988c3d87dd45118cb4ce64c5623e87316 100644
--- a/src/app/mainview/components/ChatView.qml
+++ b/src/app/mainview/components/ChatView.qml
@@ -61,6 +61,7 @@ Rectangle {
Layout.fillWidth: true
Layout.preferredHeight: JamiTheme.chatViewHeaderPreferredHeight
Layout.maximumHeight: JamiTheme.chatViewHeaderPreferredHeight
+ Layout.minimumWidth: JamiTheme.chatViewHeaderMinimumWidth
userAliasLabelText: headerUserAliasLabelText
userUserNameLabelText: headerUserUserNameLabelText
@@ -137,9 +138,10 @@ Rectangle {
Layout.alignment: Qt.AlignHCenter
Layout.fillWidth: true
Layout.fillHeight: true
- Layout.maximumWidth: JamiTheme.chatViewMaximumWidth
Layout.topMargin: JamiTheme.chatViewHairLineSize
Layout.bottomMargin: JamiTheme.chatViewHairLineSize
+ Layout.leftMargin: JamiTheme.chatviewMargin
+ Layout.rightMargin: JamiTheme.chatviewMargin
currentIndex: CurrentConversation.isRequest ||
CurrentConversation.needsSyncing
diff --git a/src/app/mainview/components/MessageBar.qml b/src/app/mainview/components/MessageBar.qml
index c9d5ac8931dbc042e3aac68fa19ef613743b0aad..344bad299910f25f2099b4c709b988d521cbbd8e 100644
--- a/src/app/mainview/components/MessageBar.qml
+++ b/src/app/mainview/components/MessageBar.qml
@@ -50,7 +50,6 @@ ColumnLayout {
Layout.alignment: Qt.AlignTop | Qt.AlignHCenter
Layout.preferredHeight: JamiTheme.chatViewHairLineSize
Layout.fillWidth: true
- Layout.maximumWidth: JamiTheme.chatViewMaximumWidth
color: JamiTheme.tabbarBorderColor
}