QML UI: use consistent, darker text color for dive list

We received suggestions from users to darken the text color in the dive
list a bit and this does seem to be a lot more readable. Especially since
people are likely to use this outdoors the higher contrast seems
reasonable.

Signed-off-by: Dirk Hohndel <dirk@hohndel.org>
This commit is contained in:
Dirk Hohndel 2016-03-22 11:36:11 -07:00
parent 77e1c2afa9
commit e8f8051efe
2 changed files with 11 additions and 6 deletions

View file

@ -13,7 +13,7 @@ MobileComponents.Page {
property int credentialStatus: manager.credentialStatus
property int numDives: diveListView.count
property color textColor: subsurfaceTheme.diveListTextColor
Component {
id: diveDelegate
MobileComponents.ListItem {
@ -43,6 +43,7 @@ MobileComponents.Page {
font.weight: Font.Light
elide: Text.ElideRight
maximumLineCount: 1 // needed for elide to work at all
color: textColor
anchors {
left: parent.left
leftMargin: horizontalPadding
@ -53,8 +54,8 @@ MobileComponents.Page {
MobileComponents.Label {
id: dateLabel
text: dive.date + " " + dive.time
opacity: 0.6
font.pointSize: subsurfaceTheme.smallPointSize
color: textColor
anchors {
right: parent.right
top: parent.top
@ -70,30 +71,31 @@ MobileComponents.Page {
}
MobileComponents.Label {
text: 'Depth: '
opacity: 0.6
font.pointSize: subsurfaceTheme.smallPointSize
color: textColor
}
MobileComponents.Label {
text: dive.depth
width: Math.max(MobileComponents.Units.gridUnit * 3, paintedWidth) // helps vertical alignment throughout listview
font.pointSize: subsurfaceTheme.smallPointSize
color: textColor
}
MobileComponents.Label {
text: 'Duration: '
opacity: 0.6
font.pointSize: subsurfaceTheme.smallPointSize
color: textColor
}
MobileComponents.Label {
text: dive.duration
font.pointSize: subsurfaceTheme.smallPointSize
color: textColor
}
}
MobileComponents.Label {
id: numberText
text: "#" + dive.number
color: MobileComponents.Theme.textColor
font.pointSize: subsurfaceTheme.smallPointSize
opacity: 0.6
color: textColor
anchors {
right: parent.right
top: locationText.bottom
@ -131,6 +133,7 @@ MobileComponents.Page {
leftMargin: MobileComponents.Units.gridUnit / 2
right: parent.right
}
color: textColor
level: 2
}
Rectangle {
@ -179,6 +182,7 @@ MobileComponents.Page {
height: paintedHeight + MobileComponents.Units.gridUnit / 2
verticalAlignment: Text.AlignBottom
text: "Dive Log"
color: textColor
}
Connections {
target: detailsWindow

View file

@ -255,6 +255,7 @@ MobileComponents.ApplicationWindow {
property color accentColor: "#2d5b9a"
property color shadedColor: "#132744"
property color accentTextColor: "#ececec"
property color diveListTextColor: Qt.rgba(0,0,0,0.76) // the Kirigami theme text color is too light
property int columnWidth: Math.round(rootItem.width/(MobileComponents.Units.gridUnit*30)) > 0 ? Math.round(rootItem.width / Math.round(rootItem.width/(MobileComponents.Units.gridUnit*30))) : rootItem.width
}