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.

Sign up for GitHub

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

Jump to bottom

Improve heading spacing on Markdown preview #102036

Closed
jasonwilliams opened this issue Jul 9, 2020 · 2 comments · Fixed by #102427
Closed

Improve heading spacing on Markdown preview #102036

jasonwilliams opened this issue Jul 9, 2020 · 2 comments · Fixed by #102427
Assignees
@mjbvz
Labels
help wanted Issues identified as good community contribution opportunities insiders-released Patch has been released in VS Code Insiders markdown Markdown support issues verification-needed Verification of issue is requested verified Verification succeeded
Milestone
July 2020

Comments

@jasonwilliams
Copy link
Contributor

jasonwilliams commented Jul 9, 2020 •
edited

The spacing on markdown preview has headings (h2,h3) in the middle between text, but they should be spaced less with the content underneath so it looks like a section. Right now the spacing looks even with the content below and above.

Here is an example (using grey matter theme):
markdown-preview

I've adjusted on photoshop what it should look like:
markdown-preview (1)

It's only slight but the bottom one brings the heading down slightly so its more together.
I looked into doing this but i could only find https://github.com/microsoft/vscode/blob/06f85af581281a3f45783329d375ecc7694930b4/extensions/markdown-language-features/media/markdown.css

@mjbvz
@mjbvz mjbvz added help wanted Issues identified as good community contribution opportunities markdown Markdown support issues labels Jul 10, 2020
@mjbvz mjbvz added this to the Backlog milestone Jul 10, 2020
@mjbvz
Copy link
Contributor

mjbvz commented Jul 10, 2020

Yes that is the correct file to change. Try updating the css rules to adjust the heading spacing.

You can also quickly prototype changes using your own css in the markdown preview

@jasonwilliams
Copy link
Contributor Author

jasonwilliams commented Jul 10, 2020 •
edited

@mjbvz do you have a way of inspecting to see what’s going on? I just get the web view doc when I do.
I have 0 margin and 0 padding on the h2s but there's still some space underneath so im wondering if there's other styles kicking in here

Edit: Found the solution here #12871

This was referenced Jul 10, 2020
Closed
Merged
mjbvz pushed a commit that referenced this issue Jul 14, 2020
@jasonwilliams
fix styling to improve heading spacing fixes #102036 (#102427)
b8e773e 
* updating styling to make headings look better

* be consistent and use em
@mjbvz mjbvz modified the milestones: Backlog, July 2020 Jul 14, 2020
@mjbvz mjbvz added the verification-needed Verification of issue is requested label Jul 14, 2020
Charles-Gagnon pushed a commit to Charles-Gagnon/vscode that referenced this issue Jul 14, 2020
@jasonwilliams @Charles-Gagnon
fix styling to improve heading spacing fixes microsoft#102036 (micros…
fd87d77 
…oft#102427)

* updating styling to make headings look better

* be consistent and use em
@mjbvz mjbvz mentioned this issue Aug 3, 2020
Closed
@alexr00 alexr00 added the verified Verification succeeded label Aug 5, 2020
@github-actions github-actions bot locked and limited conversation to collaborators Aug 28, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@mjbvz mjbvz

Labels
help wanted Issues identified as good community contribution opportunities insiders-released Patch has been released in VS Code Insiders markdown Markdown support issues verification-needed Verification of issue is requested verified Verification succeeded
Projects
None yet
Milestone
July 2020
Development

Successfully merging a pull request may close this issue.

fix styling to improve heading spacing fixes #102036 jasonwilliams/vscode
4 participants
@jasonwilliams @mjbvz @alexr00 and others