kenji/illogical-impulse
1
0
Fork 0
forked from Shinonome/dots-hyprland
Code Pull Requests Activity

settings: redesign home page

Browse Source
This commit is contained in:
end-4
2025-09-01 18:05:45 +02:00
parent fcb4e6cc85
commit cdc38f7e6e
11 changed files with 322 additions and 277 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.config/quickshell/ii/modules/common/widgets/ConfigSelectionArray.qml
-1
View File
@@ -10,7 +10,6 @@ Flow {
Layout.fillWidth: true
spacing: 2
property list<var> options: []
property string configOptionName: ""
property var currentValue: null
signal selected(var newValue)
.config/quickshell/ii/modules/common/widgets/ContentSection.qml
+5
View File
@@ -18,6 +18,11 @@ ColumnLayout {
}
ColumnLayout {
id: sectionContent
Layout.fillWidth: true
spacing: 8
Item {
Layout.fillWidth: true
}
}
}
.config/quickshell/ii/modules/common/widgets/LightDarkPreferenceButton.qml
+1 -1
View File
@@ -6,7 +6,7 @@ import QtQuick
import QtQuick.Layouts
import Quickshell
GroupButton {
RippleButton {
id: lightDarkButtonRoot
required property bool dark
property color previewBg: dark ? ColorUtils.colorWithHueOf("#3f3838", Appearance.m3colors.m3primary) :
.config/quickshell/ii/modules/common/widgets/RippleButtonWithIcon.qml
+3 -1
View File
@@ -17,12 +17,13 @@ RippleButton {
}
}
implicitHeight: 35
horizontalPadding: 15
horizontalPadding: 10
buttonRadius: Appearance.rounding.small
colBackground: Appearance.colors.colLayer2
contentItem: RowLayout {
Item {
Layout.fillWidth: false
implicitWidth: Math.max(materialIconLoader.implicitWidth, nerdIconLoader.implicitWidth)
Loader {
id: materialIconLoader
@@ -48,6 +49,7 @@ RippleButton {
}
}
Loader {
Layout.fillWidth: true
sourceComponent: buttonWithIconRoot.mainContentComponent
Layout.alignment: Qt.AlignVCenter
}
.config/quickshell/ii/modules/settings/InterfaceConfig.qml
-5
View File
@@ -18,7 +18,6 @@ ContentPage {
}
ConfigSelectionArray {
currentValue: Config.options.policies.weeb
configOptionName: "policies.weeb"
onSelected: newValue => {
Config.options.policies.weeb = newValue;
}
@@ -46,7 +45,6 @@ ContentPage {
}
ConfigSelectionArray {
currentValue: Config.options.policies.ai
configOptionName: "policies.ai"
onSelected: newValue => {
Config.options.policies.ai = newValue;
}
@@ -90,7 +88,6 @@ ContentPage {
ConfigSelectionArray {
currentValue: Config.options.bar.cornerStyle
configOptionName: "bar.cornerStyle"
onSelected: newValue => {
Config.options.bar.cornerStyle = newValue; // Update local copy
}
@@ -115,7 +112,6 @@ ContentPage {
title: Translation.tr("Bar layout")
ConfigSelectionArray {
currentValue: Config.options.bar.vertical
configOptionName: "bar.vertical"
onSelected: newValue => {
Config.options.bar.vertical = newValue;
}
@@ -572,7 +568,6 @@ ContentPage {
ConfigSelectionArray {
id: languageSelector
currentValue: Config.options.language.ui
configOptionName: "language.ui"
onSelected: newValue => {
Config.options.language.ui = newValue;
reloadNotice.visible = true;
.config/quickshell/ii/modules/settings/QuickConfig.qml
+305
View File
@@ -0,0 +1,305 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Qt5Compat.GraphicalEffects
import Quickshell
import Quickshell.Io
import qs
import qs.services
import qs.modules.common
import qs.modules.common.widgets
import qs.modules.common.functions
ContentPage {
forceWidth: true
Process {
id: konachanWallProc
property string status: ""
command: ["bash", "-c", FileUtils.trimFileProtocol(`${Directories.scriptPath}/colors/random_konachan_wall.sh`)]
stdout: SplitParser {
onRead: data => {
konachanWallProc.status = data.trim();
}
}
}
component SmallLightDarkPreferenceButton: RippleButton {
id: smallLightDarkPreferenceButton
required property bool dark
property color colText: toggled ? Appearance.colors.colOnPrimary : Appearance.colors.colOnLayer2
padding: 5
Layout.fillWidth: true
toggled: Appearance.m3colors.darkmode === dark
colBackground: Appearance.colors.colLayer2
onClicked: {
Quickshell.execDetached(["bash", "-c", `${Directories.wallpaperSwitchScriptPath} --mode ${dark ? "dark" : "light"} --noswitch`]);
}
contentItem: Item {
anchors.centerIn: parent
ColumnLayout {
anchors.centerIn: parent
spacing: 0
MaterialSymbol {
Layout.alignment: Qt.AlignHCenter
iconSize: 30
text: dark ? "dark_mode" : "light_mode"
color: smallLightDarkPreferenceButton.colText
}
StyledText {
Layout.alignment: Qt.AlignHCenter
text: dark ? Translation.tr("Dark") : Translation.tr("Light")
font.pixelSize: Appearance.font.pixelSize.smaller
color: smallLightDarkPreferenceButton.colText
}
}
}
}
// Wallpaper selection
ContentSection {
title: Translation.tr("Wallpaper & Colors")
Layout.fillWidth: true
RowLayout {
Layout.fillWidth: true
Item {
implicitWidth: 300
implicitHeight: 200
Image {
id: wallpaperPreview
anchors.fill: parent
sourceSize.width: 300
sourceSize.height: 200
fillMode: Image.PreserveAspectCrop
source: Config.options.background.wallpaperPath
layer.enabled: true
layer.effect: OpacityMask {
maskSource: Rectangle {
width: 360
height: 200
radius: Appearance.rounding.normal
}
}
}
}
ColumnLayout {
RippleButtonWithIcon {
id: rndWallBtn
Layout.fillWidth: true
buttonRadius: Appearance.rounding.small
materialIcon: "wallpaper"
mainText: konachanWallProc.running ? Translation.tr("Be patient...") : Translation.tr("Random: Konachan")
onClicked: {
konachanWallProc.running = true;
}
StyledToolTip {
content: Translation.tr("Random SFW Anime wallpaper from Konachan\nImage is saved to ~/Pictures/Wallpapers")
}
}
RippleButtonWithIcon {
Layout.fillWidth: true
materialIcon: "wallpaper"
StyledToolTip {
content: Translation.tr("Pick wallpaper image on your system")
}
onClicked: {
Quickshell.execDetached(`${Directories.wallpaperSwitchScriptPath}`);
}
mainContentComponent: Component {
RowLayout {
spacing: 10
StyledText {
font.pixelSize: Appearance.font.pixelSize.small
text: Translation.tr("Choose file")
color: Appearance.colors.colOnSecondaryContainer
}
RowLayout {
spacing: 3
KeyboardKey {
key: "Ctrl"
}
KeyboardKey {
key: "󰖳"
}
StyledText {
Layout.alignment: Qt.AlignVCenter
text: "+"
}
KeyboardKey {
key: "T"
}
}
}
}
}
RowLayout {
Layout.alignment: Qt.AlignHCenter
Layout.fillWidth: true
Layout.fillHeight: true
uniformCellSizes: true
SmallLightDarkPreferenceButton {
Layout.fillHeight: true
dark: false
}
SmallLightDarkPreferenceButton {
Layout.fillHeight: true
dark: true
}
}
ConfigSwitch {
text: Translation.tr("Transparency")
checked: Config.options.appearance.transparency.enable
onCheckedChanged: {
Config.options.appearance.transparency.enable = checked;
}
StyledToolTip {
content: Translation.tr("Might look ass. Unsupported.")
}
}
}
}
ConfigSelectionArray {
currentValue: Config.options.appearance.palette.type
onSelected: newValue => {
Config.options.appearance.palette.type = newValue;
Quickshell.execDetached(["bash", "-c", `${Directories.wallpaperSwitchScriptPath} --noswitch`]);
}
options: [
{
"value": "auto",
"displayName": Translation.tr("Auto")
},
{
"value": "scheme-content",
"displayName": Translation.tr("Content")
},
{
"value": "scheme-expressive",
"displayName": Translation.tr("Expressive")
},
{
"value": "scheme-fidelity",
"displayName": Translation.tr("Fidelity")
},
{
"value": "scheme-fruit-salad",
"displayName": Translation.tr("Fruit Salad")
},
{
"value": "scheme-monochrome",
"displayName": Translation.tr("Monochrome")
},
{
"value": "scheme-neutral",
"displayName": Translation.tr("Neutral")
},
{
"value": "scheme-rainbow",
"displayName": Translation.tr("Rainbow")
},
{
"value": "scheme-tonal-spot",
"displayName": Translation.tr("Tonal Spot")
}
]
}
}
ContentSection {
title: Translation.tr("Bar & screen")
ConfigRow {
ContentSubsection {
title: Translation.tr("Bar position")
ConfigSelectionArray {
currentValue: (Config.options.bar.bottom ? 1 : 0) | (Config.options.bar.vertical ? 2 : 0)
onSelected: newValue => {
Config.options.bar.bottom = (newValue & 1) !== 0;
Config.options.bar.vertical = (newValue & 2) !== 0;
}
options: [
{
displayName: Translation.tr("Top"),
value: 0 // bottom: false, vertical: false
},
{
displayName: Translation.tr("Left"),
value: 2 // bottom: false, vertical: true
},
{
displayName: Translation.tr("Bottom"),
value: 1 // bottom: true, vertical: false
},
{
displayName: Translation.tr("Right"),
value: 3 // bottom: true, vertical: true
}
]
}
}
ContentSubsection {
title: Translation.tr("Bar style")
ConfigSelectionArray {
currentValue: Config.options.bar.cornerStyle
onSelected: newValue => {
Config.options.bar.cornerStyle = newValue; // Update local copy
}
options: [
{
displayName: Translation.tr("Hug"),
value: 0
},
{
displayName: Translation.tr("Float"),
value: 1
},
{
displayName: Translation.tr("Plain rectangle"),
value: 2
}
]
}
}
}
ConfigRow {
ContentSubsection {
title: Translation.tr("Screen round corner")
ConfigSelectionArray {
currentValue: Config.options.appearance.fakeScreenRounding
onSelected: newValue => {
Config.options.appearance.fakeScreenRounding = newValue;
}
options: [
{
displayName: Translation.tr("No"),
value: 0
},
{
displayName: Translation.tr("Yes"),
value: 1
},
{
displayName: Translation.tr("When not fullscreen"),
value: 2
}
]
}
}
}
}
NoticeBox {
Layout.fillWidth: true
text: Translation.tr('Not all options are available in this app. You should also check the config file by hitting the "Config file" button on the topleft corner or opening %1 manually.').arg(Directories.shellConfigPath)
}
}
.config/quickshell/ii/modules/settings/ServicesConfig.qml
-1
View File
@@ -211,7 +211,6 @@ ContentPage {
ConfigSelectionArray {
currentValue: Config.options.time.format
configOptionName: "time.format"
onSelected: newValue => {
if (newValue === "hh:mm") {
Quickshell.execDetached(["bash", "-c", `sed -i 's/\\TIME12\\b/TIME/' '${FileUtils.trimFileProtocol(Directories.config)}/hypr/hyprlock.conf'`]);
.config/quickshell/ii/modules/settings/StyleConfig.qml
-253
View File
@@ -1,253 +0,0 @@
import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import Quickshell
import Quickshell.Io
import qs
import qs.services
import qs.modules.common
import qs.modules.common.widgets
import qs.modules.common.functions
ContentPage {
baseWidth: lightDarkButtonGroup.implicitWidth
forceWidth: true
Process {
id: konachanWallProc
property string status: ""
command: ["bash", "-c", FileUtils.trimFileProtocol(`${Directories.scriptPath}/colors/random_konachan_wall.sh`)]
stdout: SplitParser {
onRead: data => {
console.log(`Konachan wall proc output: ${data}`);
konachanWallProc.status = data.trim();
}
}
}
ContentSection {
title: Translation.tr("Colors & Wallpaper")
// Light/Dark mode preference
ButtonGroup {
id: lightDarkButtonGroup
Layout.fillWidth: true
LightDarkPreferenceButton {
dark: false
}
LightDarkPreferenceButton {
dark: true
}
}
// Material palette selection
ContentSubsection {
title: Translation.tr("Material palette")
ConfigSelectionArray {
currentValue: Config.options.appearance.palette.type
configOptionName: "appearance.palette.type"
onSelected: (newValue) => {
Config.options.appearance.palette.type = newValue;
Quickshell.execDetached(["bash", "-c", `${Directories.wallpaperSwitchScriptPath} --noswitch`])
}
options: [
{"value": "auto", "displayName": Translation.tr("Auto")},
{"value": "scheme-content", "displayName": Translation.tr("Content")},
{"value": "scheme-expressive", "displayName": Translation.tr("Expressive")},
{"value": "scheme-fidelity", "displayName": Translation.tr("Fidelity")},
{"value": "scheme-fruit-salad", "displayName": Translation.tr("Fruit Salad")},
{"value": "scheme-monochrome", "displayName": Translation.tr("Monochrome")},
{"value": "scheme-neutral", "displayName": Translation.tr("Neutral")},
{"value": "scheme-rainbow", "displayName": Translation.tr("Rainbow")},
{"value": "scheme-tonal-spot", "displayName": Translation.tr("Tonal Spot")}
]
}
}
// Wallpaper selection
ContentSubsection {
title: Translation.tr("Wallpaper")
RowLayout {
Layout.alignment: Qt.AlignHCenter
RippleButtonWithIcon {
id: rndWallBtn
buttonRadius: Appearance.rounding.small
materialIcon: "wallpaper"
mainText: konachanWallProc.running ? Translation.tr("Be patient...") : Translation.tr("Random: Konachan")
onClicked: {
console.log(konachanWallProc.command.join(" "))
konachanWallProc.running = true;
}
StyledToolTip {
content: Translation.tr("Random SFW Anime wallpaper from Konachan\nImage is saved to ~/Pictures/Wallpapers")
}
}
RippleButtonWithIcon {
materialIcon: "wallpaper"
StyledToolTip {
content: Translation.tr("Pick wallpaper image on your system")
}
onClicked: {
Quickshell.execDetached(`${Directories.wallpaperSwitchScriptPath}`)
}
mainContentComponent: Component {
RowLayout {
spacing: 10
StyledText {
font.pixelSize: Appearance.font.pixelSize.small
text: Translation.tr("Choose file")
color: Appearance.colors.colOnSecondaryContainer
}
RowLayout {
spacing: 3
KeyboardKey {
key: "Ctrl"
}
KeyboardKey {
key: "󰖳"
}
StyledText {
Layout.alignment: Qt.AlignVCenter
text: "+"
}
KeyboardKey {
key: "T"
}
}
}
}
}
}
}
StyledText {
Layout.topMargin: 5
Layout.alignment: Qt.AlignHCenter
text: Translation.tr("Alternatively use /dark, /light, /img in the launcher")
font.pixelSize: Appearance.font.pixelSize.smaller
color: Appearance.colors.colSubtext
}
}
ContentSection {
title: Translation.tr("Decorations & Effects")
ContentSubsection {
title: Translation.tr("Transparency")
ConfigRow {
ConfigSwitch {
text: Translation.tr("Enable")
checked: Config.options.appearance.transparency.enable
onCheckedChanged: {
Config.options.appearance.transparency.enable = checked;
}
StyledToolTip {
content: Translation.tr("Might look ass. Unsupported.")
}
}
}
}
ContentSubsection {
title: Translation.tr("Fake screen rounding")
ButtonGroup {
id: fakeScreenRoundingButtonGroup
property int selectedPolicy: Config.options.appearance.fakeScreenRounding
spacing: 2
SelectionGroupButton {
property int value: 0
leftmost: true
buttonText: Translation.tr("No")
toggled: (fakeScreenRoundingButtonGroup.selectedPolicy === value)
onClicked: {
Config.options.appearance.fakeScreenRounding = value;
}
}
SelectionGroupButton {
property int value: 1
buttonText: Translation.tr("Yes")
toggled: (fakeScreenRoundingButtonGroup.selectedPolicy === value)
onClicked: {
Config.options.appearance.fakeScreenRounding = value;
}
}
SelectionGroupButton {
property int value: 2
rightmost: true
buttonText: Translation.tr("When not fullscreen")
toggled: (fakeScreenRoundingButtonGroup.selectedPolicy === value)
onClicked: {
Config.options.appearance.fakeScreenRounding = value;
}
}
}
}
ContentSubsection {
title: Translation.tr("Shell windows")
ConfigRow {
uniform: true
ConfigSwitch {
text: Translation.tr("Title bar")
checked: Config.options.windows.showTitlebar
onCheckedChanged: {
Config.options.windows.showTitlebar = checked;
}
}
ConfigSwitch {
text: Translation.tr("Center title")
checked: Config.options.windows.centerTitle
onCheckedChanged: {
Config.options.windows.centerTitle = checked;
}
}
}
}
ContentSubsection {
title: Translation.tr("Wallpaper parallax")
ConfigSwitch {
text: Translation.tr("Vertical")
checked: Config.options.background.parallax.vertical
onCheckedChanged: {
Config.options.background.parallax.vertical = checked;
}
}
ConfigRow {
uniform: true
ConfigSwitch {
text: Translation.tr("Depends on workspace")
checked: Config.options.background.parallax.enableWorkspace
onCheckedChanged: {
Config.options.background.parallax.enableWorkspace = checked;
}
}
ConfigSwitch {
text: Translation.tr("Depends on sidebars")
checked: Config.options.background.parallax.enableSidebar
onCheckedChanged: {
Config.options.background.parallax.enableSidebar = checked;
}
}
}
ConfigSpinBox {
text: Translation.tr("Preferred wallpaper zoom (%)")
value: Config.options.background.parallax.workspaceZoom * 100
from: 100
to: 150
stepSize: 1
onValueChanged: {
console.log(value/100)
Config.options.background.parallax.workspaceZoom = value / 100;
}
}
}
}
}
.config/quickshell/ii/modules/verticalBar/Workspaces.qml
+5 -8
View File
@@ -20,7 +20,8 @@ Item {
readonly property int workspaceGroup: Math.floor((monitor?.activeWorkspace?.id - 1) / Config.options.bar.workspaces.shown)
property list<bool> workspaceOccupied: []
property int workspaceButtonWidth: 26
property real workspaceButtonWidth: 26
property real activeWorkspaceMargin: 2
property real workspaceIconSize: workspaceButtonWidth * 0.69
property real workspaceIconSizeShrinked: workspaceButtonWidth * 0.55
property real workspaceIconOpacityShrinked: 1
@@ -150,20 +151,16 @@ Item {
Rectangle {
z: 2
// Make active ws indicator, which has a brighter color, smaller to look like it is of the same size as ws occupied highlight
property real activeWorkspaceMargin: 2
implicitWidth: workspaceButtonWidth - activeWorkspaceMargin * 2
implicitWidth: workspaceButtonWidth - root.activeWorkspaceMargin * 2
radius: Appearance.rounding.full
color: Appearance.colors.colPrimary
anchors.horizontalCenter: parent.horizontalCenter
property real idx1: workspaceIndexInGroup
property real idx2: workspaceIndexInGroup
y: Math.min(idx1, idx2) * workspaceButtonWidth + activeWorkspaceMargin
implicitHeight: Math.abs(idx1 - idx2) * workspaceButtonWidth + workspaceButtonWidth - activeWorkspaceMargin * 2
y: Math.min(idx1, idx2) * workspaceButtonWidth + root.activeWorkspaceMargin
implicitHeight: Math.abs(idx1 - idx2) * workspaceButtonWidth + workspaceButtonWidth - root.activeWorkspaceMargin * 2
Behavior on activeWorkspaceMargin {
animation: Appearance.animation.elementMoveFast.numberAnimation.createObject(this)
}
Behavior on idx1 { // Leading anim
NumberAnimation {
duration: 100
.config/quickshell/ii/settings.qml
+3 -3
View File
@@ -24,9 +24,9 @@ ApplicationWindow {
property bool showNextTime: false
property var pages: [
{
name: Translation.tr("Style"),
icon: "palette",
component: "modules/settings/StyleConfig.qml"
name: Translation.tr("Quick"),
icon: "instant_mix",
component: "modules/settings/QuickConfig.qml"
},
{
name: Translation.tr("Interface"),
.config/quickshell/ii/welcome.qml
-4
View File
@@ -140,7 +140,6 @@ ApplicationWindow {
ConfigSelectionArray {
currentValue: Config.options.bar.cornerStyle
configOptionName: "bar.cornerStyle"
onSelected: newValue => {
Config.options.bar.cornerStyle = newValue; // Update local copy
}
@@ -165,7 +164,6 @@ ApplicationWindow {
title: "Bar layout"
ConfigSelectionArray {
currentValue: Config.options.bar.vertical
configOptionName: "bar.vertical"
onSelected: newValue => {
Config.options.bar.vertical = newValue;
}
@@ -284,7 +282,6 @@ ApplicationWindow {
ConfigSelectionArray {
currentValue: Config.options.policies.weeb
configOptionName: "policies.weeb"
onSelected: newValue => {
Config.options.policies.weeb = newValue;
}
@@ -310,7 +307,6 @@ ApplicationWindow {
ConfigSelectionArray {
currentValue: Config.options.policies.ai
configOptionName: "policies.ai"
onSelected: newValue => {
Config.options.policies.ai = newValue;
}