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

Only show the folder icon if fields are folders

Browse Source
This commit is contained in:
Tom Byers
2019-05-09 11:04:43 +01:00
parent 3dc2130926
commit 1ffa8c8915
3 changed files with 31 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -22,7 +22,7 @@
this.addFooterAndDoneButton(legendText);
// create summary from component pieces and match text to current selection
this.summary.addContent(legendText);
this.summary.addContent(legendText, this.fieldLabel);
this.summary.update(this.getSelection(), this.total, this.fieldLabel);
this.$fieldset.before(this.summary.$el);
@@ -56,7 +56,7 @@
}
}
},
addContent: function(legendText) {
addContent: function(legendText, fieldLabel) {
const $content = $(`<p>
<span class="selection-summary__text"></span>
<button class="button button-secondary">Change<span class="visuallyhidden"> ${legendText}</span></button>
@@ -65,6 +65,8 @@
this.$text = $content.find('.selection-summary__text');
this.$changeButton = $content.find('button');
if (fieldLabel === 'folder') { this.$text.addClass('selection-summary__text--folders'); }
this.$el.append($content);
},
update: function(selection, total, field) {

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

@@ -2,20 +2,23 @@
.selection-summary__text {
display: inline-block;
padding: .526315em .789473em .263157em 40px;
padding-left: 51px;
background-image: file-url('folder-black.svg');
background-repeat: no-repeat;
background-size: 39px auto;
background-position: 0px 4px;
padding: .526315em .789473em .263157em 0px;
&:focus {
outline: none;
}
}
@include ie-lte(8) {
background-image: file-url('folder-blue-bold.png');
.selection-summary__text--folders {
padding-left: 51px;
background-image: file-url('folder-black.svg');
background-repeat: no-repeat;
background-size: 39px auto;
background-position: 0px 4px;
@include ie-lte(8) {
background-image: file-url('folder-blue-bold.png');
}
}
// revert full-width button for smaller screens