diff --git a/components/StyledIconButton.qml b/components/StyledIconButton.qml deleted file mode 100644 index 88caaf9..0000000 --- a/components/StyledIconButton.qml +++ /dev/null @@ -1,38 +0,0 @@ -import qs.config -import QtQuick -import QtQuick.Controls - -RoundButton { - id: control - - radius: 8 - font.family: Theme.lucide.font.family - font.pixelSize: 15 - font.bold: true - padding: 8 - - HoverHandler { - cursorShape: Qt.PointingHandCursor - } - - contentItem: Text { - text: control.text - color: control.hovered ? Theme.palette.primarycontent : Theme.palette.basecontent - Behavior on color { - ColorAnimation { - duration: 100 - } - } - font: control.font - } - - background: Rectangle { - color: control.hovered ? Theme.palette.primary : Theme.palette.base100 - Behavior on color { - ColorAnimation { - duration: 100 - } - } - radius: control.radius - } -} diff --git a/modules/pomodoro/Pomodoro.qml b/modules/pomodoro/Pomodoro.qml index 4292b1c..d1056ef 100644 --- a/modules/pomodoro/Pomodoro.qml +++ b/modules/pomodoro/Pomodoro.qml @@ -1,6 +1,5 @@ pragma ComponentBehavior: Bound -import qs.components import qs.config import qs.constants import qs.services @@ -50,60 +49,58 @@ StyledWindow { font.pixelSize: 22 } - Item { - implicitWidth: circle.width - implicitHeight: circle.height + Circle { + id: circle + radius: 150 + color: Pomodoro.state == "timer" ? Theme.palette.primary : Theme.palette.warning + percentage: (Pomodoro.state == "timer" ? (Pomodoro.initialTime - Pomodoro.remainingTime) : Pomodoro.remainingTime) / Pomodoro.initialTime % 1 - Circle { - id: circle - radius: 150 - borderColor: Theme.palette.base100 - strokeColor: Pomodoro.state == "timer" ? Theme.palette.primary : Theme.palette.warning - strokeWidth: 12 - fillColor: button.hovered ? Theme.palette.primary : "transparent" - percentage: (Pomodoro.state == "timer" ? (Pomodoro.initialTime - Pomodoro.remainingTime) : Pomodoro.remainingTime) / Pomodoro.initialTime % 1 - } + WrapperRectangle { + color: "transparent" + anchors.verticalCenter: parent.verticalCenter + anchors.horizontalCenter: parent.horizontalCenter + ColumnLayout { + spacing: 18 + StyledButton { - StyledIconButton { - id: button + Layout.alignment: Qt.AlignHCenter - anchors.centerIn: circle + focus: root.visible - radius: 9999 + content: LucideIcon { + text: Pomodoro.running ? Icons.square : Icons.play + font.pixelSize: 20 + } - focus: root.visible - text: Pomodoro.running ? Icons.square : Icons.play - font.pixelSize: 48 + onClicked: { + Pomodoro.toggle(); + } - background: undefined - onClicked: { - Pomodoro.toggle(); - } - - Keys.onSpacePressed: event => { - event.accepted = true; - Pomodoro.toggle(); - } - Keys.onEscapePressed: event => { - event.accepted = true; - Visibility.pomodoro = false; - } - Keys.onTabPressed: event => { - event.accepted = true; - Pomodoro.reset(); + Keys.onSpacePressed: event => { + event.accepted = true; + Pomodoro.toggle(); + } + Keys.onEscapePressed: event => { + event.accepted = true; + Visibility.pomodoro = false; + } + Keys.onTabPressed: event => { + event.accepted = true; + Pomodoro.reset(); + } + } + StyledText { + Layout.alignment: Qt.AlignHCenter + text: { + const date = new Date(Pomodoro.remainingTime); + return `${date.getMinutes().toString().padStart(2, "0")}:${(date.getSeconds() % 3600).toString().padStart(2, "0")}`; + } + font.pixelSize: 16 + } } } } - StyledText { - Layout.alignment: Qt.AlignHCenter - text: { - const date = new Date(Pomodoro.remainingTime); - return `${date.getMinutes().toString().padStart(2, "0")}:${(date.getSeconds() % 3600).toString().padStart(2, "0")}`; - } - font.pixelSize: 16 - } - StyledButton { Layout.alignment: Qt.AlignHCenter diff --git a/modules/storybook/Storybook.qml b/modules/storybook/Storybook.qml index 7603c6d..1647923 100644 --- a/modules/storybook/Storybook.qml +++ b/modules/storybook/Storybook.qml @@ -2,7 +2,6 @@ pragma ComponentBehavior: Bound import qs.components import qs.config -import qs.constants import qs.services import qs.widgets import Quickshell.Hyprland @@ -46,21 +45,9 @@ StyledWindow { Layout.alignment: Qt.AlignHCenter text: "Components" font.pixelSize: 24 - font.bold: true - font.underline: true bottomPadding: 24 } - ColumnLayout { - StyledText { - text: "Switch" - font.pixelSize: 18 - } - StyledIconButton { - text: Icons.square - } - } - ColumnLayout { StyledText { text: "Switch" diff --git a/widgets/Circle.qml b/widgets/Circle.qml index 33207a5..18cbc59 100644 --- a/widgets/Circle.qml +++ b/widgets/Circle.qml @@ -7,10 +7,7 @@ Item { property int radius: 0 property double percentage: 0 - property alias borderColor: fill.strokeColor - property alias strokeColor: path.strokeColor - property alias strokeWidth: path.strokeWidth - property alias fillColor: fill.fillColor + property alias color: path.strokeColor implicitWidth: radius * 2 implicitHeight: radius * 2 @@ -20,8 +17,6 @@ Item { preferredRendererType: Shape.CurveRenderer ShapePath { - id: fill - fillColor: Theme.palette.base100 strokeColor: Theme.palette.base200 strokeWidth: 8 @@ -39,8 +34,8 @@ Item { id: path fillColor: "transparent" - strokeWidth: 0 - strokeColor: "transparent" + strokeWidth: 8 + strokeColor: "white" capStyle: ShapePath.RoundCap PathAngleArc {