view_components icon indicating copy to clipboard operation
view_components copied to clipboard

Dialog spacings between content and header in Rails

Open marcalcobe opened this issue 1 year ago • 2 comments

Pain point

  • When using a Dialog with Rails the content of the dialog and the header have no separation between them.
  • This is more evident when you use a header with divider as the content goes just bellow the divider (see screenshot bellow).
  • If the content is just a text then there is no padding or margin added to separate it from the header.
  • We noticed that this isn't a problem in the React version, where the content has always a padding around it (see screenshot bellow).

Screenshots

- Rails with divider: Screenshot 2024-08-15 at 12 19 12

- Rails without divider: Screenshot 2024-08-15 at 12 19 21

- React: Screenshot 2024-08-15 at 12 19 31

I know that this might be a design decision, so I'd would like to understand why is it different in React vs Rails.

marcalcobe avatar Aug 15 '24 09:08 marcalcobe

Uh oh! @marcalcobe, the image you shared is missing helpful alt text. Check your issue body.

Alt text is an invisible description that helps screen readers describe images to blind or low-vision users. If you are using markdown to display images, add your alt text inside the brackets of the markdown image.

Learn more about alt text at Basic writing and formatting syntax: images on GitHub Docs.

🤖 Beep boop! This comment was added automatically by github/accessibility-alt-text-bot.

github-actions[bot] avatar Aug 15 '24 09:08 github-actions[bot]

👋 Hi, thanks for reporting this! I don't believe this was an intentional design decision.

The Dialog component is still in Alpha. This kind of improvement would be something we could take a look at rectifying if we invest in bringing Dialog to Beta. In the meantime, we would recommend manually adding some padding to the dialog contents.

lesliecdubs avatar Aug 19 '24 21:08 lesliecdubs