Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refactor styling of debug dialog #2802

Merged
merged 1 commit into from
Jul 18, 2023

Conversation

robinandeer
Copy link
Contributor

@robinandeer robinandeer commented Jul 17, 2023

Describe your changes

Screenshot 2023-07-18 at 09.38.27.png

  • Update styling for debug dialog elements

Justify why they are needed

  • I wanted it go along with input fields

  • The button height doesn't match input fields so they look a little strange

Checklist before requesting a review

  • I have performed a self-review of my code

@vercel
Copy link

vercel bot commented Jul 17, 2023

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
hedvig-dot-com 🛑 Canceled (Inspect) Jul 18, 2023 8:14am
onboarding 🛑 Canceled (Inspect) Jul 18, 2023 8:14am

@robinandeer
Copy link
Contributor Author

robinandeer commented Jul 17, 2023

Copy link
Contributor

@alebedev alebedev left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks different for me in preview app

Screenshot 2023-07-18 at 08.57.42.png

Some generic notes

  • would centering each line vertically help?
  • can we use min-width for buttons?

Big step in right direction even now!

Copy link
Contributor

@guilhermespopolin guilhermespopolin left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy link
Contributor

@alebedev alebedev left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice, this layout take much less markup!

@@ -47,7 +47,7 @@ export const DebugResumeSessionSection = () => {

const Layout = styled.form({
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nit: now we have grid with single line, right? Maybe flexbox would be more obvious

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hmmm but then we need to add "flex" properties to children to determine how they scale horizontally

That's why I like grid -- it let's you determine layout from the parent 🙂

@robinandeer
Copy link
Contributor Author

@robinandeer started a stack merge that includes this pull request via Graphite.

@robinandeer robinandeer force-pushed the 07-17-Add_resume_shop_session_form_to_debug_dialog branch from 5a28eb5 to e8ab425 Compare July 18, 2023 08:07
Base automatically changed from 07-17-Add_resume_shop_session_form_to_debug_dialog to main July 18, 2023 08:08
@robinandeer
Copy link
Contributor Author

Graphite rebased this pull request as part of a merge.

@robinandeer robinandeer force-pushed the 07-17-Refactor_styling_of_debug_dialog branch from 498e9de to 22f768d Compare July 18, 2023 08:08
@robinandeer robinandeer merged commit f07ca8a into main Jul 18, 2023
3 checks passed
@robinandeer
Copy link
Contributor Author

@robinandeer merged this pull request with Graphite.

@robinandeer robinandeer deleted the 07-17-Refactor_styling_of_debug_dialog branch July 18, 2023 08:09
@vercel vercel bot temporarily deployed to Preview – hedvig-dot-com July 18, 2023 08:12 Inactive
@vercel vercel bot temporarily deployed to Preview – onboarding July 18, 2023 08:14 Inactive
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants