DEV Community

loading...

Prepare for telescope 2.0

yuanleemidori profile image Yuan-Hsi Lee ・2 min read

This week, I've been working mostly with UI changes, including user accessibility and investigating an issue in landing page for UI 2.0.

User accessibility

Use accessibility is one thing that I want to focus on telescope 2.0 release. There are many rules to follow to improve our user accessibility, and I started with the obvious one, which is checking the color contrast and size of all our pages and components. I've found the links color in dark mode, contribution card in dark mode, search help, slack icon can be improved. Also, since I'm working with mostly color styling, I also start to update the colors in our dark and light mode palette for better management.

Royce will be working with me on user accessibility, looking forward to working with him!

Landing page for UI 2.0

In Pedro's UI 2.0 project, he also plans to modify our banner. I'm assigned the part of moving nav bar from banner to timeline. The goal is to remove the nav bar from the banner, but show the nav bar when the user scrolls to timeline (posts). I've considered different solutions so far,

  1. Move nav bar to timeline (posts) component
    Currently, nav bar is above <main> so that we can always see it in the top-right corner of the page.

  2. Only display nav bar when the timeline component touches the top of the screen
    This one is challenging for me. I haven't worked with element positions with screen before, not sure how much time do I need to investigate it.

  3. Make the nav bar component invisible in banner
    If we don't want it to be showed on the banner area, why don't we make it invisible in that area? For example, make the navbar element "under" the banner element?

Developer experience

As mentioned in previous post(s), I've been updating documents to follow the changes in telescope (mostly microservice). I closed my old PR for adding a new, temporary document for microservice transition. Instead, I go back to existing documents, and update them. Start with environment-setup.md, I believe there are lots of documents can be updated.

Discussion (0)

pic
Editor guide