GitHub-Proxy/Cura
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/Ultimaker/Cura synced 2025-05-21 20:19:32 +08:00
Code Issues Packages Projects Releases Wiki Activity

Add theme colors

Browse Source 
Contributes to CL-1212
This commit is contained in:
Ian Paschal 2019-01-21 13:07:16 +01:00
parent 1369c98ea6
commit 2e5eb61144
14 changed files with 70 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
plugins/UM3NetworkPrinting/resources/qml/CameraButton.qml
View File

@ -9,30 +9,35 @@ import Cura 1.0 as Cura
Rectangle { Rectangle {
id: base id: base
property var iconSource: null;
color: "#0a0850" // TODO: Theme!
height: width;
radius: Math.round(0.5 * width);
width: 24 * screenScaleFactor;
property var enabled: true property var enabled: true
property var iconSource: null
UM.RecolorImage { color: UM.Theme.getColor("small_button_active")
id: icon; height: UM.Theme.getSize("small_button").height
anchors { radius: Math.round(0.5 * width)
horizontalCenter: parent.horizontalCenter; width: UM.Theme.getSize("small_button").width
verticalCenter: parent.verticalCenter;
UM.RecolorImage
{
id: icon
anchors
{
horizontalCenter: parent.horizontalCenter
verticalCenter: parent.verticalCenter
} }
color: UM.Theme.getColor("primary_text"); color: UM.Theme.getColor("small_button_text_active")
height: width; height: Math.round(parent.height / 2)
source: iconSource; source: iconSource
width: Math.round(parent.width / 2); width: Math.round(parent.width / 2)
} }
MouseArea { MouseArea
id: clickArea; {
anchors.fill: parent; id: clickArea
anchors.fill: parent
hoverEnabled: base.enabled hoverEnabled: base.enabled
onClicked: { onClicked:
{
if (base.enabled) if (base.enabled)
{ {
if (OutputDevice.activeCameraUrl != "") if (OutputDevice.activeCameraUrl != "")

21
plugins/UM3NetworkPrinting/resources/qml/ExpandableCard.qml
View File

@ -6,21 +6,22 @@ import QtQuick.Controls 2.0
import UM 1.3 as UM import UM 1.3 as UM
import Cura 1.0 as Cura import Cura 1.0 as Cura
// TODO: Theme & documentation! /**
// The expandable component has 3 major sub components: * The expandable component has 3 major sub components:
// * The headerItem Always visible and should hold some info about what happens if the component is expanded * - The headerItem Always visible and should hold some info about what happens if the component is expanded
// * The popupItem The content that needs to be shown if the component is expanded. * - The popupItem The content that needs to be shown if the component is expanded.
*/
Item Item
{ {
id: base id: base
property bool expanded: false property bool expanded: false
property bool enabled: true property bool enabled: true
property var borderWidth: 1 property var borderWidth: UM.Theme.getSize("default_lining")
property color borderColor: "#CCCCCC" property color borderColor: UM.Theme.getColor("wide_lining")
property color headerBackgroundColor: "white" property color headerBackgroundColor: UM.Theme.getColor("main_background")
property color headerHoverColor: "#e8f2fc" property color headerHoverColor: UM.Theme.getColor("action_button_hovered")
property color drawerBackgroundColor: "white" property color drawerBackgroundColor: UM.Theme.getColor("main_background")
property alias headerItem: header.children property alias headerItem: header.children
property alias drawerItem: drawer.children property alias drawerItem: drawer.children
@ -65,7 +66,7 @@ Item
anchors anchors
{ {
top: header.bottom top: header.bottom
topMargin: -1 topMargin: UM.Theme.getSize("default_lining") * -1
} }
border border
{ {

4
plugins/UM3NetworkPrinting/resources/qml/MonitorBuildplateConfiguration.qml
View File

@ -49,7 +49,7 @@ Item
{ {
id: buildplateIcon id: buildplateIcon
anchors.centerIn: parent anchors.centerIn: parent
color: "#0a0850" // TODO: Theme! (Standard purple) color: UM.Theme.getColor("small_button_active")
height: parent.height height: parent.height
source: "../svg/icons/buildplate.svg" source: "../svg/icons/buildplate.svg"
width: height width: height
@ -60,7 +60,7 @@ Item
Label Label
{ {
id: buildplateLabel id: buildplateLabel
color: "#191919" // TODO: Theme! color: UM.Theme.getColor("text")
elide: Text.ElideRight elide: Text.ElideRight
font: UM.Theme.getFont("default") // 12pt, regular font: UM.Theme.getFont("default") // 12pt, regular
text: buildplate ? buildplate : "" text: buildplate ? buildplate : ""

12
plugins/UM3NetworkPrinting/resources/qml/MonitorCarousel.qml
View File

@ -82,9 +82,9 @@ Item
onClicked: navigateTo(currentIndex - 1) onClicked: navigateTo(currentIndex - 1)
background: Rectangle background: Rectangle
{ {
color: leftButton.hovered ? "#e8f2fc" : "#ffffff" // TODO: Theme! color: leftButton.hovered ? UM.Theme.getColor("action_button_hovered") : UM.Theme.getColor("action_button")
border.width: 1 * screenScaleFactor // TODO: Theme! border.width: 1 * screenScaleFactor // TODO: Theme!
border.color: "#cccccc" // TODO: Theme! border.color: UM.Theme.getColor("wide_lining")
radius: 2 * screenScaleFactor // TODO: Theme! radius: 2 * screenScaleFactor // TODO: Theme!
} }
contentItem: Item contentItem: Item
@ -94,10 +94,10 @@ Item
{ {
anchors.centerIn: parent anchors.centerIn: parent
width: 18 // TODO: Theme! width: 18 // TODO: Theme!
height: width // TODO: Theme! height: width
sourceSize.width: width // TODO: Theme! sourceSize.width: width
sourceSize.height: width // TODO: Theme! sourceSize.height: width
color: "#152950" // TODO: Theme! color: UM.Theme.getColor("text")
source: UM.Theme.getIcon("arrow_left") source: UM.Theme.getIcon("arrow_left")
} }
} }

10
plugins/UM3NetworkPrinting/resources/qml/MonitorExtruderConfiguration.qml
View File

@ -36,7 +36,7 @@ Item
MonitorIconExtruder MonitorIconExtruder
{ {
id: extruderIcon id: extruderIcon
color: "#eeeeee" // TODO: Theme! color: UM.Theme.getColor("secondary")
position: 0 position: 0
} }
@ -48,8 +48,8 @@ Item
left: extruderIcon.right left: extruderIcon.right
leftMargin: 12 * screenScaleFactor // TODO: Theme! leftMargin: 12 * screenScaleFactor // TODO: Theme!
} }
color: materialLabel.visible > 0 ? "transparent" : "#eeeeee" // TODO: Theme!
height: 18 * screenScaleFactor // TODO: Theme! height: 18 * screenScaleFactor // TODO: Theme!
color: materialLabel.visible > 0 ? "transparent" : UM.Theme.getColor("secondary")
width: Math.max(materialLabel.contentWidth, 60 * screenScaleFactor) // TODO: Theme! width: Math.max(materialLabel.contentWidth, 60 * screenScaleFactor) // TODO: Theme!
radius: 2 * screenScaleFactor // TODO: Theme! radius: 2 * screenScaleFactor // TODO: Theme!
@ -57,7 +57,7 @@ Item
{ {
id: materialLabel id: materialLabel
color: "#191919" // TODO: Theme! color: UM.Theme.getColor("text")
elide: Text.ElideRight elide: Text.ElideRight
font: UM.Theme.getFont("default") // 12pt, regular font: UM.Theme.getFont("default") // 12pt, regular
text: "" text: ""
@ -77,8 +77,8 @@ Item
left: materialLabelWrapper.left left: materialLabelWrapper.left
bottom: parent.bottom bottom: parent.bottom
} }
color: printCoreLabel.visible > 0 ? "transparent" : "#eeeeee" // TODO: Theme!
height: 18 * screenScaleFactor // TODO: Theme! height: 18 * screenScaleFactor // TODO: Theme!
color: printCoreLabel.visible > 0 ? "transparent" : UM.Theme.getColor("secondary")
width: Math.max(printCoreLabel.contentWidth, 36 * screenScaleFactor) // TODO: Theme! width: Math.max(printCoreLabel.contentWidth, 36 * screenScaleFactor) // TODO: Theme!
radius: 2 * screenScaleFactor // TODO: Theme! radius: 2 * screenScaleFactor // TODO: Theme!
@ -86,7 +86,7 @@ Item
{ {
id: printCoreLabel id: printCoreLabel
color: "#191919" // TODO: Theme! color: UM.Theme.getColor("text")
elide: Text.ElideRight elide: Text.ElideRight
font: UM.Theme.getFont("default_bold") // 12pt, bold font: UM.Theme.getFont("default_bold") // 12pt, bold
text: "" text: ""

14
plugins/UM3NetworkPrinting/resources/qml/MonitorPrintJobCard.qml
View File

@ -49,7 +49,7 @@ Item
width: 216 * screenScaleFactor // TODO: Theme! (Should match column size) width: 216 * screenScaleFactor // TODO: Theme! (Should match column size)
Rectangle Rectangle
{ {
color: "#eeeeee" color: UM.Theme.getColor("secondary")
width: Math.round(parent.width / 2) width: Math.round(parent.width / 2)
height: parent.height height: parent.height
visible: !printJob visible: !printJob
@ -57,7 +57,7 @@ Item
Label Label
{ {
text: printJob && printJob.name ? printJob.name : "" text: printJob && printJob.name ? printJob.name : ""
color: "#374355" color: UM.Theme.getColor("text")
elide: Text.ElideRight elide: Text.ElideRight
font: UM.Theme.getFont("medium") // 14pt, regular font: UM.Theme.getFont("medium") // 14pt, regular
visible: printJob visible: printJob
@ -75,7 +75,7 @@ Item
width: 216 * screenScaleFactor // TODO: Theme! (Should match column size) width: 216 * screenScaleFactor // TODO: Theme! (Should match column size)
Rectangle Rectangle
{ {
color: "#eeeeee" color: UM.Theme.getColor("secondary")
width: Math.round(parent.width / 3) width: Math.round(parent.width / 3)
height: parent.height height: parent.height
visible: !printJob visible: !printJob
@ -83,7 +83,7 @@ Item
Label Label
{ {
text: printJob ? OutputDevice.formatDuration(printJob.timeTotal) : "" text: printJob ? OutputDevice.formatDuration(printJob.timeTotal) : ""
color: "#374355" color: UM.Theme.getColor("text")
elide: Text.ElideRight elide: Text.ElideRight
font: UM.Theme.getFont("medium") // 14pt, regular font: UM.Theme.getFont("medium") // 14pt, regular
visible: printJob visible: printJob
@ -102,7 +102,7 @@ Item
Rectangle Rectangle
{ {
color: "#eeeeee" color: UM.Theme.getColor("secondary")
width: 72 * screenScaleFactor // TODO: Theme! width: 72 * screenScaleFactor // TODO: Theme!
height: parent.height height: parent.height
visible: !printJob visible: !printJob
@ -112,7 +112,7 @@ Item
{ {
id: printerAssignmentLabel id: printerAssignmentLabel
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
color: "#374355" color: UM.Theme.getColor("text")
elide: Text.ElideRight elide: Text.ElideRight
font: UM.Theme.getFont("medium") // 14pt, regular font: UM.Theme.getFont("medium") // 14pt, regular
text: { text: {
@ -186,7 +186,7 @@ Item
} }
Label { Label {
text: printJob && printJob.owner ? printJob.owner : "" text: printJob && printJob.owner ? printJob.owner : ""
color: "#374355" // TODO: Theme! color: UM.Theme.getColor("text")
elide: Text.ElideRight elide: Text.ElideRight
font: UM.Theme.getFont("medium") // 14pt, regular font: UM.Theme.getFont("medium") // 14pt, regular
anchors.top: printerConfiguration.top anchors.top: printerConfiguration.top

2
plugins/UM3NetworkPrinting/resources/qml/MonitorPrintJobPreview.qml
View File

@ -19,7 +19,7 @@ Item
Rectangle Rectangle
{ {
anchors.fill: parent anchors.fill: parent
color: printJob ? "transparent" : "#eeeeee" // TODO: Theme! color: printJob ? "transparent" : UM.Theme.getColor("secondary")
radius: 8 // TODO: Theme! radius: 8 // TODO: Theme!
Image Image
{ {

8
plugins/UM3NetworkPrinting/resources/qml/MonitorPrintJobProgressBar.qml
View File

@ -34,16 +34,16 @@ Item
{ {
background: Rectangle background: Rectangle
{ {
color: "#f5f5f5" // TODO: Theme!
implicitHeight: visible ? 8 * screenScaleFactor : 0 // TODO: Theme! implicitHeight: visible ? 8 * screenScaleFactor : 0 // TODO: Theme!
color: UM.Theme.getColor("progressbar_background")
implicitWidth: 180 * screenScaleFactor // TODO: Theme! implicitWidth: 180 * screenScaleFactor // TODO: Theme!
radius: 2 * screenScaleFactor // TODO: Theme! radius: 2 * screenScaleFactor // TODO: Theme!
} }
progress: Rectangle progress: Rectangle
{ {
id: progressItem; id: progressItem;
color: printJob && printJob.isActive ? "#3282ff" : "#CCCCCC" // TODO: Theme!
radius: 2 * screenScaleFactor // TODO: Theme! radius: 2 * screenScaleFactor // TODO: Theme!
color: printJob && printJob.isActive ? UM.Theme.getColor("progressbar_control") : UM.Theme.getColor("progressbar_disabled")
} }
} }
} }
@ -56,7 +56,7 @@ Item
leftMargin: 18 * screenScaleFactor // TODO: Theme! leftMargin: 18 * screenScaleFactor // TODO: Theme!
} }
text: printJob ? Math.round(printJob.progress * 100) + "%" : "0%" text: printJob ? Math.round(printJob.progress * 100) + "%" : "0%"
color: printJob && printJob.isActive ? "#374355" : "#babac1" // TODO: Theme! color: printJob && printJob.isActive ? UM.Theme.getColor("text") : UM.Theme.getColor("text_inactive")
width: contentWidth width: contentWidth
font: UM.Theme.getFont("medium") // 14pt, regular font: UM.Theme.getFont("medium") // 14pt, regular
@ -72,7 +72,7 @@ Item
left: percentLabel.right left: percentLabel.right
leftMargin: 18 * screenScaleFactor // TODO: Theme! leftMargin: 18 * screenScaleFactor // TODO: Theme!
} }
color: "#374355" // TODO: Theme! color: UM.Theme.getColor("text")
font: UM.Theme.getFont("medium") // 14pt, regular font: UM.Theme.getFont("medium") // 14pt, regular
text: text:
{ {

6
plugins/UM3NetworkPrinting/resources/qml/MonitorPrinterCard.qml
View File

@ -69,7 +69,7 @@ Item
id: printerImage id: printerImage
width: 108 * screenScaleFactor // TODO: Theme! width: 108 * screenScaleFactor // TODO: Theme!
height: 108 * screenScaleFactor // TODO: Theme! height: 108 * screenScaleFactor // TODO: Theme!
color: printer ? "transparent" : "#eeeeee" // TODO: Theme! color: printer ? "transparent" : UM.Theme.getColor("secondary")
radius: 8 // TODO: Theme! radius: 8 // TODO: Theme!
Image Image
{ {
@ -94,8 +94,8 @@ Item
{ {
id: printerNameLabel id: printerNameLabel
// color: "#414054" // TODO: Theme! // color: "#414054" // TODO: Theme!
color: printer ? "transparent" : "#eeeeee" // TODO: Theme!
height: 18 * screenScaleFactor // TODO: Theme! height: 18 * screenScaleFactor // TODO: Theme!
color: printer ? "transparent" : UM.Theme.getColor("secondary")
width: parent.width width: parent.width
radius: 2 * screenScaleFactor // TODO: Theme! radius: 2 * screenScaleFactor // TODO: Theme!
@ -116,8 +116,8 @@ Item
Rectangle Rectangle
{ {
color: "#eeeeee" // TODO: Theme!
height: 18 * screenScaleFactor // TODO: Theme! height: 18 * screenScaleFactor // TODO: Theme!
color: UM.Theme.getColor("secondary")
radius: 2 * screenScaleFactor // TODO: Theme! radius: 2 * screenScaleFactor // TODO: Theme!
visible: !printer visible: !printer
width: 48 * screenScaleFactor // TODO: Theme! width: 48 * screenScaleFactor // TODO: Theme!

2
plugins/UM3NetworkPrinting/resources/qml/MonitorPrinterConfiguration.qml
View File

@ -37,7 +37,7 @@ Item
MonitorExtruderConfiguration MonitorExtruderConfiguration
{ {
color: modelData && modelData.activeMaterial ? modelData.activeMaterial.color : "#eeeeee" // TODO: Theme! color: modelData && modelData.activeMaterial ? modelData.activeMaterial.color : UM.Theme.getColor("secondary")
material: modelData && modelData.activeMaterial ? modelData.activeMaterial.name : "" material: modelData && modelData.activeMaterial ? modelData.activeMaterial.name : ""
position: modelData && typeof(modelData.position) === "number" ? modelData.position : -1 // Use negative one to create empty extruder number position: modelData && typeof(modelData.position) === "number" ? modelData.position : -1 // Use negative one to create empty extruder number
printCore: modelData ? modelData.hotendID : "" printCore: modelData ? modelData.hotendID : ""

4
plugins/UM3NetworkPrinting/resources/qml/MonitorPrinterPill.qml
View File

@ -32,14 +32,14 @@ Item
Rectangle { Rectangle {
id: background id: background
anchors.fill: parent anchors.fill: parent
color: printerNameLabel.visible ? "#e4e4f2" : "#eeeeee"// TODO: Theme! color: printerNameLabel.visible ? UM.Theme.getColor("printer_type_label_background") : UM.Theme.getColor("secondary")
radius: 2 * screenScaleFactor // TODO: Theme! radius: 2 * screenScaleFactor // TODO: Theme!
} }
Label { Label {
id: printerNameLabel id: printerNameLabel
anchors.centerIn: parent anchors.centerIn: parent
color: "#535369" // TODO: Theme! color: UM.Theme.getColor("text")
text: tagText text: tagText
font.pointSize: 10 // TODO: Theme! font.pointSize: 10 // TODO: Theme!
visible: text !== "" visible: text !== ""

6
plugins/UM3NetworkPrinting/resources/qml/MonitorQueue.qml
View File

@ -94,7 +94,7 @@ Item
Label Label
{ {
text: catalog.i18nc("@label", "Print jobs") text: catalog.i18nc("@label", "Print jobs")
color: "#666666" color: UM.Theme.getColor("text_scene")
elide: Text.ElideRight elide: Text.ElideRight
font: UM.Theme.getFont("medium") // 14pt, regular font: UM.Theme.getFont("medium") // 14pt, regular
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
@ -108,7 +108,7 @@ Item
Label Label
{ {
text: catalog.i18nc("@label", "Total print time") text: catalog.i18nc("@label", "Total print time")
color: "#666666" color: UM.Theme.getColor("text_scene")
elide: Text.ElideRight elide: Text.ElideRight
font: UM.Theme.getFont("medium") // 14pt, regular font: UM.Theme.getFont("medium") // 14pt, regular
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
@ -122,7 +122,7 @@ Item
Label Label
{ {
text: catalog.i18nc("@label", "Waiting for") text: catalog.i18nc("@label", "Waiting for")
color: "#666666" color: UM.Theme.getColor("text_scene")
elide: Text.ElideRight elide: Text.ElideRight
font: UM.Theme.getFont("medium") // 14pt, regular font: UM.Theme.getFont("medium") // 14pt, regular
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter

2
plugins/UM3NetworkPrinting/resources/qml/PrintJobContextMenu.qml
View File

@ -18,7 +18,7 @@ Item {
Button { Button {
id: button; id: button;
background: Rectangle { background: Rectangle {
color: UM.Theme.getColor("viewport_background"); // TODO: Theme! color: UM.Theme.getColor("viewport_background")
height: button.height; height: button.height;
opacity: button.down || button.hovered ? 1 : 0; opacity: button.down || button.hovered ? 1 : 0;
radius: Math.round(0.5 * width); radius: Math.round(0.5 * width);

1
resources/themes/cura-light/theme.json
View File

@ -298,6 +298,7 @@
"progressbar_background": [245, 245, 245, 255], "progressbar_background": [245, 245, 245, 255],
"progressbar_control": [50, 130, 255, 255], "progressbar_control": [50, 130, 255, 255],
"progressbar_disabled": [204, 204, 204, 255],
"slider_groove": [223, 223, 223, 255], "slider_groove": [223, 223, 223, 255],
"slider_groove_fill": [8, 7, 63, 255], "slider_groove_fill": [8, 7, 63, 255],