How replace opacity from toast?


Topic: How replace opacity from toast?

Mobtex pro asked 6 years ago

Simple things in MDB are complex.

Damian Gemza staff commented 6 years ago

Dear Mobtex, You can use the code below to change the opacity of your toast. This is a workaround, but for now, it's the only way to change the opacity of toasts. In your opinion which way of changing the opacity of the toast is the best way? Let us know, and maybe we'll implement your solution. #toast-container > mdb-toast-component{ opacity: 1.0 !important; -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100) !important; } Best Regards, Damian

Mobtex pro commented 6 years ago

Damian, It's 2018. MDB has an "opacity: 0.5" attribute in the toast class. How do I change this attribute in javascript? I do not want to do this via CSS, it's ugly.

Damian Gemza staff commented 6 years ago

Dear Mobtex, As I said to you before, We have in our plans to add functionality which you're describing, but it will be implemented in the future. I cannot provide you ETA on this. As for now, if you need to change the opacity of toast, please do it with css, or download the compilation repository on which you'll be able to add your changes to the code (change the opacity in toast component), and then compile it by using "npm run compile" command in terminal. This command will execute a compilation process which will generate you a .tgz archive with MDB library. After generating that archive you have to install it in your application by using npm install ng-uikit-pro-standard-6.2.2.tgz Here's the link to the compilation repository: https://git.mdbootstrap.com/mdb/angular/ng-uikit-pro-standard-compile Best Regards, Damian

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Open

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No