Icons page #34
Icons page #34
Conversation
|
🤔 I don't know about adding something new to At least we can simply add the icons into Also if we are using FontAwesome or any icon library out of our stack, we will still have this empty page... I think it's not as recurrent as the colors. |
|
Maybe a lead is to add to the generator default styles and markup if they are choosing the SVG icon option. 🤔 |
|
|
||
| return ( | ||
| <div className="tlbx-icon-wrapper" key={key} title={key}> | ||
| <svg className="tlbx-icon"><use xlink="http://www.w3.org/1999/xlink" xlinkHref={`#icon-${key}`} /></svg> |
There was a problem hiding this comment.
We can use the Icon component to keep this logic in one place
| @@ -16,6 +16,7 @@ import SingleFull from '../../views/Single/SingleFull'; | |||
| import SinglePage from '../../views/Single/SinglePage'; | |||
| import Doc from '../../views/Doc/Doc'; | |||
| import Colors from '../../views/Colors/Colors'; | |||
| import Icons from '../../views/Icons/Icons'; | |||
There was a problem hiding this comment.
Icons will be a bit confusing with components/Icon/Icon and components/Icon/Icons...
| return ( | ||
| <div className="tlbx-grid"> | ||
| {Object.keys(icons).map((key) => { | ||
| const icon = icons[key]; |
There was a problem hiding this comment.
No need of a variable for so little and only one usage 😉
| super(); | ||
|
|
||
| this.state = { | ||
| icons: window.icons, |
There was a problem hiding this comment.
Maybe we can add this logic in a proper Redux collection if it usefull somewhere else.
I have created a page with a table of all icons in the project!
We need to update the
toolbox-utilstask to generate the window variables:This example uses the icons from Toolbox ;)