mirror of
https://github.com/subsurface/subsurface.git
synced 2024-11-28 13:10:19 +00:00
mobile-widgets/qml: create theme section and move themesettings
Move gridlayout themesetting to TemplateSection theme and use the TemplateTitle. Also switch from using PrefDisplay.mobile_scale to subsurfaceTheme.currentScale Signed-off-by: jan Iversen <jan@casacondor.com> Signed-off-by: Dirk Hohndel <dirk@hohndel.org>
This commit is contained in:
jan Iversen
Dirk Hohndel
parent
ba7a8f68bc
commit
0443d7f2c9
1 changed files with 190 additions and 194 deletions
|
|
@ -132,214 +132,210 @@ Kirigami.ScrollablePage {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
TemplateSection {
|
||||||
|
id: sectionTheme
|
||||||
|
title: qsTr("Theme")
|
||||||
|
|
||||||
GridLayout {
|
GridLayout {
|
||||||
id: themeSettings
|
id: themeSettings
|
||||||
columns: 3
|
visible: sectionTheme.isExpanded
|
||||||
|
columns: 3
|
||||||
|
|
||||||
TemplateLabel {
|
TemplateLabel {
|
||||||
text: qsTr("Theme")
|
text: qsTr("Blue")
|
||||||
font.pointSize: subsurfaceTheme.headingPointSize
|
rightPadding: Kirigami.Units.gridUnit
|
||||||
font.weight: Font.Light
|
Layout.preferredWidth: gridWidth * 0.15
|
||||||
Layout.topMargin: Kirigami.Units.largeSpacing
|
}
|
||||||
Layout.bottomMargin: Kirigami.Units.largeSpacing / 2
|
Row {
|
||||||
Layout.columnSpan: 3
|
Layout.preferredWidth: gridWidth * 0.6
|
||||||
}
|
Rectangle {
|
||||||
TemplateLabel {
|
id: blueRect
|
||||||
text: qsTr("Blue")
|
color: subsurfaceTheme.blueBackgroundColor
|
||||||
rightPadding: Kirigami.Units.gridUnit
|
border.color: "black"
|
||||||
Layout.preferredWidth: gridWidth * 0.15
|
width: sampleRegularBlue.width + Kirigami.Units.gridUnit
|
||||||
}
|
height: Kirigami.Units.gridUnit * 2
|
||||||
Row {
|
Text {
|
||||||
Layout.preferredWidth: gridWidth * 0.6
|
id: sampleRegularBlue
|
||||||
Rectangle {
|
text: qsTr("regular text")
|
||||||
id: blueRect
|
font.pointSize: subsurfaceTheme.regularPointSize
|
||||||
color: subsurfaceTheme.blueBackgroundColor
|
color: subsurfaceTheme.blueTextColor
|
||||||
border.color: "black"
|
anchors {
|
||||||
width: sampleRegularBlue.width + Kirigami.Units.gridUnit
|
horizontalCenter: parent.horizontalCenter
|
||||||
height: Kirigami.Units.gridUnit * 2
|
verticalCenter: parent.verticalCenter
|
||||||
Text {
|
}
|
||||||
id: sampleRegularBlue
|
}
|
||||||
text: qsTr("regular text")
|
}
|
||||||
font.pointSize: subsurfaceTheme.regularPointSize
|
Rectangle {
|
||||||
color: subsurfaceTheme.blueTextColor
|
color: subsurfaceTheme.bluePrimaryColor
|
||||||
anchors {
|
border.color: "black"
|
||||||
horizontalCenter: parent.horizontalCenter
|
width: sampleHighlightBlue.width + Kirigami.Units.gridUnit
|
||||||
verticalCenter: parent.verticalCenter
|
height: Kirigami.Units.gridUnit * 2
|
||||||
|
Text {
|
||||||
|
id: sampleHighlightBlue
|
||||||
|
text: qsTr("Highlight")
|
||||||
|
font.pointSize: subsurfaceTheme.regularPointSize
|
||||||
|
color: subsurfaceTheme.bluePrimaryTextColor
|
||||||
|
anchors {
|
||||||
|
horizontalCenter: parent.horizontalCenter
|
||||||
|
verticalCenter: parent.verticalCenter
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Rectangle {
|
SsrfSwitch {
|
||||||
color: subsurfaceTheme.bluePrimaryColor
|
id: blueButton
|
||||||
border.color: "black"
|
Layout.preferredWidth: gridWidth * 0.25
|
||||||
width: sampleHighlightBlue.width + Kirigami.Units.gridUnit
|
checked: subsurfaceTheme.currentTheme === "Blue"
|
||||||
height: Kirigami.Units.gridUnit * 2
|
enabled: subsurfaceTheme.currentTheme !== "Blue"
|
||||||
Text {
|
|
||||||
id: sampleHighlightBlue
|
|
||||||
text: qsTr("Highlight")
|
|
||||||
font.pointSize: subsurfaceTheme.regularPointSize
|
|
||||||
color: subsurfaceTheme.bluePrimaryTextColor
|
|
||||||
anchors {
|
|
||||||
horizontalCenter: parent.horizontalCenter
|
|
||||||
verticalCenter: parent.verticalCenter
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
SsrfSwitch {
|
|
||||||
id: blueButton
|
|
||||||
Layout.preferredWidth: gridWidth * 0.25
|
|
||||||
checked: subsurfaceTheme.currentTheme === "Blue"
|
|
||||||
enabled: subsurfaceTheme.currentTheme !== "Blue"
|
|
||||||
onClicked: {
|
|
||||||
blueTheme()
|
|
||||||
PrefDisplay.theme = subsurfaceTheme.currentTheme
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
TemplateLabel {
|
|
||||||
id: pinkLabel
|
|
||||||
text: qsTr("Pink")
|
|
||||||
rightPadding: Kirigami.Units.gridUnit
|
|
||||||
Layout.preferredWidth: gridWidth * 0.15
|
|
||||||
}
|
|
||||||
Row {
|
|
||||||
Layout.preferredWidth: gridWidth * 0.6
|
|
||||||
Rectangle {
|
|
||||||
id: pinkRect
|
|
||||||
color: subsurfaceTheme.pinkBackgroundColor
|
|
||||||
border.color: "black"
|
|
||||||
width: sampleRegularPink.width + Kirigami.Units.gridUnit
|
|
||||||
height: Kirigami.Units.gridUnit * 2
|
|
||||||
Text {
|
|
||||||
id: sampleRegularPink
|
|
||||||
text: qsTr("regular text")
|
|
||||||
font.pointSize: subsurfaceTheme.regularPointSize
|
|
||||||
color: subsurfaceTheme.pinkTextColor
|
|
||||||
anchors {
|
|
||||||
horizontalCenter: parent.horizontalCenter
|
|
||||||
verticalCenter: parent.verticalCenter
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Rectangle {
|
|
||||||
color: subsurfaceTheme.pinkPrimaryColor
|
|
||||||
border.color: "black"
|
|
||||||
width: sampleHighlightPink.width + Kirigami.Units.gridUnit
|
|
||||||
height: Kirigami.Units.gridUnit * 2
|
|
||||||
Text {
|
|
||||||
id: sampleHighlightPink
|
|
||||||
text: qsTr("Highlight")
|
|
||||||
font.pointSize: subsurfaceTheme.regularPointSize
|
|
||||||
color: subsurfaceTheme.pinkPrimaryTextColor
|
|
||||||
anchors {
|
|
||||||
horizontalCenter: parent.horizontalCenter
|
|
||||||
verticalCenter: parent.verticalCenter
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
SsrfSwitch {
|
|
||||||
id: pinkButton
|
|
||||||
Layout.preferredWidth: gridWidth * 0.25
|
|
||||||
checked: subsurfaceTheme.currentTheme === "Pink"
|
|
||||||
enabled: subsurfaceTheme.currentTheme !== "Pink"
|
|
||||||
onClicked: {
|
|
||||||
pinkTheme()
|
|
||||||
PrefDisplay.theme = subsurfaceTheme.currentTheme
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
TemplateLabel {
|
|
||||||
text: qsTr("Dark")
|
|
||||||
rightPadding: Kirigami.Units.gridUnit
|
|
||||||
Layout.preferredWidth: gridWidth * 0.15
|
|
||||||
}
|
|
||||||
Row {
|
|
||||||
Layout.preferredWidth: gridWidth * 0.6
|
|
||||||
Rectangle {
|
|
||||||
id: blackRect
|
|
||||||
color: subsurfaceTheme.darkBackgroundColor
|
|
||||||
border.color: "black"
|
|
||||||
width: sampleRegularDark.width + Kirigami.Units.gridUnit
|
|
||||||
height: Kirigami.Units.gridUnit * 2
|
|
||||||
Text {
|
|
||||||
id: sampleRegularDark
|
|
||||||
text: qsTr("regular text")
|
|
||||||
font.pointSize: subsurfaceTheme.regularPointSize
|
|
||||||
color: subsurfaceTheme.darkTextColor
|
|
||||||
anchors {
|
|
||||||
horizontalCenter: parent.horizontalCenter
|
|
||||||
verticalCenter: parent.verticalCenter
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Rectangle {
|
|
||||||
color: subsurfaceTheme.darkPrimaryColor
|
|
||||||
border.color: "black"
|
|
||||||
width: sampleHighlightDark.width + Kirigami.Units.gridUnit
|
|
||||||
height: Kirigami.Units.gridUnit * 2
|
|
||||||
Text {
|
|
||||||
id: sampleHighlightDark
|
|
||||||
text: qsTr("Highlight")
|
|
||||||
font.pointSize: subsurfaceTheme.regularPointSize
|
|
||||||
color: subsurfaceTheme.darkPrimaryTextColor
|
|
||||||
anchors {
|
|
||||||
horizontalCenter: parent.horizontalCenter
|
|
||||||
verticalCenter: parent.verticalCenter
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
SsrfSwitch {
|
|
||||||
id: darkButton
|
|
||||||
Layout.preferredWidth: gridWidth * 0.25
|
|
||||||
checked: subsurfaceTheme.currentTheme === "Dark"
|
|
||||||
enabled: subsurfaceTheme.currentTheme !== "Dark"
|
|
||||||
onClicked: {
|
|
||||||
darkTheme()
|
|
||||||
PrefDisplay.theme = subsurfaceTheme.currentTheme
|
|
||||||
}
|
|
||||||
}
|
|
||||||
TemplateLabel {
|
|
||||||
text: qsTr("Scaling")
|
|
||||||
font.pointSize: subsurfaceTheme.headingPointSize
|
|
||||||
font.weight: Font.Light
|
|
||||||
Layout.topMargin: Kirigami.Units.largeSpacing
|
|
||||||
Layout.bottomMargin: Kirigami.Units.largeSpacing / 2
|
|
||||||
Layout.columnSpan: 3
|
|
||||||
}
|
|
||||||
Row {
|
|
||||||
Layout.preferredWidth: gridWidth * 0.8
|
|
||||||
Layout.columnSpan: 3
|
|
||||||
spacing: Kirigami.Units.largeSpacing
|
|
||||||
SsrfButton {
|
|
||||||
text: qsTr("smaller")
|
|
||||||
enabled: PrefDisplay.mobile_scale !== 0.85
|
|
||||||
onClicked: {
|
onClicked: {
|
||||||
PrefDisplay.mobile_scale = 0.85
|
blueTheme()
|
||||||
fontMetrics.font.pointSize = subsurfaceTheme.basePointSize * PrefDisplay.mobile_scale;
|
PrefDisplay.theme = subsurfaceTheme.currentTheme
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
SsrfButton {
|
|
||||||
text: qsTr("regular")
|
TemplateLabel {
|
||||||
enabled: PrefDisplay.mobile_scale !== 1.0
|
id: pinkLabel
|
||||||
onClicked: {
|
text: qsTr("Pink")
|
||||||
PrefDisplay.mobile_scale = 1.0
|
rightPadding: Kirigami.Units.gridUnit
|
||||||
fontMetrics.font.pointSize = subsurfaceTheme.basePointSize * PrefDisplay.mobile_scale;
|
Layout.preferredWidth: gridWidth * 0.15
|
||||||
|
}
|
||||||
|
Row {
|
||||||
|
Layout.preferredWidth: gridWidth * 0.6
|
||||||
|
Rectangle {
|
||||||
|
id: pinkRect
|
||||||
|
color: subsurfaceTheme.pinkBackgroundColor
|
||||||
|
border.color: "black"
|
||||||
|
width: sampleRegularPink.width + Kirigami.Units.gridUnit
|
||||||
|
height: Kirigami.Units.gridUnit * 2
|
||||||
|
Text {
|
||||||
|
id: sampleRegularPink
|
||||||
|
text: qsTr("regular text")
|
||||||
|
font.pointSize: subsurfaceTheme.regularPointSize
|
||||||
|
color: subsurfaceTheme.pinkTextColor
|
||||||
|
anchors {
|
||||||
|
horizontalCenter: parent.horizontalCenter
|
||||||
|
verticalCenter: parent.verticalCenter
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Rectangle {
|
||||||
|
color: subsurfaceTheme.pinkPrimaryColor
|
||||||
|
border.color: "black"
|
||||||
|
width: sampleHighlightPink.width + Kirigami.Units.gridUnit
|
||||||
|
height: Kirigami.Units.gridUnit * 2
|
||||||
|
Text {
|
||||||
|
id: sampleHighlightPink
|
||||||
|
text: qsTr("Highlight")
|
||||||
|
font.pointSize: subsurfaceTheme.regularPointSize
|
||||||
|
color: subsurfaceTheme.pinkPrimaryTextColor
|
||||||
|
anchors {
|
||||||
|
horizontalCenter: parent.horizontalCenter
|
||||||
|
verticalCenter: parent.verticalCenter
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
SsrfButton {
|
|
||||||
text: qsTr("larger")
|
SsrfSwitch {
|
||||||
enabled: PrefDisplay.mobile_scale !== 1.15
|
id: pinkButton
|
||||||
|
Layout.preferredWidth: gridWidth * 0.25
|
||||||
|
checked: subsurfaceTheme.currentTheme === "Pink"
|
||||||
|
enabled: subsurfaceTheme.currentTheme !== "Pink"
|
||||||
onClicked: {
|
onClicked: {
|
||||||
PrefDisplay.mobile_scale = 1.15
|
pinkTheme()
|
||||||
fontMetrics.font.pointSize = subsurfaceTheme.basePointSize * PrefDisplay.mobile_scale;
|
PrefDisplay.theme = subsurfaceTheme.currentTheme
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
TemplateLabel {
|
||||||
|
text: qsTr("Dark")
|
||||||
|
rightPadding: Kirigami.Units.gridUnit
|
||||||
|
Layout.preferredWidth: gridWidth * 0.15
|
||||||
|
}
|
||||||
|
Row {
|
||||||
|
Layout.preferredWidth: gridWidth * 0.6
|
||||||
|
Rectangle {
|
||||||
|
id: blackRect
|
||||||
|
color: subsurfaceTheme.darkBackgroundColor
|
||||||
|
border.color: "black"
|
||||||
|
width: sampleRegularDark.width + Kirigami.Units.gridUnit
|
||||||
|
height: Kirigami.Units.gridUnit * 2
|
||||||
|
Text {
|
||||||
|
id: sampleRegularDark
|
||||||
|
text: qsTr("regular text")
|
||||||
|
font.pointSize: subsurfaceTheme.regularPointSize
|
||||||
|
color: subsurfaceTheme.darkTextColor
|
||||||
|
anchors {
|
||||||
|
horizontalCenter: parent.horizontalCenter
|
||||||
|
verticalCenter: parent.verticalCenter
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Rectangle {
|
||||||
|
color: subsurfaceTheme.darkPrimaryColor
|
||||||
|
border.color: "black"
|
||||||
|
width: sampleHighlightDark.width + Kirigami.Units.gridUnit
|
||||||
|
height: Kirigami.Units.gridUnit * 2
|
||||||
|
Text {
|
||||||
|
id: sampleHighlightDark
|
||||||
|
text: qsTr("Highlight")
|
||||||
|
font.pointSize: subsurfaceTheme.regularPointSize
|
||||||
|
color: subsurfaceTheme.darkPrimaryTextColor
|
||||||
|
anchors {
|
||||||
|
horizontalCenter: parent.horizontalCenter
|
||||||
|
verticalCenter: parent.verticalCenter
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
SsrfSwitch {
|
||||||
|
id: darkButton
|
||||||
|
Layout.preferredWidth: gridWidth * 0.25
|
||||||
|
checked: subsurfaceTheme.currentTheme === "Dark"
|
||||||
|
enabled: subsurfaceTheme.currentTheme !== "Dark"
|
||||||
|
onClicked: {
|
||||||
|
darkTheme()
|
||||||
|
PrefDisplay.theme = subsurfaceTheme.currentTheme
|
||||||
|
}
|
||||||
|
}
|
||||||
|
TemplateLabel {
|
||||||
|
text: qsTr("Scaling")
|
||||||
|
font.pointSize: subsurfaceTheme.headingPointSize
|
||||||
|
font.weight: Font.Light
|
||||||
|
Layout.topMargin: Kirigami.Units.largeSpacing
|
||||||
|
Layout.bottomMargin: Kirigami.Units.largeSpacing / 2
|
||||||
|
Layout.columnSpan: 3
|
||||||
|
}
|
||||||
|
Row {
|
||||||
|
Layout.preferredWidth: gridWidth * 0.8
|
||||||
|
Layout.columnSpan: 3
|
||||||
|
spacing: Kirigami.Units.largeSpacing
|
||||||
|
SsrfButton {
|
||||||
|
text: qsTr("smaller")
|
||||||
|
enabled: subsurfaceTheme.currentScale !== 0.85
|
||||||
|
onClicked: {
|
||||||
|
PrefDisplay.mobile_scale = 0.85
|
||||||
|
fontMetrics.font.pointSize = subsurfaceTheme.basePointSize * PrefDisplay.mobile_scale;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
SsrfButton {
|
||||||
|
text: qsTr("regular")
|
||||||
|
enabled: subsurfaceTheme.currentScale !== 1.0
|
||||||
|
onClicked: {
|
||||||
|
PrefDisplay.mobile_scale = 1.0
|
||||||
|
fontMetrics.font.pointSize = subsurfaceTheme.basePointSize * PrefDisplay.mobile_scale;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
SsrfButton {
|
||||||
|
text: qsTr("larger")
|
||||||
|
enabled: subsurfaceTheme.currentScale !== 1.15
|
||||||
|
onClicked: {
|
||||||
|
PrefDisplay.mobile_scale = 1.15
|
||||||
|
fontMetrics.font.pointSize = subsurfaceTheme.basePointSize * PrefDisplay.mobile_scale;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue