Added colors configuration options

This commit is contained in:
Eric Kotato 2018-03-05 15:59:25 +03:00
parent 765cfaed03
commit 31564b4501
8 changed files with 39 additions and 28 deletions

View file

@ -18,7 +18,15 @@ Create file `theme.conf.user` in theme folder. See `slice/theme.conf` for refere
### Available options ### Available options
* `font` - changes overall font. Defaults to `Roboto`. * `font` - overall font. Defaults to `Roboto`.
* `color_bg` - main background color. Defaults to `#222222`.
* `color_button_bg_idle` - button background color (in idle state). Defaults to `#888888`.
* `color_button_bg_hover` - button background color (in hover state). Defaults to `#aaaaaa`.
* `color_button_bg_selected` - selected button background color (in idle state). Defaults to `#dddddd`.
* `color_button_bg_selected_hover` - selected button background color (in hover state). Defaults to `#cccccc`.
* `color_button_text` - button text color (in any state). Defaults to `#1f1f1f`.
* `color_text` - main text and foreground elements color (such as progress bar and power icons). Defaults to `#dddddd`.
* `color_placeholder_text` - placeholder text color (in password field). Defaults to `#888888`.
## License ## License

View file

@ -42,14 +42,14 @@ Item
id: powerItemIconOverlay id: powerItemIconOverlay
anchors.fill: powerItemIcon anchors.fill: powerItemIcon
source: powerItemIcon source: powerItemIcon
color: "#dddddd" color: config.color_text
} }
Label Label
{ {
id: descriptionLabel id: descriptionLabel
text: itemRoot.title text: itemRoot.title
color: "#fff" color: config.color_text
font font
{ {

View file

@ -17,7 +17,7 @@ Item
id: sessionNameLabel id: sessionNameLabel
anchors.centerIn: parent anchors.centerIn: parent
text: sessionName text: sessionName
color: "#fff" color: config.color_text
font font
{ {

View file

@ -28,18 +28,10 @@ Item
sourceSize.height: 64 sourceSize.height: 64
} }
ColorOverlay
{
id: profilePictureOverlay
anchors.fill: profilePicture
source: profilePicture
color: "#dddddd"
}
Label Label
{ {
text: userName text: userName
color: "#fff" color: config.color_text
font font
{ {
@ -55,7 +47,7 @@ Item
Label Label
{ {
text: userLogin text: userLogin
color: "#fff" color: config.color_text
y: userName == "" ? 5 : 36 y: userName == "" ? 5 : 36
font font
{ {

View file

@ -7,7 +7,7 @@ import QtQuick.Controls 1.4
Rectangle Rectangle
{ {
id: root id: root
color: "#222222" color: config.color_bg
state: "stateUsers" state: "stateUsers"
states: states:

View file

@ -229,8 +229,8 @@ Item
style: TextFieldStyle style: TextFieldStyle
{ {
textColor: "#dddddd" textColor: config.color_text
placeholderTextColor: "#888888" placeholderTextColor: config.color_placeholder_text
background: Item { height: 25 } background: Item { height: 25 }
} }
@ -252,6 +252,7 @@ Item
width: parent.width width: parent.width
height: 2 height: 2
opacity: hasLoginShown ? 1 : 0 opacity: hasLoginShown ? 1 : 0
color: config.color_text
} }
Rectangle Rectangle
@ -262,6 +263,7 @@ Item
width: parent.width / 5 width: parent.width / 5
height: 2 height: 2
opacity: 0 opacity: 0
color: config.color_text
} }
Rectangle Rectangle
@ -272,6 +274,7 @@ Item
width: 0 width: 0
height: 2 height: 2
opacity: 0 opacity: 0
color: config.color_text
} }
SlicedButton SlicedButton
@ -309,7 +312,7 @@ Item
y: pageRoot.height / 4.7 y: pageRoot.height / 4.7
opacity: 0 opacity: 0
color: "#fff" color: config.color_text
font font
{ {

View file

@ -50,19 +50,19 @@ Item
PropertyChanges PropertyChanges
{ {
target: buttonBgSliceLeft; target: buttonBgSliceLeft;
bgColor: selected ? "#dddddd" : "#888888" bgColor: selected ? config.color_button_bg_selected : config.color_button_bg_idle
} }
PropertyChanges PropertyChanges
{ {
target: buttonBgCenter; target: buttonBgCenter;
color: selected ? "#dddddd" : "#888888" color: selected ? config.color_button_bg_selected : config.color_button_bg_idle
} }
PropertyChanges PropertyChanges
{ {
target: buttonBgSliceRight; target: buttonBgSliceRight;
bgColor: selected ? "#dddddd" : "#888888" bgColor: selected ? config.color_button_bg_selected : config.color_button_bg_idle
} }
}, },
State State
@ -71,19 +71,19 @@ Item
PropertyChanges PropertyChanges
{ {
target: buttonBgSliceLeft; target: buttonBgSliceLeft;
bgColor: selected ? "#cccccc" : "#aaaaaa" bgColor: selected ? config.color_button_bg_selected_hover : config.color_button_bg_hover
} }
PropertyChanges PropertyChanges
{ {
target: buttonBgCenter; target: buttonBgCenter;
color: selected ? "#cccccc" : "#aaaaaa" color: selected ? config.color_button_bg_selected_hover : config.color_button_bg_hover
} }
PropertyChanges PropertyChanges
{ {
target: buttonBgSliceRight; target: buttonBgSliceRight;
bgColor: selected ? "#cccccc" : "#aaaaaa" bgColor: selected ? config.color_button_bg_selected_hover : config.color_button_bg_hover
} }
} }
] ]
@ -94,7 +94,7 @@ Item
width: paddingLeft width: paddingLeft
height: parent.height height: parent.height
property string bgColor: "#888888" property string bgColor: config.color_button_bg_idle
onPaint: onPaint:
{ {
@ -130,7 +130,7 @@ Item
Rectangle Rectangle
{ {
id: buttonBgCenter id: buttonBgCenter
color: "#888888" color: config.color_button_bg_idle
x: paddingLeft x: paddingLeft
width: buttonText.width width: buttonText.width
height: parent.height height: parent.height
@ -162,7 +162,7 @@ Item
width: paddingRight width: paddingRight
height: parent.height height: parent.height
property string bgColor: "#888888" property string bgColor: config.color_button_bg_idle
onPaint: onPaint:
{ {
@ -196,7 +196,7 @@ Item
id: buttonText id: buttonText
x: paddingLeft x: paddingLeft
y: paddingTop y: paddingTop
color: "#1f1f1f" color: config.color_button_text
font font
{ {

View file

@ -1,2 +1,10 @@
[General] [General]
font=Roboto font=Roboto
color_bg=#222222
color_button_bg_idle=#888888
color_button_bg_hover=#aaaaaa
color_button_bg_selected=#dddddd
color_button_bg_selected_hover=#cccccc
color_button_text=#1f1f1f
color_text=#dddddd
color_placeholder_text=#888888