toast which always displays in white despite the color chang

Topic: toast which always displays in white despite the color change,

Moulay JAMAL EL AMRANI priority asked 1 year ago

Expected behavior Hello,

I have a problem with the toast component which always displays in white despite the color change,

my second problem is that I never received my git link to be able to generate the token. so I used the library I received at menu level https://mdbootstrap.com/profile/my-orders/

is there a way to get team or skype assistance for example just to clarify my need and to see if I have purchased the right library and the right version.

Cordially Jamal EL AMRANI

i user : "mdb-angular-ui-kit": "file:mdb-angular-ui-kit-2.3.0.tgz", Actual behavior enter image description here

<div
    class="toast toast-danger mx-auto"
    id="basic-primary-example"
    role="alert"
    aria-live="assertive"
    aria-atomic="true"

> erreur {{date_jour}}

{{ text }}

Adam Jakubowski staff commented 1 year ago

Hello,

The support forum is dedicated to technical questions.

All questions regarding MDB licensing, products, partnerships and other non-technical queries - it should be asked directly to contact@mdbootstrap.com

I've reached out to you via the email address assigned to your mdbootstrap account.

Keep coding

Add comment

Arkadiusz Idzikowski staff answered 1 year ago

1 0 Best answer

Please insert min. 20 characters.

The new classes like toast-danger were added in version 3.0.0, previously we used bg-danger for a danger toast. Here is an example syntax for the version you use:

<div
  class="toast bg-danger mx-auto"
  id="basic-danger-example"
  role="alert"
  aria-live="assertive"
  aria-atomic="true"
>
  <div class="toast-header text-white bg-danger">
    <strong class="me-auto">MDBootstrap</strong>
    <small>11 mins ago</small>
    <button
      type="button"
      class="btn-close btn-close-white"
      aria-label="Close"
      (click)="close()"
    ></button>
  </div>
  <div class="toast-body text-white">Danger Basic Example</div>
</div>

We will check the problem with access to the GitLab server. Someone from our team should contact you soon.

branko.milosavljevic priority commented 1 year ago

I can report the same behavior with mdb-angular-ui-kit-3.0.1.tgz and mdb-angular-ui-kit-4.0.0.tgz. Toasts are always white.

Arkadiusz Idzikowski staff commented 1 year ago

Did you update the syntax in your application? The code I used in the answer is for versions older than 3.0.0. In 3.0.1 or 4.0.0 you should use toast-primary instead of bg-primary. You can find the updated code in our documentation.

branko.milosavljevic priority commented 1 year ago

Yes, I use proper syntax. But it seams that problem appears when I add a new theme. I added a new theme with primary and secondary colors as it stated in documentation. While debugging I can see that styles from toasts.scss are overridden by toasts-theme.scss where background color is white.

Add comment

Write

Create snippet

FREE CONSULTATION

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

Status

Answered

Specification of the issue

ForumUser: Priority
Premium support: Yes
Technology: MDB Angular
MDB Version: MDB5 3.0.0
Device: PC
Browser: Chrome, Safari
OS: ios
Provided sample code: No
Provided link: Yes

Moulay JAMAL EL AMRANI

0Support score
3Questions 0Answers 0Snippets