Installa Nexigrid
Due file nella pagina e inizi a scrivere classi ng-. Niente build, niente dipendenze.
Aggiungi stili e script
Linka il foglio di stile nell head e gli script core prima della chiusura del body. Aggiungi il JS di ogni componente interattivo che usi.
<!-- in <head> -->
<link rel="stylesheet" href="/assets/css/nexigrid.css">
<!-- before </body> -->
<script type="module" src="/assets/js/ng_core.js"></script>
<script type="module" src="/assets/js/ng_observer.js"></script>
<script type="module" src="/assets/js/ng_dropdown.js"></script>
Struttura file
Il framework è fatto di file semplici — copia il dist nel progetto, nessun bundler.
assets/
css/
nexigrid.css
js/
ng_core.js
ng_observer.js
ng_<component>.js
fonts/
inter/ phosphor/
Il tuo primo componente
Scrivi il markup con le classi ng-. I componenti CSS-only funzionano subito; quelli interattivi si montano da soli.
<button class="ng-btn ng-btn-primary">Get started</button>
<span class="ng-badge ng-badge-success-soft">Ready</span>
Ready
Dark mode
Cambia tema con un solo attributo data-theme, o via JS.
<!-- default theme -->
<html data-theme="dark"> … </html>
<!-- toggle from JS -->
<button data-theme-toggle>Toggle theme</button>
Codice sorgente
Clona il repository o sfoglia il codice su GitHub.
git clone https://github.com/DevonMax/nexigrid.git