Bug 11042 - Color issue for selected tab under search box
Summary: Color issue for selected tab under search box
Status: CLOSED MOVED
Alias: None
Product: Koha
Classification: Unclassified
Component: Staff interface (show other bugs)
Version: 3.12
Hardware: All All
: P5 - low enhancement
Assignee: Ketan Kulkarni
QA Contact: Testopia
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2013-10-11 19:48 UTC by Shane Sammons
Modified: 2014-11-29 09:13 UTC (History)
4 users (show)

See Also:
Change sponsored?: ---
Patch complexity: ---
Documentation contact:
Documentation submission:
Text to go in the release notes:
Version(s) released in:
Circulation function:

Attachments
Image of color issue & element inspector. (64.15 KB, image/png)
2013-10-11 19:48 UTC, Shane Sammons 		Details
Updated staff-global.css (1.34 KB, patch)
2013-10-26 04:21 UTC, Ketan Kulkarni 		Details | Diff | Splinter Review
Bug 11042: Updated staff global.css so that it does not override rules in custom.css (1.75 KB, patch)
2014-01-15 16:06 UTC, Jonathan Druart 		Details | Diff | Splinter Review
Show Obsolete (1) View All Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
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.