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

Feat: Allow scrolling via keyboard in code blocks #2264

Merged
merged 2 commits into from
Nov 30, 2023
Merged

Feat: Allow scrolling via keyboard in code blocks #2264

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
07de768
Allow scrolling via keyboard in code blocks
jhildenbiddle Oct 13, 2023
d6d5b0b
Merge branch 'develop' into 2224-scrollable-code
jhildenbiddle Nov 30, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion src/core/render/compiler/code.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,5 +11,5 @@ export const highlightCodeCompiler = ({ renderer }) =>
lang
);

return /* html */ `<pre v-pre data-lang="${lang}"><code class="lang-${lang}">${text}</code></pre>`;
return /* html */ `<pre v-pre data-lang="${lang}"><code class="lang-${lang}" tabindex="0">${text}</code></pre>`;
});
15 changes: 8 additions & 7 deletions src/themes/vue.styl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -114,6 +114,7 @@ body
.markdown-section code,
.markdown-section pre
background-color #f8f8f8
z-index 0

.markdown-section pre,
.markdown-section output
Expand Down Expand Up @@ -141,21 +142,24 @@ body
font-size 0.8rem

.markdown-section pre
padding 0 1.4rem
line-height 1.5rem
overflow auto
word-wrap normal

.markdown-section pre > code
color #525252
font-size 0.8rem
padding 2.2em 5px
padding 2.2em 1.4rem
line-height inherit
margin 0 2px
margin 5px
max-width inherit
overflow inherit
white-space inherit

.markdown-section pre > code:focus
// outline 5px auto Highlight;
outline 5px auto -webkit-focus-ring-color;

.markdown-section output
padding: 1.7rem 1.4rem
border 1px dotted #ccc
Expand All @@ -172,6 +176,7 @@ body

.markdown-section pre::after,
.markdown-section output::after
content attr(data-lang)
color #ccc
font-size 0.6rem
font-weight 600
Expand All @@ -183,10 +188,6 @@ body
text-align right
top 0

.markdown-section pre::after
.markdown-section output::after
content attr(data-lang)

/* code highlight */
.token.comment, .token.prolog, .token.doctype, .token.cdata
color #8e908c
Expand Down
Loading