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

[@mantine/prism] Fix prism number spacing #1156

Merged
merged 2 commits into from
Apr 2, 2022

Conversation

auronsan1st
Copy link
Contributor

@auronsan1st auronsan1st commented Apr 1, 2022

use min-width of max lines 65535 like VSCode.

user can easy override with styles. if they want smaller space caused only small lines code

@@ -42,8 +42,9 @@ export default createStyles((theme, { colorScheme, native }: PrismStylesParams)
lineNumber: {
color: colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[4],
textAlign: 'right',
paddingRight: theme.dir === 'ltr' ? theme.spacing.xl : undefined,
paddingLeft: theme.dir === 'rtl' ? theme.spacing.xl : undefined,
minWidth: 43,
Copy link
Member

Choose a reason for hiding this comment

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

Will it fix the issue for triple digits, e.g. 122?

Copy link
Contributor Author

@auronsan1st auronsan1st Apr 1, 2022

Choose a reason for hiding this comment

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

above code fix the digit but need space so looks clean
Screen Shot 2022-04-02 at 04 03 19

like this
Screen Shot 2022-04-02 at 04 00 17

width: 43,
marginRight: theme.dir === 'ltr' ? theme.spacing.xs : undefined,
marginLeft: theme.dir === 'rtl' ? theme.spacing.xs : undefined,

either use minWidth or width. minWidth can use for support lines more than 65535 or 100000.

but if use width will force content so the number will overlap with the code (when reached 100000). same behaviour if use IE that need support minWidth and maxWidth that same effect with width on normal browser

Copy link
Contributor Author

Choose a reason for hiding this comment

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

if just support three lines number, only need 25
Screen Shot 2022-04-02 at 10 16 14

@rtivital rtivital merged commit a0894a0 into mantinedev:master Apr 2, 2022
@rtivital
Copy link
Member

rtivital commented Apr 2, 2022

Great, thanks!

@auronsan1st auronsan1st deleted the fix/prism-spacing branch April 2, 2022 14:37
@auronsan1st auronsan1st restored the fix/prism-spacing branch April 2, 2022 14:37
@auronsan1st auronsan1st deleted the fix/prism-spacing branch April 2, 2022 14:40
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