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

Fix: Toasts blocked by st.chat_input #7204

Merged
merged 3 commits into from Aug 18, 2023
Merged

Fix: Toasts blocked by st.chat_input #7204

merged 3 commits into from Aug 18, 2023

Conversation

mayagbarnes
Copy link
Collaborator

@mayagbarnes mayagbarnes commented Aug 18, 2023

Describe your changes

z-index on st.chat_input container places it above toasts. Adjusting so toasts display above.

Current:
Screenshot 2023-08-18 at 1 25 46 PM

Revised:
Screenshot 2023-08-18 at 1 07 11 PM

Deployed test app:
https://toast-overlay.streamlit.app/

GitHub Issue Link (if applicable)

Closes #7115

@mayagbarnes mayagbarnes marked this pull request as ready for review August 18, 2023 21:08
bottom: toastAdjustment ? "45px" : "0px",
// Toasts overlap chatInput container
zIndex: 100,
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is there a particular reason for 100? Is that just a really high number?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Essentially because chatInputContainer is 99 lol

@mayagbarnes mayagbarnes merged commit 543906a into develop Aug 18, 2023
49 checks passed
@mayagbarnes mayagbarnes deleted the toast-chat-fix branch August 18, 2023 21:53
eric-skydio pushed a commit to eric-skydio/streamlit that referenced this pull request Dec 20, 2023
z-index on st.chat_input container places it above toasts. Adjusting so toasts display above.
zyxue pushed a commit to zyxue/streamlit that referenced this pull request Mar 22, 2024
z-index on st.chat_input container places it above toasts. Adjusting so toasts display above.
zyxue pushed a commit to zyxue/streamlit that referenced this pull request Apr 16, 2024
z-index on st.chat_input container places it above toasts. Adjusting so toasts display above.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

toast is blocked by chat_input with wide page layout
2 participants