[BUG] Main Tab Icons - Unable to Change color

[Ragnar123456]

Description

Have tried several different times to change the color of the main tab icons using the included function. When I click on a color in the color picker, the icon in the popup does change color. However, when I click on the "X" to close the popup the icon on the main tab screen does change to the new color. If I go ahead and save anyway, the main tab icons do not have the color selected in the popup.

I have tried disabling all user installed plugins (except UI Customizer), but the same result continues.

Have also tried it with Firefox 98.0.2 (64-bit) with he same result.

Edit 1: Figured out how to get the color attached to the icon in the main tab. You have to select the color from the color picker first. The icons will then be the selected color. You then click on the colored icon and it is saved as the correct icon and color on the main tab.window.

However, even though the color is shown on the main tab window, when you save and exit UI Customizer, the colorized icons are not shown on the OctoPrint main screen.

Edit 2: After playing around with CSS in the advanced tab of UI Customizer, it would appear that the CSS attribute "!important" needs to be added to override a theme's colors.

---

Plugins installed

• Arc-Welder[arc_welder] v1.0.0+u.bb71e8f
• Bed Visualizer[bedlevelvisualizer] v1.1.1
• Camera Settings[camerasettings] v0.3.2
• Dashboard[dashboard] v1.19.8
• Enclosure Plugin[enclosure] v4.13.2
• FileManager[filemanager] v0.1.6
• HeaterTimeout[HeaterTimeout] v0.0.4
• HomeAssistant Discovery[homeassistant] v3.4.0
• Navbar Temperature Plugin[navbartemp] v0.14
• OctoDash Companion[octodashcompanion] v0.0.7
• OctoEverywhere![octoeverywhere] v1.6.6
• OctoPod Plugin[octopod] v0.3.12
• Preheat Button[preheat] v0.8.0
• PrettyGCode[prettygcode] v1.2.4
• PrintTimeGenius Plugin[PrintTimeGenius] v2.2.8
• Simple Emergency Stop[simpleemergencystop] v1.0.5
• Slicer Thumbnails[prusaslicerthumbnails] v1.0.0
• UI Customizer[uicustomizer] v0.1.8.9

UI Customizer settings

• addWebCamZoom: false
• centerTopIcons: true
• compactMenu: false
• compressTempControls: true
• disableTermInactive: true
• filesFullHeight: true
• fixedFooter: true
• fixedHeader: true
• fluidLayout: true
• gcodeFullWidth: false
• hideGraphBackground: true
• hideMainCam: false
• mainTabsCustomize: true
• navbarplugintempfix: true
• responsiveMode: true
• saveAccordions: false
• themeLocal: false

Software versions

• OctoPrint 1.7.3
• Python 3.7.3
• OctoPi 0.18.0

Browser

• Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.4 Safari/605.1.15

[LazeMSS]

I will look ASAP

[LazeMSS]

@Ragnar123456 which theme is overwriting the color icons - the color is set on the icon so the important should not be needed unless a theme is overwriting it

[LazeMSS]

Did a bit of improvement to the logic of the UI...

[Ragnar123456]

I am currently using the Discorded theme. I just went through testing all of the themes. All respect the icon colors except Discorded and Red Night.

[LazeMSS]

Thanks will check

[LazeMSS]

Fixed in: https://github.com/LazeMSS/OctoPrint-UICustomizerThemes/releases/tag/0.2.9.6