Lead Appearance with light and dark, and stop pages listing whole datasets
Appearance was six cards deep and Light/Dark was the third of them, below the wallpaper grid and the entire lock screen -- so the control reached most often was the last one you got to. It is five tabs now, Theme first. The mock showed four; the page turned out to have eleven cards, so Titlebars and Windows became Windows, and Clock and vitals became Shell, rather than pretending four would hold them. Region, Date & Time and Displays each rendered a complete dataset as rows: every installed locale, the whole tz database, every mode the monitor advertises. The chooser was never the problem -- SearchPicker already existed and worked. It was simply rendered always-expanded, so the one line saying what is currently set sat under hundreds that were not. PickerRow collapses each behind its current value and closes again once something is picked. The avatar never appeared to change because accountsservice writes every picture to the same path, leaving the URL byte-identical while Qt served its cached image. cache:false was already set and could not have helped: an unchanged source is never re-read at all. avatarUrl now carries a revision fragment, bumped only when a write actually succeeds. Pictures are cropped before they are set, in the picture's own pixel coordinates so the result does not depend on the size it happened to be displayed at, and written out at 512x512 through GdkPixbuf -- already a dependency here, so nothing new is required. Snapshots listed nothing. The timeline and its Delete buttons existed the whole time, behind a row labelled "Browse...", a word that promises a file browser. The three most recent points are shown inline now, with the rest one press away. qmldir-registration-contract exists because an unregistered component is not a quiet problem: Quickshell fails the entire configuration on it, so the settings window dies and the bar and dock go with it. That happened twice while writing this, both times on a machine somebody was using. It is pure file inspection, so it runs before a change ever reaches the running shell. Claude-Session: https://claude.ai/code/session_01BRvzt4H8XXLPVH5MyYdk9L
This commit is contained in:
Gabriel Brown
@@ -19,6 +19,11 @@ SettingsPage {
|
||||
|
||||
property string expandedPicker: ""
|
||||
|
||||
// Which group of cards is on screen. Theme leads deliberately: light and
|
||||
// dark is the control reached most often, and it used to be the third
|
||||
// section down, below a wallpaper grid and the whole lock screen.
|
||||
property string tab: "theme"
|
||||
|
||||
title: "Appearance"
|
||||
lede: "Tune the Prism shell and the applications that live inside it. The preview above is your real geometry, to scale."
|
||||
|
||||
@@ -44,7 +49,20 @@ SettingsPage {
|
||||
}
|
||||
}
|
||||
|
||||
SettingsTabs {
|
||||
tabs: [
|
||||
{ value: "theme", label: "Theme" },
|
||||
{ value: "background", label: "Background" },
|
||||
{ value: "type", label: "Typography" },
|
||||
{ value: "windows", label: "Windows" },
|
||||
{ value: "shell", label: "Shell" },
|
||||
]
|
||||
current: root.tab
|
||||
onSelected: value => root.tab = value
|
||||
}
|
||||
|
||||
SettingsCard {
|
||||
visible: root.tab === "background"
|
||||
title: "Background"
|
||||
subtitle: Wallpaper.lastError !== ""
|
||||
? Wallpaper.lastError
|
||||
@@ -83,6 +101,7 @@ SettingsPage {
|
||||
}
|
||||
|
||||
SettingsCard {
|
||||
visible: root.tab === "background"
|
||||
title: "Lock screen"
|
||||
subtitle: LockScreen.lastError !== ""
|
||||
? LockScreen.lastError
|
||||
@@ -101,6 +120,7 @@ SettingsPage {
|
||||
}
|
||||
|
||||
SettingsCard {
|
||||
visible: root.tab === "theme"
|
||||
title: "Color scheme"
|
||||
subtitle: ColorScheme.lastError !== ""
|
||||
? ColorScheme.lastError
|
||||
@@ -116,6 +136,7 @@ SettingsPage {
|
||||
}
|
||||
|
||||
SettingsCard {
|
||||
visible: root.tab === "type"
|
||||
title: "Shell typography"
|
||||
subtitle: Fonts.lastError !== ""
|
||||
? Fonts.lastError
|
||||
@@ -157,6 +178,7 @@ SettingsPage {
|
||||
}
|
||||
|
||||
SettingsCard {
|
||||
visible: root.tab === "type"
|
||||
title: "Application typography"
|
||||
subtitle: DesktopStyle.lastError !== ""
|
||||
? DesktopStyle.lastError
|
||||
@@ -229,6 +251,7 @@ SettingsPage {
|
||||
}
|
||||
|
||||
SettingsCard {
|
||||
visible: root.tab === "type"
|
||||
title: "Icons & pointer"
|
||||
subtitle: DesktopStyle.lastError !== ""
|
||||
? DesktopStyle.lastError
|
||||
@@ -279,6 +302,7 @@ SettingsPage {
|
||||
}
|
||||
|
||||
SettingsCard {
|
||||
visible: root.tab === "windows"
|
||||
title: "Titlebars"
|
||||
subtitle: "For applications that draw GNOME-compatible titlebars. Hyprland itself does not add titlebar buttons to tiled windows."
|
||||
|
||||
@@ -288,6 +312,7 @@ SettingsPage {
|
||||
}
|
||||
|
||||
SettingsCard {
|
||||
visible: root.tab === "windows"
|
||||
title: "Windows"
|
||||
subtitle: "Spacing and shape of tiled windows. Each change is applied to the compositor and confirmed before it is saved."
|
||||
|
||||
@@ -302,6 +327,7 @@ SettingsPage {
|
||||
}
|
||||
|
||||
SettingsCard {
|
||||
visible: root.tab === "theme"
|
||||
title: "Effects"
|
||||
subtitle: "Each of these costs frame time. Turning one off is a legitimate way to buy it back while gaming."
|
||||
|
||||
@@ -318,6 +344,7 @@ SettingsPage {
|
||||
}
|
||||
|
||||
SettingsCard {
|
||||
visible: root.tab === "shell"
|
||||
title: "Clock"
|
||||
|
||||
ToggleRow { setting: "use24Hour" }
|
||||
@@ -326,6 +353,7 @@ SettingsPage {
|
||||
}
|
||||
|
||||
SettingsCard {
|
||||
visible: root.tab === "shell"
|
||||
title: "System vitals"
|
||||
subtitle: "Choose what appears beside the workspace indicator."
|
||||
|
||||
|
||||
@@ -0,0 +1,231 @@
|
||||
// Choosing which part of a picture becomes the profile picture.
|
||||
//
|
||||
// Without this, whatever was picked went to accountsservice whole, and a
|
||||
// landscape photograph became a squashed thumbnail with the subject off the
|
||||
// edge. The circle is drawn where the avatar is actually round elsewhere in the
|
||||
// shell, so what is framed here is what appears there.
|
||||
//
|
||||
// The crop is reported in the picture's OWN pixels, not screen ones, so the
|
||||
// result does not depend on the size this happened to be displayed at.
|
||||
|
||||
import QtQuick
|
||||
import qs.config
|
||||
|
||||
Item {
|
||||
id: root
|
||||
|
||||
// Absolute path of the picture being framed.
|
||||
property string source: ""
|
||||
|
||||
// Side of the square viewport, in screen pixels.
|
||||
readonly property int viewport: 260
|
||||
|
||||
// How far in the picture is zoomed, as a multiple of the smallest scale
|
||||
// that still covers the viewport. 1 means "just covers".
|
||||
property real zoom: 1
|
||||
readonly property real maxZoom: 4
|
||||
|
||||
// Top-left of the drawn picture, relative to the viewport's top-left.
|
||||
property real offsetX: 0
|
||||
property real offsetY: 0
|
||||
|
||||
readonly property bool ready: picture.status === Image.Ready
|
||||
&& picture.sourceSize.width > 0 && picture.sourceSize.height > 0
|
||||
|
||||
// The scale at which the shorter side exactly fills the viewport. Any
|
||||
// smaller and the square would include area the picture does not cover.
|
||||
readonly property real baseScale: root.ready
|
||||
? root.viewport / Math.min(picture.sourceSize.width, picture.sourceSize.height)
|
||||
: 1
|
||||
readonly property real scale: root.baseScale * root.zoom
|
||||
|
||||
readonly property real drawnWidth: root.ready ? picture.sourceSize.width * root.scale : 0
|
||||
readonly property real drawnHeight: root.ready ? picture.sourceSize.height * root.scale : 0
|
||||
|
||||
// Emitted with a square in the picture's own pixel coordinates.
|
||||
signal cropped(int x, int y, int size)
|
||||
signal cancelled
|
||||
|
||||
implicitWidth: parent ? parent.width : 620
|
||||
implicitHeight: column.implicitHeight
|
||||
|
||||
// Keeps the viewport covered: the picture may never be dragged far enough
|
||||
// to expose an edge, so the crop is always entirely inside the image.
|
||||
function clamp(): void {
|
||||
root.offsetX = Math.min(0, Math.max(root.viewport - root.drawnWidth, root.offsetX));
|
||||
root.offsetY = Math.min(0, Math.max(root.viewport - root.drawnHeight, root.offsetY));
|
||||
}
|
||||
|
||||
// Start centred, filling the viewport.
|
||||
function reset(): void {
|
||||
root.zoom = 1;
|
||||
root.offsetX = (root.viewport - root.drawnWidth) / 2;
|
||||
root.offsetY = (root.viewport - root.drawnHeight) / 2;
|
||||
}
|
||||
|
||||
onReadyChanged: if (root.ready) root.reset()
|
||||
onZoomChanged: root.clamp()
|
||||
|
||||
Column {
|
||||
id: column
|
||||
width: parent.width
|
||||
spacing: 14
|
||||
|
||||
Row {
|
||||
spacing: 20
|
||||
|
||||
Rectangle {
|
||||
id: frame
|
||||
width: root.viewport
|
||||
height: root.viewport
|
||||
radius: 12
|
||||
clip: true
|
||||
color: Theme.bgDark
|
||||
border.width: 1
|
||||
border.color: Theme.alpha(Theme.fg, 0.09)
|
||||
|
||||
Image {
|
||||
id: picture
|
||||
source: root.source === "" ? "" : "file://" + root.source
|
||||
x: root.offsetX
|
||||
y: root.offsetY
|
||||
width: root.drawnWidth
|
||||
height: root.drawnHeight
|
||||
fillMode: Image.Stretch
|
||||
asynchronous: true
|
||||
// The picture is drawn at whatever size the frame needs, so
|
||||
// decoding it at full resolution wastes memory on a photo.
|
||||
sourceSize.width: 1600
|
||||
sourceSize.height: 1600
|
||||
smooth: true
|
||||
}
|
||||
|
||||
// The round mask: a dimming fill with the circle punched out of
|
||||
// it, then the ring drawn on top. Painted once per change, not
|
||||
// continuously.
|
||||
Canvas {
|
||||
id: mask
|
||||
anchors.fill: parent
|
||||
onPaint: {
|
||||
const context = mask.getContext("2d");
|
||||
context.clearRect(0, 0, mask.width, mask.height);
|
||||
context.fillStyle = Qt.rgba(0.12, 0.13, 0.19, 0.62);
|
||||
context.fillRect(0, 0, mask.width, mask.height);
|
||||
context.globalCompositeOperation = "destination-out";
|
||||
context.beginPath();
|
||||
context.arc(mask.width / 2, mask.height / 2,
|
||||
mask.width / 2 - 8, 0, Math.PI * 2);
|
||||
context.fill();
|
||||
context.globalCompositeOperation = "source-over";
|
||||
context.strokeStyle = Qt.rgba(0.78, 0.83, 0.96, 0.85);
|
||||
context.lineWidth = 2;
|
||||
context.beginPath();
|
||||
context.arc(mask.width / 2, mask.height / 2,
|
||||
mask.width / 2 - 8, 0, Math.PI * 2);
|
||||
context.stroke();
|
||||
}
|
||||
}
|
||||
|
||||
// The offset is tracked from where the press started rather than
|
||||
// accumulated per frame, which would drift.
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
enabled: root.ready
|
||||
cursorShape: Qt.OpenHandCursor
|
||||
property real pressX: 0
|
||||
property real pressY: 0
|
||||
property real originX: 0
|
||||
property real originY: 0
|
||||
|
||||
onPressed: mouse => {
|
||||
pressX = mouse.x; pressY = mouse.y;
|
||||
originX = root.offsetX; originY = root.offsetY;
|
||||
}
|
||||
onPositionChanged: mouse => {
|
||||
if (!pressed)
|
||||
return;
|
||||
root.offsetX = originX + (mouse.x - pressX);
|
||||
root.offsetY = originY + (mouse.y - pressY);
|
||||
root.clamp();
|
||||
}
|
||||
onWheel: wheel => {
|
||||
const before = root.scale;
|
||||
root.zoom = Math.max(1, Math.min(root.maxZoom,
|
||||
root.zoom * (wheel.angleDelta.y > 0 ? 1.1 : 1 / 1.1)));
|
||||
// Keep the centre of the frame pointing at the same part
|
||||
// of the picture, so zooming does not walk the subject
|
||||
// out of the circle.
|
||||
const ratio = root.scale / before;
|
||||
root.offsetX = root.viewport / 2 - (root.viewport / 2 - root.offsetX) * ratio;
|
||||
root.offsetY = root.viewport / 2 - (root.viewport / 2 - root.offsetY) * ratio;
|
||||
root.clamp();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Column {
|
||||
width: column.width - frame.width - 20
|
||||
spacing: 12
|
||||
|
||||
Text {
|
||||
width: parent.width
|
||||
text: root.ready
|
||||
? "Drag to reposition, scroll to zoom."
|
||||
: (root.source === "" ? "" : "Opening the picture…")
|
||||
color: Theme.fgDim
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontSize
|
||||
wrapMode: Text.WordWrap
|
||||
}
|
||||
|
||||
Text {
|
||||
width: parent.width
|
||||
visible: root.ready
|
||||
text: "The circle is what other people see. Written out at 512 × 512."
|
||||
color: Theme.fgMuted
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontSizeSmall
|
||||
wrapMode: Text.WordWrap
|
||||
}
|
||||
|
||||
Text {
|
||||
width: parent.width
|
||||
visible: picture.status === Image.Error
|
||||
text: "That file could not be opened as a picture."
|
||||
color: Theme.danger
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontSizeSmall
|
||||
wrapMode: Text.WordWrap
|
||||
}
|
||||
|
||||
Row {
|
||||
spacing: 8
|
||||
|
||||
SettingsButton {
|
||||
text: "Set picture"
|
||||
tone: "accent"
|
||||
enabled: root.ready
|
||||
onClicked: {
|
||||
// Screen coordinates back into the picture's own.
|
||||
const size = root.viewport / root.scale;
|
||||
root.cropped(Math.round(-root.offsetX / root.scale),
|
||||
Math.round(-root.offsetY / root.scale),
|
||||
Math.round(size));
|
||||
}
|
||||
}
|
||||
|
||||
SettingsButton {
|
||||
text: "Reset"
|
||||
enabled: root.ready
|
||||
onClicked: root.reset()
|
||||
}
|
||||
|
||||
SettingsButton {
|
||||
text: "Cancel"
|
||||
onClicked: root.cancelled()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -50,38 +50,50 @@ SettingsPage {
|
||||
|
||||
SettingsCard {
|
||||
title: "Timezone"
|
||||
subtitle: "Currently " + (DateTime.timezone === "" ? "unknown" : DateTime.timezone)
|
||||
+ ". Type to narrow the list."
|
||||
|
||||
SearchField {
|
||||
id: zoneSearch
|
||||
width: parent.width
|
||||
placeholder: "Search timezones"
|
||||
}
|
||||
PickerRow {
|
||||
id: zonePicker
|
||||
|
||||
Repeater {
|
||||
model: root.matchingZones
|
||||
label: "Time zone"
|
||||
detail: DateTime.timezone === ""
|
||||
? "Reading the system clock"
|
||||
: DateTime.cityOf(DateTime.timezone) + " — " + DateTime.regionOf(DateTime.timezone)
|
||||
value: DateTime.timezone === "" ? "Unknown" : DateTime.cityOf(DateTime.timezone)
|
||||
divider: false
|
||||
|
||||
SearchField {
|
||||
id: zoneSearch
|
||||
width: parent.width
|
||||
placeholder: "Search timezones"
|
||||
}
|
||||
|
||||
Repeater {
|
||||
model: root.matchingZones
|
||||
|
||||
TextRow {
|
||||
required property var modelData
|
||||
required property int index
|
||||
|
||||
label: DateTime.cityOf(modelData)
|
||||
detail: DateTime.regionOf(modelData)
|
||||
value: modelData === DateTime.timezone ? "Current" : ""
|
||||
controlWidth: 90
|
||||
divider: index < root.matchingZones.length - 1
|
||||
activatable: true
|
||||
onActivated: {
|
||||
DateTime.setTimezone(modelData);
|
||||
zonePicker.collapse();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
TextRow {
|
||||
required property var modelData
|
||||
required property int index
|
||||
|
||||
label: DateTime.cityOf(modelData)
|
||||
detail: DateTime.regionOf(modelData)
|
||||
value: modelData === DateTime.timezone ? "Current" : ""
|
||||
controlWidth: 90
|
||||
divider: index < root.matchingZones.length - 1
|
||||
activatable: true
|
||||
onActivated: DateTime.setTimezone(modelData)
|
||||
visible: root.matchingZones.length === 0
|
||||
label: "No timezone matches that"
|
||||
detail: "Try a city or a region, such as \"Denver\" or \"Europe\""
|
||||
divider: false
|
||||
}
|
||||
}
|
||||
|
||||
TextRow {
|
||||
visible: root.matchingZones.length === 0
|
||||
label: "No timezone matches that"
|
||||
detail: "Try a city or a region, such as \"Denver\" or \"Europe\""
|
||||
divider: false
|
||||
}
|
||||
}
|
||||
|
||||
SettingsCard {
|
||||
|
||||
@@ -15,6 +15,9 @@ Column {
|
||||
property var monitor: null
|
||||
property bool enabled: true
|
||||
|
||||
// Emitted once a mode has been asked for, so a container can put the list
|
||||
// away. Applying is still this component's job; closing is not.
|
||||
signal picked
|
||||
spacing: 0
|
||||
|
||||
readonly property var grouped: {
|
||||
@@ -106,11 +109,14 @@ Column {
|
||||
|
||||
TapHandler {
|
||||
enabled: root.enabled && !rate.selected
|
||||
onTapped: Displays.apply(
|
||||
root.monitor.name,
|
||||
rate.modelData.mode,
|
||||
Displays.nearestCleanScale(rate.modelData.mode, root.monitor.scale),
|
||||
root.monitor.transform)
|
||||
onTapped: {
|
||||
Displays.apply(
|
||||
root.monitor.name,
|
||||
rate.modelData.mode,
|
||||
Displays.nearestCleanScale(rate.modelData.mode, root.monitor.scale),
|
||||
root.monitor.transform);
|
||||
root.picked();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -175,10 +175,25 @@ SettingsPage {
|
||||
title: "Resolution"
|
||||
subtitle: "Applied straight away, then reverted automatically unless you confirm."
|
||||
|
||||
DisplayModePicker {
|
||||
width: parent.width
|
||||
monitor: root.monitor
|
||||
PickerRow {
|
||||
id: modePicker
|
||||
|
||||
label: "Resolution"
|
||||
detail: root.monitor
|
||||
? root.monitor.width + " × " + root.monitor.height + " native"
|
||||
: "No display selected"
|
||||
value: root.monitor
|
||||
? root.monitor.width + " × " + root.monitor.height
|
||||
: ""
|
||||
enabled: !Displays.awaitingConfirmation && !Displays.busy
|
||||
divider: false
|
||||
|
||||
DisplayModePicker {
|
||||
width: parent.width
|
||||
monitor: root.monitor
|
||||
enabled: !Displays.awaitingConfirmation && !Displays.busy
|
||||
onPicked: modePicker.collapse()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,83 @@
|
||||
// A setting whose value is chosen from far more options than belong on screen.
|
||||
//
|
||||
// PickerRow {
|
||||
// label: "Language"
|
||||
// value: SystemLocale.currentLabel
|
||||
// SearchPicker { items: SystemLocale.locales; onPicked: ... }
|
||||
// }
|
||||
//
|
||||
// Three pages rendered an entire dataset as rows -- every installed locale, the
|
||||
// whole tz database, every mode a monitor advertises -- so the one line telling
|
||||
// you what is currently set was buried under hundreds that were not. The chooser
|
||||
// itself was never the problem and is unchanged: this only collapses it behind
|
||||
// the current value, which is what a person came to the page to read.
|
||||
//
|
||||
// Collapsed by default, and closes again once something is picked, so the page
|
||||
// returns to being readable rather than staying open on a list nobody needs any
|
||||
// more.
|
||||
|
||||
import QtQuick
|
||||
import qs.config
|
||||
|
||||
Column {
|
||||
id: root
|
||||
|
||||
property string label: ""
|
||||
property string detail: ""
|
||||
// What is set right now. Shown on the collapsed row, so the common case --
|
||||
// looking rather than changing -- needs no interaction at all.
|
||||
property string value: ""
|
||||
property bool enabled: true
|
||||
property bool divider: true
|
||||
property bool expanded: false
|
||||
|
||||
default property alias content: body.data
|
||||
|
||||
// Pages call this from their picker's onPicked, so choosing something puts
|
||||
// the list away instead of leaving it open over the rest of the page.
|
||||
function collapse(): void { root.expanded = false; }
|
||||
|
||||
width: parent ? parent.width : 620
|
||||
spacing: 0
|
||||
|
||||
SettingRow {
|
||||
width: parent.width
|
||||
label: root.label
|
||||
detail: root.detail
|
||||
activatable: root.enabled
|
||||
divider: root.divider && !root.expanded
|
||||
opacity: root.enabled ? 1 : 0.5
|
||||
controlWidth: 210
|
||||
onActivated: root.expanded = !root.expanded
|
||||
|
||||
Row {
|
||||
anchors.right: parent.right
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
spacing: 9
|
||||
|
||||
Text {
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
text: root.value
|
||||
color: Theme.fgDim
|
||||
font.family: Theme.fontFamily
|
||||
font.features: Theme.tabularFigures
|
||||
font.pixelSize: Theme.fontSize
|
||||
elide: Text.ElideRight
|
||||
}
|
||||
|
||||
Text {
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
text: root.expanded ? "▴" : "▾"
|
||||
color: Theme.fgMuted
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontSizeSmall
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Column {
|
||||
id: body
|
||||
width: parent.width
|
||||
visible: root.expanded
|
||||
}
|
||||
}
|
||||
@@ -29,21 +29,27 @@ SettingsPage {
|
||||
title: "Language"
|
||||
subtitle: "Changing this needs your password, and takes effect for programs started afterwards."
|
||||
|
||||
TextRow {
|
||||
PickerRow {
|
||||
id: languagePicker
|
||||
|
||||
label: "Current language"
|
||||
detail: SystemLocale.pendingRestart
|
||||
? "Chosen, but not in use until you sign out and back in"
|
||||
: "Used by programs that ask the system what language to speak"
|
||||
value: SystemLocale.currentLabel || "Reading…"
|
||||
}
|
||||
divider: false
|
||||
|
||||
SearchPicker {
|
||||
width: parent.width
|
||||
items: SystemLocale.locales
|
||||
current: SystemLocale.current
|
||||
placeholder: "Search languages and regions"
|
||||
emptyText: SystemLocale.scanning ? "Reading installed locales…" : "No locales are installed"
|
||||
onPicked: value => SystemLocale.set(value)
|
||||
SearchPicker {
|
||||
width: parent.width
|
||||
items: SystemLocale.locales
|
||||
current: SystemLocale.current
|
||||
placeholder: "Search languages and regions"
|
||||
emptyText: SystemLocale.scanning ? "Reading installed locales…" : "No locales are installed"
|
||||
onPicked: value => {
|
||||
SystemLocale.set(value);
|
||||
languagePicker.collapse();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,89 @@
|
||||
// Page-level tabs, for a page that is genuinely several subjects.
|
||||
//
|
||||
// SettingsTabs {
|
||||
// tabs: [{ value: "theme", label: "Theme" }, …]
|
||||
// current: root.tab
|
||||
// onSelected: value => root.tab = value
|
||||
// }
|
||||
//
|
||||
// Only for pages long enough that scrolling hides the control someone came for.
|
||||
// Appearance was six cards deep, so light and dark -- the thing reached most --
|
||||
// sat below a wallpaper grid and an entire lock screen. Tabs are not a way to
|
||||
// make a short page look organised; they are for when the page is long enough
|
||||
// that the order stops being a suggestion and starts being a burial.
|
||||
|
||||
import QtQuick
|
||||
import qs.config
|
||||
|
||||
Item {
|
||||
id: root
|
||||
|
||||
// [{ value, label }]
|
||||
property var tabs: []
|
||||
property string current: ""
|
||||
|
||||
signal selected(string value)
|
||||
|
||||
width: parent ? parent.width : 620
|
||||
implicitHeight: 40
|
||||
|
||||
Row {
|
||||
id: strip
|
||||
anchors.left: parent.left
|
||||
anchors.bottom: parent.bottom
|
||||
spacing: 2
|
||||
|
||||
Repeater {
|
||||
model: root.tabs
|
||||
|
||||
delegate: Item {
|
||||
id: tab
|
||||
|
||||
required property var modelData
|
||||
|
||||
readonly property bool active: String(tab.modelData.value) === root.current
|
||||
|
||||
implicitWidth: caption.implicitWidth + 30
|
||||
implicitHeight: 38
|
||||
|
||||
Text {
|
||||
id: caption
|
||||
anchors.centerIn: parent
|
||||
text: String(tab.modelData.label ?? "")
|
||||
color: tab.active ? Theme.fg : (hover.hovered ? Theme.fgDim : Theme.fgMuted)
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontSize
|
||||
font.weight: tab.active ? Font.DemiBold : Font.Medium
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
anchors.bottom: parent.bottom
|
||||
height: 2
|
||||
radius: 1
|
||||
visible: tab.active
|
||||
color: Theme.accent
|
||||
}
|
||||
|
||||
HoverHandler {
|
||||
id: hover
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
}
|
||||
|
||||
TapHandler {
|
||||
onTapped: root.selected(String(tab.modelData.value))
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
anchors.bottom: parent.bottom
|
||||
height: 1
|
||||
color: Theme.alpha(Theme.fg, 0.08)
|
||||
z: -1
|
||||
}
|
||||
}
|
||||
@@ -24,6 +24,12 @@ SettingsPage {
|
||||
title: "Snapshots"
|
||||
lede: "Points in time you can go back to, taken automatically for each volume."
|
||||
|
||||
// Points in time shown without asking. The page used to show none: the
|
||||
// timeline and its Delete buttons sat behind a row labelled "Browse…", a
|
||||
// word that promises a file browser, so a page about points in time
|
||||
// appeared to list only how many there were.
|
||||
readonly property int previewCount: 3
|
||||
|
||||
property string openConfig: ""
|
||||
property string confirmingDelete: ""
|
||||
property string confirmingRestore: ""
|
||||
@@ -90,6 +96,9 @@ SettingsPage {
|
||||
readonly property string configName: String(volumeCard.modelData.name ?? "")
|
||||
readonly property var snapshots: volumeCard.modelData.snapshots ?? []
|
||||
readonly property bool open: root.openConfig === volumeCard.configName
|
||||
readonly property int shownCount: volumeCard.open
|
||||
? volumeCard.snapshots.length
|
||||
: Math.min(root.previewCount, volumeCard.snapshots.length)
|
||||
|
||||
title: Snapshots.labelFor(volumeCard.modelData)
|
||||
subtitle: String(volumeCard.modelData.subvolume ?? "")
|
||||
@@ -118,30 +127,24 @@ SettingsPage {
|
||||
onTriggered: Snapshots.take(volumeCard.configName, "Taken from Settings")
|
||||
}
|
||||
|
||||
ActionRow {
|
||||
label: "History"
|
||||
detail: volumeCard.snapshots.length === 0
|
||||
? "Nothing taken yet"
|
||||
: volumeCard.snapshots.length + " point"
|
||||
+ (volumeCard.snapshots.length === 1 ? "" : "s") + " in time"
|
||||
action: volumeCard.open ? "Hide" : "Browse…"
|
||||
enabled: volumeCard.snapshots.length > 0
|
||||
divider: volumeCard.open
|
||||
onTriggered: {
|
||||
root.confirmingDelete = "";
|
||||
Snapshots.closeBrowser();
|
||||
root.openConfig = volumeCard.open ? "" : volumeCard.configName;
|
||||
}
|
||||
TextRow {
|
||||
visible: volumeCard.snapshots.length === 0
|
||||
label: "No points in time yet"
|
||||
detail: "One is taken automatically on the schedule above."
|
||||
value: ""
|
||||
divider: false
|
||||
}
|
||||
|
||||
// ── The timeline ─────────────────────────────────────────────────
|
||||
|
||||
Column {
|
||||
width: parent.width
|
||||
visible: volumeCard.open && !root.browsingOpen
|
||||
visible: !root.browsingOpen
|
||||
|
||||
Repeater {
|
||||
model: volumeCard.snapshots
|
||||
model: volumeCard.open
|
||||
? volumeCard.snapshots
|
||||
: volumeCard.snapshots.slice(0, root.previewCount)
|
||||
|
||||
delegate: SettingRow {
|
||||
id: pointRow
|
||||
@@ -162,7 +165,7 @@ SettingsPage {
|
||||
+ " · #" + pointRow.modelData.number
|
||||
+ (pointRow.modelData.kept ? " · kept" : "")
|
||||
controlWidth: 250
|
||||
divider: pointRow.index < volumeCard.snapshots.length - 1
|
||||
divider: pointRow.index < volumeCard.shownCount - 1
|
||||
|
||||
Row {
|
||||
anchors.right: parent.right
|
||||
@@ -197,6 +200,36 @@ SettingsPage {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
SettingRow {
|
||||
width: parent.width
|
||||
visible: volumeCard.snapshots.length > root.previewCount
|
||||
activatable: true
|
||||
divider: false
|
||||
label: volumeCard.open
|
||||
? "Showing all " + volumeCard.snapshots.length + " points in time"
|
||||
: (volumeCard.snapshots.length - root.previewCount)
|
||||
+ " older point"
|
||||
+ (volumeCard.snapshots.length - root.previewCount === 1 ? "" : "s")
|
||||
+ " in time"
|
||||
detail: volumeCard.open
|
||||
? ""
|
||||
: "Oldest is " + String(volumeCard.snapshots[volumeCard.snapshots.length - 1]?.date ?? "")
|
||||
controlWidth: 110
|
||||
onActivated: {
|
||||
root.confirmingDelete = "";
|
||||
root.openConfig = volumeCard.open ? "" : volumeCard.configName;
|
||||
}
|
||||
|
||||
Text {
|
||||
anchors.right: parent.right
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
text: volumeCard.open ? "Show fewer \u25B4" : "Show all \u25BE"
|
||||
color: Theme.fgDim
|
||||
font.family: Theme.fontFamily
|
||||
font.pixelSize: Theme.fontSizeSmall
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// ── Inside one point in time ─────────────────────────────────────
|
||||
|
||||
@@ -67,8 +67,30 @@ SettingsPage {
|
||||
|
||||
// ── You ──────────────────────────────────────────────────────────────────
|
||||
|
||||
// Chosen but not yet framed. While this is set the cropper replaces the
|
||||
// account card, because framing is a decision to finish, not a setting to
|
||||
// leave half-made.
|
||||
property string pendingPicture: ""
|
||||
|
||||
SettingsCard {
|
||||
visible: root.me !== null
|
||||
visible: root.pendingPicture !== ""
|
||||
title: "Frame the picture"
|
||||
|
||||
AvatarCropper {
|
||||
width: parent.width
|
||||
source: root.pendingPicture
|
||||
|
||||
onCropped: (x, y, size) => {
|
||||
UserAccounts.setIconCropped(String(root.me?.userName ?? ""),
|
||||
root.pendingPicture, x, y, size);
|
||||
root.pendingPicture = "";
|
||||
}
|
||||
onCancelled: root.pendingPicture = ""
|
||||
}
|
||||
}
|
||||
|
||||
SettingsCard {
|
||||
visible: root.me !== null && root.pendingPicture === ""
|
||||
|
||||
Row {
|
||||
width: parent.width
|
||||
@@ -88,8 +110,10 @@ SettingsPage {
|
||||
source: UserAccounts.avatarUrl
|
||||
visible: UserAccounts.avatarUrl !== ""
|
||||
fillMode: Image.PreserveAspectCrop
|
||||
// The file is replaced in place when the picture
|
||||
// changes, so the cache has to be told to let go.
|
||||
// accountsservice replaces the file in place, so the
|
||||
// path never changes. cache:false is not enough on its
|
||||
// own -- an unchanged source is never re-read at all --
|
||||
// which is why avatarUrl carries a revision fragment.
|
||||
cache: false
|
||||
asynchronous: true
|
||||
sourceSize.width: 192
|
||||
@@ -374,6 +398,6 @@ SettingsPage {
|
||||
// chooser every other application gets and needs no privilege of its own.
|
||||
AvatarPicker {
|
||||
id: avatarPicker
|
||||
onPicked: path => UserAccounts.setIcon(String(root.me?.userName ?? ""), path)
|
||||
onPicked: path => root.pendingPicture = path
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,6 +5,9 @@ AvatarPicker 1.0 AvatarPicker.qml
|
||||
ConnectivityPage 1.0 ConnectivityPage.qml
|
||||
FirewallPage 1.0 FirewallPage.qml
|
||||
ContainersPage 1.0 ContainersPage.qml
|
||||
AvatarCropper 1.0 AvatarCropper.qml
|
||||
PickerRow 1.0 PickerRow.qml
|
||||
SettingsTabs 1.0 SettingsTabs.qml
|
||||
GamingPage 1.0 GamingPage.qml
|
||||
HomePhonePage 1.0 HomePhonePage.qml
|
||||
HomeFavoriteCard 1.0 HomeFavoriteCard.qml
|
||||
|
||||
Reference in New Issue
Block a user