diff --git a/resources/qml/Topbar.qml b/resources/qml/Topbar.qml index e29b9abf86..c5d46873cb 100644 --- a/resources/qml/Topbar.qml +++ b/resources/qml/Topbar.qml @@ -64,53 +64,21 @@ Rectangle checked: !base.monitoringPrint exclusiveGroup: sidebarHeaderBarGroup - style: UM.Theme.styles.topbar_header_tab + style: UM.Theme.styles.topbar_header_tab } Button { id: showMonitor + width: UM.Theme.getSize("topbar_button").width height: UM.Theme.getSize("sidebar_header").height onClicked: base.startMonitoringPrint() text: catalog.i18nc("@title:tab", "Monitor") - iconSource: UM.Theme.getIcon("tab_monitor") - property color overlayColor: - { - if(!printerAcceptsCommands) - { - return UM.Theme.getColor("status_unknown"); - } - - if(Cura.MachineManager.printerOutputDevices[0].printerState == "maintenance") - { - return UM.Theme.getColor("status_busy"); - } - switch(Cura.MachineManager.printerOutputDevices[0].jobState) - { - case "printing": - case "pre_print": - case "wait_cleanup": - case "pausing": - case "resuming": - return UM.Theme.getColor("status_busy"); - case "ready": - case "": - return UM.Theme.getColor("status_ready"); - case "paused": - return UM.Theme.getColor("status_paused"); - case "error": - return UM.Theme.getColor("status_stopped"); - case "offline": - return UM.Theme.getColor("status_offline"); - default: - return UM.Theme.getColor("text_reversed"); - } - } - property string overlayIconSource: + property string iconSource: { if(!printerConnected) { - return ""; + return UM.Theme.getIcon("tab_status_unknown"); } else if(!printerAcceptsCommands) { @@ -138,7 +106,7 @@ Rectangle case "error": return UM.Theme.getIcon("tab_status_stopped") default: - return "" + return UM.Theme.getIcon("tab_status_unknown") } } @@ -146,7 +114,7 @@ Rectangle checked: base.monitoringPrint exclusiveGroup: sidebarHeaderBarGroup - style: UM.Theme.styles.topbar_header_tab + style: UM.Theme.styles.topbar_header_tab_no_overlay } ExclusiveGroup { id: sidebarHeaderBarGroup } @@ -215,7 +183,7 @@ Rectangle text: control.text; elide: Text.ElideRight; anchors.left: parent.left; - anchors.leftMargin: UM.Theme.getSize("default_margin").width + anchors.leftMargin: UM.Theme.getSize("default_margin").width * 2 anchors.right: downArrow.left; anchors.rightMargin: control.rightMargin; anchors.verticalCenter: parent.verticalCenter; diff --git a/resources/themes/cura-light/icons/tab_monitor.svg b/resources/themes/cura-light/icons/tab_monitor.svg deleted file mode 100644 index afc661a22d..0000000000 --- a/resources/themes/cura-light/icons/tab_monitor.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - \ No newline at end of file diff --git a/resources/themes/cura-light/icons/tab_status_busy.svg b/resources/themes/cura-light/icons/tab_status_busy.svg index cf8e384d88..4df1a5b733 100644 --- a/resources/themes/cura-light/icons/tab_status_busy.svg +++ b/resources/themes/cura-light/icons/tab_status_busy.svg @@ -1,9 +1 @@ - - - - - - - - - \ No newline at end of file + \ No newline at end of file diff --git a/resources/themes/cura-light/icons/tab_status_connected.svg b/resources/themes/cura-light/icons/tab_status_connected.svg index 56aecdf0a7..4960e97d0f 100644 --- a/resources/themes/cura-light/icons/tab_status_connected.svg +++ b/resources/themes/cura-light/icons/tab_status_connected.svg @@ -1,7 +1 @@ - - - - - - - \ No newline at end of file +tab_status_connected \ No newline at end of file diff --git a/resources/themes/cura-light/icons/tab_status_paused.svg b/resources/themes/cura-light/icons/tab_status_paused.svg index 0ec744ad86..7358d76305 100644 --- a/resources/themes/cura-light/icons/tab_status_paused.svg +++ b/resources/themes/cura-light/icons/tab_status_paused.svg @@ -1,8 +1 @@ - - - - - - - - \ No newline at end of file +tab_status_paused \ No newline at end of file diff --git a/resources/themes/cura-light/icons/tab_status_stopped.svg b/resources/themes/cura-light/icons/tab_status_stopped.svg index ec1afaec81..d93f477ea7 100644 --- a/resources/themes/cura-light/icons/tab_status_stopped.svg +++ b/resources/themes/cura-light/icons/tab_status_stopped.svg @@ -1,8 +1 @@ - - - - - - - - \ No newline at end of file +tab_status_stopped \ No newline at end of file diff --git a/resources/themes/cura-light/icons/tab_status_unknown.svg b/resources/themes/cura-light/icons/tab_status_unknown.svg index 382a2b2d8b..1ba37e06be 100644 --- a/resources/themes/cura-light/icons/tab_status_unknown.svg +++ b/resources/themes/cura-light/icons/tab_status_unknown.svg @@ -1,8 +1 @@ - - - - - - - - \ No newline at end of file + \ No newline at end of file diff --git a/resources/themes/cura-light/styles.qml b/resources/themes/cura-light/styles.qml index d40fa1c9d1..cedb861da5 100755 --- a/resources/themes/cura-light/styles.qml +++ b/resources/themes/cura-light/styles.qml @@ -90,72 +90,44 @@ QtObject { } } - property Component topbar_header_tab: Component { + property Component topbar_header_tab_no_overlay: Component { ButtonStyle { - background: Item { - implicitWidth: Theme.getSize("topbar_button").width; - implicitHeight: Theme.getSize("topbar_button").height; + background: Rectangle { + implicitHeight: Theme.getSize("topbar_button").height + implicitWidth: Theme.getSize("topbar_button").width + color: "transparent" + anchors.fill: parent - Rectangle { - id: buttonFace; + Rectangle + { + id: underline - anchors.fill: parent; - property bool down: control.pressed || (control.checkable && control.checked); - - color: "transparent" - Behavior on color { ColorAnimation { duration: 50; } } - - Rectangle { - id: underline; - - anchors.horizontalCenter: parent.horizontalCenter - anchors.bottom: parent.bottom - width: Theme.getSize("topbar_button").width - height: Theme.getSize("sidebar_header_highlight").height - color: control.checked ? UM.Theme.getColor("sidebar_header_highlight") : UM.Theme.getColor("sidebar_header_highlight_hover") - visible: control.hovered || control.checked - } + anchors.left: parent.left + anchors.right: parent.right + anchors.bottom: parent.bottom + width: parent.width + height: Theme.getSize("sidebar_header_highlight").height + color: control.checked ? UM.Theme.getColor("sidebar_header_highlight") : "transparent" + visible: control.hovered || control.checked } } - label: Item - { + label: Rectangle { implicitHeight: Theme.getSize("topbar_button_icon").height - implicitWidth: Theme.getSize("topbar_button").width; + implicitWidth: Theme.getSize("topbar_button").width + color: "transparent" + anchors.fill: parent + Item { - anchors.horizontalCenter: parent.horizontalCenter - anchors.verticalCenter: parent.verticalCenter; - width: childrenRect.width - height: Theme.getSize("topbar_button_icon").height - UM.RecolorImage - { - visible: control.iconSource != "" - id: icon - color: UM.Theme.getColor("text_emphasis") - opacity: !control.enabled ? 0.2 : 1.0 - source: control.iconSource - width: visible ? Theme.getSize("topbar_button_icon").width : 0 - height: Theme.getSize("topbar_button_icon").height - - sourceSize: Theme.getSize("topbar_button_icon") - } - UM.RecolorImage - { - visible: control.overlayIconSource != "" && control.iconSource != "" - color: control.overlayColor - opacity: !control.enabled ? 0.2 : 1.0 - source: control.overlayIconSource - width: visible ? Theme.getSize("topbar_button_icon").width : 0 - height: Theme.getSize("topbar_button_icon").height - - sourceSize: Theme.getSize("topbar_button_icon") - } + anchors.centerIn: parent + width: textLabel.width + icon.width + Theme.getSize("default_margin").width / 2 Label { - text: control.text; - anchors.left: icon.right - anchors.leftMargin: icon.visible ? Theme.getSize("default_margin").width : 0 + id: textLabel + text: control.text + anchors.right: icon.visible ? icon.left : parent.right + anchors.rightMargin: icon.visible ? Theme.getSize("default_margin").width / 2 : 0 anchors.verticalCenter: parent.verticalCenter; font: control.checked ? UM.Theme.getFont("large") : UM.Theme.getFont("large_nonbold") color: @@ -174,6 +146,107 @@ QtObject { } } } + Image + { + id: icon + visible: control.iconSource != "" + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + opacity: !control.enabled ? 0.2 : 1.0 + source: control.iconSource + width: visible ? Theme.getSize("topbar_button_icon").width : 0 + height: Theme.getSize("topbar_button_icon").height + + sourceSize: Theme.getSize("topbar_button_icon") + } + } + } + } + } + + property Component topbar_header_tab: Component { + ButtonStyle { + background: Item { + implicitHeight: Theme.getSize("topbar_button").height + implicitWidth: Theme.getSize("topbar_button").width + Theme.getSize("topbar_button_icon").width + + Rectangle { + id: buttonFace; + anchors.fill: parent; + + color: "transparent" + Behavior on color { ColorAnimation { duration: 50; } } + + Rectangle { + id: underline; + + anchors.horizontalCenter: parent.horizontalCenter + anchors.bottom: parent.bottom + width: Theme.getSize("topbar_button").width + Theme.getSize("topbar_button_icon").width + height: Theme.getSize("sidebar_header_highlight").height + color: control.checked ? UM.Theme.getColor("sidebar_header_highlight") : UM.Theme.getColor("sidebar_header_highlight_hover") + visible: control.hovered || control.checked + } + } + } + + label: Item + { + implicitHeight: Theme.getSize("topbar_button_icon").height + implicitWidth: Theme.getSize("topbar_button").width + Theme.getSize("topbar_button_icon").width + Item + { + anchors.horizontalCenter: parent.horizontalCenter + anchors.verticalCenter: parent.verticalCenter; + width: childrenRect.width + height: Theme.getSize("topbar_button_icon").height + Label + { + text: control.text; + anchors.right: (icon.visible || overlayIcon.visible) ? icon.left : parent.right + anchors.rightMargin: (icon.visible || overlayIcon.visible) ? Theme.getSize("default_margin").width : 0 + anchors.verticalCenter: parent.verticalCenter; + font: control.checked ? UM.Theme.getFont("large") : UM.Theme.getFont("large_nonbold") + color: + { + if(control.hovered) + { + return UM.Theme.getColor("topbar_button_text_hovered"); + } + if(control.checked) + { + return UM.Theme.getColor("topbar_button_text_active"); + } + else + { + return UM.Theme.getColor("topbar_button_text_inactive"); + } + } + } + UM.RecolorImage + { + visible: control.iconSource != "" + id: icon + color: UM.Theme.getColor("text_emphasis") + opacity: !control.enabled ? 0.2 : 1.0 + source: control.iconSource + width: visible ? Theme.getSize("topbar_button_icon").width : 0 + height: Theme.getSize("topbar_button_icon").height + + sourceSize: Theme.getSize("topbar_button_icon") + } + UM.RecolorImage + { + id: overlayIcon + visible: control.overlayIconSource != "" && control.iconSource != "" + color: control.overlayColor + opacity: !control.enabled ? 0.2 : 1.0 + source: control.overlayIconSource + width: visible ? Theme.getSize("topbar_button_icon").width : 0 + height: Theme.getSize("topbar_button_icon").height + + sourceSize: Theme.getSize("topbar_button_icon") + } } } } diff --git a/resources/themes/cura-light/theme.json b/resources/themes/cura-light/theme.json index 398fbac3eb..0eb66c9e76 100644 --- a/resources/themes/cura-light/theme.json +++ b/resources/themes/cura-light/theme.json @@ -310,7 +310,7 @@ "topbar_logo_right_margin": [3, 0], "topbar_button": [8, 4], - "topbar_button_icon": [3.125, 2.5], + "topbar_button_icon": [1.2, 1.2], "button_tooltip": [1.0, 1.3], "button_tooltip_arrow": [0.25, 0.25], diff --git a/resources/themes/cura/icons/tab_status_busy.svg b/resources/themes/cura/icons/tab_status_busy.svg deleted file mode 100644 index 7b5774e71b..0000000000 --- a/resources/themes/cura/icons/tab_status_busy.svg +++ /dev/null @@ -1,9 +0,0 @@ - - - - - - - - - \ No newline at end of file diff --git a/resources/themes/cura/icons/tab_status_connected.svg b/resources/themes/cura/icons/tab_status_connected.svg deleted file mode 100644 index 7997ffbee6..0000000000 --- a/resources/themes/cura/icons/tab_status_connected.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - \ No newline at end of file diff --git a/resources/themes/cura/icons/tab_status_paused.svg b/resources/themes/cura/icons/tab_status_paused.svg deleted file mode 100644 index 606d4cb96c..0000000000 --- a/resources/themes/cura/icons/tab_status_paused.svg +++ /dev/null @@ -1,8 +0,0 @@ - - - - - - - - \ No newline at end of file diff --git a/resources/themes/cura/icons/tab_status_stopped.svg b/resources/themes/cura/icons/tab_status_stopped.svg deleted file mode 100644 index 6cd0f18b17..0000000000 --- a/resources/themes/cura/icons/tab_status_stopped.svg +++ /dev/null @@ -1,8 +0,0 @@ - - - - - - - - \ No newline at end of file diff --git a/resources/themes/cura/icons/tab_status_unknown.svg b/resources/themes/cura/icons/tab_status_unknown.svg deleted file mode 100644 index 5e46eec55b..0000000000 --- a/resources/themes/cura/icons/tab_status_unknown.svg +++ /dev/null @@ -1,8 +0,0 @@ - - - - - - - - \ No newline at end of file diff --git a/resources/themes/cura/images/logo.svg b/resources/themes/cura/images/logo.svg deleted file mode 100644 index 545b42d193..0000000000 --- a/resources/themes/cura/images/logo.svg +++ /dev/null @@ -1,8 +0,0 @@ - - - - - - - - \ No newline at end of file