Classed syntax highlighting + Line numbers #1242

evan-brass · 2020-11-24T17:49:29Z

CSS classed syntax highlighting

This extends #913
ClassedHtmlGenerator uses tokens_to_classed_spans internally which creates a new scope stack for each line causing the panic when a restore occurs on a different line from a clear.

Documentation
- Explain how to style classed highlighting (.code class, samples for <mark>, etc.)
Implement hl_lines (<mark> tags?)
Implement line numbers
- Table
- linenostart fence option
Tests
Is any more documentation needed?
Is it ok for highlighting_css_themes to not be under the new markdown section?

evan-brass · 2020-12-04T02:42:04Z

Hello @Keats. Is this something you're interested in? Before I continue, I wanted to see if this is going in a right direction.

Keats · 2020-12-04T13:01:17Z

Sorry I thought I replied to it already! This is something we want but I'm wondering if we need to override the HTML syntect outputs so we can support line numbers and highlight in the best possible way (https://zola.discourse.group/t/highlighting-improvements/19/11?u=keats)

Keats · 2020-12-04T21:22:48Z

Character highlighting: I don't think we want to do that, just lines are fine.
Higher contrast: if we rewrite the HTML output, we can use mark as you say for highlighted text and let people overwrite the style via CSS. I'm not sure about using mark for syntax instead of span though. Why do you say it will reduce duplication?
Line numbers: I believe to have it nicely working (copy/paste without the line numbers etc), we need to rewrite the HTML from syntect completely.

I think if we go the rewrite html route, adding the classes is trivial since we just put it instead of inline css?

Keats · 2020-12-05T06:25:36Z

I think if we go the rewrite HTML route, the first thing to do is to write by hand the HTML we would like to end up so we can experiment easily

uwearzt · 2021-01-03T13:40:12Z

@evan-brass Thanks for pushing my PR forward. This year i have time to work on Zola (and my website). If you need any help, just drop me a note.

Copied and pasted from pull request 913 Co-Authored-By: Uwe Arzt <[email protected]>

Mostly copied from PR 913 Co-Authored-By: Uwe Arzt <[email protected]>

This is copied from getzola#913 Co-Authored-By: Uwe Arzt <[email protected]>

Give `CodeBlock` access to the start and end events because classed highlighting needs to adjust the pre element and close spans. Rename get_highlighter and make it return everything needed for highlighting so that we don't need the config after a codeblock is created. Prep the code block for classed highlighting which will need to store different state from inline highlighting.

still need to do open_spans and lots of stuff.

* Remove html_escape: use Tera * Output table

The foreground color will now be applied to the line numbers. This also reduces the number of spans required in inline output.

evan-brass · 2021-01-06T12:10:33Z

Sorry for the delay.

I'm still not sure what line number style to implement so I implemented the few discussed already. There's some bugs and no tests yet.

I don't like how much code I wrote in the codeblock module - it feels like there's some simple design that I'm not seeing. I tried to break the line numbers, highlighted lines, and syntax highlighting into multiple "passes", but it still doesn't seem right.

Keats · 2021-01-09T13:54:52Z

I did it again sorry >_>

Keats · 2021-03-06T21:49:56Z

@evan-brass is it ready or is it still a WIP?

Keats · 2021-05-17T12:09:46Z

Another ping @evan-brass
I'll pick it up later this month otherwise

kzurawel · 2021-05-26T19:20:00Z

I've been using this branch for a while and so far I'm quite happy with it, but I had one suggestion/request: when using the "css" highlight theme, it would be nice to include the language-* classname from the <code> block on the <pre> tag as well. This would allow for doing things like setting different background colors for different types of code block (in my use case, allowing "plain text" fenced code blocks to blend in more with the page by having no background color, while allowing specific language code blocks to be more visually defined).

Keats · 2021-06-07T20:25:17Z

It looks really good! Merge conflict is going to be a bit annoying (hidden lines, how it interacts with line numbers etc) but I'll try to merge things through the syntax-highlight-++ branch this week or so

Keats · 2021-06-14T18:26:11Z

Erhm the merge is annoying, do you mind if I do it manually in a new commit and mark you as the commit author @evan-brass ? I will probably tweak some bits but most of it will be this PR.

evan-brass · 2021-06-14T20:53:38Z

Sure. Sounds good.

Keats · 2021-06-16T20:35:14Z

@kzurawel should the lang be moved entirely to pre instead of code? It's a bit silly to repeat the information 3-4 times

kzurawel · 2021-06-16T21:05:16Z

I would be fine with that; I can’t think of a situation where having the inner lang class would matter

Keats · 2021-06-17T09:30:41Z

It's if you want to use something like highlightjs. I think I will just the class on pre and code actually so it covers everything.

Keats · 2021-06-21T09:20:12Z

Not finished yet but #1531 is a simplified implementation as it doesn't try to unify various spans, which sounds like it would something better done in syntect directly.
However the class based highlighting panics when ran on the Zola site despite the code being 99% copy/pasted from syntect itself so I might copy the code from this PR instead if I can't figure it out.

Keats · 2021-06-22T17:29:23Z

trishume/syntect#336 and I made a PR to fix it so it should be ok

Keats · 2021-07-02T18:30:47Z

@kzurawel can you try #1531 ?

evan-brass force-pushed the classed-highlighting branch from 9e94065 to 5155f5b Compare December 4, 2020 02:15

This comment has been minimized.

Sign in to view

evan-brass marked this pull request as draft December 5, 2020 00:32

evan-brass changed the title ~~Classed syntax highlighting~~ Classed syntax highlighting + Line numbers Dec 8, 2020

evan-brass marked this pull request as ready for review December 8, 2020 23:38

Keats force-pushed the next branch from ff1ee3d to cc3e4f9 Compare December 14, 2020 19:45

evan-brass force-pushed the classed-highlighting branch from 4c06480 to 59bc44d Compare December 17, 2020 01:56

Keats mentioned this pull request Jan 3, 2021

Syntax highlighting with CSS classes #913

Closed

4 tasks

evan-brass and others added 17 commits January 6, 2021 02:19

Add css highlighting options for Config

2ad95e6

Copied and pasted from pull request 913 Co-Authored-By: Uwe Arzt <[email protected]>

Add highlight css file output

26c77e5

Mostly copied from PR 913 Co-Authored-By: Uwe Arzt <[email protected]>

Add css highlighting documentation

bdc0d6f

This is copied from getzola#913 Co-Authored-By: Uwe Arzt <[email protected]>

cargo fmt

135a67a

Classed highlighting

26d5f01

Little Fixes

9db8026

Implement hl_lines for classed highlighting

b6c3688

Fix comment

1ddeafe

~unify classed and inline

1c3f4fa

still need to do open_spans and lots of stuff.

First attempt at line-numbers

bb06428

* Remove html_escape: use Tera * Output table

Finish bringing in Syntect highlighting code

97c4a50

Second attempt at line numbers

4c6a95f

Comments, fmt, clippy

0cac289

linenostart, update tests, add linenos tests

8df33df

Add css color to pre tag

9cde3a2

The foreground color will now be applied to the line numbers. This also reduces the number of spans required in inline output.

docs

3299b4e

CodeBlockPass?

6d7f708

evan-brass force-pushed the classed-highlighting branch from 59bc44d to 6d7f708 Compare January 6, 2021 11:35

evan-brass marked this pull request as draft January 6, 2021 11:51

Keats closed this Jan 9, 2021

Keats deleted the branch getzola:syntax-highlight-++ January 9, 2021 13:51

Keats reopened this Jan 9, 2021

Keats mentioned this pull request May 17, 2021

Allow user to add custom highlighting themes #419

Closed

Keats mentioned this pull request May 23, 2021

Need examples of code using each named highlight scheme #1197

Closed

rootkea mentioned this pull request May 25, 2021

Docs: Unset highlight_theme variable in sample config.toml #1482

Closed

Keats marked this pull request as ready for review June 7, 2021 19:04

Keats changed the base branch from next to syntax-highlight-++ June 7, 2021 19:07

Keats mentioned this pull request Jun 20, 2021

New Release? #1529

Closed

Keats force-pushed the syntax-highlight-++ branch from 6075d56 to 7b75ad0 Compare June 21, 2021 08:56

Keats force-pushed the syntax-highlight-++ branch from 7b75ad0 to ebfbd8d Compare July 2, 2021 18:30

Keats closed this Jul 10, 2021

Keats deleted the branch getzola:syntax-highlight-++ July 10, 2021 06:49

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Classed syntax highlighting + Line numbers #1242

Classed syntax highlighting + Line numbers #1242

evan-brass commented Nov 24, 2020 •

edited

Loading

evan-brass commented Dec 4, 2020

Keats commented Dec 4, 2020

This comment has been minimized.

Keats commented Dec 4, 2020

Keats commented Dec 5, 2020

uwearzt commented Jan 3, 2021

evan-brass commented Jan 6, 2021

Keats commented Jan 9, 2021

Keats commented Mar 6, 2021

Keats commented May 17, 2021

kzurawel commented May 26, 2021

Keats commented Jun 7, 2021

Keats commented Jun 14, 2021

evan-brass commented Jun 14, 2021

Keats commented Jun 16, 2021

kzurawel commented Jun 16, 2021

Keats commented Jun 17, 2021

Keats commented Jun 21, 2021

Keats commented Jun 22, 2021

Keats commented Jul 2, 2021

Classed syntax highlighting + Line numbers #1242

Classed syntax highlighting + Line numbers #1242

Conversation

evan-brass commented Nov 24, 2020 • edited Loading

evan-brass commented Dec 4, 2020

Keats commented Dec 4, 2020

This comment has been minimized.

Keats commented Dec 4, 2020

Keats commented Dec 5, 2020

uwearzt commented Jan 3, 2021

evan-brass commented Jan 6, 2021

Keats commented Jan 9, 2021

Keats commented Mar 6, 2021

Keats commented May 17, 2021

kzurawel commented May 26, 2021

Keats commented Jun 7, 2021

Keats commented Jun 14, 2021

evan-brass commented Jun 14, 2021

Keats commented Jun 16, 2021

kzurawel commented Jun 16, 2021

Keats commented Jun 17, 2021

Keats commented Jun 21, 2021

Keats commented Jun 22, 2021

Keats commented Jul 2, 2021

evan-brass commented Nov 24, 2020 •

edited

Loading