There wasn't a designated area for dicussion igDialogs, but with this control why is the header area style set to the hover style? By default the jQuery style doesn't apply this and it causes funky display of colors to appear.
I'm using the redmon theme from Theme Roller but I've changed the hover state to use the colors from the UI Lightness so buttons, igGrid rows are a bit more vibrant on hover. But the igDialog uses the hover style on the header of the dialog which is just wierd. It doesn't look good at all.
Was this intentional? As of right now I've switched back to jQuery to handle dialogs.
Hi Daniel,
Can you provide more information about hover style? Which exactly html element of igDialog uses that style and what exact name of that "hover" class.
The header of igDialog uses classes defined by igDialog.css.header. That has value of "ui-igdialog-header ui-dialog-titlebar ui-widget-header ui-corner-top ui-helper-clearfix".
The header does not process mouse-over and does not take another "hover" style when mouse is moved over it. The only elements, which are affected by mouse-over, are dialog-buttons. The classes used on mouse over are defined by igDialog.css.headerButtonHover which is equals to "ui-igdialog-headerbutton-hover ui-state-hover" and they are added to default class of button when mouse is moved over it.
We are using the redmond style from jQuery.ThemeRoller website. I wanted to add a bit more color to the hover styles, so I combined two themes together. Doing that changed the appearance of the dialog boxes. I've attached the styles that I overwrote in a text file. I really am not a fan of how content gets pasted into these forums.
It still not clear to me how header of igDialog is related to hover styles. If you inspect attributes of html elements used by dialog for header, then you probably will not find any "hover" class/style.
I reverted all of my changes a while back when confronted with this issue, but when the styles I listed above when I made those changes to the CSS file then all of the dialogs were transformed into the orange hover color that the styles above enforces. When I reverted the styles back, then the header background colors went back to the blue. I scratched my head on it plenty of times and the orange color appeared in all browsers.
I believe the CDN version was 2049. I haven't checked it with 2059, becaused as I mentioned I had used jQuery dialogs instead.
If this doesn't help then I don't have any more examples at the moment. I could try to replicate it later on but I don't have the time at the moment.