Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

custom style / css is not being applied to toasts

See original GitHub issue

I am trying out your repo for my project and for now: love it!

but, I’m having an issue with customization.

I’m trying to change the color and size of my toasts like you can see here: https://github.com/shirbr510/react-toastify-demo/blob/master/src/App.js

I’ve tried with glamor, but have failed to change the style at all.

can you please help me out?

react-toastify version: 4.0.2

Issue Analytics

State:
Created 5 years ago
Comments:5 (3 by maintainers)

Top GitHub Comments

5reactions

fkhadracommented, Jun 7, 2018

The following should work for the next release. I’m fixing the bug

oast("Custom style", {
        className: css({
            background: 'black'
        }),
        bodyClassName: css({
            fontSize: '160px'
        }),
        progressClassName: css({
            background: "repeating-radial-gradient(circle at center, red 0, blue, green 30px)"
        })
    });

0reactions

fkhadracommented, Jun 7, 2018

Top Results From Across the Web

Why isn't my styling being applied to a custom toast class?

I want to create a customized Toast when click on a div with ionic 2, I've add a cssClass when create the toast...

Custom Style For Lightning Toast - Salesforce Stack Exchange

Is there a way to customize the style (color, font-size, height) of lighting toast? I'm trying with css but have no success.

How to style | React-Toastify - GitHub Pages

Passing css classes to component. The ToastContainer accept the following props for styling: className: applied to the container; toastClassName: applied on the ...

Toasts - Materialize

Options. You can customize the behavior of each Toast using these options. ... but you can create your own CSS classes and apply...

Building a toast component - web.dev

Styles #. With layout and positioning set, add CSS that helps with adapting to user settings and interactions. Toast container #. Toasts are...