From 8a5e2eff7e3b6853df8e51c8b9892f4f14888186 Mon Sep 17 00:00:00 2001 From: Owen Leonard Date: Wed, 1 Sep 2021 12:12:04 +0000 Subject: [PATCH] Bug 28934: Correct markup of GDPR consent in OPAC patron entry This patch makes changes to the markup around the GDPR consent checkbox in the OPAC self-registration / update page to make it more consistent with other form fields on the page. The patch also adds some missing attributes which are required to enable JavaScript validation of the checkbox. 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). - Go to Administration -> System preferences and Enable the system preference PatronSelfRegistration. - Set the system preference GDPR_Policy to "Enforce". - Go to the OPAC and click the "Register here" link. - Under the "GDPR consent" heading near the bottom of the page, confirm that the "I agree" checkbox lines up with other form fields on the page, and that the "Required" label lines up below it. - Submit the form without checking the GDPR consent checkbox. - The form should not be submitted, and a "This field is required" message should appear next to the checkbox label. --- .../bootstrap/css/src/_responsive.scss | 14 ++++++ .../opac-tmpl/bootstrap/css/src/opac.scss | 48 +++++++------------ .../bootstrap/en/modules/opac-memberentry.tt | 10 ++-- 3 files changed, 39 insertions(+), 33 deletions(-) diff --git a/koha-tmpl/opac-tmpl/bootstrap/css/src/_responsive.scss b/koha-tmpl/opac-tmpl/bootstrap/css/src/_responsive.scss index ad2013e717..d2ec036f06 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/css/src/_responsive.scss +++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/_responsive.scss @@ -95,6 +95,14 @@ li { padding-bottom: .5em; + + &.lradio { + padding-left: 0; + + label { + text-align: left; + } + } } ol { @@ -200,6 +208,12 @@ text-align: center; } + .required_label { + &.required { + margin: 0; + } + } + #searchsubmit { font-weight: bold; } diff --git a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss index c665cfea5d..11d718c06d 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss +++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss @@ -642,17 +642,15 @@ th { } } -div { - &.required_label { - display: none; +.required_label { + display: none; - &.required { - color: #C00; - display: block; - font-size: 95%; - margin-left: 10rem; - margin-top: 3px; - } + &.required { + color: #C00; + display: block; + font-size: 95%; + margin-left: 10rem; + margin-top: 3px; } } @@ -735,11 +733,6 @@ fieldset { text-align: left; width: auto; } - &.lradio { - float: none; - margin: inherit; - width: auto; - } } fieldset { @@ -750,20 +743,6 @@ fieldset { ol { list-style-type: none; padding: 1em 1em 0 1em; - - &.lradio { - label { - float: none; - margin-right: 0; - width: auto; - - &.lradio { - float: left; - margin-right: 1em; - width: 12em; - } - } - } } li { @@ -774,13 +753,22 @@ fieldset { width: 100%; &.lradio { - padding-left: 8.5em; + padding-left: 9rem; width: auto; label { float: none; margin: 0 0 0 1em; + text-align: left; width: auto; + + &.error { + float: right; + } + } + + .required_label { + margin-left: 1em; } } } diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-memberentry.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-memberentry.tt index 7f1ad4a58a..7d85f167a5 100644 --- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-memberentry.tt +++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-memberentry.tt @@ -957,9 +957,13 @@ -- 2.20.1