[英]how to change the width of ngx-toastr in angular 9
I have ngx-toastr message notification from npm.我收到了来自 npm 的 ngx-toastr 消息通知。 Is there a way to change the size of message container?有没有办法改变消息容器的大小?
when I open my application in small device, then toastr notification is too big.当我在小型设备中打开我的应用程序时,toastr 通知太大了。
ToastrModule.forRoot({
timeOut: 1000,
positionClass: 'toast-top-right',
preventDuplicates: true,
}),
If you want to change the size of toastr-dialog on all devices, add this to the styles.scss
file:如果要更改所有设备上 toastr-dialog 的大小,请将其添加到styles.scss
文件中:
.ngx-toastr {
width: 250px !important; // Specify toastr-dialog width for all devices
}
If you want to change the size only on small devices, you can use @media
query to do it.如果您只想在小型设备上更改大小,可以使用@media
查询来完成。
.ngx-toastr {
@media (max-width: 768px) {
width: 250px !important; // Specify toastr-dialog width only on small devices
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.