steal screencorners from noctalia

modules/bar/Bar.qml

@@ -14,9 +14,9 @@ Variants {
         aboveWindows: true
         screen: modelData
         margins {
-            top: Settings.config.margins
+            top: Settings.config.floating ? Settings.config.margins : 0
-            left: Settings.config.margins
+            left: Settings.config.floating ? Settings.config.margins : 0
-            right: Settings.config.margins
+            right: Settings.config.floating ? Settings.config.margins : 0
         }
 
         anchors {
@@ -29,8 +29,8 @@ Variants {
             id: container
             implicitHeight: Settings.config.barHeight
             anchors.fill: parent
-            color: Colors.surface
+            color: Qt.rgba(Colors.surface.r, Colors.surface.g, Colors.surface.b, Settings.config.translucency)
-            radius: implicitHeight / 2
+            radius: Settings.config.floating ? Settings.config.barHeight / 2 : 0
 
             Row {
                 id: leftStuff

modules/bar/Battery.qml

@@ -15,7 +15,7 @@ Loader {
     sourceComponent: Rectangle {
         id: container
         radius: implicitHeight / 2
-        color: clickHandler.containsMouse ? Colors.primary : Colors.secondary
+        color: clickHandler.containsMouse ? Colors.primary : Colors.surfaceContainer
         anchors.verticalCenter: parent.verticalCenter
         implicitWidth: root.implicitWidth + 20
         implicitHeight: Settings.config.barHeight - 10

modules/bar/Clock.qml

@@ -8,7 +8,7 @@ import qs.reusables
 Rectangle {
     id: container
     radius: implicitHeight / 2
-    color: formatSwitch.containsMouse ? Colors.secondaryContainer : Colors.primaryContainer
+    color: formatSwitch.containsMouse ? Colors.primaryContainer : Colors.surfaceContainer
     anchors.verticalCenter: parent.verticalCenter
     implicitHeight: Settings.config.barHeight - 10
     implicitWidth: root.implicitWidth + 20

modules/bar/Mpris.qml

@@ -8,7 +8,7 @@ Rectangle {
     id: container
     visible: root.spotify != null
     radius: implicitHeight / 2
-    color: clickHandler.containsMouse ? Colors.secondaryContainer : Colors.primaryContainer
+    color: clickHandler.containsMouse ? Colors.primaryContainer : Colors.surfaceContainer
     implicitWidth: root.implicitWidth + 20
     implicitHeight: Settings.config.barHeight - 10
     Item {

modules/bar/Title.qml

@@ -7,7 +7,7 @@ import qs.reusables
 Rectangle {
     id: container
     radius: implicitHeight / 2
-    color: Colors.primaryContainer
+    color: Colors.surfaceContainer
     anchors.verticalCenter: parent.verticalCenter
     implicitWidth: root.implicitWidth
     implicitHeight: Settings.config.barHeight - 10
@@ -23,15 +23,5 @@ Rectangle {
             text: root.activeWindow ? root.activeWindow.activated ? root.activeWindow.appId : "Desktop" : "Desktop"
             elide: Text.ElideRight
         }
-        MouseArea {
-            id: fontOpener
-            anchors.fill: parent
-            acceptedButtons: Qt.LeftButton
-            cursorShape: Qt.PointingHandCursor
-            onClicked: {
-                fontPicker.open();
-                console.log(fontPicker.selectedFont.family);
-            }
-        }
     }
 }

modules/bar/Volume.qml

@@ -9,7 +9,7 @@ import qs
 Rectangle {
     id: container
     radius: implicitHeight / 2
-    color: pavuArea.containsMouse ? Colors.secondaryContainer : Colors.primaryContainer
+    color: pavuArea.containsMouse ? Colors.primaryContainer : Colors.surfaceContainer
     anchors.verticalCenter: parent.verticalCenter
     implicitWidth: root.implicitWidth + 20
     implicitHeight: Settings.config.barHeight - 10

modules/bar/Workspaces.qml

@@ -5,10 +5,13 @@ import qs
 import qs.settings
 import qs.reusables
 
-Item {
+Rectangle {
     id: root
-    implicitWidth: workspaceRow.implicitWidth
+    color: Colors.surfaceContainer
-    implicitHeight: workspaceRow.implicitHeight
+
+    implicitWidth: workspaceRow.implicitWidth + 10
+    implicitHeight: Settings.config.barHeight - 10
+    radius: Settings.config.barHeight / 2
     anchors.verticalCenter: parent.verticalCenter
     property var screen: screen
     Row {
@@ -43,7 +46,8 @@ Item {
                 CustomText {
                     anchors.centerIn: workspaceNumber
                     text: parent.modelData.id
-                    color: workspaceNumber.modelData.focused ? Colors.onSecondaryContainerColor : Colors.surfaceVariant
+                    color: Colors.onSurfaceColor
+                    opacity: workspaceNumber.modelData.focused ? 1 : 0.5
                 }
                 MouseArea {
                     anchors.fill: parent

modules/overlays/ScreenCorners.qml

@@ -0,0 +1,224 @@
+import QtQuick
+import QtQuick.Shapes
+import qs
+import qs.settings
+
+/**
+* ScreenCorners - Shape component for rendering screen corners
+*
+* Renders concave corners at the screen edges to create a rounded screen effect.
+* Self-contained Shape component (no shadows).
+*/
+Item {
+    id: root
+
+    anchors.fill: parent
+
+    // Wrapper with layer caching to reduce GPU tessellation overhead
+    Item {
+        anchors.fill: parent
+
+        // Cache the Shape to a texture to prevent continuous re-tessellation
+        layer.enabled: true
+
+        Shape {
+            id: cornersShape
+
+            anchors.fill: parent
+            preferredRendererType: Shape.CurveRenderer
+            enabled: false // Disable mouse input
+
+            ShapePath {
+                id: cornersPath
+
+                // Corner configuration
+                readonly property color cornerColor: Qt.rgba(Colors.surface.r, Colors.surface.g, Colors.surface.b, Settings.config.translucency)
+                readonly property real cornerRadius: Settings.config.screenCornerRadius
+                readonly property real cornerSize: Settings.config.screenCornerRadius
+
+                // Determine margins based on bar position
+                readonly property real topMargin: Settings.config.floating ? 0 : Settings.config.barHeight
+                readonly property real bottomMargin: 0
+                readonly property real leftMargin: 0
+                readonly property real rightMargin: 0
+
+                // Screen dimensions
+                readonly property real screenWidth: cornersShape.width
+                readonly property real screenHeight: cornersShape.height
+
+                // Only show screen corners if enabled and appropriate conditions are met
+                readonly property bool shouldShow: Settings.config.showScreenCorners
+
+                // ShapePath configuration
+                strokeWidth: -1 // No stroke, fill only
+                fillColor: shouldShow ? cornerColor : "transparent"
+
+                // Smooth color animation (disabled during theme transitions to sync with Color.qml)
+
+                // ========== PATH DEFINITION ==========
+                // Draws 4 separate corner squares at screen edges
+                // Each corner square has a concave arc on the inner diagonal
+
+                // ========== TOP-LEFT CORNER ==========
+                // Arc is at the bottom-right of this square (inner diagonal)
+                // Start at top-left screen corner
+                startX: leftMargin
+                startY: topMargin
+
+                // Top edge (moving right)
+                PathLine {
+                    relativeX: cornersPath.cornerSize
+                    relativeY: 0
+                }
+
+                // Right edge (moving down toward arc)
+                PathLine {
+                    relativeX: 0
+                    relativeY: cornersPath.cornerSize - cornersPath.cornerRadius
+                }
+
+                // Concave arc (bottom-right corner of square, curving inward toward screen center)
+                PathArc {
+                    relativeX: -cornersPath.cornerRadius
+                    relativeY: cornersPath.cornerRadius
+                    radiusX: cornersPath.cornerRadius
+                    radiusY: cornersPath.cornerRadius
+                    direction: PathArc.Counterclockwise
+                }
+
+                // Bottom edge (moving left)
+                PathLine {
+                    relativeX: -(cornersPath.cornerSize - cornersPath.cornerRadius)
+                    relativeY: 0
+                }
+
+                // Left edge (moving up) - closes back to start
+                PathLine {
+                    relativeX: 0
+                    relativeY: -cornersPath.cornerSize
+                }
+
+                // ========== TOP-RIGHT CORNER ==========
+                // Arc is at the bottom-left of this square (inner diagonal)
+                PathMove {
+                    x: cornersPath.screenWidth - cornersPath.rightMargin - cornersPath.cornerSize
+                    y: cornersPath.topMargin
+                }
+
+                // Top edge (moving right)
+                PathLine {
+                    relativeX: cornersPath.cornerSize
+                    relativeY: 0
+                }
+
+                // Right edge (moving down)
+                PathLine {
+                    relativeX: 0
+                    relativeY: cornersPath.cornerSize
+                }
+
+                // Bottom edge (moving left toward arc)
+                PathLine {
+                    relativeX: -(cornersPath.cornerSize - cornersPath.cornerRadius)
+                    relativeY: 0
+                }
+
+                // Concave arc (bottom-left corner of square, curving inward toward screen center)
+                PathArc {
+                    relativeX: -cornersPath.cornerRadius
+                    relativeY: -cornersPath.cornerRadius
+                    radiusX: cornersPath.cornerRadius
+                    radiusY: cornersPath.cornerRadius
+                    direction: PathArc.Counterclockwise
+                }
+
+                // Left edge (moving up) - closes back to start
+                PathLine {
+                    relativeX: 0
+                    relativeY: -(cornersPath.cornerSize - cornersPath.cornerRadius)
+                }
+
+                // ========== BOTTOM-LEFT CORNER ==========
+                // Arc is at the top-right of this square (inner diagonal)
+                PathMove {
+                    x: cornersPath.leftMargin
+                    y: cornersPath.screenHeight - cornersPath.bottomMargin - cornersPath.cornerSize
+                }
+
+                // Top edge (moving right toward arc)
+                PathLine {
+                    relativeX: cornersPath.cornerSize - cornersPath.cornerRadius
+                    relativeY: 0
+                }
+
+                // Concave arc (top-right corner of square, curving inward toward screen center)
+                PathArc {
+                    relativeX: cornersPath.cornerRadius
+                    relativeY: cornersPath.cornerRadius
+                    radiusX: cornersPath.cornerRadius
+                    radiusY: cornersPath.cornerRadius
+                    direction: PathArc.Counterclockwise
+                }
+
+                // Right edge (moving down)
+                PathLine {
+                    relativeX: 0
+                    relativeY: cornersPath.cornerSize - cornersPath.cornerRadius
+                }
+
+                // Bottom edge (moving left)
+                PathLine {
+                    relativeX: -cornersPath.cornerSize
+                    relativeY: 0
+                }
+
+                // Left edge (moving up) - closes back to start
+                PathLine {
+                    relativeX: 0
+                    relativeY: -cornersPath.cornerSize
+                }
+
+                // ========== BOTTOM-RIGHT CORNER ==========
+                // Arc is at the top-left of this square (inner diagonal)
+                // Start at bottom-right of square (different from other corners!)
+                PathMove {
+                    x: cornersPath.screenWidth - cornersPath.rightMargin
+                    y: cornersPath.screenHeight - cornersPath.bottomMargin
+                }
+
+                // Bottom edge (moving left)
+                PathLine {
+                    relativeX: -cornersPath.cornerSize
+                    relativeY: 0
+                }
+
+                // Left edge (moving up toward arc)
+                PathLine {
+                    relativeX: 0
+                    relativeY: -(cornersPath.cornerSize - cornersPath.cornerRadius)
+                }
+
+                // Concave arc (top-left corner of square, curving inward toward screen center)
+                PathArc {
+                    relativeX: cornersPath.cornerRadius
+                    relativeY: -cornersPath.cornerRadius
+                    radiusX: cornersPath.cornerRadius
+                    radiusY: cornersPath.cornerRadius
+                    direction: PathArc.Counterclockwise
+                }
+
+                // Top edge (moving right)
+                PathLine {
+                    relativeX: cornersPath.cornerSize - cornersPath.cornerRadius
+                    relativeY: 0
+                }
+
+                // Right edge (moving down) - closes back to start
+                PathLine {
+                    relativeX: 0
+                    relativeY: cornersPath.cornerSize
+                }
+            }
+        }
+    }
+}

modules/overlays/Wallpaper.qml

@@ -27,5 +27,6 @@ Variants {
             fillMode: Image.Stretch
             source: Settings.config.currentWall
         }
+        ScreenCorners {}
     }
 }

modules/widgets/wallswitcher/WallSwitcher.qml

@@ -46,9 +46,10 @@ FloatingWindow {
             Layout.bottomMargin: 0
             radius: 14
             implicitHeight: 30
-            color: Colors.onPrimaryColor
+            color: Colors.surfaceContainerLow
             CustomText {
                 id: titleText
+                font.bold: true
                 anchors.centerIn: textWrapper
                 text: "Wallpapers in " + Settings.config.wallDir
             }
@@ -96,6 +97,7 @@ FloatingWindow {
                         id: imageRounder
                         implicitHeight: 80
                         implicitWidth: 120
+                        color: "transparent"
                         required property string filePath
                         radius: 12
                         child: Image {

settings/Settings.qml

@@ -8,33 +8,34 @@ Singleton {
     id: root
     property alias config: settingsAdapter
     property alias currentWall: settingsAdapter.currentWall
-    onConfigChanged: {
-        console.log('config change detected, writing adapter');
-        settingsView.writeAdapter();
-    }
 
     FileView {
         id: settingsView
 
-        onAdapterUpdated: writeAdapter()
         path: "/home/lucy/.config/quickshell/settings/config.json"
-        watchChanges: false
+        watchChanges: true
+        onFileChanged: reload()
 
+        onAdapterUpdated: writeAdapter()
         adapter: JsonAdapter {
             id: settingsAdapter
-            property var margins: 10
+            property var margins: 20
             property var currentWall: ""
-            property var barHeight: 28
+            property var barHeight: 20
             property var font: ""
             property var fontSize: 14
             property var rounding: 10
             property var wallDir: "file:///home/lucy/.walls/"
-            property bool floating: true
+            property bool floating: false
             property int paddingTop: 10
             property int paddingSides: 10
             property var generateScheme: true
             property bool wallSwitcherShown: false
-            property int fontWeight: 500
+            property int fontWeight: 600
+            property bool showScreenCorners: true
+            property int screenCornerRadius: 10
+            property double translucency: 1
+            property bool blackScreenCorners: true
         }
     }
 }

shell.qml

@@ -10,10 +10,9 @@ import qs.modules.widgets.settingsapp
 
 ShellRoot {
     id: root
-    Ipc {}
+    Wallpaper {}
     Bar {}
     Notification {}
-    Wallpaper {}
     WallSwitcher {}
-    MainWindow {}
+    Ipc {}
 }