diff --git a/src/commoncomponents/JamiSwitch.qml b/src/commoncomponents/JamiSwitch.qml index 98b9d328942aa0cc11bc08b6c3b836489c353b46..1ad27a9ff0634c271996fc97bb12c130bc860117 100644 --- a/src/commoncomponents/JamiSwitch.qml +++ b/src/commoncomponents/JamiSwitch.qml @@ -25,6 +25,8 @@ Switch { id: root indicator: Rectangle { + id: handleBackground + implicitWidth: JamiTheme.switchPreferredWidth implicitHeight: JamiTheme.switchPreferredHeight @@ -33,23 +35,26 @@ Switch { radius: JamiTheme.switchIndicatorRadius - color: root.checked ? JamiTheme.switchBackgroundCheckedColor : JamiTheme.whiteColor - border.color: root.checked ? JamiTheme.switchBackgroundCheckedColor : - JamiTheme.switchBackgroundBorderColor + color: root.checked ? JamiTheme.switchBackgroundCheckedColor : + JamiTheme.switchBackgroundColor + border.color: handleBackground.color Rectangle { + id: handle + x: root.checked ? parent.width - width : 0 y: parent.height / 2 - height / 2 width: JamiTheme.switchIndicatorPreferredWidth - height: JamiTheme.switchIndicatorPreferredHeight + height: JamiTheme.switchPreferredHeight radius: JamiTheme.switchIndicatorRadius - color: (root.down || root.focus) ? Qt.darker(JamiTheme.switchBackgroundBorderColor, 1.2) : - JamiTheme.whiteColor - border.color: root.checked ? JamiTheme.switchBackgroundCheckedColor : - JamiTheme.switchIndicatorBorderColor + color: root.checked ? JamiTheme.switchHandleCheckedColor : + JamiTheme.switchHandleColor + border.color: root.focus ? (root.checked ? JamiTheme.switchHandleCheckedBorderColor : + JamiTheme.switchHandleBorderColor) : + JamiTheme.transparentColor } } diff --git a/src/commoncomponents/MaterialButton.qml b/src/commoncomponents/MaterialButton.qml index cdec8dcedf606176b9a03c58dd67eeaf96455149..b369ef66b83cdbb6b8c89dd869588b98e3e8da74 100644 --- a/src/commoncomponents/MaterialButton.qml +++ b/src/commoncomponents/MaterialButton.qml @@ -25,7 +25,7 @@ import net.jami.Constants 1.1 // TODO: this component suffers from excessive responsibility // and should have fixed width and content width defined variations // as well as better handling for the animated icon -Button { +AbstractButton { id: root property bool outlined: false @@ -138,7 +138,7 @@ Button { Layout.alignment: Qt.AlignVCenter Layout.leftMargin: hasIcon ? - JamiTheme.preferredMarginSize / 2 : + JamiTheme.preferredMarginSize : undefined sourceComponent: animatedSource_.length !== 0 ? animatedIconComponent : @@ -168,7 +168,6 @@ Button { } background: Rectangle { - anchors.fill: parent color: { if (root.outlined) return "transparent" diff --git a/src/commoncomponents/MaterialLineEdit.qml b/src/commoncomponents/MaterialLineEdit.qml index 6fef7009f8e27baae50c6dad306a25d1421ae1f0..837b9482d57c9b3f01c8de8708a629fba8e68030 100644 --- a/src/commoncomponents/MaterialLineEdit.qml +++ b/src/commoncomponents/MaterialLineEdit.qml @@ -40,11 +40,12 @@ TextField { wrapMode: Text.Wrap readOnly: false selectByMouse: true - selectionColor: JamiTheme.placeHolderTextFontColor + selectionColor: JamiTheme.placeholderTextColor font.pointSize: JamiTheme.materialLineEditPointSize font.kerning: true + placeholderTextColor: JamiTheme.placeholderTextColor color: JamiTheme.textColor LineEditContextMenu { diff --git a/src/constant/JamiTheme.qml b/src/constant/JamiTheme.qml index dbd6e49e7fa452b2d98dcfea48da48ddf6e09778..4d4a403025da7fb4f14e2e9ef45546a952c859a6 100644 --- a/src/constant/JamiTheme.qml +++ b/src/constant/JamiTheme.qml @@ -60,7 +60,6 @@ Item { property color notificationRed: "#ff3b30" property color notificationBlue: "#31b7ff" property color unPresenceOrange: "orange" - property color placeHolderTextFontColor: "#767676" property color draftTextColor: "#cf5300" property color selectedTabColor: primaryForegroundColor property color filterBadgeColor: "#eed4d8" @@ -99,9 +98,12 @@ Item { property color closeButtonLighterBlack: "#4c4c4c" // Jami switch - property color switchBackgroundBorderColor: "#cccccc" - property color switchBackgroundCheckedColor: primaryBackgroundColor - property color switchIndicatorBorderColor: "#999999" + property color switchBackgroundColor: darkTheme ? "#373737" : "#9f9f9f" + property color switchBackgroundCheckedColor: "#8dbaea" + property color switchHandleColor: darkTheme ? Qt.darker(lightGrey_, 2) : whiteColor + property color switchHandleCheckedColor: "#1b76d1" + property color switchHandleBorderColor: darkTheme ? whiteColor : Qt.darker(lightGrey_, 2) + property color switchHandleCheckedBorderColor: Qt.darker(lightGrey_, 3) // Call buttons property color acceptButtonGreen: "#4caf50" @@ -158,7 +160,7 @@ Item { property color fileInTimestampColor: darkTheme ? "#999" : "#555" property color chatviewBgColor: darkTheme ? bgDarkMode_ : whiteColor property color bgInvitationRectColor: darkTheme ? "#222222" : whiteColor - property color placeholderTextColor: darkTheme ? "#2b2b2b" : "#d3d3d3" + property color placeholderTextColor: darkTheme ? "#7a7a7a" : "#767676" property color inviteHoverColor: darkTheme ? blackColor : whiteColor property color chatviewButtonColor: darkTheme ? whiteColor : blackColor property color bgTextInput: darkTheme ? "#060608" : whiteColor @@ -270,10 +272,9 @@ Item { property real lineEditContextMenuSeparatorsHeight: 2 // Jami switch - property real switchIndicatorRadius: 13 - property real switchPreferredHeight: 18 + property real switchIndicatorRadius: 30 + property real switchPreferredHeight: 25 property real switchPreferredWidth: 48 - property real switchIndicatorPreferredHeight: 26 property real switchIndicatorPreferredWidth: 26 // Modal Popup diff --git a/src/mainview/components/ContactSearchBar.qml b/src/mainview/components/ContactSearchBar.qml index 740c0fd51f5359e9f5615fbecb07e9aaf794b126..6b3a4e9f1727a4c5bcc3216eb0e1c03634230224 100644 --- a/src/mainview/components/ContactSearchBar.qml +++ b/src/mainview/components/ContactSearchBar.qml @@ -82,10 +82,10 @@ Rectangle { font.kerning: true selectByMouse: true - selectionColor: JamiTheme.placeHolderTextFontColor + selectionColor: JamiTheme.placeholderTextColor placeholderText: JamiStrings.contactSearchConversation - placeholderTextColor: JamiTheme.placeHolderTextFontColor + placeholderTextColor: JamiTheme.placeholderTextColor background: Rectangle { id: searchBarBackground diff --git a/src/mainview/components/MessageBarTextArea.qml b/src/mainview/components/MessageBarTextArea.qml index 8b8c94d4fa7d1d98afbc6b017883cea800574590..cca9a08c5d282627432a330a436caad83db928d3 100644 --- a/src/mainview/components/MessageBarTextArea.qml +++ b/src/mainview/components/MessageBarTextArea.qml @@ -84,9 +84,9 @@ JamiFlickable { renderType: Text.NativeRendering wrapMode: TextEdit.Wrap selectByMouse: true - selectionColor: JamiTheme.placeHolderTextFontColor + selectionColor: JamiTheme.placeholderTextColor textFormat: TextEdit.PlainText - placeholderTextColor: JamiTheme.placeHolderTextFontColor + placeholderTextColor: JamiTheme.placeholderTextColor cursorDelegate: Rectangle { visible: textArea.cursorVisible