Make FLuentToastContainer work better on mobile devices (was #684)

microsoft · Sep 3, 2023 · b4d1722 · b4d1722
1 parent cf571a4
commit b4d1722
Showing 1 changed file with 31 additions and 36 deletions.
diff --git a/src/Core/Components/Toast/FluentToastContainer.razor.css b/src/Core/Components/Toast/FluentToastContainer.razor.css
@@ -17,39 +17,34 @@
     bottom: 0;
 }
 
-@media (min-width: 576px) {
-
-    .position-topleft {
-        top: 24px;
-        left: 24px;
-    }
-
-    .position-topright {
-        top: 24px;
-        right: 24px;
-    }
-
-    .position-topcenter {
-        top: 24px;
-        left: 50%;
-        transform: translate(-50%, 0%);
-    }
-
-    .position-bottomleft {
-        bottom: 24px;
-        left: 24px;
-    }
-
-    .position-bottomright {
-        bottom: 24px;
-        right: 24px;
-    }
-
-    .position-bottomcenter {
-        bottom: 24px;
-        left: 50%;
-        transform: translate(-50%, 0%);
-    }
-
-
-}
+.position-topleft {
+    top: 24px;
+    left: 24px;
+}
+
+.position-topright {
+    top: 24px;
+    right: 24px;
+}
+
+.position-topcenter {
+    top: 24px;
+    left: 50%;
+    transform: translate(-50%, 0%);
+}
+
+.position-bottomleft {
+    bottom: 24px;
+    left: 24px;
+}
+
+.position-bottomright {
+    bottom: 24px;
+    right: 24px;
+}
+
+.position-bottomcenter {
+    bottom: 24px;
+    left: 50%;
+    transform: translate(-50%, 0%);
+}