@@ -, +, @@ - Hover the mouse over the patron image. - If the patron has a previously-defined patron image, should you see an "Edit" button appear. Clicking the button should display a modal dialog titled "Edit patron image." Test that the "Upload," "Delete," and "Cancel" buttons work correctly. - If a patron has no patron image defined, you should see an "Add" button appear. Clicking the button should display a modal dialog titled "Edit patron image." Test that the "Upload," "Delete," and "Cancel" buttons work correctly. --- .../intranet-tmpl/prog/css/staff-global.css | 53 +++++++++++++++---- .../prog/en/includes/circ-menu.inc | 53 +++++++++++++------ .../intranet-tmpl/prog/js/members-menu.js | 15 ++++++ 3 files changed, 95 insertions(+), 26 deletions(-) --- a/koha-tmpl/intranet-tmpl/prog/css/staff-global.css +++ a/koha-tmpl/intranet-tmpl/prog/css/staff-global.css @@ -567,22 +567,53 @@ div.patroninfo ul li { list-style-type : none; } -#patronbasics div { - background: transparent url("../img/patron-blank.min.svg") 10px 5px no-repeat; - border: 1px solid #CCCCCC; +/* Patron images */ + +.patroninfo > div { + border-right: 1px solid #b9d8d9; + width: 100%; +} + +.patronimage-container { + padding: .2em; + position: relative; +} + +.patronimage { + opacity: 1; + display: block; + max-width: 160px; + transition: .2s ease; +} + +.patronimage.empty { + background: transparent url("../img/patron-blank.min.svg") center 5px no-repeat; height: 125px; margin: .3em 0 .3em .3em; padding: 0; - width: 105px; + width: 80%; } -#patronimage { - border: 1px solid #CCCCCC; - max-width : 140px; - margin: .3em 0 .3em .3em; - padding: .2em; - width:auto !important; - width:130px; +.patronimage-controls { + transition: .5s ease; + opacity: 0; + position: absolute; + top: 80%; + left: 50%; + transform: translate(-50%, -50%); + text-align: center; +} + +.patronimage-container:hover .patronimage { + opacity: 0.8; +} + +.patronimage-container:hover .patronimage-controls { + opacity: 1; +} + +.patronimage-control { + padding: 1em 2em; } div.patronviews { --- a/koha-tmpl/intranet-tmpl/prog/en/includes/circ-menu.inc +++ a/koha-tmpl/intranet-tmpl/prog/en/includes/circ-menu.inc @@ -1,22 +1,26 @@ [% USE Koha %] [% IF ( patron.borrowernumber ) %]