feat(toast): add the default styles for ionic theme (#29922)

Author: thetaPC

core/src/components/toast/test/basic/index.html

@@ -94,7 +94,7 @@
           id="translucent-toast"
           onclick="openToast({message: 'click to close', buttons: ['Close'], translucent: true})"
         >
-          Translucent Toast
+          Translucent Toast (iOS theme only)
         </button>
 
         <button
@@ -118,7 +118,7 @@
           id="translucent-color-toast"
           onclick="openToast({message: 'click to close', buttons: ['Close'], translucent: true, color: 'success'})"
         >
-          Translucent Color Toast
+          Translucent Color Toast (iOS theme only)
         </button>
 
         <button

core/src/components/toast/test/basic/toast.e2e.ts

@@ -44,7 +44,10 @@ class ToastFixture {
   }
 }
 
-configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
+/**
+ * This behavior does not vary across directions.
+ */
+configs({ modes: ['ios', 'md', 'ionic-md'], directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
   test.describe(title('toast: position rendering'), () => {
     let toastFixture: ToastFixture;
     test.beforeEach(async ({ page }) => {
@@ -124,7 +127,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, screenshot, c
   });
 });
 
-configs().forEach(({ title, screenshot, config }) => {
+configs({ modes: ['ios', 'md', 'ionic-md'] }).forEach(({ title, screenshot, config }) => {
   test.describe(title('toast: rendering'), () => {
     let toastFixture: ToastFixture;
     test.beforeEach(async ({ page }) => {