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

fix(menu): add mt for menu item #221

Closed
wants to merge 2 commits into from
Closed

fix(menu): add mt for menu item #221

wants to merge 2 commits into from

Conversation

seaerchin
Copy link

Problem

See #188. This problem is because css sizing doesn't account for boxShadow (as we aren't using border)

Closes #188

Solution

  1. Add mt which is equal to the size of the box shadow.
    • i'm not entirely sure if this is the best way to do it, but it was a simple + straight forward way for this

@netlify
Copy link

netlify bot commented Feb 9, 2023

Deploy Preview for objective-bell-0ffbfb canceled.

Name Link
🔨 Latest commit 0fd01f1
🔍 Latest deploy log https://app.netlify.com/sites/objective-bell-0ffbfb/deploys/63eb3693209a5d0008e4afd8

@seaerchin seaerchin requested a review from karrui February 9, 2023 08:28
@seaerchin
Copy link
Author

Offline: need to fit design system specs so mt cannot :(

@@ -46,6 +46,7 @@ const baseStyle = definePartsStyle((props) => {
boxShadow: $shadow.reference,
},
item: {
mt: '0.125rem',
Copy link
Collaborator

@karrui karrui Feb 13, 2023

Choose a reason for hiding this comment

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

can see from chromatic that the padding changed. But now that I think more about it, I think it's fine. We should move this into the size section of the theme, then get designers to sign off.

we should also use px in this case, since the border width when highlighting is not using rem

Copy link
Author

Choose a reason for hiding this comment

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

oki! can i just double check why we wanna put this into sizes rather than baseStyles? (no opinion, cos idk if got diff sizes from the figma + idk if the border will change b/w sizes)

Copy link
Collaborator

@karrui karrui Feb 14, 2023

Choose a reason for hiding this comment

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

future proofing, since sizes control the things that may change between sizes.
if border don't change then leave in base lor. but hor, some styles no border. so maybe put in variant safer

Copy link
Author

Choose a reason for hiding this comment

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

yea i think i'll put this in variant and define a MENU_ITEM_BORDER_STYLES to share b/w outline + clear (i could define a function also but cos we define clear in terms of a function so idk if it would be confusing)

@seaerchin seaerchin requested review from karrui and removed request for karrui April 6, 2023 09:24
@karrui
Copy link
Collaborator

karrui commented Jun 18, 2024

Closing, seems like this change not needed.

@karrui karrui closed this Jun 18, 2024
@karrui karrui deleted the fix/menu-border branch June 18, 2024 16:43
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.

[BUG] First item of Menu has missing bottom border
2 participants