refactor(theme-shared): change toast close button style

npm/ng-packs/packages/theme-shared/src/lib/components/toast/toast.component.html

@@ -3,14 +3,14 @@
     <i class="fa icon" [ngClass]="iconClass"></i>
   </div>
   <div class="toast-content">
-    <button class="close-button" (click)="close()" *ngIf="toast.options.closable">
+    <button class="toast-close-button" (click)="close()" *ngIf="toast.options.closable">
       <i class="fa fa-times"></i>
     </button>
     <div class="toast-title">
       {{ toast.title | abpLocalization: toast.options?.titleLocalizationParams }}
     </div>
-    <div class="toast-message">
+    <p class="toast-message">
       {{ toast.message | abpLocalization: toast.options?.messageLocalizationParams }}
-    </div>
+    </p>
   </div>
 </div>

npm/ng-packs/packages/theme-shared/src/lib/components/toast/toast.component.scss

@@ -45,7 +45,7 @@
   }
   .toast-content {
     position: relative;
-    .close-button {
+    .toast-close-button {
       position: absolute;
       top: 0;
       right: 0;
@@ -53,20 +53,16 @@
       align-items: center;
       justify-content: center;
       margin: 0;
-      padding: 5px 10px 5px 5px;
+      padding: 0px 5px 0 0;
       width: 25px;
       height: 25px;
       border: none;
       border-radius: 50%;
       background: transparent;
+      color: inherit;
       &:focus {
         outline: none;
       }
-      .close-icon {
-        width: 16px;
-        height: 16px;
-        stroke: #000;
-      }
     }
     .toast-title {
       margin: 0;
@@ -75,6 +71,8 @@
       font-weight: 600;
     }
     .toast-message {
+      margin: 0;
+      padding: 0;
     }
   }
 }