Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Set width of notification based on content #36

Closed
chitgoks opened this issue Nov 4, 2019 · 6 comments
Closed

Set width of notification based on content #36

chitgoks opened this issue Nov 4, 2019 · 6 comments

Comments

@chitgoks
Copy link

chitgoks commented Nov 4, 2019

Rather than setting a fixed value for width, it would be nice to have the width the same as the content of the text inside the notification.

@teodosii
Copy link
Owner

teodosii commented Nov 4, 2019

I doubt you checked that each notification gets width: 100% so it gets as wide as the container. The width option is to have more control over the notification.

@teodosii teodosii closed this as completed Nov 4, 2019
@chitgoks
Copy link
Author

chitgoks commented Nov 4, 2019

i assumed that would be the case which is why i opened this since i started at not using the width property and it doesnt expand based on content text. ill retry and put up a sample

@chitgoks
Copy link
Author

chitgoks commented Nov 4, 2019

hi teodosii, so this is how i called it

function showNotification(message, type, duration) {
    store.addNotification({
        message: message,
        type: type ? type : 'success',
        insert: 'top',
        container: 'top-right',
        animationIn: ['animated', 'fadeIn'],
        animationOut: ['animated', 'fadeOut'],
        dismiss: {
          duration: duration ? duration : 3000
        }
    });
}

please see attached for result.
notif

@teodosii teodosii reopened this Nov 4, 2019
@teodosii
Copy link
Owner

teodosii commented Nov 4, 2019

Actually, my mistake here. It doesn't get set to width: 100%, it gets set to width: auto which is is basically 100% of the container. But containers do not have a predefined width, that's up to you or anyone else to have these set, and due to the fact they have no width, auto might behave different from case to case.

You either stick to setting the width manually per notification or set the width to each container.

@teodosii
Copy link
Owner

teodosii commented Nov 4, 2019

If you have any other questions, feel free to ask. These are at the moment the only 2 solutions - for me at least are enough - if you happen to have a better solution and it would benefit this library, I will gladly implement it. In the meantime I will close this issue.

@teodosii teodosii closed this as completed Nov 4, 2019
@chitgoks
Copy link
Author

chitgoks commented Nov 4, 2019

ok that makes sense. it's not really urgent for me but ill look into this last once im done with my other tasks. ill get ack if i can find a solution. im still learning react now ;)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants