Skip to content

pantoken-root / visual-debug

visual-debug ​

Bêta

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

Les primitives de mise en page d'InstUI (View, Flex, Grid, List, …) acceptent withVisualDebug pour tracer le contour de la boîte et de ses enfants lors du débogage d'une mise en page. Ce plugin émet un seul modificateur préfixé par 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) donc il est 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