Grunticon er en Grunt.js opgave, der kan køre på en mappe, der indeholder SVG-billeder. Du kan bruge PNG-billeder så godt, men resultaterne vil ikke være meget "vectorish."
Grunticon virker ved at tage alle disse SVG ikoner og genererer CSS kode som du kan bruge til korrekt indlejre dem på websider, med indbygget understøttelse af responsive layouts og retina-enheder.
CSS kode genereret af denne app dækker alle de grundlæggende funktioner, der kommer i tre forskellige versioner:
- SVG data URL'er
- PNG data URL'er
- Klassiske PNG-billeder
Den tredje metode blev inkluderet som en fallback til browsere ikke understøtter SVG data, hvilket gør de SVG ikoner som regulære PNG-billeder. Hvis SVGs ikke er tilgængelige i et PNG formular, så Grunticon vil konvertere dem for dig automatisk og placere dem i en særlig mappe.
Ved at redigere et par linjer i Grunt.js opgave fil, kan udviklerne også justere egenskaberne ved de udlæses ikoner, der spænder fra CSS præfiks til placeringen af en forhåndsvisning HTML-fil.
Sammen med CSS, kan en lille JS fil også blive genereret, som kan bruges til at asynkront indlæse SVG-filer, og sørg for at de ikke blokerer side gengivelse, hvis flere elementer bruges på samme side.
Ikoner genereret via Grunticon har også evnen til at blive stylet via CSS, gengives i forskellige farvevarianter, og selv animeret.
. Installationsvejledning er forsynet med pakkens README-fil
Krav :
- Grunt.js 0.4.2 eller højere
Kommentarer ikke fundet