WCAG: Settings - AAA colors, keyboard nav, reduce motion toggle
This commit is contained in:
@@ -12,7 +12,8 @@ Window {
|
||||
visible: false
|
||||
flags: Qt.FramelessWindowHint | Qt.Window
|
||||
color: "transparent"
|
||||
title: "Settings"
|
||||
title: "WhisperVoice Settings"
|
||||
Accessible.name: "WhisperVoice Settings"
|
||||
|
||||
// Explicit sizing for Python to read
|
||||
|
||||
@@ -133,15 +134,20 @@ Window {
|
||||
// Improved Close Button
|
||||
Rectangle {
|
||||
width: 32; height: 32
|
||||
activeFocusOnTab: true
|
||||
Accessible.name: "Close settings"
|
||||
Accessible.role: Accessible.Button
|
||||
Keys.onReturnPressed: root.close()
|
||||
Keys.onSpacePressed: root.close()
|
||||
radius: 8
|
||||
color: closeMa.containsMouse ? "#20ff4b4b" : "transparent"
|
||||
border.color: closeMa.containsMouse ? "#40ff4b4b" : "transparent"
|
||||
color: closeMa.containsMouse ? "#20FF8A8A" : "transparent"
|
||||
border.color: closeMa.containsMouse ? "#40FF8A8A" : "transparent"
|
||||
border.width: 1
|
||||
|
||||
Text {
|
||||
anchors.centerIn: parent
|
||||
text: "×"
|
||||
color: closeMa.containsMouse ? "#ff4b4b" : SettingsStyle.textSecondary
|
||||
color: closeMa.containsMouse ? "#FF8A8A" : SettingsStyle.textSecondary
|
||||
font.family: mainFont
|
||||
font.pixelSize: 20
|
||||
font.bold: true
|
||||
@@ -157,6 +163,15 @@ Window {
|
||||
|
||||
Behavior on color { ColorAnimation { duration: 150 } }
|
||||
Behavior on border.color { ColorAnimation { duration: 150 } }
|
||||
// Focus ring
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
radius: 8
|
||||
color: "transparent"
|
||||
border.width: SettingsStyle.focusRingWidth
|
||||
border.color: SettingsStyle.accent
|
||||
visible: parent.activeFocus
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -206,6 +221,11 @@ Window {
|
||||
height: 38
|
||||
color: stack.currentIndex === index ? SettingsStyle.surfaceHover : (ma.containsMouse ? Qt.rgba(1,1,1,0.03) : "transparent")
|
||||
radius: 6
|
||||
activeFocusOnTab: true
|
||||
Accessible.name: name
|
||||
Accessible.role: Accessible.Tab
|
||||
Keys.onReturnPressed: stack.currentIndex = index
|
||||
Keys.onSpacePressed: stack.currentIndex = index
|
||||
|
||||
Behavior on color { ColorAnimation { duration: 150 } }
|
||||
|
||||
@@ -256,6 +276,15 @@ Window {
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
onClicked: stack.currentIndex = index
|
||||
}
|
||||
// Focus ring
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
radius: 6
|
||||
color: "transparent"
|
||||
border.width: SettingsStyle.focusRingWidth
|
||||
border.color: SettingsStyle.accent
|
||||
visible: parent.activeFocus
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -520,7 +549,7 @@ Window {
|
||||
ModernSettingsItem {
|
||||
label: "Window Opacity"
|
||||
description: "Transparency level"
|
||||
showSeparator: false
|
||||
showSeparator: true
|
||||
control: ModernSlider {
|
||||
Layout.preferredWidth: 200
|
||||
from: 0.1; to: 1.0
|
||||
@@ -528,6 +557,15 @@ Window {
|
||||
onMoved: ui.setSetting("opacity", Number(value.toFixed(2)))
|
||||
}
|
||||
}
|
||||
ModernSettingsItem {
|
||||
label: "Reduce Motion"
|
||||
description: "Disable animations for accessibility"
|
||||
showSeparator: false
|
||||
control: ModernSwitch {
|
||||
checked: ui.getSetting("reduce_motion")
|
||||
onToggled: ui.setSetting("reduce_motion", checked)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -752,8 +790,8 @@ Window {
|
||||
}
|
||||
color: "#ffffff"
|
||||
font.family: "JetBrains Mono"
|
||||
font.pixelSize: 10
|
||||
opacity: 0.7
|
||||
font.pixelSize: 11
|
||||
opacity: 1.0
|
||||
elide: Text.ElideRight
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
@@ -1065,9 +1103,9 @@ Window {
|
||||
spacing: 16
|
||||
|
||||
StatBox { label: "APP CPU"; value: ui.appCpu; unit: "%"; accent: "#00f2ff" }
|
||||
StatBox { label: "APP RAM"; value: ui.appRamMb; unit: "MB"; accent: "#bd93f9" }
|
||||
StatBox { label: "GPU VRAM"; value: ui.appVramMb; unit: "MB"; accent: "#ff79c6" }
|
||||
StatBox { label: "GPU LOAD"; value: ui.appVramPercent; unit: "%"; accent: "#ff5555" }
|
||||
StatBox { label: "APP RAM"; value: ui.appRamMb; unit: "MB"; accent: "#CAA9FF" }
|
||||
StatBox { label: "GPU VRAM"; value: ui.appVramMb; unit: "MB"; accent: "#FF8FD0" }
|
||||
StatBox { label: "GPU LOAD"; value: ui.appVramPercent; unit: "%"; accent: "#FF8A8A" }
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
|
||||
Reference in New Issue
Block a user