Thema’s
Begin bij een thema en pas aan tot het past bij je club. Elke keuze is een CSS-variabele: je zet ze één keer in je site en alle widgets volgen.
Thema’s
Vanuit je clubkleuren
Geef één of twee kleuren van je club; wij maken er een leesbaar thema van.
Alles zelf instellen
Kleuren
Tekst
Vorm
Voorbeeld met echte data
Leesbaarheid
- Tekst op achtergrond 16,5:1 · Goed leesbaar
- Secundaire tekst 5,9:1 · Goed leesbaar
- Kop van tabellen 7,9:1 · Goed leesbaar
- Links 7,9:1 · Goed leesbaar
- Winst 5,4:1 · Goed leesbaar
- Accent 7,9:1 · Goed leesbaar
Je thema
:root {
--ppong-bg: #ffffff;
--ppong-surface: #ffffff;
--ppong-sunken: #fff1c2;
--ppong-stripe: #f2f5fa;
--ppong-line: #d5dbe5;
--ppong-line-strong: #8a96a8;
--ppong-text: #1a1f29;
--ppong-muted: #5a6577;
--ppong-head-bg: #1d4f9e;
--ppong-head-text: #ffffff;
--ppong-accent: #1d4f9e;
--ppong-on-accent: #ffffff;
--ppong-link: #1d4f9e;
--ppong-win: #1f7a3f;
--ppong-on-win: #ffffff;
--ppong-loss: #b8261b;
--ppong-font: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
--ppong-font-num: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
--ppong-size: 14px;
--ppong-title-size: 17px;
--ppong-radius: 4px;
--ppong-border: 1px;
--ppong-pad: 12px;
}Zet dit in de CSS van je site, bijvoorbeeld in Weergave › Customizer › Extra CSS bij WordPress. Het geldt voor alle widgets op je site.
Link naar dit thema
https://widgets.ppong.be/nl/themes/#theme=eyJiZyI6IiNmZmZmZmYiLCJzdXJmYWNlIjoiI2ZmZmZmZiIsInN1bmtlbiI6IiNmZmYxYzIiLCJzdHJpcGUiOiIjZjJmNWZhIiwibGluZSI6IiNkNWRiZTUiLCJsaW5lLXN0cm9uZyI6IiM4YTk2YTgiLCJ0ZXh0IjoiIzFhMWYyOSIsIm11dGVkIjoiIzVhNjU3NyIsImhlYWQtYmciOiIjMWQ0ZjllIiwiaGVhZC10ZXh0IjoiI2ZmZmZmZiIsImFjY2VudCI6IiMxZDRmOWUiLCJvbi1hY2NlbnQiOiIjZmZmZmZmIiwibGluayI6IiMxZDRmOWUiLCJ3aW4iOiIjMWY3YTNmIiwib24td2luIjoiI2ZmZmZmZiIsImxvc3MiOiIjYjgyNjFiIiwiZm9udCI6InN5c3RlbS11aSwgLWFwcGxlLXN5c3RlbSwgXCJTZWdvZSBVSVwiLCBSb2JvdG8sIEFyaWFsLCBzYW5zLXNlcmlmIiwiZm9udC1udW0iOiJzeXN0ZW0tdWksIC1hcHBsZS1zeXN0ZW0sIFwiU2Vnb2UgVUlcIiwgUm9ib3RvLCBBcmlhbCwgc2Fucy1zZXJpZiIsInNpemUiOiIxNHB4IiwidGl0bGUtc2l6ZSI6IjE3cHgiLCJyYWRpdXMiOiI0cHgiLCJib3JkZXIiOiIxcHgiLCJwYWQiOiIxMnB4In0=Bewaar deze link om je thema later verder aan te passen.