link: introduce effects

- new link effects: target download
- effects can now be strings besides bools (to allow for custom download
  attribute on links)
- remove "no*" classes form image as they don't make sense for
  string effects and are cluttering the image class list for newly
  introduced effects
- refactor attribute parsing for later reusage in menu generation, button
  topbar, etc.
This commit is contained in:
Sören Weber 2025-02-07 14:28:26 +01:00
parent 516e552ece
commit aaf0c707a2
No known key found for this signature in database
GPG key ID: BEC6D55545451B6D
10 changed files with 230 additions and 93 deletions
docs/content/configuration/customization

View file

@ -56,27 +56,21 @@ With this configuration in effect, the following URL
would result in
````html {title="HTML"}
<img src="https://octodex.github.com/images/minion.png" loading="lazy" alt="Minion" class="bg-white border nolazy lightbox noshadow">
<img src="https://octodex.github.com/images/minion.png" loading="lazy" alt="Minion" class="bg-white border lightbox">
````
## Styling Effects
If the resulting effect value is
- `true`: add a class with the effect's name
- `false`: add a class with the effect's name and a "no" prefix
If the resulting effect value is `true` a class with the effect's name will be added.
Styles for default effects are contained in the theme. Add styles for your custom effects to `layouts/partials/content-header.html`.
For the above example you could add styles for both boolean cases:
For the above custom effect you could add the following style:
````html {title="layouts/partials/content-header.html"}
<style>
img.bg-white {
background-color: white;
}
img.nobg-white {
background-color: transparent;
}
</style>
````