From e924bff3aa9cd2a5a773711fe4ded4af5182d6c4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ula=C5=9F=20Turan?=
 <56156254+ulasturann@users.noreply.github.com>
Date: Tue, 1 Nov 2022 11:11:42 +0300
Subject: [PATCH] Fix #3498: Non-responsive toast. (#3524)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Ulaş Turan <ulasturan@Ulas-MacBook-Pro.local>
---
 components/lib/toast/Toast.css | 36 ++++++++++++++++++----------------
 1 file changed, 19 insertions(+), 17 deletions(-)

diff --git a/components/lib/toast/Toast.css b/components/lib/toast/Toast.css
index 7d459f5f8a..5825db668f 100644
--- a/components/lib/toast/Toast.css
+++ b/components/lib/toast/Toast.css
@@ -1,6 +1,8 @@
 .p-toast {
     position: fixed;
-    width: 25rem;
+    width: 100%;
+    max-width: 25rem;
+    padding-left: 2rem;
 }
 
 .p-toast-message-content {
@@ -17,40 +19,40 @@
 }
 
 .p-toast-top-right {
-	top: 20px;
-	right: 20px;
+    top: 20px;
+    right: 20px;
 }
 
 .p-toast-top-left {
-	top: 20px;
-	left: 20px;
+    top: 20px;
+    left: 20px;
 }
 
 .p-toast-bottom-left {
-	bottom: 20px;
-	left: 20px;
+    bottom: 20px;
+    left: 20px;
 }
 
 .p-toast-bottom-right {
-	bottom: 20px;
-	right: 20px;
+    bottom: 20px;
+    right: 20px;
 }
 
 .p-toast-top-center {
-	top: 20px;
+    top: 20px;
     left: 50%;
     transform: translateX(-50%);
 }
 
 .p-toast-bottom-center {
-	bottom: 20px;
-	left: 50%;
+    bottom: 20px;
+    left: 50%;
     transform: translateX(-50%);
 }
 
 .p-toast-center {
-	left: 50%;
-	top: 50%;
+    left: 50%;
+    top: 50%;
     min-width: 20vw;
     transform: translate(-50%, -50%);
 }
@@ -64,7 +66,7 @@
 }
 
 .p-toast-icon-close.p-link {
-	cursor: pointer;
+    cursor: pointer;
 }
 
 /* Animations */
@@ -76,7 +78,7 @@
 .p-toast-message-enter-active {
     opacity: 1;
     transform: translateY(0);
-    transition: transform .3s, opacity .3s;
+    transition: transform 0.3s, opacity 0.3s;
 }
 
 .p-toast-message-enter-done {
@@ -93,5 +95,5 @@
     max-height: 0;
     margin-bottom: 0;
     overflow: hidden;
-    transition: max-height .45s cubic-bezier(0, 1, 0, 1), opacity .3s, margin-bottom .3s;
+    transition: max-height 0.45s cubic-bezier(0, 1, 0, 1), opacity 0.3s, margin-bottom 0.3s;
 }