diff --git a/bar/modules/Volume.qml b/bar/modules/Volume.qml index af96889..584336f 100644 --- a/bar/modules/Volume.qml +++ b/bar/modules/Volume.qml @@ -150,12 +150,19 @@ ModuleChip { cardHeight: popupCol.implicitHeight + 34 hasKeyboardFocus: true - ColumnLayout { + Item { id: popupCol anchors { left: parent.left; right: parent.right; top: parent.top } anchors.margins: 16 anchors.topMargin: 18 - spacing: 14 + implicitWidth: popupContent.implicitWidth + implicitHeight: popupContent.implicitHeight + focus: true + + ColumnLayout { + id: popupContent + anchors.fill: parent + spacing: 14 VolumeSection { id: outputSection @@ -248,6 +255,13 @@ ModuleChip { } Item { height: 2 } } + + MouseArea { + anchors.fill: parent + z: -1 + onClicked: popupCol.forceActiveFocus() + } + } } component VolumeSection: ColumnLayout { @@ -310,13 +324,18 @@ ModuleChip { if (!vs.muted) { let val = parseInt(text.replace("%", "").trim(), 10) if (!isNaN(val)) vs.sliderMoved(Math.max(0, Math.min(vs.maxVolume, val))) - text = vs.volume + "%" + text = Qt.binding(function() { return vs.muted ? "muted" : vs.volume + "%" }) } + popupCol.forceActiveFocus() } onActiveFocusChanged: { if (activeFocus && !vs.muted) { text = vs.volume.toString() selectAll() + } else if (!activeFocus && !vs.muted) { + let val = parseInt(text.replace("%", "").trim(), 10) + if (!isNaN(val)) vs.sliderMoved(Math.max(0, Math.min(vs.maxVolume, val))) + text = Qt.binding(function() { return vs.muted ? "muted" : vs.volume + "%" }) } } } @@ -525,7 +544,8 @@ ModuleChip { onAccepted: { let val = parseInt(text.replace("%", "").trim(), 10) if (!isNaN(val)) lr.valueSet(Math.max(lr.minValue, Math.min(lr.maxValue, val))) - text = lr.value + "%" + text = Qt.binding(function() { return lr.value + "%" }) + popupCol.forceActiveFocus() } onActiveFocusChanged: { if (activeFocus) { @@ -534,7 +554,7 @@ ModuleChip { } else { let val = parseInt(text.replace("%", "").trim(), 10) if (!isNaN(val)) lr.valueSet(Math.max(lr.minValue, Math.min(lr.maxValue, val))) - text = lr.value + "%" + text = Qt.binding(function() { return lr.value + "%" }) } } } diff --git a/components/PopupPanel.qml b/components/PopupPanel.qml index 6ef5316..177f85b 100644 --- a/components/PopupPanel.qml +++ b/components/PopupPanel.qml @@ -23,8 +23,6 @@ PanelWindow { function _doOpen() { hideTimer.stop(); visible = true; popupOpen = true } function open() { - if (popupCenterX < 0 && chipRoot) - popupCenterX = chipRoot.mapToItem(null, 0, 0).x + chipRoot.width / 2 _doOpen() } function close() { popupOpen = false; hideTimer.restart() } diff --git a/config/themes/boat.qml b/config/themes/boat.qml new file mode 100644 index 0000000..6db5f7f --- /dev/null +++ b/config/themes/boat.qml @@ -0,0 +1,309 @@ +pragma Singleton +import QtQuick +import Quickshell + +QtObject { + id: theme + + // ── Wallpaper ────────────────────────────────────────────────────────────── + readonly property string wallpaper: Quickshell.env("HOME") + "/.config/quickshell/wallpapers/wallhaven-zpoxyj.png" + + // ── Base Backgrounds ─────────────────────────────────────────────────────── + readonly property color bg: "#cc0e0a0d" // Deepest water and night sky shadow + readonly property color bgPanel: "transparent" + readonly property color bgPopup: "#cc0e0a0d" // Near-black silhouette tones + readonly property color bgFrame: bg + + // ── Separators ──────────────────────────────────────────────────────────── + readonly property color separator: "#33614d4a" // Muted dusky terracotta line + + // ── Text ────────────────────────────────────────────────────────────────── + readonly property color textMain: "#fffaf4f0" // Warm sunset cream highlight + readonly property color textDim: "#998f7e7c" // Hazy dusk mauve gray + readonly property color todayText: "#ffffffff" + + // ── Accent & Borders ────────────────────────────────────────────────────── + readonly property color accent: "#ffe0533c" // Vibrant horizon crimson-orange + readonly property color border: "transparent" + readonly property color frameBorder: "transparent" + readonly property color borderPopup: "transparent" + readonly property color borderToday: accent + + // ── Logo Module ──────────────────────────────────────────────────────── + readonly property color logoBg: bgPanel + readonly property color logoBgHover: "#22ffffff" + readonly property color logoBorder: border + readonly property color logoBorderActive: accent + readonly property color logoIcon: textMain + readonly property color logoIconActive: accent + + // ── Stats Module (Variation: Crimson Horizon Pulse) ─────────────────────── + readonly property color statsBg: bgPanel + readonly property color statsBorder: border + readonly property color statsCpuColor: "#ffe0533c" // Horizon crimson-orange + readonly property color statsMemColor: "#ff4e618d" // Twilight sky deep blue + readonly property color statsDiskColor: "#fffca352" // Warm cabin lamp glow + readonly property color statsTrackColor: "#15ffffff" + + // ── Volume Module (Variation: Lone Boat Dusk) ───────────────────────────── + readonly property color volBg: bgPanel + readonly property color volBgHover: "#22614d4a" + readonly property color volBorder: border + readonly property color volBorderHover: "#ff4e618d" + readonly property color volPopupBg: bgPopup + readonly property color volPopupBorder: borderPopup + readonly property color volIcon: "#ff4e618d" + readonly property color volIconMuted: "#ff485066" + readonly property color volTrack: "#22ffffff" + readonly property color volHandle: accent + readonly property color volHandleBorder: "#33ffffff" + readonly property color volMuteBg: "#33f38ba8" + readonly property color volPickerHover: "#15e0533c" + + // ── Clock Module ─────────────────────────────────────────────────────────── + readonly property color clockBg: bgPanel + readonly property color clockBgHover: "#11ffffff" + readonly property color clockBorder: border + readonly property color clockBorderHover: accent + readonly property color clockTime: textMain + readonly property color clockSeconds: "#fffca352" // Cabin-glow orange/yellow + readonly property color clockIcon: accent + + // ── Battery Module ──────────────────────────────────────────────────────── + readonly property color batteryFull: accent + readonly property color batteryCharging: accent + readonly property color batteryCritical: statusErr + readonly property color batteryLow: statusWarn + readonly property color batteryIcon: clockIcon + readonly property color batBg: bgPanel + readonly property color batBgHover: "#11ffffff" + readonly property color batBorder: border + readonly property color batBorderHover: accent + readonly property color batText: textMain + readonly property color batPopupBg: bgPopup + readonly property color batPopupBorder: borderPopup + readonly property color batPopupSeparator: separator + readonly property color batPopupHeader: "#ffe0533c" + readonly property color batPopupText: textMain + readonly property color batPopupDim: textDim + readonly property color batProgressTrack: separator + readonly property color batProfileActiveText: bg + + // ── Network Module ──────────────────────────────────────────────────────── + readonly property color netBg: bgPanel + readonly property color netBgHover: "#11ffffff" + readonly property color netBorder: border + readonly property color netBorderHover: accent + readonly property color netText: textMain + readonly property color netPopupBg: bgPopup + readonly property color netPopupBorder: borderPopup + readonly property color netPopupSeparator: separator + readonly property color netPopupHeader: "#ffe0533c" + readonly property color netPopupText: textMain + readonly property color netPopupDim: textDim + readonly property color netFieldBg: "#22ffffff" + readonly property color netCancelBgHover: "#22ffffff" + readonly property color netConnectText: "#ff0e0a0d" + readonly property color netApActiveBg: Qt.alpha(accent, 0.15) + readonly property color netApHoverBg: calArrowBgHover + readonly property color netDisconnectBg: Qt.alpha(statusErr, 0.18) + readonly property color netDisconnectBorder: Qt.alpha(statusErr, 0.45) + readonly property color netWiredOkBg: Qt.alpha(statusOk, 0.12) + readonly property color netWiredErrBg: Qt.alpha(statusErr, 0.12) + readonly property color netWiredOkBorder: Qt.alpha(statusOk, 0.4) + readonly property color netWiredErrBorder: Qt.alpha(statusErr, 0.4) + + // ── Calendar Popup ───────────────────────────────────────────────────────── + readonly property color calCardBg: bgPopup + readonly property color calCardBorder: borderPopup + readonly property color calSeparator: separator + readonly property color clockPopupHeader: "#ffe0533c" + readonly property color clockPopupText: textMain + readonly property color clockPopupDim: textDim + readonly property color clockPopupDate: textMain + readonly property color clockPopupUtc: textDim + readonly property color calArrowIcon: textDim + readonly property color calArrowIconHover: "#ffe0533c" + readonly property color calArrowBg: "transparent" + readonly property color calArrowBgHover: "#22e0533c" // Soft sunset tint + readonly property color calArrowBgPress: "#ffe0533c" + + // ── Workspace Module ─────────────────────────────────────────────────────── + readonly property color wsPanelBg: bgPanel + readonly property color wsPanelBorder: "transparent" + readonly property color wsActiveBg: accent + readonly property color wsInactiveBg: "#15ffffff" + readonly property color wsHoverBg: "#33614d4a" + readonly property color wsActiveText: "#ff0e0a0d" + readonly property color wsInactiveText: textMain + readonly property color wsHoverText: "#ffffffff" + + // ── Tray Module ──────────────────────────────────────────────────────────── + readonly property color trayBg: bgPanel + readonly property color trayBgHover: "#11ffffff" + readonly property color trayBorder: border + readonly property color trayBorderHover: "#22ffffff" + readonly property color trayIcon: textMain + + // ── Tray Context Menu ────────────────────────────────────────────────────── + readonly property color trayMenuBg: bgPopup + readonly property color trayMenuBorder: borderPopup + readonly property color trayMenuText: textMain + readonly property color trayMenuDim: textDim + readonly property color trayMenuHover: "#22e0533c" + readonly property color trayMenuCheck: accent + readonly property color trayMenuSeparator: separator + + // ── Launcher (Variation: Dark Water Mist) ────────────────────────────────── + readonly property color launcherBg: bgPopup + readonly property color launcherBorder: borderPopup + readonly property color launcherInput: "#440a080a" + readonly property color launcherInputBorderFocus: accent + readonly property color launcherPill: "#44614d4a" + readonly property color launcherText: textMain + readonly property color launcherDim: textDim + readonly property color launcherAccent: accent + readonly property color launcherHover: "#22e0533c" + readonly property color launcherSelected: "#44e0533c" + readonly property color launcherModeActiveText: "#ffffffff" + readonly property color launcherModeActiveBg: accent + + // ── Status Colors ────────────────────────────────────────────────────────── + readonly property color statusOk: "#ffb8c499" // Soft warm sage green + readonly property color statusWarn: "#fffca352" // Cabin-glow orange + readonly property color statusErr: "#fff38ba8" + readonly property color statusInfo: "#ff4e618d" // Dusk twilight blue + + // ── Notifications Module ─────────────────────────────────────────────────── + readonly property color notifBg: bgPanel + readonly property color notifBgHover: "#11ffffff" + readonly property color notifBorder: border + readonly property color notifBorderActive: accent + readonly property color notifIcon: textMain + readonly property color notifIconActive: accent + readonly property color notifBadgeBg: statusErr + readonly property color notifBadgeText: "#ffffffff" + readonly property color notifSeparator: separator + readonly property color notifDnd: separator + + // ── Toast cards (Variation: Silhouette Glow) ───────────────────────────────── + readonly property color notifToastBg: bgPopup + readonly property color notifToastBgHover: "#22ffffff" + readonly property color notifToastBorder: borderPopup + readonly property color notifToastText: textMain + readonly property color notifToastDim: textDim + readonly property color notifToastAppName: "#ff4e618d" + + // ── Urgency colours ──────────────────────────────────────────────────────── + readonly property color notifUrgencyCritical: statusErr + readonly property color notifUrgencyNormal: statusInfo + readonly property color notifUrgencyLow: textDim + + // ── Progress bar ─────────────────────────────────────────────────────────── + readonly property color notifProgressBg: "#22ffffff" + readonly property color notifProgressFill: accent + + // ── History popup ────────────────────────────────────────────────────────── + readonly property color notifHistoryBg: bgPopup + readonly property color notifHistoryBorder: borderPopup + readonly property color notifHistoryHover: "#11e0533c" + readonly property color notifHistoryEmpty: textDim + + // ── BgDate Module ────────────────────────────────────────────────────────── + readonly property color bgDateText: "#ffffffff" + readonly property color bgDateShadow: "#88000000" + readonly property color bgDateSecondsText: bgDateText + + // ── Crypto Module ────────────────────────────────────────────────────────── + readonly property color cryptoBg: bgPanel + readonly property color cryptoBgHover: "#15ffffff" + readonly property color cryptoBorder: border + readonly property color cryptoBorderHover: accent + + readonly property color cryptoIcon: accent + readonly property color cryptoLabel: textDim + readonly property color cryptoValue: textMain + + readonly property color cryptoUp: "#ffb8c499" + readonly property color cryptoDown: "#fff38ba8" + + // Popup card + readonly property color cryptoPopupBg: bgPopup + readonly property color cryptoPopupBorder: borderPopup + readonly property color cryptoPopupHeader: "#ffe0533c" + readonly property color cryptoPopupText: textMain + readonly property color cryptoPopupDim: textDim + + // Tinted surfaces + readonly property color cryptoUpBg: Qt.rgba(cryptoUp.r, cryptoUp.g, cryptoUp.b, 0.13) + readonly property color cryptoDownBg: Qt.rgba(cryptoDown.r, cryptoDown.g, cryptoDown.b, 0.13) + readonly property color cryptoChipRemoveBg: Qt.rgba(cryptoDown.r, cryptoDown.g, cryptoDown.b, 0.27) + readonly property color cryptoApplyIdleBg: Qt.rgba(accent.r, accent.g, accent.b, 0.20) + + readonly property color cryptoFieldBg: "#15ffffff" + readonly property color cryptoFieldBgFocus: "#22ffffff" + readonly property color cryptoRangeTrack: "#1affffff" + readonly property color cryptoTextOnAccent: "#ff0e0a0d" + readonly property color cryptoPlaceholder: Qt.rgba(textDim.r, textDim.g, textDim.b, 0.33) + + // ── Polkit Dialog ────────────────────────────────────────────────────────── + readonly property color polkitOverlayBg: "#bb000000" + readonly property color polkitCardBg: bgPopup + readonly property color polkitCardBorder: border + + // Lock icon + readonly property color polkitIconBg: "#1ee0533c" + readonly property color polkitIconBorder: "#44e0533c" + readonly property color polkitIconColor: accent + + // Text hierarchy + readonly property color polkitTitle: textMain + readonly property color polkitMessage: "#cce5ded9" + + // Action-ID pill + readonly property color polkitPillBg: "#1a614d4a" + readonly property color polkitPillText: "#668f7e7c" + + // Divider + readonly property color polkitDivider: "#33614d4a" + + // Supplementary message states + readonly property color polkitSuppErrBg: "#1af38ba8" + readonly property color polkitSuppErrBorder: "#44f38ba8" + readonly property color polkitSuppErrText: statusErr + + readonly property color polkitSuppOkBg: "#1ab8c499" + readonly property color polkitSuppOkBorder: "#44b8c499" + readonly property color polkitSuppOkText: statusOk + + // Fields + readonly property color polkitFieldBg: "#440a080a" + readonly property color polkitFieldBorder: "#22ffffff" + readonly property color polkitFieldBorderFocus: accent + + // Identity selector + readonly property color polkitUserLabel: "#998f7e7c" + readonly property color polkitUserValue: accent + + // Input prompt + readonly property color polkitInputPrompt: "#888f7e7c" + + // TextInput + readonly property color polkitInputText: textMain + readonly property color polkitInputSelection: "#55e0533c" + readonly property color polkitInputSelectedText: bg + + // Eye toggle + readonly property color polkitEyeIcon: "#668f7e7c" + readonly property color polkitEyeIconHover: accent + + // Buttons + readonly property color polkitAuthBg: "#dde0533c" + readonly property color polkitAuthBgHover: accent + readonly property color polkitAuthText: bg + + readonly property color polkitCancelBg: "#0dffffff" + readonly property color polkitCancelBgHover: "#22ffffff" + readonly property color polkitCancelBorder: "#22ffffff" + readonly property color polkitCancelText: "#cce5ded9" +} diff --git a/config/themes/qmldir b/config/themes/qmldir index 8eec4ac..023a79a 100644 --- a/config/themes/qmldir +++ b/config/themes/qmldir @@ -12,4 +12,6 @@ singleton Metropolitan 1.0 metropolitan.qml singleton Goldencity 1.0 goldencity.qml singleton Hummingbird 1.0 hummingbird.qml singleton Tropicalnight 1.0 tropicalnight.qml +singleton Boat 1.0 boat.qml + diff --git a/wallpapers/wallhaven-zpoxyj.png b/wallpapers/wallhaven-zpoxyj.png new file mode 100644 index 0000000..fa04639 Binary files /dev/null and b/wallpapers/wallhaven-zpoxyj.png differ