athul / archie

A minimal Hugo Theme
https://athul.github.io/archie
MIT License
977 stars 299 forks source link

Code highlight block issues #61

Closed x7upLime closed 1 year ago

x7upLime commented 1 year ago

I admit I didn't investigate much on this myself.. I'll post the issue just in case someone else experienced this (perhaps it's just me..).

I can see that: The code highlight themes have their own text highlight color, which take precedence over the red highlight color of archie light inside the code block. My issue: Choosing a light code highlight theme (ex. emacs) will change the text highlight color to a light one inside the block, that will be used on the emacs light background, so that one cannot see highlighted text inside the code block (lots of highlights, sorry).

Is there a way to make archie's default text highlight color override the one in the code highlight block?

Also setting [markup] [markup.highlight] anchorLineNos = true will have the unpleasant effect (but quite reasonable..) to have each line treated as an archie link, with underline.

My config.tml:

baseURL = 'someurl' languageCode = 'en-us' title = 'someblog' theme = "archie"

[params] mode = "auto"

[markup] [markup.highlight] anchorLineNos = true ## <-- line num treated as archie link codeFences = true guessSyntax = false hl_Lines = '' hl_inline = false lineAnchors = '' lineNoStart = 1 lineNos = true lineNumbersInTable = false noClasses = true noHl = true style = 'emacs' tabWidth = 4

athul commented 1 year ago

I'm not sure this is archie specific. Please do check out Hugo Docs: https://gohugo.io/content-management/syntax-highlighting/#configure-syntax-highlighter

This will be a better guide :)

x7upLime commented 1 year ago

I figured how to make it work, it surely is not an archie issue (although it seemed like one, for one that is not familiar with hugo or styling in general..)

I generated a style.css file using

$ hugo gen chromastyles --style=emacs > spicedEmacs.css

And added this line to spicedEmacs.css:

.chroma .line ::selection {background-color: #ddff00}

Then following archie's README.md, I placed the file inside themes/archie/assets/css/ of my hugo project and reloaded.

Now it looks charming :)