Quick and easy way to recolor the icons/visualization is a few minutes.

Discussion in 'C-Bus Automation Controllers' started by CABrouwes, Feb 6, 2021.

  1. CABrouwes

    CABrouwes

    Joined:
    Apr 25, 2009
    Messages:
    86
    Likes Received:
    2
    Location:
    New York Area
    I started looking at automating the recoloring of the wiser icons, and I ended up developing a free web app to recolor any collection of SVG icons in a few clicks. With it you can recolor the wiser icons in minutes.

    Here is the procedure:

    1. On your computer, download a backup of the wiser. This will create a .tar.gz file.
    2. Convert the .tar.gz into a .zip file (for example, using https://www.zamzar.com/)
    3. Upload the .zip file on the site http://svg.cab63.com
    4. Recolor the collection. It can be as simple as selecting one icon, clicking on the green color in the mapping window, and choosing a new color. All the icons will be recolored. However, much more complex remappings are possible.
    5. Export the new recolored icons. This will create a zip file. Expand the zip file.
    6. Open the zip from step 2 and delete the "icons" folder and replace it with the "icons" folder created at step 5.
    7. Conver the .zip back to a .tar.gz file (https://www.zamzar.com)
    8. Upload it back onto the wiser.
    If you are using SVGs as backgrounds or images, they will also be converted, and you will find them in a folder called "img". If all your images and background are also SVGs, you can wipe out and replace the folder at step 6 (like the "icons" folder). However, if you are using a mix of image formats, the app will only recolor and save the SVGs, and you will need to delete and replace these SVGs individually in the "img" folder to avoid deleting the other images.

    Of course, this procedure will only address the color of the icons, the other colors displayed by the wiser are defined in the CSS file. You will probably want to update the CSS file with the same color as the one you used to recolor the icons.

    If you have feedback or questions, please leave them on here: GitHub
     
    CABrouwes, Feb 6, 2021
    #1
    gte242 likes this.
    1. Advertisements

  2. CABrouwes

    lcrowhurst

    Joined:
    Dec 2, 2004
    Messages:
    231
    Likes Received:
    76
    Location:
    Sydney, NSW, Australia
    this is excellent :)
     
    lcrowhurst, Feb 6, 2021
    #2
    1. Advertisements

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.