bar tooltips: make em use tooltip color

This commit is contained in:
end-4
2025-08-11 16:03:29 +07:00
parent 0beee14cd8
commit e7397f824b
6 changed files with 30 additions and 36 deletions
@@ -10,10 +10,8 @@ Rectangle {
readonly property real margin: 10 readonly property real margin: 10
implicitWidth: columnLayout.implicitWidth + margin * 2 implicitWidth: columnLayout.implicitWidth + margin * 2
implicitHeight: columnLayout.implicitHeight + margin * 2 implicitHeight: columnLayout.implicitHeight + margin * 2
color: Appearance.colors.colLayer0 color: Appearance.colors.colTooltip
radius: Appearance.rounding.small radius: Appearance.rounding.small
border.width: 1
border.color: Appearance.colors.colLayer0Border
clip: true clip: true
ColumnLayout { ColumnLayout {
@@ -34,12 +32,12 @@ Rectangle {
opacity: rowVisible ? 1 : 0 opacity: rowVisible ? 1 : 0
Behavior on opacity { NumberAnimation { duration: 500 } } Behavior on opacity { NumberAnimation { duration: 500 } }
MaterialSymbol { text: "schedule"; color: Appearance.m3colors.m3onSecondaryContainer } MaterialSymbol { text: "schedule"; color: Appearance.colors.colOnTooltip }
StyledText { text: Battery.isCharging ? Translation.tr("Time to full:") : Translation.tr("Time to empty:"); color: Appearance.colors.colOnLayer1 } StyledText { text: Battery.isCharging ? Translation.tr("Time to full:") : Translation.tr("Time to empty:"); color: Appearance.colors.colOnTooltip }
StyledText { StyledText {
Layout.fillWidth: true Layout.fillWidth: true
horizontalAlignment: Text.AlignRight horizontalAlignment: Text.AlignRight
color: Appearance.colors.colOnLayer1 color: Appearance.colors.colOnTooltip
text: { text: {
function formatTime(seconds) { function formatTime(seconds) {
var h = Math.floor(seconds / 3600); var h = Math.floor(seconds / 3600);
@@ -82,7 +80,7 @@ Rectangle {
return "battery_0_bar"; return "battery_0_bar";
} }
} }
color: Appearance.m3colors.m3onSecondaryContainer color: Appearance.colors.colOnTooltip
} }
@@ -96,13 +94,13 @@ Rectangle {
return Translation.tr("Discharging:"); return Translation.tr("Discharging:");
} }
} }
color: Appearance.colors.colOnLayer1 color: Appearance.colors.colOnTooltip
} }
StyledText { StyledText {
Layout.fillWidth: true Layout.fillWidth: true
horizontalAlignment: Text.AlignRight horizontalAlignment: Text.AlignRight
color: Appearance.colors.colOnLayer1 color: Appearance.colors.colOnTooltip
text: { text: {
if (Battery.chargeState == 4) { if (Battery.chargeState == 4) {
return ""; return "";
@@ -53,10 +53,8 @@ Item {
readonly property real margin: 12 readonly property real margin: 12
implicitWidth: columnLayout.implicitWidth + margin * 2 implicitWidth: columnLayout.implicitWidth + margin * 2
implicitHeight: columnLayout.implicitHeight + margin * 2 implicitHeight: columnLayout.implicitHeight + margin * 2
color: Appearance.colors.colLayer0 color: Appearance.colors.colTooltip
radius: Appearance.rounding.small radius: Appearance.rounding.small
border.width: 1
border.color: Appearance.colors.colLayer0Border
clip: true clip: true
ColumnLayout { ColumnLayout {
@@ -71,7 +69,7 @@ Item {
StyledText { StyledText {
Layout.fillWidth: true Layout.fillWidth: true
horizontalAlignment: Text.AlignLeft horizontalAlignment: Text.AlignLeft
color: Appearance.colors.colOnLayer1 color: Appearance.colors.colOnTooltip
text: `${root.formattedDate} ${root.formattedTime}` text: `${root.formattedDate} ${root.formattedTime}`
} }
} }
@@ -80,12 +78,12 @@ Item {
RowLayout { RowLayout {
spacing: 5 spacing: 5
Layout.fillWidth: true Layout.fillWidth: true
MaterialSymbol { text: "timelapse"; color: Appearance.m3colors.m3onSecondaryContainer } MaterialSymbol { text: "timelapse"; color: Appearance.colors.colOnTooltip }
StyledText { text: Translation.tr("Uptime:"); color: Appearance.colors.colOnLayer1 } StyledText { text: Translation.tr("Uptime:"); color: Appearance.colors.colOnTooltip }
StyledText { StyledText {
Layout.fillWidth: true Layout.fillWidth: true
horizontalAlignment: Text.AlignRight horizontalAlignment: Text.AlignRight
color: Appearance.colors.colOnLayer1 color: Appearance.colors.colOnTooltip
text: root.formattedUptime text: root.formattedUptime
} }
} }
@@ -98,8 +96,8 @@ Item {
RowLayout { RowLayout {
spacing: 5 spacing: 5
Layout.fillWidth: true Layout.fillWidth: true
MaterialSymbol { text: "checklist"; color: Appearance.m3colors.m3onSecondaryContainer } MaterialSymbol { text: "checklist"; color: Appearance.colors.colOnTooltip }
StyledText { text: Translation.tr("Upcoming Tasks:"); color: Appearance.colors.colOnLayer1 } StyledText { text: Translation.tr("Upcoming Tasks:"); color: Appearance.colors.colOnTooltip }
} }
StyledText { StyledText {
@@ -107,7 +105,7 @@ Item {
topPadding: 5 topPadding: 5
horizontalAlignment: Text.AlignLeft horizontalAlignment: Text.AlignLeft
wrapMode: Text.Wrap wrapMode: Text.Wrap
color: Appearance.colors.colOnLayer1 color: Appearance.colors.colOnTooltip
text: root.todosSection text: root.todosSection
} }
} }
@@ -75,10 +75,8 @@ Item {
readonly property real margin: 10 readonly property real margin: 10
implicitWidth: columnLayout.implicitWidth + margin * 2 implicitWidth: columnLayout.implicitWidth + margin * 2
implicitHeight: columnLayout.implicitHeight + margin * 2 implicitHeight: columnLayout.implicitHeight + margin * 2
color: Appearance.colors.colLayer0 color: Appearance.colors.colTooltip
radius: Appearance.rounding.small radius: Appearance.rounding.small
border.width: 1
border.color: Appearance.colors.colLayer0Border
clip: true clip: true
ColumnLayout { ColumnLayout {
@@ -94,17 +92,17 @@ Item {
MaterialSymbol { MaterialSymbol {
text: modelData.icon text: modelData.icon
color: Appearance.m3colors.m3onSecondaryContainer color: Appearance.colors.colOnTooltip
} }
StyledText { StyledText {
text: modelData.label text: modelData.label
color: Appearance.colors.colOnLayer1 color: Appearance.colors.colOnTooltip
} }
StyledText { StyledText {
Layout.fillWidth: true Layout.fillWidth: true
horizontalAlignment: Text.AlignRight horizontalAlignment: Text.AlignRight
visible: modelData.value !== "" visible: modelData.value !== ""
color: Appearance.colors.colOnLayer1 color: Appearance.colors.colOnTooltip
text: modelData.value text: modelData.value
} }
} }
@@ -7,9 +7,9 @@ import qs.modules.common.widgets
Rectangle { Rectangle {
id: root id: root
radius: Appearance.rounding.small radius: Appearance.rounding.small
color: Appearance.colors.colLayer1 color: Appearance.colors.colTooltip
implicitWidth: columnLayout.implicitWidth * 2 implicitWidth: columnLayout.implicitWidth + 14 * 2
implicitHeight: columnLayout.implicitHeight * 2 implicitHeight: columnLayout.implicitHeight + 14 * 2
Layout.fillWidth: parent Layout.fillWidth: parent
property alias title: title.text property alias title: title.text
@@ -26,18 +26,19 @@ Rectangle {
id: symbol id: symbol
fill: 0 fill: 0
iconSize: Appearance.font.pixelSize.normal iconSize: Appearance.font.pixelSize.normal
color: Appearance.colors.colOnTooltip
} }
StyledText { StyledText {
id: title id: title
font.pixelSize: Appearance.font.pixelSize.smaller font.pixelSize: Appearance.font.pixelSize.smaller
color: Appearance.colors.colOnLayer1 color: Appearance.colors.colOnTooltip
} }
} }
StyledText { StyledText {
id: value id: value
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
font.pixelSize: Appearance.font.pixelSize.normal font.pixelSize: Appearance.font.pixelSize.small
color: Appearance.colors.colOnLayer1 color: Appearance.colors.colOnTooltip
} }
} }
} }
@@ -11,10 +11,8 @@ Rectangle {
readonly property real margin: 10 readonly property real margin: 10
implicitWidth: columnLayout.implicitWidth + margin * 2 implicitWidth: columnLayout.implicitWidth + margin * 2
implicitHeight: columnLayout.implicitHeight + margin * 2 implicitHeight: columnLayout.implicitHeight + margin * 2
color: Appearance.colors.colLayer0 color: Appearance.colors.colTooltip
radius: Appearance.rounding.small radius: Appearance.rounding.small
border.width: 1
border.color: Appearance.colors.colLayer0Border
clip: true clip: true
ColumnLayout { ColumnLayout {
@@ -34,13 +32,14 @@ Rectangle {
fill: 0 fill: 0
text: "location_on" text: "location_on"
iconSize: Appearance.font.pixelSize.huge iconSize: Appearance.font.pixelSize.huge
color: Appearance.colors.colOnTooltip
} }
StyledText { StyledText {
text: Weather.data.city text: Weather.data.city
font.pixelSize: Appearance.font.pixelSize.title font.pixelSize: Appearance.font.pixelSize.title
font.family: Appearance.font.family.title font.family: Appearance.font.family.title
color: Appearance.colors.colOnLayer0 color: Appearance.colors.colOnTooltip
} }
} }
@@ -36,7 +36,7 @@ LazyLoader {
top: Appearance.sizes.hyprlandGapsOut top: Appearance.sizes.hyprlandGapsOut
bottom: Appearance.sizes.hyprlandGapsOut bottom: Appearance.sizes.hyprlandGapsOut
} }
WlrLayershell.namespace: "quickshell:popup" //maybe this can fix with the popups not showing ? WlrLayershell.namespace: "quickshell:popup"
WlrLayershell.layer: WlrLayer.Overlay WlrLayershell.layer: WlrLayer.Overlay
Loader { Loader {