improve appearance of dock type buttons area

shell/package/contents/configuration/LatteDockConfiguration.qml

@@ -49,6 +49,9 @@ FocusScope {
     property bool panelIsVertical: plasmoid.formFactor === PlasmaCore.Types.Vertical
     property int subGroupSpacing: units.largeSpacing + units.smallSpacing * 1.5
 
+    property color bC: theme.backgroundColor
+    property color transparentBackgroundColor: Qt.rgba(bC.r, bC.g, bC.b, 0.7)
+
     PlasmaCore.FrameSvgItem{
         anchors.fill: parent
         imagePath: "dialogs/background"
@@ -56,7 +59,7 @@ FocusScope {
 
     TypeSelection{
         x: dialog.width/2 - width/2
-        y: plasmoid.configuration.advanced ? 0 : -height-18
+        y: plasmoid.configuration.advanced ? -marginHeight : -height
 
         Behavior on y {
             NumberAnimation { duration: plasmoid.configuration.durationTime*units.longDuration }
@@ -319,11 +322,7 @@ FocusScope {
             width: maxWidth - units.smallSpacing
             height: behaviorPage.Layout.maximumHeight + units.smallSpacing * 4
 
-            property color bC: theme.backgroundColor
+            color: transparentBackgroundColor
-            property color transparentBack: Qt.rgba(bC.r, bC.g, bC.b, 0.7)
-
-            color: transparentBack
-
             border.width: 1
             border.color: theme.backgroundColor
 

shell/package/contents/configuration/TypeSelection.qml

@@ -29,21 +29,35 @@ import org.kde.plasma.plasmoid 2.0
 
 import org.kde.latte 0.1 as Latte
 
-Row {
+Rectangle {
+    width: typeRow.width + 2*marginWidth
+    height: typeRow.height + 2*marginHeight
+
+    property int marginHeight: 0.3 * typeRow.height
+    property int marginWidth: 0.5 * typeRow.height
+
+    color: transparentBackgroundColor
+    border.width: 1
+    border.color: theme.backgroundColor
+
+    Row {
         id: typeRow
+        anchors.centerIn: parent
+
         spacing: 1
 
         readonly property bool isPanel: (plasmoid.configuration.panelPosition === Latte.Dock.Justify)
                                         && (plasmoid.configuration.useThemePanel) && (plasmoid.configuration.panelSize===100)
                                         && (plasmoid.configuration.zoomLevel === 0) && !plasmoid.configuration.autoDecreaseIconSize
 
-    layer.enabled: true
+        /*layer.enabled: true
     layer.effect: DropShadow {
-        radius: 6
+        radius: dockTypeButton.height / 10
-        samples: 2 * radius
+        samples: radius
-        color: "#000000"
+        color: "#0a0a0a"
         horizontalOffset: -1
-    }
+        //opacity: 0.5
+    }*/
 
         ExclusiveGroup {
             id: dockTypeGroup
@@ -97,5 +111,6 @@ Row {
                 }
             }
         }
+    }
 
 }