cache busting for custom CSS, update readme

This commit is contained in:
Aron Gergely 2021-06-08 21:57:36 +02:00 committed by Athul Cyriac Ajay
parent 27307e797f
commit dd1612c482
2 changed files with 21 additions and 3 deletions

View file

@ -15,6 +15,7 @@ Forked from [Ezhil Theme](https://github.com/vividvilla/ezhil)
- Tags - Tags
- Auto Dark Mode(based on system theme) - Auto Dark Mode(based on system theme)
- tl:dr; frontamatter - tl:dr; frontamatter
- Cache busting for CSS files
## Installation ## Installation
In your Hugo website directory, create a new folder named theme and clone the repo In your Hugo website directory, create a new folder named theme and clone the repo
@ -45,6 +46,19 @@ Inspired by design of blog.jse.li
---- ----
## Config Options
### Custom CSS
Custom CSS files can be included though the `customcss` config parameter.
Note: CSS files should be placed under the `assets` directory e.g. `assets/css/first.css`.
```toml
[params]
customcss = ["css/first.css", "css/second.css"]
```
## Config of the Demo Site ## Config of the Demo Site
```toml ```toml

View file

@ -35,16 +35,20 @@
{{ $fontstyle := resources.Get "css/fonts.css" | fingerprint }} {{ $fontstyle := resources.Get "css/fonts.css" | fingerprint }}
<link href="{{ $fontstyle.Permalink }}" rel="stylesheet"> <link href="{{ $fontstyle.Permalink }}" rel="stylesheet">
{{ end }} {{ end }}
{{ $style := resources.Get "css/main.css" | fingerprint }} {{ $style := resources.Get "css/main.css" | fingerprint }}
<link rel="stylesheet" type="text/css" media="screen" href="{{ $style.Permalink }}" /> <link rel="stylesheet" type="text/css" media="screen" href="{{ $style.Permalink }}" />
{{- if or (eq .Site.Params.mode "auto") (eq .Site.Params.mode "dark") -}} {{- if or (eq .Site.Params.mode "auto") (eq .Site.Params.mode "dark") -}}
{{ $darkstyle := resources.Get "css/dark.css" | fingerprint }} {{ $darkstyle := resources.Get "css/dark.css" | fingerprint }}
<link rel="stylesheet" type="text/css" href="{{ $darkstyle.Permalink }}" {{ if eq .Site.Params.mode "auto" }}media="(prefers-color-scheme: dark)"{{ end }} /> <link rel="stylesheet" type="text/css" href="{{ $darkstyle.Permalink }}" {{ if eq .Site.Params.mode "auto" }}media="(prefers-color-scheme: dark)"{{ end }} />
{{ end }} {{ end }}
<!-- Custom CSS style get applied last --> <!-- Custom CSS style get applied last -->
{{- if isset .Site.Params "customcss" }} {{- if isset .Site.Params "customcss" }}
{{ range .Site.Params.customCSS }} {{ range .Site.Params.customCSS }}
<link rel="stylesheet" type="text/css" href="{{ . | relURL }}"> {{ $customstyle := resources.Get . | fingerprint }}
<link rel="stylesheet" type="text/css" href="{{ $customstyle.Permalink }}">
{{ end }} {{ end }}
{{- end -}} {{- end -}}
{{- range .Site.Params.customJS }} {{- range .Site.Params.customJS }}