HTML validator displays errors for news in OPAC. I used HTMML validator 0.9.5.8 for Firefox. 1) nested p-Tag like <tbody><tr><td><p><p>This is the text...</p></p> (...) This is because opac-main.tt encloses the news text with a p tag. This is not necessary since the News editor delivers HTML formatted text. To test: Create news with just on line. Display in OPAC and test with HTML validator or check page source code. 2) multiple thead in same table if you have more than one news To test: Create multiple news for OPAC. HTML validator will complain about multiple thead tags in same table. This is not allowed, see: www.w3.org/TR/html-markup/table.html#table
Created attachment 31333 [details] [review] Bug 12863 - News in OPAC: HTML broken with nested p tags and multiple thead in same table This patch fixes broken HTML in OPAC news by replacing table display with divs. To test: Create multiple news for OPAC Validate with HTML validator or check source code Result: Error with nested p tags Table header thead is repeated for every news (not allowed) Bonus testing: Let a screen reader like NVDA read the news and try to understand it with closed eyes. Apply patch Result: No more HTML errors in news Screen reader reads news properly To style you can use classes newscontainer, newsitem, newsheader, newsbody and newsfooter.
Setting to P4 since HTML is broken and accessibiliy by screen readers affected.
Created attachment 31394 [details] [review] [SIGNED-OFF] Bug 12863 - News in OPAC: HTML broken with nested p tags and multiple thead in same table This patch fixes broken HTML in OPAC news by replacing table display with divs. To test: Create multiple news for OPAC Validate with HTML validator or check source code Result: Error with nested p tags Table header thead is repeated for every news (not allowed) Bonus testing: Let a screen reader like NVDA read the news and try to understand it with closed eyes. Apply patch Result: No more HTML errors in news Screen reader reads news properly To style you can use classes newscontainer, newsitem, newsheader, newsbody and newsfooter. Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Created attachment 31395 [details] [review] Bug 12863 [LESS follow-up] News in OPAC: HTML broken with nested p tags and multiple thead in same table This follow-up modifies the LESS file to add style to the new markup to match the previous markup. A subsequent patch will include the revised and compiled CSS.
Created attachment 31396 [details] [review] Bug 12863 [CSS follow-up] News in OPAC: HTML broken with nested p tags and multiple thead in same table This patch contains the revised and compiled CSS which will style the OPAC's new news markup to match the previous version. To test, apply the patch and clear your browser cache if necessary. View news in the OPAC and confirm that it is styled like it was before the patch making markup changes.
Created attachment 31398 [details] [review] Bug 12863 [LESS follow-up] News in OPAC: HTML broken with nested p tags and multiple thead in same table This follow-up modifies the LESS file to add style to the new markup to match the previous markup. A subsequent patch will include the revised and compiled CSS. Signed-off-by: Marc Véron <veron@veron.ch>
Created attachment 31399 [details] [review] [Signed-off] Bug 12863 [CSS follow-up] News in OPAC: HTML broken with nested p tags and multiple thead in same table This patch contains the revised and compiled CSS which will style the OPAC's new news markup to match the previous version. To test, apply the patch and clear your browser cache if necessary. View news in the OPAC and confirm that it is styled like it was before the patch making markup changes. CSS patch behaves as expected. Thanks to Owen for adding this. Signed-off-by: Marc Véron <veron@veron.ch>
Created attachment 31443 [details] [review] [PASSED QA] Bug 12863 - News in OPAC: HTML broken with nested p tags and multiple thead in same table This patch fixes broken HTML in OPAC news by replacing table display with divs. To test: Create multiple news for OPAC Validate with HTML validator or check source code Result: Error with nested p tags Table header thead is repeated for every news (not allowed) Bonus testing: Let a screen reader like NVDA read the news and try to understand it with closed eyes. Apply patch Result: No more HTML errors in news Screen reader reads news properly To style you can use classes newscontainer, newsitem, newsheader, newsbody and newsfooter. Signed-off-by: Owen Leonard <oleonard@myacpl.org> Signed-off-by: Katrin Fischer <Katrin.Fischer.83@web.de> Works as described, passes tests and QA script.
Created attachment 31444 [details] [review] [PASSED QA] Bug 12863 [LESS follow-up] News in OPAC: HTML broken with nested p tags and multiple thead in same table This follow-up modifies the LESS file to add style to the new markup to match the previous markup. A subsequent patch will include the revised and compiled CSS. Signed-off-by: Marc Véron <veron@veron.ch> Signed-off-by: Katrin Fischer <Katrin.Fischer.83@web.de>
Created attachment 31445 [details] [review] [PASSED QA] Bug 12863 [CSS follow-up] News in OPAC: HTML broken with nested p tags and multiple thead in same table This patch contains the revised and compiled CSS which will style the OPAC's new news markup to match the previous version. To test, apply the patch and clear your browser cache if necessary. View news in the OPAC and confirm that it is styled like it was before the patch making markup changes. CSS patch behaves as expected. Thanks to Owen for adding this. Signed-off-by: Marc Véron <veron@veron.ch> Signed-off-by: Katrin Fischer <Katrin.Fischer.83@web.de>
Patches pushed to master. Thanks Marc!