Skip to content

🟢 Create responsive screen adaptation to show up well during web screen change and mobile change  #14

@XanderRubio

Description

@XanderRubio

Ensure efficient screen adaptation for Before I Die Code on all devices. Fix header for logo, Github link, and avatar. Possible issues with Logo.gif and Nav.jsx component structure. Focus first on the adaptation of the web screen and then focus on the module screen. Ideally would like to create a milestone to adapt the code for React Native and make it mobile-friendly.

Would need to fix for web responsiveness:

  • The header of the Logo.gif and Github avatar
  • When USER is clicked on the image of a contributor to see their text, fix the text to adjust and adapt to the screen size

Current web responsive when reducing web screen⬇️

Needs.to.be.more.responsive.1.mov

FIx the contributor's text to be responsive ⬇️

Text responsiveness

FIx the contributor's text to be responsive ⬇️ VIDEO

VIDEO.text.responsiveness.mov

Current mobile responsive ⬇️

Mobile.responsiveness.mov

Would need to fix for mobile responsiveness:

  • The header of the Logo.gif and Github avatar
  • Would need to adjust the text "An Open Source Project"
  • Fix the dummy images being displayed in the background behind "An Open Source Project"
  • Reformat contributors bid_image and avatar image
  • When clicking on each contributors photo, fix the display text of their answer for "Before I Die"

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions