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

Replace "Ctrl" by "Cmd" under macOS and style the "kbd" tag in keyboard shortcuts labels #1449

Merged
merged 5 commits into from
Dec 15, 2023

Conversation

yohanboniface
Copy link
Member

No description provided.

Copy link
Contributor

@davidbgk davidbgk left a comment

Choose a reason for hiding this comment

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

Is that intentional not to put kbd tags in that case?

Capture d’écran, le 2023-12-11 à 15 11 13

When/if applied, the CSS line-height/padding for that tag needs to be reduced.

shortcut = shortcut.split('+').map((el) => `<kbd>${el}</kbd>`).join('+')
}
const modifier = this.isMacOS ? 'Cmd' : 'Ctrl'
label += ` ${shortcut.replace('Modifier', modifier)}`
Copy link
Contributor

Choose a reason for hiding this comment

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

Suggested change
label += ` ${shortcut.replace('Modifier', modifier)}`
label += ` (${shortcut.replace('Modifier', modifier)})`

I think keeping the keyboard shortcut between parenthesis is more readable.

Copy link
Member Author

Choose a reason for hiding this comment

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

Once the kbd tag is styled, I find the parenthesis noisy:

image

vs

image

What do you think ?

@yohanboniface
Copy link
Member Author

Is that intentional not to put kbd tags in that case?

Not intentional, but this box is derived from the buttons, and use the title element, which does not contain the tag of course. I did not put energy on changing that point, because I thought we'd totally change this box to have all the shortcuts, etc. But let's refactor to use something else than the title, you're right.

This main help already display some of them, so let's first
focus on this label refactor, and then do a refactor of that
main help modal.
This happens in title attributes, for example.
@yohanboniface yohanboniface changed the title Refactorize keyboards shortcuts and label Replace "Ctrl" by "Cmd" under macOS and style the "kbd" tag in keyboard shortcuts labels Dec 15, 2023
@yohanboniface yohanboniface merged commit 7bcf751 into master Dec 15, 2023
12 checks passed
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.

2 participants