File tree Expand file tree Collapse file tree 1 file changed +30
-0
lines changed Expand file tree Collapse file tree 1 file changed +30
-0
lines changed Original file line number Diff line number Diff line change @@ -150,6 +150,36 @@ generateFonts({
150150}).then (results => console .log (results));
151151```
152152
153+ #### Organising icons
154+
155+ Icon names and className will be generated from a slug of the relative path + basename of each ` .svg ` file found in the input directory.
156+
157+ This allows arranging your icons in namespaces, which can be useful if a project uses a large number of icons.
158+
159+ Considering the following ` ./icons ` input directory:
160+
161+ ```
162+ icons
163+ ├── logo.svg
164+ ├── social
165+ │ ├── facebook.svg
166+ │ └── twitter.svg
167+ └── symbol
168+ └── chevron
169+ ├── left.svg
170+ └── right.svg
171+ ```
172+
173+ Running ` fantasticon ./icons -o dist ` will generate a font-set with the following Icon IDs / CSS selectors:
174+ And the generated icon IDs would be:
175+
176+ | Icon ID | CSS selector |
177+ | ---------------------- | ---------------------------- |
178+ | ` social-facebook ` | ` .icon.icon-social-facebook ` |
179+ | ` social-twitter ` | ` .icon.icon-social-twitter ` |
180+ | ` symbol-chevron-left ` | ` .icon.icon-chevron-left ` |
181+ | ` symbol-chevron-right ` | ` .icon.icon-chevron-right ` |
182+
153183### Contribute
154184
155185PRs are always welcome. If you need help questions, want to bounce ideas or just say hi, [ join the Discord channel] ( https://discord.gg/BXAY3Kc3mp ) .
You can’t perform that action at this time.
0 commit comments