sowenjub/CasperishTheme

Dark theme availability ?

twittemb opened this issue · 4 comments

Hey @sowenjub

Very nice job. I intend to use it for my blog.

Do you plan to make it compliant with dark themes ?

Thanks.

Hey @twittemb, thanks!
I do intend to make it compliant as Tailwind CSS supports an official dark mode (it's on their roadmap).

Thanks for your response @sowenjub.

There are 1 thing I'd like to customize, this is the syntax highlighting colours (background + keywords), and I'm having a hard time doing it. Could you guide me there please ?

And also I noticed a difference between chrome/edge/safari for the code snippets. On Safari, there is no horizontal scroll-bar and the lines are wrapped. That makes the code ugly to read. Do you have a solution for that ?

Thanks for your help.

I'll start with the wrapped lines. It's now fixed ☺️. This was a side effect of break-words which is used to handle long URLs in posts.

The syntax highlighting background is inherited from Tailwind's typography plugin, so you would have to override it in the theme.css file.

Specifically, edit theme.css and you should find at the bottom .prose pre which includes the scroll fix (overflow-wrap: normal;). You can set your preferred color there.

.prose pre {
  background-color: #yourcolor;
  overflow-wrap: normal;
}

Of course, don't forget that you need to regenerate the styles.css (see the readme) otherwise you won't see any change.

Keywords css is also defined in the theme.css file, it’s everything prefixed with .highlighted.

Let me know if you need more help than this.

everything works fine.

Thanks a lot.