Changed all icons for svgs #554
Conversation
SergioCasCeb
commented
Jan 5, 2024
SergioCasCeb
commented
- Previously all icons were imported from Font Awesome, so to not depend on such a system anymore all icons have been substituted for SVGS
- Changed the quick use button to a simpler, more obvious variation.
- Changed the quick use button to a simpler, more obvious variation.
…oCasCeb/playground into simpler-user-button-sergio
The console now auto expands when the console is minimized and the user click on one of the console options.
- Previously all icon were been imported from Font Awesome, so in order to not depend on such system anymore all icons have been substituted for svgs
✅ Deploy Preview for thingweb-playground ready!
To edit notification comments on pull requests, go to your Netlify site configuration. |
…ing-console-sergio Auto-expanding the console when clicking on it
|
@egekorkan the thing about having the icons as code, it allows me to change their color dynamically much easier. If I have them as images I have to utilize an extra mask on top of the image in order to change the image's colors. |
|
I can see the reasoning. In that case, we need to have a way to manage them. How do you generate the code? If it is simply by "exporting" from something like inkscape, we should still put the SVG files but not use them in the code but refer to them from the code via comments. Not needing this would be cooler though. |
|
I am getting them from Font Awesome as they also allow you to download the SVGs or copy the code directly. That way the style stays consistent. |
- The button text has been changed from Apply to Load to match the text of the quick use button
- Changed the quick use button to a simpler, more obvious variation.
- Changed the quick use button to a simpler, more obvious variation.
- The button text has been changed from Apply to Load to match the text of the quick use button
…oCasCeb/playground into simpler-user-button-sergio
- Previously all icon were been imported from Font Awesome, so in order to not depend on such system anymore all icons have been substituted for svgs
…rgioCasCeb/playground into changing-icons-to-svgs-sergio
- Rebased the branch to fix the merging conflicts added by the new console functionality
…r-button-sergio Modified quick use button
|
Some small things to do:
|
- Previously all icon were been imported from Font Awesome, so in order to not depend on such system anymore all icons have been substituted for svgs
- Previously all icon were been imported from Font Awesome, so in order to not depend on such system anymore all icons have been substituted for svgs
- Rebased the branch to fix the merging conflicts added by the new console functionality
…rgioCasCeb/playground into changing-icons-to-svgs-sergio
- Previously all icon were been imported from Font Awesome, so in order to not depend on such system anymore all icons have been substituted for svgs
- Previously all icon were been imported from Font Awesome, so in order to not depend on such system anymore all icons have been substituted for svgs
…rgioCasCeb/playground into changing-icons-to-svgs-sergio
- Added all missing attribuutions to svg (html and javascript) - Fixed all merging issues - Fixed style issues due to the merging and the new svgs
|
@egekorkan , I just realized now that it is deployed in Netlify, that when we build the project for production all comments are removed, including those in HTML for the SVG attribution, will this be an issue? If it is we will probably will have to either:
|
Nope, the source code matters as long as the source code is public :) |
|
It is much better now. However, it is still not clear where the inline svgs are copied from so it is difficult to maintain later on. |
If you mean that there is no attribution for those icons specifically, I did add it. But if you mean that just showing that it is from font awesome is not enough then I will still lean towards hosting them ourselves, that way we have all the icons locally, and they can just be added by utilizing their respective classes in an (icon) element. This does add more size to the project, but it also reduces the styling necessary to make sure the svgs show properly and assures a more consistent style/size. |
|
comments are added as expected, merging |
