isunjn / serene

A blog theme for zola, simple and clean

Hi there 👋

serene's Issues

Idea: Automatic demo deployment

You can create a github workflow which will deploy demo with the newest version of the theme (to Vercel, or Github Pages).

Issue with linenos + minify_html

Using code listing with linenos enabled, while minify_html is set to true in config.toml, will mess the layout.

Here's an example screenshot of this issue.

Demo site suffers the same.

[bug] figcaption width is bugged

calling this shortcode gives

{{ figure(src="./sample.jpg", alt="A pbm image", caption="A sample Bit Map image.") }}

of in HTMl

<figure>
<img alt="A pbm image" src="./sample.jpg" class="lightense-target">
<figcaption>A sample Bit Map image.</figcaption>
</figure>

figcaption is subject to the following css rule

body.post article figcaption {
	width: min-content;
	margin: 5px auto;
}

I had to remove width: min-content to make it work

Single-line text in code blocks is not centered

Issue with English Docs

First of all, Thank you so much for this amazing theme.

I was trying to use this theme as a git submodule. But a minor typo is creating issues.

The command as written in the docs is: git submodule add https://github.com/isunjn/serene.git theme/serene

But the official docs of Zola instructs to install a theme in the themes directory.

So the correct command to use the theme as a git submodule should be: git submodule add https://github.com/isunjn/serene.git themes/serene

Help wanted: `zola serve` doesn't work

Hello. Thanks for making such a nice theme!

my code

I thought I would clone your theme and create a blog. Here is the code.
https://github.com/Seasawher/serene-blog

zola serve doesn't work

But zola serve does not work. I get an error that highlight_themes is not found.

In config.toml, you will find the following line

extra_syntaxes_and_themes = ["highlight_themes"]

If you change it as follows, it will work:

extra_syntaxes_and_themes = ["themes/serene/highlight_themes"]

However, I thought this might not be the design intended on the serene side. The reason is that zola's initial screen is displayed without the theme applied.

my problem

In zola, I remember that when using a theme, it was sufficient to write a custom file in the templates directory only when you wanted to override the theme. However, for some reason, this does not seem to work on my blog.

After zola serve, I get an error that github.svg is not found. Of course, there is a github.svg under themse/serene/, but zola can't find it.

What on earth did I do wrong? I would appreciate any advice you can give me...

Thanks for reading.

ToC never sets 'active' for final section if less than one page long

Hey there! I ran into this when exploring https://serene-demo.pages.dev/

The table of contents section never sets 'active' the final section of the blog if it's < 1 page long.

Some examples :

• you can't go to cupiditate here https://serene-demo.pages.dev/blog/example-post/#cupiditate
• you can't go to update here https://serene-demo.pages.dev/blog/usage/#update

I have never really worked with much front end but a bit of digging makes me think this is what's causing it.

serene/static/js/main.js

Line 146 in dd61c65

}), { rootMargin: '-9% 0px -90% 0px' });

I'm not sure if this was an intended feature or something that was missed, as I see explicit values set for the rootMargin.
But some other combination of rootMargin + threshold should be able to fix this - haven't played around with the values too much to find out.

Add back the back-to-top button

Add a separate 'about' page

Feature request: Code block with filename

Commonmark doesn't have these yet. I think they can be implemented as shortcodes (like callouts?):

{% code(toml, name="config.toml" %}
[section]
value = "foo"
{% end %}

// or...

{% code(lang=toml, name="config.toml" %}
[section]
value = "foo"
{% end %}

mermaid 语法错误

不管页面的头部设置 mermaid = true，还是在 config.toml 文件中设置 mermaid = true 都会出现这个 mermaid 语法错误的图片。

Add copy-button for code blocks

Add support for self-host fonts

Customize giscus styles for simplification

Blog overview as start page

Hi, i love your cool zola theme!

Can i set the blog post overview as the home page?

Include pagination for home page (list view) and blog page

I love this theme! Thanks so much for creating it!

I'm noticing that if I enable list mode for the home page, the footer gets pushed way down and the list of posts goes on endlessly. Do you think it makes sense to think of including pagination, with the right UI elements in place for it? A lot of other themes do this.

I realize I could customize it and add shortcodes for it as per the Zola docs, but it would be awesome to have the right stylistic elements in place (e.g., arrow buttons) that align with the rest of the theme. Hope this makes sense!

Add light/dark mode for code blocks

Layout shift on post page

Add support for blog list as the homepage

Feature Request: Fancy 404 page

Something minimal just like the home page would be nice :)

Templates should use {{config.base_url}}

This template is lovely! Thanks for working on it. One thing I encountered when trying to deploy to a github pages project page (as opposed to a user one, i.e nathanielnrn.github.io/project vs just nathanielnrn.github.io).

Templates should use {{config.base_url}} before things like /js and /main.css to ensure that deployment works when the base url is extended. (i.e base_url = "mywebsite.com/extended")

Relevant for places like here, here, and here to name a few.

Add generic page.html ?

I add to modify your theme to make it work with generic content, would you be open to introducing modifications that could allow the creation of pages that are not projects or blog posts ?

Support for internal links in projects data.toml

In markdown files, you can use the internal link syntax to point to internal links. It would be nice if the urls in the data.toml file also supported this.

[Feature Request] KaTeX support

Often mathematical notations (using LaTeX syntax) are used in technical documents or blog posts. It would be really great if the theme supports this feature using KaTeX.

If you're interested, I can make a pull request.

Images with captions should not have an alt text.

According to this source, captions already provide a description of the image, and the alt attribute should thus be set to null (i.e., alt="").

Currently, the documentation recommends adding the alt text regardless of whether or not a caption text is supplied.

outdate alerts behave strangely, sometimes displaying blank alerts

If outdate_alert = true and outdate_alert_days is set too long, a blank alert will be displayed.

Feature request: hide tags and page.summary

Hi, first of all thanks for creating this theme, it looks great. Here are a few features I would like to see in this theme.

• Option to justify blog text. Iiuc this needs something like this rhazdon/hugo-theme-hello-friend-ng#20 (comment). EDIT: I don't need it anymore. I realized that I can @import "../theme/serene/sass/main.scss" so after updating serene I won't need to copy new css anymore.
• Option to hide tags even if they are present. I like to tag but not show. I can just comment them out in the markup, but if I have 20 posts and suddenly realize I want to show the tags, it's going to take a long time.
• Option to not include page.summary in a blog post. This will be useful if you want to add a summary for rss andwant to remove this text from the beginning of a post. In the future page.summary can be used under post name on the blog page.

EDIT: I've done it locally, waiting to hear from you if you want it in serene.

Giscus CORS

Hi, I have a CORS issue with giscus but I'm not really sure how to resolve it. I followed the instructions here https://github.com/isunjn/serene/blob/main/USAGE.md#comments.

Any help would be appreciated!

Add tags and image support for projects page

Accessibility issue with admonition

Some of the admonitions have too low contrast rate (<4) which creates accessibility issues. Please inspect the demo page to have a look.

The URL of a Blog post is wrong in a page deployed to GitHub Pages

Thank you very much for your help earlier.

zola serve is working perfectly. However, there is a problem when deploying it, even though it works well locally.

I deployed to GitHub Pages using GitHub Action, but I can't view the Blog post (404 error). Why does this happen?

here is my code: https://github.com/Seasawher/Seasawher.github.io