Bug 25906 - Style corrections for OPAC serial pages
Summary: Style corrections for OPAC serial pages
Status: RESOLVED FIXED
Alias: None
Product: Koha
Classification: Unclassified
Component: Templates (show other bugs)
Version: master
Hardware: All All
: P5 - low enhancement (vote)
Assignee: Owen Leonard
QA Contact: Testopia
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2020-07-01 08:40 UTC by Timothy Alexis Vass
Modified: 2020-11-30 21:51 UTC (History)
1 user (show)

See Also:
Change sponsored?: ---
Patch complexity: Small patch
Text to go in the release notes:
Version(s) released in:
20.11.00


Attachments
What it currently looks like. (6.43 KB, image/png)
2020-07-01 08:40 UTC, Timothy Alexis Vass
Details
What it should look like. (6.38 KB, image/png)
2020-07-01 08:42 UTC, Timothy Alexis Vass
Details
How it looks in master (16.20 KB, image/png)
2020-07-01 11:11 UTC, Owen Leonard
Details
How it looks in master for me (36.34 KB, image/png)
2020-07-02 06:33 UTC, Timothy Alexis Vass
Details
Bug 25906: Style corrections for OPAC serial pages (6.69 KB, patch)
2020-07-11 14:52 UTC, Owen Leonard
Details | Diff | Splinter Review
Bug 25906: Style corrections for OPAC serial pages (6.81 KB, patch)
2020-08-07 13:38 UTC, Katrin Fischer
Details | Diff | Splinter Review

Note You need to log in before you can comment on or make changes to this bug.
Description Timothy Alexis Vass 2020-07-01 08:40:55 UTC
Created attachment 106447 [details]
What it currently looks like.
Comment 1 Timothy Alexis Vass 2020-07-01 08:42:13 UTC
Created attachment 106448 [details]
What it should look like.
Comment 2 Timothy Alexis Vass 2020-07-01 08:50:48 UTC
1. In linked stylesheet:
#menu form, #search-facets form {
    margin: 0em;
}

Change margin to 1em.

-----

2. In the inline style block:
#search-facets fieldset.action {
    padding-left: 4px;
    margin: .3em;
}

Remove padding-let and margin, set text-align to center.

-----

3. In opac-full-serial-issues:
<select id="libraryfilter" name="libraryfilter" style="width:10em;"></select>

<select id="subscriptionidfilter" name="subscriptionfilter" style="width:10em;" disabled="disabled"></select>

Remove style="width:10em;" from these two elements.
Comment 3 Owen Leonard 2020-07-01 11:11:08 UTC
Created attachment 106449 [details]
How it looks in master

What version are you looking at? What I see in master doesn't match your "What it currently looks like" screenshot.
Comment 4 Timothy Alexis Vass 2020-07-02 06:33:49 UTC
Created attachment 106459 [details]
How it looks in master for me

Indeed my branch was behind by 466 commits.
I have now pulled origin/master and this is what I currently have:

root@9972e03d5da8:koha(master)$ git log
commit d3f0fc135b0b73b7dcf7fee09ca30a42e2e514a3
Author: Julian Maurice <julian.maurice@biblibre.com>
Date:   Mon Jun 29 17:23:35 2020 +0400

Attached is what it looks like for me in Firefox.
Comment 5 Timothy Alexis Vass 2020-07-02 09:55:35 UTC
Looking at your screenshot Owen, it looks nice.

1. I still suggest to remove style="width:10em;" from the two select elements, so that they adapt to the span2 width and so that the elements stay inside the container.

2. I would also like to change the span2 to a span3 so that the space inside makes sense at widths 768px to 1200px.

The .span2 select { width: 100%; } would need to apply for .span3 select too.

3. I also suggest that the Clear-button is centered.
Comment 6 Owen Leonard 2020-07-11 14:52:30 UTC
Created attachment 106785 [details] [review]
Bug 25906: Style corrections for OPAC serial pages

This patch makes some CSS changes to the OPAC SCSS and to the OPAC
"full serial issues" page to improve the style.

I've expanded the in-page CSS on the full serial issues page for
readability and added Template Toolkit's "collapse" filter to remove the
whitespace on rendering.

To test, apply the patch and rebuild the OPAC CSS
(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client)

- Locate a serial record in the OPAC.
- Click "More details" to view the issues page.
- Confirm that the "view" tabs look correct, with consistent padding.
- Click the "Full history" tab.
- In the sidebar, the filter should have full-width dropdowns and clear
  button.
Comment 7 Timothy Alexis Vass 2020-08-04 09:46:01 UTC
Looks great in both Firefox and Chrome.
Comment 8 Katrin Fischer 2020-08-07 13:38:04 UTC
Created attachment 107965 [details] [review]
Bug 25906: Style corrections for OPAC serial pages

This patch makes some CSS changes to the OPAC SCSS and to the OPAC
"full serial issues" page to improve the style.

I've expanded the in-page CSS on the full serial issues page for
readability and added Template Toolkit's "collapse" filter to remove the
whitespace on rendering.

To test, apply the patch and rebuild the OPAC CSS
(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client)

- Locate a serial record in the OPAC.
- Click "More details" to view the issues page.
- Confirm that the "view" tabs look correct, with consistent padding.
- Click the "Full history" tab.
- In the sidebar, the filter should have full-width dropdowns and clear
  button.

Signed-off-by: Timothy Alexis Vass <timothy_alexis.vass@ub.lu.se>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Comment 9 Katrin Fischer 2020-08-07 13:38:32 UTC
(15:32:29) cait: TimothyAlexis: should I add your sign-off line to bug 25906?
(15:33:05) TimothyAlexis: Sure

And so I did it :)
Comment 10 Jonathan Druart 2020-08-13 05:57:33 UTC
Pushed to master for 20.11, thanks to everybody involved!
Comment 11 Lucas Gass 2020-08-17 15:23:48 UTC
enhancement will not be backported to 20.05.x