New informative / notification component

I did not like the st.spinner, due to its always being depended on the position of the div.
So i’m working on a new component which will make a better version (IMHO) of that.

the notification inherits the theme color.
the notification is sticky on top, and moves with the navbar.

currently i’ts super raw.

Link to the sample:

Анимация

2 Likes

Awesome!

This is something we were discussing just the other day as a potential addition to the official API :smiley:

2 Likes

Hey @BugzTheBunny!

That’s wonderful! I’m going to add this to our components tracker under the “under development” section!

Happy Streamlit-ing!
Marisa

2 Likes

Woah! That’s a great component @BugzTheBunny! :clap:

1 Like

Very nice! I do like this more than the spinner, will definitely start using this. Also, not sure if it was intentional, when I run this with a light theme or anything not using a black background colour, the notification background seems to be using a fixed colour.

in the components.py file

background-color: #0E1117

I added the bc variable in from your style dict and everything worked as expected.

background-color: {styles["bc"]}

Keep up the great work!

2 Likes

Indeed, I left some things there like that for my needes, but i made it as much as modular as i could for that point :slight_smile:

In my personal code i’ve made it a bit less flex and more depended, in this version i shared, its more modular, so i didin’t notice all of the details when refactoring it :smiley:

Thanks for noting it!