dock: gradient screen-edge line, gap, and content border matching bar style

shell/dock/AppletDock.qml

@@ -124,13 +124,47 @@ PanelWindow {
         }
     }
 
-    // Accent border on the left edge
+    // Left edge gradient line - marks the virtual screen edge when pinned,
+    // simple accent line in overlay mode
     Rectangle {
+        id: _edgeLine
         anchors.left: parent.left
         anchors.top: parent.top
         anchors.bottom: parent.bottom
         width: 1
-        color: root._accent
+
+        gradient: S.DockState.mode === "pinned" ? _screenEdgeGradient : null
+        color: S.DockState.mode === "pinned" ? "transparent" : root._accent
+        opacity: _bg.opacity
+
+        transform: Translate {
+            x: root._slideX
+        }
+
+        Gradient {
+            id: _screenEdgeGradient
+            GradientStop {
+                position: 0
+                color: S.Theme.base0C
+            }
+            GradientStop {
+                position: 1
+                color: S.Theme.base09
+            }
+        }
+    }
+
+    // Dock content border - 1px accent, inset from the edge line by the gap
+    Rectangle {
+        anchors.left: parent.left
+        anchors.leftMargin: S.Theme.groupSpacing
+        anchors.top: parent.top
+        anchors.bottom: parent.bottom
+        anchors.right: parent.right
+        color: "transparent"
+        border.color: root._accent
+        border.width: 1
+        radius: S.Theme.radius
         opacity: _bg.opacity
 
         transform: Translate {
@@ -138,10 +172,11 @@ PanelWindow {
         }
     }
 
-    // Content
+    // Content - inset past the edge line + gap
     Flickable {
         id: _flickable
         anchors.fill: parent
+        anchors.leftMargin: S.Theme.groupSpacing + 1
         contentHeight: _column.height
         clip: true
         boundsBehavior: Flickable.StopAtBounds