darkhelm/notifications-admin
1
0
Fork 0
mirror of https://github.com/GSA/notifications-admin.git synced 2026-06-06 14:30:57 -04:00
Code Issues Packages Projects Releases Wiki Activity

Update buttons for collapsible checkboxes

Browse Source 
We use collapsible checkboxes when setting which folders team members
can see (on the manage folder page and on the edit team member page).
This commit is contained in:
Katie Smith
2020-02-05 11:57:43 +00:00
parent ba8ac41953
commit 4e42fa6f5d
3 changed files with 19 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/assets/javascripts/collapsibleCheckboxes.js
View File

@@ -62,7 +62,7 @@
return $(`<div class="selection-footer${stickyClass}">
<button
class="button button-secondary"
class="govuk-button govuk-button--secondary selection-footer__button"
aria-expanded="${expanded ? 'true' : 'false'}"
aria-controls="${this.fieldsetId}">
${buttonContent}
@@ -159,7 +159,7 @@
CollapsibleCheckboxes.prototype.bindEvents = function() {
const self = this;
this.$formGroup.on('click', '.button', this.handleClick.bind(this));
this.$formGroup.on('click', '.govuk-button', this.handleClick.bind(this));
this.$checkboxes.on('click', this.handleSelection.bind(this));
this.summary.bindEvents(this);

18
app/assets/stylesheets/components/checkboxes.scss
View File

@@ -18,14 +18,6 @@
background-position: 0px 4px;
}
// revert full-width button for smaller screens
.button {
display: inline-block;
width: auto;
position: relative;
top: 1px;
}
}
.checkboxes-nested {
@@ -83,12 +75,12 @@
.selection-footer {
clear: both;
}
.button-secondary {
// revert full-width button for smaller screens
display: inline-block;
width: auto;
}
.selection-footer__button {
// revert full-width button for smaller screens
display: inline-block;
width: auto;
}
// styles specific to the collapsible checkboxes module