luxick/luxtools-template
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Rework handling of icons and tinting of external icons

Browse Source
This commit is contained in:
luxick
2026-02-25 13:34:34 +01:00
parent f0b768e5bb
commit 582ed5fd60
31 changed files with 70 additions and 134 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
README.md
View File

@@ -5,4 +5,21 @@ This is a fork of the original default dokuwiki template.
## Changes from the original template
- Default font changed to "Perfect DOS VGA 437 Win"
- Enhanced header search with DokuWiki quicksearch suggestions, keyboard navigation, and disabled browser autofill
- Enhanced header search with DokuWiki quicksearch suggestions, keyboard navigation, and disabled browser autofill
## Icon theming (light/dark)
- Header tool icons (user tools and site tools) are rendered as inline SVG.
- The pagetools footer is intentionally text-only (no icons).
- Icon color is controlled through `@ini_icons` (placeholder `__icons__`) in [replacements] inside `style.ini`.
- Hover/active icon color follows `@ini_link` to match link interaction color.
## Edit toolbar icons
- The edit page toolbar (`?do=edit`) is generated by DokuWiki core and uses PNG toolbar images.
- This template converts those toolbar `<img>` icons to CSS mask icons at runtime, then applies `@ini_icons`.
- Hover/active/focus color follows `@ini_link`.
- This keeps DokuWiki core files untouched while still allowing light/dark icon theming.
### About coloring SVG icons from the outside
- Recommended: inline SVG + CSS (`fill`, `stroke`, or `currentColor`).
- Limited: external SVG via `<img>` or `background-image` cannot reliably be recolored with plain CSS.
- Workarounds for external SVG exist (`mask-image`, CSS `filter`), but they are less maintainable and less precise.