dark theme fixes

This commit is contained in:
Dan Ballard 2020-08-28 15:08:33 -07:00
parent 60c6a8d983
commit ec21dcbf8e
9 changed files with 96 additions and 36 deletions

View File

@ -18,6 +18,7 @@ Rectangle {
Layout.maximumHeight: height
property color inactiveColor: Theme.defaultButtonColor
property color activeColor: Theme.defaultButtonActiveColor
property color textColor: Theme.defaultButtonTextColor
color: mousedown ? activeColor : inactiveColor
border.color: mousedown ? activeColor : inactiveColor
border.width: 1
@ -50,7 +51,7 @@ Rectangle {
font.family: Fonts.applicationFontRegular.name
font.styleName: "ExtraBold"
font.pixelSize: button.height / 2
color: Theme.defaultButtonTextColor
color: button.textColor
visible: button.text != "" && button.text != undefined
}

View File

@ -10,7 +10,7 @@ import "theme"
// ButtonTextField integrates a text field and a button
TextField {
id: tf
color: Theme.mainTextColor
color: Theme.textfieldTextColor
font.pixelSize: Theme.secondaryTextSize * gcd.themeScale
width: parent.width - 20
@ -22,8 +22,8 @@ TextField {
background: Rectangle {
radius: 10
color: Theme.backgroundMainColor
border.color: Theme.backgroundMainColor
color: Theme.textfieldBackgroundColor
border.color: Theme.textfieldBorderColor
layer.enabled: true
layer.effect: DropShadow {
transparentBorder: true
@ -41,6 +41,10 @@ TextField {
override_radius: 10
height: parent.height;
inactiveColor: Theme.textfieldButtonColor
activeColor: Theme.textfieldButtonColor
textColor: Theme.textfieldButtonTextColor
onClicked: {
parent.focus = true;
parent.clicked();

View File

@ -8,7 +8,7 @@ import "theme"
// IconTextField integrates a text field and an icon
TextField {
color: Theme.mainTextColor
color: Theme.textfieldTextColor
font.pixelSize: Theme.secondaryTextSize * gcd.themeScale * gcd.themeScale
width: parent.width - 20
property alias icon: icon_.source
@ -19,8 +19,8 @@ TextField {
background: Rectangle {
radius: 10
color: Theme.backgroundMainColor
border.color: Theme.backgroundMainColor
color: Theme.textfieldBackgroundColor
border.color: Theme.textfieldBorderColor
layer.enabled: true
layer.effect: DropShadow {
transparentBorder: true
@ -42,8 +42,8 @@ TextField {
height: parent.height-4;
width: parent.height-4;
iconColor: Theme.altTextColor
backgroundColor: Theme.backgroundMainColor
iconColor: Theme.textfieldTextColor
backgroundColor: Theme.textfieldBackgroundColor
}
}

View File

@ -13,13 +13,13 @@ For example:
*/
TextField {
color: Theme.mainTextColor
color: Theme.textfieldTextColor
font.pointSize: 10 * gcd.themeScale
width: 100
background: Rectangle {
radius: 2
color: Theme.backgroundPaneColor
border.color: Theme.defaultButtonActiveColor
color: Theme.textfieldBackgroundColor
border.color: Theme.textfieldBorderColor
}
}

View File

@ -21,7 +21,7 @@ Rectangle { // Global Toolbar
Layout.minimumHeight: height
Layout.maximumHeight: height
color: Theme.backgroundMainColor
color: Theme.toolbarMainColor
property alias leftMenuVisible: btnLeftMenu.visible
property alias backVisible: btnLeftBack.visible

View File

@ -4,36 +4,46 @@ ThemeType {
readonly property color deepPurple: "#422850"
readonly property color mauvePurple: "#8E64A5"
readonly property color purple: "#DFB9DE"
readonly property color whitePurple: "#FFFDFF"
readonly property color whitePurple: "#E3DFE4"
readonly property color softPurple: "#FDF3FC"
readonly property color pink: "#E85DA1"
readonly property color hotPink: "#D01972"
readonly property color lightGrey: "#B3B6B3"
readonly property color lightGrey: "#9E9E9E"
backgroundMainColor: darkGreyPurple
backgroundPaneColor: deepPurple
backgroundPaneColor: darkGreyPurple
backgroundHilightElementColor: deepPurple
dividerColor: mauvePurple
dividerColor: deepPurple
mainTextColor: purple
altTextColor: mauvePurple
mainTextColor: whitePurple
altTextColor: whitePurple
hilightElementTextColor: purple
defaultButtonColor: mauvePurple
defaultButtonColor: hotPink
defaultButtonActiveColor: pink
defaultButtonTextColor: whitePurple
defaultButtonDisabledColor: softPurple
defaultButtonDisabledColor: deepPurple
defaultButtonDisabledTextColor: darkGreyPurple
altButtonColor: darkGreyPurple
altButtonTextColor: purple
altButtonDisabledColor: darkGreyPurple
altButtonDisabledTextColor: purple
textfieldBackgroundColor: deepPurple
textfieldBorderColor: deepPurple
textfieldTextColor: purple
textfieldButtonColor: purple
textfieldButtonTextColor: darkGreyPurple
portraitOnlineBorderColor: whitePurple
portraitOnlineBackgroundColor: darkGreyPurple
portraitOnlineBackgroundColor: whitePurple
portraitOnlineTextColor: whitePurple
portraitConnectingBorderColor: mauvePurple
portraitConnectingBackgroundColor: darkGreyPurple
portraitConnectingBorderColor: purple //mauvePurple
portraitConnectingBackgroundColor: purple //darkGreyPurple
portraitConnectingTextColor: whitePurple
portraitOfflineBorderColor: deepPurple
portraitOfflineBackgroundColor: darkGreyPurple
portraitOfflineTextColor: softPurple
portraitOfflineBorderColor: purple
portraitOfflineBackgroundColor: purple
portraitOfflineTextColor: purple
portraitBlockedBorderColor: lightGrey
portraitBlockedBackgroundColor: lightGrey
portraitBlockedTextColor: lightGrey
@ -46,12 +56,14 @@ ThemeType {
toggleColor: darkGreyPurple
toggleOnColor: whitePurple
toggleOffColor: mauvePurple
toggleOffColor: deepPurple
sliderButtonColor: whitePurple
sliderBarLeftColor: mauvePurple
sliderBarRightColor: mauvePurple
toolbarIconColor: whitePurple
toolbarMainColor: darkGreyPurple
toolbarAltColor: deepPurple
statusbarDisconnectedInternetColor: whitePurple
statusbarDisconnectedInternetFontColor: deepPurple
@ -63,13 +75,13 @@ ThemeType {
statusbarOnlineFontColor: whitePurple
messageFromMeBackgroundColor: mauvePurple
messageFromMeTextColor: darkGreyPurple
messageFromMeTextColor: whitePurple
messageFromOtherBackgroundColor: deepPurple
messageFromOtherTextColor: whitePurple
messageStatusNormalColor: mauvePurple
messageStatusNormalColor: deepPurple
messageStatusBlockedColor: lightGrey
messageStatusBlockedTextColor: whitePurple
messageStatusAlertColor: darkGreyPurple
messageStatusAlertColor: mauvePurple
messageStatusAlertTextColor: whitePurple
}

View File

@ -19,10 +19,22 @@ ThemeType {
mainTextColor: darkPurple
altTextColor: purple
hilightElementTextColor: darkPurple
defaultButtonColor: hotPink
defaultButtonActiveColor: pink
defaultButtonTextColor: whitePurple
defaultButtonDisabledColor: purple
defaultButtonDisabledTextColor: whitePurple
altButtonColor: whitePurple
altButtonTextColor: purple
altButtonDisabledColor: softPurple
altButtonDisabledTextColor: purple
textfieldBackgroundColor: whitePurple
textfieldBorderColor: purple
textfieldTextColor: purple
textfieldButtonColor: purple
textfieldButtonTextColor: pink
portraitOnlineBorderColor: darkPurple
portraitOnlineBackgroundColor: darkPurple
@ -30,9 +42,9 @@ ThemeType {
portraitConnectingBorderColor: greyPurple
portraitConnectingBackgroundColor: greyPurple
portraitConnectingTextColor: greyPurple
portraitOfflineBorderColor: purple
portraitOfflineBackgroundColor: purple
portraitOfflineTextColor: purple
portraitOfflineBorderColor: greyPurple //purple
portraitOfflineBackgroundColor: greyPurple //purple
portraitOfflineTextColor: greyPurple//purple
portraitBlockedBorderColor: lightGrey
portraitBlockedBackgroundColor: lightGrey
portraitBlockedTextColor: lightGrey
@ -51,6 +63,8 @@ ThemeType {
sliderBarRightColor: purple
toolbarIconColor: darkPurple
toolbarMainColor: whitePurple
toolbarAltColor: softPurple
statusbarDisconnectedInternetColor: softPurple
statusbarDisconnectedInternetFontColor: darkPurple
@ -69,6 +83,6 @@ ThemeType {
messageStatusNormalColor: purple
messageStatusBlockedColor: lightGrey
messageStatusBlockedTextColor: whitePurple
messageStatusAlertColor: darkPurple
messageStatusAlertColor: hotPink
messageStatusAlertTextColor: whitePurple
}

View File

@ -12,10 +12,23 @@ Item {
readonly property color mainTextColor: theme.mainTextColor
readonly property color altTextColor: theme.altTextColor
readonly property color hilightElementTextColor: theme.hilightElementTextColor
readonly property color defaultButtonColor: theme.defaultButtonColor
readonly property color defaultButtonActiveColor: theme.defaultButtonActiveColor
readonly property color defaultButtonTextColor: theme.defaultButtonTextColor
readonly property color defaultButtonDisabledColor: theme.defaultButtonDisabledColor
readonly property color defaultButtonDisabledTextColor: theme.defaultButtonDisabledTextColor
readonly property color altButtonColor: theme.altButtonColor
readonly property color altButtonTextColor: theme.altButtonTextColor
readonly property color altButtonDisabledColor: theme.altButtonDisabledColor
readonly property color altButtonDisabledTextColor: theme.altButtonDisabledTextColor
readonly property color textfieldBackgroundColor: theme.textfieldBackgroundColor
readonly property color textfieldBorderColor: theme.textfieldBorderColor
readonly property color textfieldTextColor: theme.textfieldTextColor
readonly property color textfieldButtonColor: theme.textfieldButtonColor
readonly property color textfieldButtonTextColor: theme.textfieldButtonTextColor
readonly property color dropShadowColor: theme.dropShadowColor
readonly property color dropShadowPaneColor: theme.dropShadowPaneColor
@ -45,6 +58,8 @@ Item {
readonly property color sliderBarRightColor: theme.sliderBarRightColor
readonly property color toolbarIconColor: theme.toolbarIconColor
readonly property color toolbarMainColor: theme.toolbarMainColor
readonly property color toolbarAltColor: theme.toolbarAltColor
readonly property color statusbarDisconnectedInternetColor: theme.statusbarDisconnectedInternetColor
readonly property color statusbarDisconnectedInternetFontColor: theme.statusbarDisconnectedInternetFontColor

View File

@ -10,10 +10,22 @@ QtObject {
property color mainTextColor: "red"
property color altTextColor: "red"
property color hilightElementTextColor: "red"
property color defaultButtonColor: "red"
property color defaultButtonActiveColor: "red"
property color defaultButtonTextColor: "red"
property color defaultButtonDisabledColor: "red"
property color defaultButtonDisabledTextColor: "red"
property color altButtonColor: "red"
property color altButtonTextColor: "red"
property color altButtonDisabledColor: "red"
property color altButtonDisabledTextColor: "red"
property color textfieldBackgroundColor: "red"
property color textfieldBorderColor: "red"
property color textfieldTextColor: "red"
property color textfieldButtonColor: "red"
property color textfieldButtonTextColor: "red"
property color portraitOnlineBorderColor: "red"
property color portraitOnlineBackgroundColor: "red"
@ -42,6 +54,8 @@ QtObject {
property color sliderBarRightColor: "red"
property color toolbarIconColor: "red"
property color toolbarMainColor: "red"
property color toolbarAltColor: "red"
property color statusbarDisconnectedInternetColor: "red"
property color statusbarDisconnectedInternetFontColor: "red"