mirror of
https://github.com/subsurface/subsurface.git
synced 2025-01-20 06:45:27 +00:00
mobile-widgets/qml/settings.qml: show all colors
Show all colors in a theme, allowing user to change theme. This is preparation for allowing users to click on the individual colors and change them. Signed-off-by: jan Iversen <jan@casacondor.com>
This commit is contained in:
jan Iversen
Dirk Hohndel
parent
15fbcb655a
commit
c3be85fbd9
1 changed files with 157 additions and 146 deletions
|
|
@ -139,171 +139,181 @@ TemplatePage {
|
||||||
title: qsTr("Theme")
|
title: qsTr("Theme")
|
||||||
|
|
||||||
GridLayout {
|
GridLayout {
|
||||||
id: themeSettings
|
|
||||||
visible: sectionTheme.isExpanded
|
visible: sectionTheme.isExpanded
|
||||||
columns: 3
|
columns: 2
|
||||||
|
|
||||||
TemplateLabel {
|
TemplateComboBox {
|
||||||
text: qsTr("Blue")
|
editable: false
|
||||||
rightPadding: Kirigami.Units.gridUnit
|
Layout.columnSpan: 2
|
||||||
Layout.preferredWidth: gridWidth * 0.15
|
currentIndex: (ThemeNew.currentTheme === "Blue") ? 0 :
|
||||||
|
(ThemeNew.currentTheme === "Pink") ? 1 : 2
|
||||||
|
model: ListModel {
|
||||||
|
ListElement {text: qsTr("Blue")}
|
||||||
|
ListElement {text: qsTr("Pink")}
|
||||||
|
ListElement {text: qsTr("Dark")}
|
||||||
}
|
}
|
||||||
Row {
|
onActivated: {
|
||||||
Layout.preferredWidth: gridWidth * 0.6
|
ThemeNew.currentTheme = currentIndex === 0 ? "Blue" :
|
||||||
Rectangle {
|
currentIndex === 1 ? "Pink" : "Dark"
|
||||||
id: blueRect
|
|
||||||
color: ThemeNew.blueBackgroundColor
|
|
||||||
border.color: "black"
|
|
||||||
width: sampleRegularBlue.width + Kirigami.Units.gridUnit
|
|
||||||
height: Kirigami.Units.gridUnit * 2
|
|
||||||
Text {
|
|
||||||
id: sampleRegularBlue
|
|
||||||
text: qsTr("regular text")
|
|
||||||
font.pointSize: subsurfaceTheme.regularPointSize
|
|
||||||
color: ThemeNew.blueTextColor
|
|
||||||
anchors {
|
|
||||||
horizontalCenter: parent.horizontalCenter
|
|
||||||
verticalCenter: parent.verticalCenter
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
Rectangle {
|
|
||||||
color: ThemeNew.bluePrimaryColor
|
|
||||||
border.color: "black"
|
|
||||||
width: sampleHighlightBlue.width + Kirigami.Units.gridUnit
|
|
||||||
height: Kirigami.Units.gridUnit * 2
|
|
||||||
Text {
|
|
||||||
id: sampleHighlightBlue
|
|
||||||
text: qsTr("Highlight")
|
|
||||||
font.pointSize: subsurfaceTheme.regularPointSize
|
|
||||||
color: ThemeNew.bluePrimaryTextColor
|
|
||||||
anchors {
|
|
||||||
horizontalCenter: parent.horizontalCenter
|
|
||||||
verticalCenter: parent.verticalCenter
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
SsrfSwitch {
|
|
||||||
id: blueButton
|
|
||||||
Layout.preferredWidth: gridWidth * 0.25
|
|
||||||
checked: ThemeNew.currentTheme === "Blue"
|
|
||||||
enabled: ThemeNew.currentTheme !== "Blue"
|
|
||||||
onClicked: {
|
|
||||||
ThemeNew.currentTheme = "Blue"
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Rectangle {
|
||||||
|
border.width: 2
|
||||||
|
border.color: "black"
|
||||||
|
color: subsurfaceTheme.backgroundColor
|
||||||
|
|
||||||
|
width: rootItem.width / 2 - 20
|
||||||
|
height: subsurfaceTheme.regularPointSize + 10
|
||||||
|
|
||||||
TemplateLabel {
|
TemplateLabel {
|
||||||
id: pinkLabel
|
text: qsTr("background")
|
||||||
text: qsTr("Pink")
|
color: "black"
|
||||||
rightPadding: Kirigami.Units.gridUnit
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
Layout.preferredWidth: gridWidth * 0.15
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
}
|
|
||||||
Row {
|
|
||||||
Layout.preferredWidth: gridWidth * 0.6
|
|
||||||
Rectangle {
|
|
||||||
id: pinkRect
|
|
||||||
color: ThemeNew.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: ThemeNew.pinkTextColor
|
|
||||||
anchors {
|
|
||||||
horizontalCenter: parent.horizontalCenter
|
|
||||||
verticalCenter: parent.verticalCenter
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Rectangle {
|
Rectangle {
|
||||||
color: ThemeNew.pinkPrimaryColor
|
border.width: 2
|
||||||
border.color: "black"
|
border.color: "black"
|
||||||
width: sampleHighlightPink.width + Kirigami.Units.gridUnit
|
color: "white"
|
||||||
height: Kirigami.Units.gridUnit * 2
|
width: rootItem.width / 2 - 60
|
||||||
Text {
|
height: subsurfaceTheme.regularPointSize + 10
|
||||||
id: sampleHighlightPink
|
|
||||||
text: qsTr("Highlight")
|
TemplateLabel {
|
||||||
font.pointSize: subsurfaceTheme.regularPointSize
|
text: qsTr("text")
|
||||||
color: ThemeNew.pinkPrimaryTextColor
|
color: subsurfaceTheme.textColor
|
||||||
anchors {
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
horizontalCenter: parent.horizontalCenter
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
verticalCenter: parent.verticalCenter
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
SsrfSwitch {
|
Rectangle {
|
||||||
id: pinkButton
|
border.width: 2
|
||||||
Layout.preferredWidth: gridWidth * 0.25
|
border.color: "black"
|
||||||
checked: ThemeNew.currentTheme === "Pink"
|
color: subsurfaceTheme.primaryColor
|
||||||
enabled: ThemeNew.currentTheme !== "Pink"
|
|
||||||
onClicked: {
|
width: rootItem.width / 2 - 20
|
||||||
ThemeNew.currentTheme = "Pink"
|
height: subsurfaceTheme.regularPointSize + 10
|
||||||
|
|
||||||
|
TemplateLabel {
|
||||||
|
text: qsTr("primary")
|
||||||
|
color: "black"
|
||||||
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Rectangle {
|
||||||
|
border.width: 2
|
||||||
|
border.color: "black"
|
||||||
|
color: "white"
|
||||||
|
width: rootItem.width / 2 - 60
|
||||||
|
height: subsurfaceTheme.regularPointSize + 10
|
||||||
|
|
||||||
|
TemplateLabel {
|
||||||
|
text: qsTr("text")
|
||||||
|
color: subsurfaceTheme.primaryTextColor
|
||||||
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
TemplateLabel {
|
|
||||||
text: qsTr("Dark")
|
|
||||||
rightPadding: Kirigami.Units.gridUnit
|
|
||||||
Layout.preferredWidth: gridWidth * 0.15
|
|
||||||
}
|
|
||||||
Row {
|
|
||||||
Layout.preferredWidth: gridWidth * 0.6
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
id: blackRect
|
border.width: 2
|
||||||
color: ThemeNew.darkBackgroundColor
|
|
||||||
border.color: "black"
|
border.color: "black"
|
||||||
width: sampleRegularDark.width + Kirigami.Units.gridUnit
|
color: subsurfaceTheme.darkerPrimaryColor
|
||||||
height: Kirigami.Units.gridUnit * 2
|
|
||||||
Text {
|
width: rootItem.width / 2 - 20
|
||||||
id: sampleRegularDark
|
height: subsurfaceTheme.regularPointSize + 10
|
||||||
text: qsTr("regular text")
|
|
||||||
font.pointSize: subsurfaceTheme.regularPointSize
|
TemplateLabel {
|
||||||
color: ThemeNew.darkTextColor
|
text: qsTr("darker primary")
|
||||||
anchors {
|
color: "black"
|
||||||
horizontalCenter: parent.horizontalCenter
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
verticalCenter: parent.verticalCenter
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Rectangle {
|
Rectangle {
|
||||||
color: ThemeNew.darkPrimaryColor
|
border.width: 2
|
||||||
border.color: "black"
|
border.color: "black"
|
||||||
width: sampleHighlightDark.width + Kirigami.Units.gridUnit
|
color: "white"
|
||||||
height: Kirigami.Units.gridUnit * 2
|
width: rootItem.width / 2 - 60
|
||||||
Text {
|
height: subsurfaceTheme.regularPointSize + 10
|
||||||
id: sampleHighlightDark
|
|
||||||
text: qsTr("Highlight")
|
TemplateLabel {
|
||||||
font.pointSize: subsurfaceTheme.regularPointSize
|
text: qsTr("text")
|
||||||
color: ThemeNew.darkPrimaryTextColor
|
color: subsurfaceTheme.darkerPrimaryTextColor
|
||||||
anchors {
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
horizontalCenter: parent.horizontalCenter
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
verticalCenter: parent.verticalCenter
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Rectangle {
|
||||||
|
border.width: 2
|
||||||
|
border.color: "black"
|
||||||
|
color: subsurfaceTheme.lightPrimaryColor
|
||||||
|
|
||||||
|
width: rootItem.width / 2 - 20
|
||||||
|
height: subsurfaceTheme.regularPointSize + 10
|
||||||
|
|
||||||
|
TemplateLabel {
|
||||||
|
text: qsTr("light primary")
|
||||||
|
color: "black"
|
||||||
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
SsrfSwitch {
|
Rectangle {
|
||||||
id: darkButton
|
border.width: 2
|
||||||
Layout.preferredWidth: gridWidth * 0.25
|
border.color: "black"
|
||||||
checked: ThemeNew.currentTheme === "Dark"
|
color: "white"
|
||||||
enabled: ThemeNew.currentTheme !== "Dark"
|
width: rootItem.width / 2 - 60
|
||||||
onClicked: {
|
height: subsurfaceTheme.regularPointSize + 10
|
||||||
ThemeNew.currentTheme = "Dark"
|
|
||||||
|
TemplateLabel {
|
||||||
|
text: qsTr("text")
|
||||||
|
color: subsurfaceTheme.lightPrimaryTextColor
|
||||||
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
TemplateLabel {
|
||||||
|
text: ""
|
||||||
|
}
|
||||||
|
Rectangle {
|
||||||
|
border.width: 2
|
||||||
|
border.color: "black"
|
||||||
|
color: "white"
|
||||||
|
width: rootItem.width / 2 - 60
|
||||||
|
height: subsurfaceTheme.regularPointSize + 10
|
||||||
|
|
||||||
|
TemplateLabel {
|
||||||
|
text: qsTr("secondary text")
|
||||||
|
color: subsurfaceTheme.secondaryTextColor
|
||||||
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Rectangle {
|
||||||
|
border.width: 2
|
||||||
|
border.color: "black"
|
||||||
|
color: subsurfaceTheme.drawerColor
|
||||||
|
|
||||||
|
width: rootItem.width / 2 - 20
|
||||||
|
height: subsurfaceTheme.regularPointSize + 10
|
||||||
|
|
||||||
|
TemplateLabel {
|
||||||
|
text: qsTr("drawer")
|
||||||
|
color: "black"
|
||||||
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
TemplateLabel {
|
TemplateLabel {
|
||||||
text: qsTr("Scaling")
|
text: ""
|
||||||
font.pointSize: subsurfaceTheme.headingPointSize
|
|
||||||
font.weight: Font.Light
|
|
||||||
Layout.topMargin: Kirigami.Units.largeSpacing
|
|
||||||
Layout.bottomMargin: Kirigami.Units.largeSpacing / 2
|
|
||||||
Layout.columnSpan: 3
|
|
||||||
}
|
}
|
||||||
Row {
|
Row {
|
||||||
Layout.preferredWidth: gridWidth * 0.8
|
Layout.preferredWidth: gridWidth * 0.8
|
||||||
|
|
@ -331,9 +341,10 @@ TemplatePage {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Rectangle {
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
TemplateSection {
|
TemplateSection {
|
||||||
id: sectionUnits
|
id: sectionUnits
|
||||||
title: qsTr("Units")
|
title: qsTr("Units")
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue