Bug 11042

Summary: Color issue for selected tab under search box
Product: Koha Reporter: Shane Sammons <ssammons>
Component: Staff interfaceAssignee: Ketan Kulkarni <ketan>
Status: CLOSED MOVED QA Contact: Testopia <testopia>
Severity: enhancement    
Priority: P5 - low CC: gmcharlt, jonathan.druart, katrin.fischer, ketan, oleonard
Version: 3.12   
Hardware: All   
OS: All   
See Also: http://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=11570
Change sponsored?: --- Patch complexity: ---
Documentation contact: Documentation submission:
Text to go in the release notes:
Version(s) released in:
Attachments: Image of color issue & element inspector.
Updated staff-global.css
Bug 11042: Updated staff global.css so that it does not override rules in custom.css

Description Shane Sammons 2013-10-11 19:48:55 UTC
Created attachment 21975 [details]
Image of color issue & element inspector.

When trying to customize colors for the staff/admin area you will encounter a color code marked with !important in the CSS staff-global.css.

Upon copying the CSS code block and making changes to the color, the staff-global.css color will over ride your select, even with important left on the color statement.

Examples:
****My Custom Code:****

#header_search ul.ui-tabs-nav li.ui-tabs-selected {
background-color: #FFFFF1;
border: 1px solid #800000; !important;
border-top: 0 !important;
top: -1px;
}

****staff-global.css code****

#header_search ul.ui-tabs-nav li.ui-tabs-selected {
    background-color : #FFFFF1;
    border: 1px solid #85CA11 !important;
    border-top: 0 !important; top: -1px;
}


Notes:
I am using the Home › Administration › System preferences > intranetcolorstylesheet option for the CSS file to put my code it. 

Coding is done via SSH on the system level to my file called custom-login.css.

I think the solution is just to remove the !important; statement off the code.
Comment 1 Ketan Kulkarni 2013-10-26 04:21:42 UTC Comment hidden (obsolete)
Comment 2 Jonathan Druart 2014-01-15 16:06:36 UTC
Created attachment 24411 [details] [review]
Bug 11042: Updated staff global.css so that it does not override rules in custom.css

Test plan:
put
\#header_search ul.ui-tabs-nav li.ui-tabs-selected {
  background-color: #FFFFF1;
  border: 1px solid #800000; !important;
  border-top: 0 !important;
  top: -1px;
}
in the pref IntranetUserCSS.

Go on the intranet main page.
Look at the borders of the selected tab in the search header.
They should be burgundy-coloured.

Signed-off-by: Jonathan Druart <jonathan.druart@biblibre.com>
Comment 3 Jonathan Druart 2014-01-15 16:09:18 UTC
Owen, do you agree with this patch?
Comment 4 Owen Leonard 2014-01-15 20:36:09 UTC
I don't find that this patch solves the problem completely: The tab border color only changes on the sides, not on the bottom.

Am I not seeing what you're seeing Jonathan?

Removing instances of !important is a good goal in general, and I note that the latest version of jQueryUI doesn't have the same use of !important that 1.8.23 has. The real solution to this bug may be an upgrade to jQueryUI.
Comment 5 Jonathan Druart 2014-03-27 11:39:38 UTC
I confirm this is fixed by bug 11570.