Bug 31747

Summary: Round corners in boxes
Product: Koha Reporter: Tomás Cohen Arazi <tomascohen>
Component: Staff interfaceAssignee: Martin Renvoize <martin.renvoize>
Status: CLOSED FIXED QA Contact: Katrin Fischer <katrin.fischer>
Severity: minor    
Priority: P5 - low CC: gmcharlt, lucas, martin.renvoize, oleonard
Version: Main   
Hardware: All   
OS: All   
Change sponsored?: --- Patch complexity: Trivial patch
Documentation contact: Documentation submission:
Text to go in the release notes:
Version(s) released in:
22.11.00
Bug Depends on: 30952    
Bug Blocks: 31762, 31815    
Attachments: Screenshot
Bug 31747: Give area-news box new staff design look
Bug 31747: Use page-section class, reduce CSS
Bug 31747: Use page-section class, reduce CSS
Bug 31747: Give area-news box new staff design look
Bug 31747: Use page-section class, reduce CSS
Bug 31747: Give area-news box new staff design look
Bug 31747: Use page-section class, reduce CSS

Description Tomás Cohen Arazi 2022-10-12 19:31:43 UTC
After bug 30952, the 'news' boxes have round corners and even a shadow (that is maybe too thick).

But other boxes like on the patron details, or the main admin page you have square corners. The style should be a little more consistent.
Comment 1 Tomás Cohen Arazi 2022-10-12 19:32:26 UTC
Created attachment 141751 [details]
Screenshot
Comment 2 Lucas Gass 2022-10-12 22:13:03 UTC
Created attachment 141755 [details] [review]
Bug 31747: Give area-news box new staff design look

To test:
1. Apply patch
2. Regenerate staff CSS ( https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_interface )
3. Look at the #area-news element of the mainpage.
4. There should be no rounded corners and the box-shadow should be the same as seen elsewhere ( i.e. patron details page )
Comment 3 Martin Renvoize 2022-10-13 09:41:04 UTC
I think we should look to start reducing our specific css..

This seems a good case for that.. I'd add a 'page-section' class to the divs with 'area-news' id (Note "divs".. we should probably fix that whilst we're here and update the 'daily_quote' section to have it's own unique id.

Then we can reduce the 'area-news' specific css to just 'color' as that's all that's not dealt with by 'page-section' already.

Thoughts?
Comment 4 Martin Renvoize 2022-10-13 09:52:04 UTC Comment hidden (obsolete)
Comment 5 Martin Renvoize 2022-10-13 09:53:20 UTC
Let me know what you think of my follow-up that tries to achieve the above...

I'm really keen to reduce our CSS footprint.. instead of targetting lots of individual elements I want to start using shared classes more so we can really improve consistency accross the board.
Comment 6 Martin Renvoize 2022-10-13 09:57:26 UTC
Created attachment 141790 [details] [review]
Bug 31747: Use page-section class, reduce CSS
Comment 7 Lucas Gass 2022-10-13 16:22:36 UTC
(In reply to Martin Renvoize from comment #5)
> Let me know what you think of my follow-up that tries to achieve the above...
> 
> I'm really keen to reduce our CSS footprint.. instead of targetting lots of
> individual elements I want to start using shared classes more so we can
> really improve consistency accross the board.

I like it, less is more. :)
Comment 8 Lucas Gass 2022-10-13 16:23:30 UTC
Created attachment 141832 [details] [review]
Bug 31747: Give area-news box new staff design look

To test:
1. Apply patch
2. Regenerate staff CSS ( https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_interface )
3. Look at the #area-news element of the mainpage.
4. There should be no rounded corners and the box-shadow should be the same as seen elsewhere ( i.e. patron details page )

Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>
Comment 9 Lucas Gass 2022-10-13 16:23:34 UTC
Created attachment 141833 [details] [review]
Bug 31747: Use page-section class, reduce CSS

Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>
Comment 10 Katrin Fischer 2022-10-15 08:43:31 UTC
There are still rounded corners on .tab-content, like we see on the advanced search with the item type search - I've 31815 filed bug for those.
Comment 11 Katrin Fischer 2022-10-15 08:45:24 UTC
Created attachment 141921 [details] [review]
Bug 31747: Give area-news box new staff design look

To test:
1. Apply patch
2. Regenerate staff CSS ( https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_interface )
3. Look at the #area-news element of the mainpage.
4. There should be no rounded corners and the box-shadow should be the same as seen elsewhere ( i.e. patron details page )

Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Comment 12 Katrin Fischer 2022-10-15 08:45:29 UTC
Created attachment 141922 [details] [review]
Bug 31747: Use page-section class, reduce CSS

Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Comment 13 Tomás Cohen Arazi 2022-10-17 11:08:27 UTC
Pushed to master for 22.11.

Nice work everyone, thanks!