6 Replies Latest reply on Jun 6, 2008 4:59 PM by qle

    Orion Web Color Schemes

      Is there any chance that a color scheme can be included in the next release of Orion with a dark background to help with the burn in problem on NOC displays?  Despite urban legend about switching to LCD, I can tell you that we have both plasma and LCD displays and run the LCDs at lower brightness because they burn in as well.

        • Re: Orion Web Color Schemes
          qle
          If you're so inclined, you could create your very own style sheet (.CSS) with your own preferences. Just place a copy of it in the following folder:



          [Orion root folder]\WebEngine\Resources



          You could even copy one of the existing style sheets and customize to your liking.
            • Re: Orion Web Color Schemes

              I have done this in the past, for Orion 7.  In Orion 8, the css are more convoluted, and it's a big effort to work out an inverted scheme that's readable.  It always seems that when you get close, some bit of text ends up in black on black and disappears.  I'm sure that some bit of Solarwinds internal documentation shows which css elements are in use for each item on the web pages, which would make it easiest for their developers to whip up a dark background color scheme.

                • Re: Orion Web Color Schemes
                  qle
                  Well, it looks like the global color scheme is located in the globalStyles.css file. Couldn't you copy the elements that specify a font color from that CSS to your own custom CSS file? I'm trying to understand which elements are giving you trouble with a dark background.
                    • Re: Orion Web Color Schemes

                      It's been a while since I tried it.  I will have to try it again and see which elements were the problem.

                      • Re: Orion Web Color Schemes

                        I went back and looked at my notes and some test files from the past.  One of the problems with the black background, which is easy to add into the BODY tag in the globalStyles.css, is that the text settings in BODY are being used in a variety of places.  For example, suppose you construct a view that includes "Nodes with Problems" and "Last 10 Events".  The name of the view, the text "The Following Problems Should Be Investigated", "Last 24 Hours", the text in each of the events, and the date and time at the top are all under the control of COLOR in BODY, which is set to black by default.  That means the view name and date/time are in black on black--gone.  If you change it to white or yellow, then events become white or yellow on pale green/yellow/pink/etc. and are pretty much unreadable.


                        I would have to edit the events.css and add a font color to each of the 50+ event classes I guess.   Then there is still the problem of the link colors, which need to be white in the black areas, but black in the events....

                          • Re: Orion Web Color Schemes
                            qle
                            I just tested it and I see what you mean. However, keep in mind, you want to create a custom CSS and not mess with globalStyles.css, if at all possible. However, I messed around with it a little bit and was able to almost make it workable.



                            What I did was create a custom CSS based off of one of the existing color schemes. With my custom CSS, you can specify the background color and text color in the BODY element just as you explained. You'll also need to create (or copy from globalStyles.css) styles for the A element. This is what I ended up with at the beginning of the custom CSS, which is very basic:




                            body {

                            background-color: white;

                            color: black;

                            }

                            A:link {

                                COLOR: black;

                            }

                            A:visited {

                                COLOR: black;

                            }

                            A:active {

                                COLOR: #b22222;

                            }

                            A:hover {

                                COLOR: red;

                            }




                            With this, it's workable. However, you point out the events list and the events.css file. Unfortunately, it's similar to the globalStyles.css file in the sense that it doesn't change when you choose a different color scheme.

                            Because of this, some of the text in the events list is hard to read with light text. The only workaround I can think of would be to create a custom events.css file that is legible with a light text color. Then you would simply rename the original events.css file and move/copy your custom events.css in its place. Granted, it's not as flexible as selecting the color scheme from the web console but you should only need to do this whenever switching between a light and dark text.