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

Merge pull request #622 from GSA/616-remove-sticky-position

Browse Source 
616 remove sticky position
This commit is contained in:
Carlo Costino
2023-07-14 10:57:59 -04:00
committed by GitHub
parent 508bba6510 bbc03d2ddb
commit c34439976e
5 changed files with 42 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
app/assets/javascripts/main.js
View File

@@ -9,9 +9,6 @@ if (window.GOVUK.hasConsentFor('analytics', consentData)) {
$(() => $("time.timeago").timeago());
$(() => GOVUK.stickAtTopWhenScrolling.init());
$(() => GOVUK.stickAtBottomWhenScrolling.init());
var showHideContent = new GOVUK.ShowHideContent();
showHideContent.init();

23
app/assets/javascripts/templateFolderForm.js
View File

@@ -285,9 +285,6 @@
if (['move-to-existing-folder', 'add-new-template'].indexOf(this.currentState) !== -1) {
mode = 'dialog';
}
GOVUK.stickAtBottomWhenScrolling.setMode(mode);
// make sticky JS recalculate its cache of the element's position
GOVUK.stickAtBottomWhenScrolling.recalculate();
if (currentStateObj && ('setFocus' in currentStateObj)) {
scrollTop = $(window).scrollTop();
@@ -299,10 +296,12 @@
this.nothingSelectedButtons = $(`
<div id="nothing_selected">
<div class="js-stick-at-bottom-when-scrolling">
<button class="usa-button usa-button--event" value="add-new-template" aria-expanded="false">
New template
</button>
<button class="usa-button usa-button--event" value="add-new-folder" aria-expanded="false">New folder</button>
<div class="usa-button-group">
<button class="usa-button usa-button--event" value="add-new-template" aria-expanded="false">
New template
</button>
<button class="usa-button usa-button--event" value="add-new-folder" aria-expanded="false">New folder</button>
</div>
<div class="template-list-selected-counter">
<span class="template-list-selected-counter__count" aria-hidden="true">
${this.selectionStatus.default}
@@ -315,10 +314,12 @@
this.itemsSelectedButtons = $(`
<div id="items_selected">
<div class="js-stick-at-bottom-when-scrolling">
<button class="usa-button usa-button--event" value="move-to-existing-folder" aria-expanded="false">
Move<span class="usa-sr-only"> selection to folder</span>
</button>
<button class="usa-button usa-button--event" value="move-to-new-folder" aria-expanded="false">Add to new folder</button>
<div class="usa-button-group">
<button class="usa-button usa-button--event" value="move-to-existing-folder" aria-expanded="false">
Move<span class="usa-sr-only"> selection to folder</span>
</button>
<button class="usa-button usa-button--event" value="move-to-new-folder" aria-expanded="false">Add to new folder</button>
</div>
<div class="template-list-selected-counter" aria-hidden="true">
<span class="template-list-selected-counter__count" aria-hidden="true">
${this.selectionStatus.selected(1)}

28
app/assets/sass/uswds/_uswds-theme-custom-styles.scss
View File

@@ -195,3 +195,31 @@ td.table-empty-message {
border: 1px solid color("gray-60");
}
}
.usa-hint {
display: block;
}
.js-stick-at-bottom-when-scrolling {
margin: 0 0 units(5);
padding: units(2) 0;
display: flex;
align-items: center;
justify-content: space-between;
overflow: visible;
button {
margin-right: units(2);
}
.template-list-selected-counter {
position: relative;
top: 0;
}
}
.sticky-template-form {
margin: 0;
padding: 0;
&:focus {
outline-offset: units(1);
}
}