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

Feature request: increase spacing between line numbers and code #1497

Open
terrylinooo opened this issue Nov 10, 2023 · 2 comments
Open

Feature request: increase spacing between line numbers and code #1497

terrylinooo opened this issue Nov 10, 2023 · 2 comments

Comments

@terrylinooo
Copy link

I'm suggesting an enhancement to the spacing between line numbers and code content for better readability, especially when printed.

image

Is your feature request related to a problem? Please describe.

Currently, the line numbers are very close to the code, which makes it difficult to distinguish between them at a glance, especially when the code is printed on paper. This affects readability and can lead to confusion when referring to specific lines during code reviews or discussions.

Describe the solution you'd like
I would like to see an option to increase the spacing between line numbers and the code block. This could be a setting that allows users to adjust the spacing to their preference.

Describe alternatives you've considered
As an alternative, a default increase in spacing could be implemented if adjustable settings are not possible. Another option could be to have a print-friendly mode that automatically adjusts the layout for better legibility on paper.

Additional context
The issue becomes particularly evident when printing documents for review. Please see the attached screenshot for reference. Thank you for considering this enhancement to improve the clarity and readability of code blocks.

@terrylinooo
Copy link
Author

For someone who wants same feature, for now you can do this:

1)

Download User JavaScript and CSS Chrome extension.

2)

Browse carbon.now.sh, open the extension, fill in the following code.

JavaScript

window.onload = function() {
    Array.from(document.querySelectorAll('.CodeMirror-linenumber')).forEach((el) => {
        el.removeAttribute('style');
    });;
};

CSS

.CodeMirror-linenumber {
    padding-right: 15px;
}

Replace the 15px with your expected padding value.

@Bashamega
Copy link

You can increase it from the settings.
this is a video showing you how

video1775034738.mp4

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants