Bro you nailed it again, great tutorial!

@andfanilo

2 жыл бұрын

Thank you :) hope to see you around my channel again!

This is awesome...thank you so much!!

@andfanilo

2 жыл бұрын

Thank you for watching :) Happy Streamlitin'!

You are genius, bro

Cool and helpful!

@andfanilo

2 жыл бұрын

Thanks! Have not seen you for a while on the forum, happy new year and hope you're doing well ;)

You are great! Thank you:)

@andfanilo

Жыл бұрын

Thanks for watching, happy Streamlit hacking I guess! what do you plan to stylize?

I have a question. I made a page displaying current time with threading and it show utc kst epoch and julian. And i attached container for showing coverted time. The problem is that when i click convert button, current time blink and show itself again. U wanna make the current time container fixed and just reset second container. Is there solution for this problem?

Great vid! Where did you find the .stButton button tag? It seems my page is showing something different, would love to see how to do this on other streamlit elements

@andfanilo

2 жыл бұрын

Hi @dishydez! I made a textual breakdown on discuss.streamlit.io/t/css-hacks-for-the-dumb/14501/3 if needed. Basically you open your webtool inspector on the Streamlit page, and select your button on the page to find the div with the .stButton class containing the button in the HTML. Then you get some other, harder examples like selectbox here: discuss.streamlit.io/t/can-i-change-the-color-of-the-selectbox-widget/9601. Do tell me if you were able to find the elements you want to target. Have a nice day!

@dishydez

2 жыл бұрын

@@andfanilo Thanks!

👍& subbed

@andfanilo

2 жыл бұрын

Hi you 😃 happy new year! I’m a KZreadr now!

Hey loving your work! I am trying to format the streamlit-timeline so that it doesn't have grey text on a grey background for example. But I just can't get it to wor!. Could you point me in the right direction?? Please! :) tried dropping css into my app to overwrite it, nope. Tried taking a copy of the full CSS changing that and then get the timeline to load that in. But still no luck!

@andfanilo

Жыл бұрын

Hey Adam! To be honest this is not something I've tried, I usually fork and edit components I want to restyle, then rebuild them manually. Updating the CSS in an I'm not 100% sure works (I haven't tried though, I'm on summer break eheh!) - You can edit the timelineJS background though by adding a background argument in an event like `"background": {"color": "red"}`, see timeline.knightlab.com/docs/json-format.html - Hey wait, actually streamlit-timeline doesn't need rebuild, if you look into the code (github.com/innerdoc/streamlit-timeline/blob/main/streamlit_timeline/__init__.py) it's a static component! So you should be able to copy that, change the css_block variable to your own CSS timesheet and follow timeline.knightlab.com/docs/overriding-styles.html to inject your own. Hope this helps you get started

@theh1ve

Жыл бұрын

@@andfanilo awesome help thanks! To be honest I tried editing the _init_.py file to load in a local copy of timeline.css but couldn't get it work. Tried file:/// but it just wouldn't take it. Think I have hit the very low ceiling of my python knowledge ha ha!

@andfanilo

Жыл бұрын

Ah unfortunately it may be that if you use file:///, it doesn't look relatively to your local project but to Streamlit's installation folder (I quickly talk about it in my latest video kzread.info/dash/bejne/oq2L09luqaa0lNI.html ). Maybe try putting your css in a github repo and point to the raw URL of that, or somewhere online just to test? I think it's more Web development experience rather than Python here, which makes it way harder, so if you make it you can congratulate yourself with a nice dinner!

I was the 256th like in this video :D

@andfanilo

Жыл бұрын

Congratulations XD! And thanks for the support 😀

How to change background color of streamlit sidebar

@andfanilo

2 жыл бұрын

Hey! Have you tried the CSS hack on the sidebar : discuss.streamlit.io/t/how-to-set-the-background-color-of-st-sidebar/4888/2 ?

Thanks very much, good information Can make video about make streamlit app Responsive Ui

@andfanilo

Жыл бұрын

Hey Ali, Would love to get more details, as Streamlit is already responsive, as long as you add "use_container_width" on most widgets. Just make sure you're not trying to set too wide widgets, that would be hard to display on mobile. Have a nice day!

@AliAlias

Жыл бұрын

@@andfanilo thanks for reply

I am assuming them, we can integrate widgets from TradingView charts into Streamlit then.

@andfanilo

2 жыл бұрын

Hey! Haven't really looked into it but yeah you should be able to components. one of those Have a nice day

@k2icc

2 жыл бұрын

@@andfanilo I believe TradingView stock charts are in widgets in javascript, so in the same way you add such code within streamlit and html, I believe it can be done, but I am behind as far as what you know. Will experiment. Thanks.

@k2icc

2 жыл бұрын

@@andfanilo Managed to get it to display the chart, just the size is just like a banner, but need to find out why is not opening as per size properties on code.

@andfanilo

2 жыл бұрын

@@k2icc Oh, there are multiple posts about TradingView on the forum, I found one here discuss.streamlit.io/t/why-st-components-v1-html-and--functions-limit-the-height-of-the-frame-to-150/21858/13 where you apparently need to remove the autosize line to add your own height parameter in the TradingView specification, then in the height parameter for . Hope that helps a bit 🙂

Misaotra :)

Will this work even if deploy this?

@andfanilo

2 жыл бұрын

Yes, as long as it's in your Python code it will be deployed alongside your app ;)

ReCreate st.cards component, Drop-down menu from navigation bar

@andfanilo

2 жыл бұрын

You can try Hydralit components’s info card - github.com/TangleSpace/hydralit_components

It's so good. But when i tried to apply it yo the div div div div like this, so uncompotable. Cause i have nerver exepeience css. And st.mardown dosen't follow css. Nevertheless, i finally found it. I think i understand how it works. Thanks

@andfanilo

Жыл бұрын

Yeah that’s the not so easy thing With css, sometimes you go through long div > … chains when there are no ID nor CSS class on the block you want to target… which makes this hard to maintain in the long run There’s a bullet point on better visual styling in the roadmap though, hopefully we can push some design ideas for custom styling But glad you managed to get somewhere!

there is no method for js

@andfanilo

2 жыл бұрын

No there's no st.js. But you can though cheat by using the last method "breaking out of the " and add js into st.html that breaks out to the main app. But streamlit is not really built to have you mix js and python at the same time. Streamlit wants to handle all js for you so you don't need to think about it. If you want to add your own js, you'll need to build a Streamlit component for JS that stays limited to the scope of your custom widget.

@ArminEskandary

2 жыл бұрын

@@andfanilo it sucks