Bug 9003

Summary: Add css fix for opac news items with strong and em
Product: Koha Reporter: David Cook <dcook>
Component: OPACAssignee: David Cook <dcook>
Status: CLOSED FIXED QA Contact: Marcel de Rooy <m.de.rooy>
Severity: minor    
Priority: P5 - low CC: bgkriegel, chris, m.de.rooy
Version: master   
Hardware: All   
OS: All   
Change sponsored?: --- Patch complexity: ---
Documentation contact: Documentation submission:
Text to go in the release notes:
Version(s) released in:
Attachments: Bug 9003 - Add css fix for opac news items with strong and em
Bug 9003 - Add css fix for opac news items with strong and em
Bug 9003 - Add css fix for opac items with strong and em
[SIGNED-OFF] Bug 9003 - Add css fix for opac items with strong and em
Bug 9003 - Add css fix for opac items with strong and em

Description David Cook 2012-10-31 22:25:43 UTC
Currently, if you have nested strong and em tags in Opac News, you will only get the properties of the inner tag, since reset-fonts-grids.css resets the font weight and style (for both strong and em) to normal. 

So if you have em as your inner tag, you'll have italics but reset-fonts-grids.css also makes em have a font-weight of normal, so your strong tag is bypassed.

I suggest adding some css that takes into account this descendant/nested situation, so that users can actually both bold and italicize news items.
Comment 1 David Cook 2012-10-31 22:29:58 UTC Comment hidden (obsolete)
Comment 2 David Cook 2012-10-31 22:51:54 UTC Comment hidden (obsolete)
Comment 3 Owen Leonard 2012-11-07 21:10:44 UTC
This change looks correct to me, but I don't see any reason for you to limit it to #news. Can you please resubmit so that em and strong work well together globally?
Comment 4 David Cook 2013-02-07 05:41:09 UTC Comment hidden (obsolete)
Comment 5 Bernardo Gonzalez Kriegel 2013-02-08 19:06:18 UTC Comment hidden (obsolete)
Comment 6 Marcel de Rooy 2013-03-24 16:26:58 UTC
Created attachment 16833 [details] [review]
Bug 9003 - Add css fix for opac items with strong and em

Currently, if you have nested strong and em tags in the opac, you will only get the properties of the inner tag. This seems to be due to reset-fonts-grids.css resetting the font weight and style (for both strong and em) to normal.

So if you have strong as your outer tag and em as your inner tag, you'll have italics but no bold.

To test:

Before applying the patch...

1) Put <em> and <strong> tags around some text in the opacnav, opac news, opacheader, or any other area of the opac where you can enter html text.
2) Look at the opac and notice that only the inner tag styles are being applied to the text

Apply the patch

3) Refresh the opac (you may need to bypass or clear your browser cache for the new style to pick up)
4) Note that both the inner and outer <em> and <strong> tags are being applied to the text (i.e. your text should be bold and italicized)

Signed-off-by: Bernardo Gonzalez Kriegel <bgkriegel@gmail.com>
Small change that works. No errors.

Signed-off-by: Marcel de Rooy <m.de.rooy@rijksmuseum.nl>
Comment 7 Marcel de Rooy 2013-03-24 16:28:25 UTC
QA Comment: Nothing to say. Very small css change. 
Passed QA
Comment 8 Jared Camins-Esakov 2013-03-30 12:11:56 UTC
This patch (and a follow-up for CCSR) has been pushed to master.
Comment 9 Chris Cormack 2013-03-31 01:33:01 UTC
Pushed to 3.10.x will be in 3.10.5