processing
improving styling of banner message when u switch languages
Increasing Access
I dont think that this particular change, being strictly stylistic, would help increase access to the p5.js web editor. i still think that this could still benefit the site and its users, though!
Feature enhancement details
Currently the confirmation message banner when you switch to a new language looks like this:
https://github.com/user-attachments/assets/e943c814-e7e3-40fd-82b0-7bf538e3475c
And i think there could be a visual improvement to be made that matches the style configuration of the rest of the site!
I am hoping to get some resources on how the styling should look like! cc @raclim
Currently I'm thinking:
- Some spacing from the banner to the top of the page might be good
- ihe font can be a little smaller,
- and having the background color be light gray (like the color of the buttons) just to be more aligned with the theme...
although I definitely dont have a curated eye for this kind of stuff so I would love some feedback
the light gray in reference:
And I would like to be assigned to this project!
Thanks for raising this issue @runningonsideprojects! I think this would be a nice improvement! I think these banners are also used to notify other events, such as when a user saves a sketch or when autocomplete is enabled, so that would just be something to consider to!
Would you like to come up with a mock-up for what the design could look like, and then we could look into implementation? Let me know if that sounds good or if you have any other thoughts or questions on this! Also to note in advance, I'll be a bit slow to follow-up over the next two weeks but will be active again at the beginning of November!
Good to hear from you Rachel :)
I can draw up a mock of what I'm hoping the banner could look like, and send it on this thread for some feedback. If the banner is not a reusable component, I could probably configure it so that other banners can use the component and have the same stylistic configuration.
Thanks for the heads up on response time! Take as much time as you need!
hi @raclim !
I just drew up a mock of what the visual changes would be -- i based it off of existing components and their color schemes in light and dark mode to keep things consistent (figma link)
I also noticed that the size of the banner is not responsive to the width of the viewport -- would this be something that would be beneficial to address?
Hi I’d like to work on this issue. I have experience with CSS and responsive UI design, and I can improve the banner styling so it remains consistent and visually balanced when switching languages. Please assign this to me if it’s still not solved
Hi I’d like to work on this issue. I have experience with CSS and responsive UI design, and I can improve the banner styling so it remains consistent and visually balanced when switching languages. Please assign this to me if it’s still not solved
Hi @rawatjidelhiwale, I wrote this in the original PR but i got this one. Im just waiting to hear back from @raclim to approve the spec in my most recent message which is why there isn't a PR for it yet.