Alert like Modal in Ionic 2

2019-04-17 03:50发布

问题:

I wanted many functionalities in my alert so i implemented all the things in a modal...now i want to cutomize this modal as an alert like not taking the whole space on the screen and showing the bg on the space left outsude our modal. as shown in the image below

eg: can you tell me ow to implement outside the modal so that it looks like an alert.. in ionic 2

please help thanks in advane

回答1:

You can adjust this with the help of scss

.modal-wrapper {
    position: absolute;
    width: 90%;
    height: 65%; 
    top: 20%;
    left: 5%;
  }

You can alter the content width, height, top and left as per your need. Kindly note that modifying this value will make all the modal in your application to use this configuration rather than the default modal.

To show the backdrop in grey color, use the below code

@media not all and (min-height: 600px) and (min-width: 768px) {
  ion-modal ion-backdrop {
    visibility: visible;
  }
}