How to change the colour of a button using Themeify

Get Help
1

What is the problem?

I have the following plugins installed
(See 1 below)

I have opted to use the Dark theme in Themeify and UI Customiser has split my screen into 3.
My Connect/Disconnedt button is Grey as below:
(See 2 Below)

How can I make it look like the Upload button as below - Orange
(See 3 Below)

It should be somewhere here on this screen of Themeify but I don't know how to add the CSS rule / Selector.
(See 4 Below)

Theme5
Theme51080×2063 102 KB

What did you already try to solve it?

N.A

Have you tried running in safe mode?

N/A

Did running in safe mode solve the problem?

N.A

Systeminfo Bundle

You can download this in OctoPrint's System Information dialog ... no bundle, no support!)

N/A

Additional information about your setup

OctoPrint version, OctoPi version, printer, firmware, browser, operating system, ... as much data as possible

N/A

2

In Themeify add custom style, replace the color code with the color you want.
#printer_connect background-color #53fd86

3

Brilliant. Once I figured that I needed to enter the # before the printer_connect.

Just 2 more q please.

Theme6
Theme6850×218 28 KB

Why do some settings have a dot like "accordian" and this "printer_connect" have a # as in the pic above?
How can I find out what settings names are like accordian, printer_connect, navbar_text etc.?

4

It's CSS. # relates to an ID and . is for class. You can find them using the dev tools most browsers have built in.

https://developer.mozilla.org/en-US/docs/Tools/Page_Inspector/How_to/Open_the_Inspector

5

Thanks. Valuable info. :+1: