Skip to content

Improve syntax highlighting #651

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

Merged
merged 3 commits into from
Feb 7, 2025
Merged

Improve syntax highlighting #651

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
d8d1b3a
Dynamically generate syntax highlighting
RealOrangeOne Dec 10, 2024
6563886
Add background colour to inline highlights
RealOrangeOne Dec 10, 2024
9d57369
Remove stray import
RealOrangeOne Dec 14, 2024
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
1 change: 1 addition & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,3 +4,4 @@ _site
.jekyll-metadata
.bundle
node_modules/
_sass/_syntax-highlighting.scss
9 changes: 7 additions & 2 deletions Rakefile
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,11 +34,16 @@ end

task :submodules => ['_sass/brand/.git']

task :dev => [:dependencies, :submodules] do
task :styles => [:dependencies] do
highlight_css = `bundle exec rougify style github`.strip()
File.write("_sass/_syntax-highlighting.scss", highlight_css)
end
Comment on lines +37 to +40
Copy link
Member

Choose a reason for hiding this comment

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

Dynamically generate the syntax highlighting styles, so it's clear where they came from.

I'm not sure this makes it any clearer where the styles come from? Having a comment in the file or something might be an alternative (and would avoid additional compile-time overhead). Even if we also provide the command which generates the file and validate in CI that the file matches that command (the validate-generated-files action can help with the latter)

Copy link
Member Author

Choose a reason for hiding this comment

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

The question is, where did the current file come from? It's hard to tell. No need for that if it's generated.

Copy link
Member

@PeterJCLaw PeterJCLaw Dec 12, 2024 •
edited
Loading

Choose a reason for hiding this comment

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

Somewhat, though a comment at the top of the file like:

/* This file was generated by running .... */

Feels like it'd be at least as good?

Copy link
Member Author

Choose a reason for hiding this comment

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

Yes, for the sake of source attribution alone, that's functionally the same. But this way, there's no longer a generated file committed into the repository, since it can be easily generated automatically at build time.


task :dev => [:dependencies, :submodules, :styles] do
sh('bundle exec jekyll serve --host 0.0.0.0 --drafts --config _config.yml,_dev.yml')
end

task :build => [:dependencies, :submodules] do
task :build => [:dependencies, :submodules, :styles] do
sh('bundle exec jekyll build --config _config.yml')
end

Expand Down
71 changes: 0 additions & 71 deletions _sass/_syntax-highlighting.scss
View file
Open in desktop

This file was deleted.

10 changes: 8 additions & 2 deletions _sass/common.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,11 +33,17 @@
}
}

.highlight {
padding: 1rem;
pre.highlight {
padding: 1.5rem;
}

.centered-content {
display: flex;
justify-content: center;
}

code.highlighter-rouge {
@extend .highlight;

padding: 0.1rem;
}
Loading