Toast: shadows

Modules/Toast/SimpleToast.qml

@@ -4,7 +4,7 @@ import QtQuick.Layouts
 import qs.Commons
 import qs.Widgets
 
-Rectangle {
+Item {
   id: root
 
   property string message: ""
@@ -16,26 +16,38 @@ Rectangle {
 
   signal hidden
 
-  width: parent.width
-  height: Math.round(contentLayout.implicitHeight + Style.marginL * 2)
-  radius: Style.radiusL
-  visible: false
+  width: 480
+  height: Math.round(contentLayout.implicitHeight + Style.marginL * 4)
+  visible: true
   opacity: 0
   scale: initialScale
-  color: Color.mSurface
 
-  // Colored border based on type
-  border.color: {
-    switch (type) {
-    case "warning":
-      return Color.mPrimary
-    case "error":
-      return Color.mError
-    default:
-      return Color.mOutline
+  // Background rectangle (apply shadows here)
+  Rectangle {
+    id: background
+    anchors.fill: parent
+    anchors.margins: Style.marginL
+    radius: Style.radiusL
+    color: Color.mSurface
+
+    // Colored border based on type
+    border.width: Math.max(2, Style.borderM)
+    border.color: {
+      switch (root.type) {
+      case "warning":
+        return Color.mPrimary
+      case "error":
+        return Color.mError
+      default:
+        return Color.mOutline
+      }
     }
   }
-  border.width: Math.max(2, Style.borderM)
+
+  NDropShadows {
+    anchors.fill: background
+    source: background
+  }
 
   Behavior on opacity {
     NumberAnimation {
@@ -75,7 +87,10 @@ Rectangle {
   RowLayout {
     id: contentLayout
     anchors.fill: parent
-    anchors.margins: Style.marginL
+    anchors.topMargin: Style.marginL
+    anchors.bottomMargin: Style.marginL
+    anchors.leftMargin: Style.marginL * 2
+    anchors.rightMargin: Style.marginL * 2
     spacing: Style.marginL
 
     // Icon
@@ -132,7 +147,7 @@ Rectangle {
 
   // Click anywhere dismiss the toast
   MouseArea {
-    anchors.fill: parent
+    anchors.fill: background
     acceptedButtons: Qt.LeftButton
     onClicked: root.hide()
     cursorShape: Qt.PointingHandCursor

Modules/Toast/ToastScreen.qml

@@ -193,8 +193,8 @@ Item {
         return base
       }
 
-      implicitWidth: 420
-      implicitHeight: toastItem.height
+      implicitWidth: Math.round(toastItem.width + Style.marginL * 2)
+      implicitHeight: Math.round(toastItem.height + Style.marginL * 2)
 
       color: Color.transparent