search

inaturalist / iNaturalistReactNative

Cross-platform version of the iNat mobile app
MIT License
60 stars 20 forks source link

UI fixes for label headers on radio button sheets #1798

Closed albullington closed 2 weeks ago

albullington commented 1 month ago

Describe the bug Label headers in the radio bottom sheets are misaligned and using the wrong font.

To Reproduce Steps to reproduce the behavior:

  1. Go to Explore screen
  2. Tap on leaf icon to bring up Explore View bottom sheet
  3. Header labels are misaligned -- too far from radio button and too close to icons. It looks like the font might have changed from the Figma designs, too

or

  1. Take an observation with no evidence
  2. Open the Geoprivacy sheet
  3. See header labels far away from radio buttons in wrong font

Expected behavior Label headers should match the Figma designs: https://www.figma.com/design/MChpvx4ZrKEVVwsWKt4lkI/iNaturalist-Mobile-UI-Design?node-id=14942-36008&t=9boOhQ8bJ8oQjW18-4

Screenshots

Screenshot 2024-07-15 at 1 42 05 PM

Context (please complete the following information):

jtklein commented 1 month ago

From what I have poked around I think this was introduced with #1749 , maybe that helps with fixing it. Also, see https://inaturalist.slack.com/archives/C02G5AATVGA/p1721117575103769

albullington commented 1 month ago

@budowski not sure if you've started working on this, but I believe this will be fixed via https://github.com/inaturalist/iNaturalistReactNative/pull/1865

abhasinat commented 1 month ago

The UI for all radio bottom sheets is still not matching the Figma designs. Here are some places to reference: