WP Manifestindependent plugin directory
manifest / themes / sw-design-system

SW Design System

Konfigurovatelný design systém pro weby Smart Websites. Nastavte barvy, dark mode, tvarosloví, stíny a animace v jednom místě — plugin z toho vygeneruje CSS. Obsahuje knihovnu komponent a nápovědu.

by Smart Websites · github.com/paveltravnicek/sw-design-system · website

0stars
0forks

Install

No release zip yet. The repository archive installs, but the folder name will carry the branch suffix and updates will not flow:

wp plugin install https://github.com/paveltravnicek/sw-design-system/archive/refs/heads/main.zip

Declares an update source (https://github.com/paveltravnicek/sw-design-system/), so updates arrive through the plugin's own updater.

Readme

SW Design System

Konfigurovatelný design systém pro WordPress (weby Smart Websites). Nastavíte barvy, tvarosloví, hloubku, pohyb a dark mode v adminu → plugin z toho vygeneruje skutečný CSS soubor (žádné inline). Obsahuje knihovnu komponent a nápovědu.

Instalace

  1. Nahrajte složku sw-design-system do wp-content/plugins/.
  2. Aktivujte plugin ve Pluginy.
  3. Nastavení najdete pod Vzhled → SW Design System (jen administrátoři).

Při aktivaci se vytvoří wp-content/uploads/sw-ds/sw-tokens.css s výchozími hodnotami. Soubor se přegeneruje při každém uložení nastavení.

Jak to funguje

  • assets/sw-design-system.css — statická komponentová pravidla + výchozí :root (fallback).
  • uploads/sw-ds/sw-tokens.css — generované :root{} přepisy (a dark mode). Načítá se za statickým CSS, takže přebíjí výchozí hodnoty.
  • assets/sw-design-system.js — runtime (nájezdy prvků, parallax). Idempotentní.

Nic se netiskne inline do <head>. Generovaný soubor je cacheovatelný (cache-busting přes filemtime), takže funguje s Varnishem i WP Compress.

Plátno

Aby společné pozadí prosvítalo skrz sekce, dejte třídu sw-canvas na <body> nebo obalte sekce do <div class="sw-canvas">.

Komponenty

V záložce Komponenty zkopírujte HTML a vložte do LiveCanvas (prázdná sekce → Edit Code). Styl se načte automaticky.

Přenos na jiný web

Záložka Presety → Přenos nastavení: zkopírujte JSON a naimportujte ho na druhém webu. Nebo použijte hotový preset pro rychle odlišný vzhled.

Struktura

sw-design-system/
├── sw-design-system.php          # bootstrap, konstanty, aktivace
├── uninstall.php                 # úklid
├── includes/
│   ├── class-swds-tokens.php     # registr tokenů (zdroj pravdy)
│   ├── class-swds-presets.php    # pojmenované sady
│   ├── class-swds-generator.php  # tokeny → CSS soubor
│   ├── class-swds-settings.php   # admin stránka, ukládání
│   ├── class-swds-frontend.php   # enqueue
│   └── view-settings.php         # HTML admin stránky
├── assets/
│   ├── sw-design-system.css      # komponentové CSS
│   ├── sw-design-system.js       # runtime
│   ├── admin.css / admin.js      # admin UI
└── components/                   # HTML snippety pro knihovnu

Read the full README on GitHub →

Releases

TagPublished
2-0 Jul 21, 2026
1-0 May 29, 2026

These releases are tags only. The author does not attach a packaged zip, so there are no download counts to report.