Skip to content

pantoken / visual-debug

visual-debug

Bêta

@pantoken/plugin-visual-debug — le CSS pour la prop withVisualDebug d'InstUI.

Les primitives de mise en page d'InstUI (View, Flex, Grid, List, …) acceptent withVisualDebug pour délimiter la boîte et ses enfants lors du débogage d'une mise en page. Ce plugin émet un seul modificateur préfixé d'un tiret, -with-visual-debug, qui fonctionne sur n'importe quel élément (composé avec n'importe quelle base, p.ex. .instui-view -with-visual-debug). La couleur du contour est une propriété personnalisée --pantoken-visual-debug-color (par défaut un magenta vif) afin qu'il soit facile de la retinter.

Exemple

ts
import { toCss } from "@pantoken/css";
import { byTheme } from "@pantoken/tokens";
import { visualDebug } from "@pantoken/plugin-visual-debug";

const css = toCss(byTheme("rebrand"), { plugins: [visualDebug()] });
// <div class="instui-view -with-visual-debug">…</div>

Interfaces

Variables

Fonctions

Références

default

Renomme et ré-exporte visualDebug