diff options
| -rw-r--r-- | modules/bar/components/Clock.qml | 78 |
1 files changed, 59 insertions, 19 deletions
diff --git a/modules/bar/components/Clock.qml b/modules/bar/components/Clock.qml index 801e93d..662e837 100644 --- a/modules/bar/components/Clock.qml +++ b/modules/bar/components/Clock.qml @@ -5,34 +5,74 @@ import qs.services import qs.config import QtQuick -Column { +StyledRect { id: root - property color colour: Colours.palette.m3tertiary + readonly property color colour: Colours.palette.m3tertiary + readonly property int padding: Appearance.padding.normal - spacing: Appearance.spacing.small + implicitWidth: Config.bar.sizes.innerWidth + implicitHeight: layout.implicitHeight + root.padding * 2 - Loader { - anchors.horizontalCenter: parent.horizontalCenter + color: Qt.alpha(Colours.tPalette.m3surfaceContainer, Colours.tPalette.m3surfaceContainer.a) + radius: Appearance.rounding.full - active: Config.bar.clock.showIcon - visible: active + Column { + id: layout + anchors.centerIn: parent + spacing: Appearance.spacing.small - sourceComponent: MaterialIcon { - text: "calendar_month" - color: root.colour + Loader { + anchors.horizontalCenter: parent.horizontalCenter + + active: Config.bar.clock.showIcon + visible: active + + sourceComponent: MaterialIcon { + text: "calendar_month" + color: root.colour + } } - } - StyledText { - id: text + Column { + StyledText { + anchors.horizontalCenter: parent.horizontalCenter + + horizontalAlignment: StyledText.AlignHCenter + text: Time.format("ddd") + font.pointSize: Appearance.font.size.small + font.family: Appearance.font.family.sans + color: root.colour + } + + StyledText { + anchors.horizontalCenter: parent.horizontalCenter + + horizontalAlignment: StyledText.AlignHCenter + text: Time.format("dd") + font.pointSize: Appearance.font.size.smaller + font.family: Appearance.font.family.sans + color: root.colour + } + } + + Rectangle { + anchors.horizontalCenter: parent.horizontalCenter + height: visible ? 1 : 0 - anchors.horizontalCenter: parent.horizontalCenter + width: parent.width * 0.8 + color: root.colour + opacity: 0.2 + } - horizontalAlignment: StyledText.AlignHCenter - text: Time.format(Config.services.useTwelveHourClock ? "hh\nmm\nA" : "hh\nmm") - font.pointSize: Appearance.font.size.smaller - font.family: Appearance.font.family.mono - color: root.colour + StyledText { + anchors.horizontalCenter: parent.horizontalCenter + + horizontalAlignment: StyledText.AlignHCenter + text: Time.format(Config.services.useTwelveHourClock ? "hh\nmm\nA" : "hh\nmm") + font.pointSize: Appearance.font.size.smaller + font.family: Appearance.font.family.mono + color: root.colour + } } } |