${this.selectionStatus.selected(1)}
diff --git a/app/assets/sass/uswds/_uswds-theme-custom-styles.scss b/app/assets/sass/uswds/_uswds-theme-custom-styles.scss
index ec5d97b0f..3a6a43dd0 100644
--- a/app/assets/sass/uswds/_uswds-theme-custom-styles.scss
+++ b/app/assets/sass/uswds/_uswds-theme-custom-styles.scss
@@ -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);
+ }
+}
diff --git a/gulpfile.js b/gulpfile.js
index 8bc1aeb45..4d9689be0 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -108,7 +108,6 @@ const javascripts = () => {
paths.src + 'javascripts/govuk/cookie-functions.js',
paths.src + 'javascripts/consent.js',
paths.src + 'javascripts/cookieMessage.js',
- paths.src + 'javascripts/stick-to-window-when-scrolling.js',
paths.src + 'javascripts/copyToClipboard.js',
paths.src + 'javascripts/autofocus.js',
paths.src + 'javascripts/enhancedTextbox.js',
diff --git a/tests/javascripts/templateFolderForm.test.js b/tests/javascripts/templateFolderForm.test.js
index df1a9770c..98a12f2ab 100644
--- a/tests/javascripts/templateFolderForm.test.js
+++ b/tests/javascripts/templateFolderForm.test.js
@@ -299,20 +299,6 @@ describe('TemplateFolderForm', () => {
});
- test("should make the current controls sticky", () => {
-
- // the class the sticky JS hooks into should be present
- expect(formControls.querySelector('#nothing_selected .js-stick-at-bottom-when-scrolling')).not.toBeNull();
-
- // .recalculate should have been called so the sticky JS picks up the controls
- expect(GOVUK.stickAtBottomWhenScrolling.recalculate.mock.calls.length).toEqual(1);
-
- // mode should have been set to 'default' as the controls only have one part
- expect(GOVUK.stickAtBottomWhenScrolling.setMode.mock.calls.length).toEqual(1);
- expect(GOVUK.stickAtBottomWhenScrolling.setMode.mock.calls[0][0]).toEqual('default');
-
- });
-
});
describe("Click 'New template' for single channel service", () => {
@@ -421,20 +407,6 @@ describe('TemplateFolderForm', () => {
});
- test("should make the current controls sticky", () => {
-
- // the classes the sticky JS hooks into should be present for both parts
- expect(formControls.querySelectorAll('#add_new_template_form .js-stick-at-bottom-when-scrolling').length).toEqual(2);
-
- // .recalculate should have been called so the sticky JS picks up the controls
- expect(GOVUK.stickAtBottomWhenScrolling.recalculate.mock.calls.length).toEqual(1);
-
- // the mode should be set to 'dialog' so both parts can be sticky
- expect(GOVUK.stickAtBottomWhenScrolling.setMode.mock.calls.length).toEqual(1);
- expect(GOVUK.stickAtBottomWhenScrolling.setMode.mock.calls[0][0]).toEqual('dialog');
-
- });
-
describe("When the 'Cancel' link is clicked after choosing to add a new template", () => {
let addNewTemplateButton;
@@ -533,17 +505,13 @@ describe('TemplateFolderForm', () => {
});
- test("should make the current controls sticky", () => {
+ test("", () => {
// the class the sticky JS hooks into should be present
expect(formControls.querySelector('#add_new_folder_form .js-stick-at-bottom-when-scrolling')).not.toBeNull();
// .recalculate should have been called so the sticky JS picks up the controls
- expect(GOVUK.stickAtBottomWhenScrolling.recalculate.mock.calls.length).toEqual(1);
-
- // mode should have been set to 'default' as the controls only have one part
- expect(GOVUK.stickAtBottomWhenScrolling.setMode.mock.calls.length).toEqual(1);
- expect(GOVUK.stickAtBottomWhenScrolling.setMode.mock.calls[0][0]).toEqual('default');
+ expect(GOVUK.stickAtBottomWhenScrolling.recalculate.mock.calls.length).toEqual(0);
});
@@ -607,20 +575,6 @@ describe('TemplateFolderForm', () => {
});
- test("should make the current controls sticky", () => {
-
- // the class the sticky JS hooks into should be present
- expect(formControls.querySelector('#items_selected .js-stick-at-bottom-when-scrolling')).not.toBeNull();
-
- // .recalculate should have been called so the sticky JS picks up the controls
- expect(GOVUK.stickAtBottomWhenScrolling.recalculate.mock.calls.length).toEqual(1);
-
- // mode should have been set to 'default' as the controls only have one part
- expect(GOVUK.stickAtBottomWhenScrolling.setMode.mock.calls.length).toEqual(1);
- expect(GOVUK.stickAtBottomWhenScrolling.setMode.mock.calls[0][0]).toEqual('default');
-
- });
-
describe("'Clear selection' link", () => {
let clearLink;
@@ -755,20 +709,6 @@ describe('TemplateFolderForm', () => {
});
- test("should make the current controls sticky", () => {
-
- // the classes the sticky JS hooks into should be present for both parts
- expect(formControls.querySelectorAll('#move_to_folder_radios .js-stick-at-bottom-when-scrolling').length).toEqual(2);
-
- // .recalculate should have been called so the sticky JS picks up the controls
- expect(GOVUK.stickAtBottomWhenScrolling.recalculate.mock.calls.length).toEqual(1);
-
- // the mode should be set to 'dialog' so both parts can be sticky
- expect(GOVUK.stickAtBottomWhenScrolling.setMode.mock.calls.length).toEqual(1);
- expect(GOVUK.stickAtBottomWhenScrolling.setMode.mock.calls[0][0]).toEqual('dialog');
-
- });
-
describe("When the 'Cancel' link is clicked after choosing to move a template or folder", () => {
let moveToFolderButton;
@@ -857,20 +797,6 @@ describe('TemplateFolderForm', () => {
});
- test("should make the current controls sticky", () => {
-
- // the class the sticky JS hooks into should be present
- expect(formControls.querySelector('#move_to_new_folder_form .js-stick-at-bottom-when-scrolling')).not.toBeNull();
-
- // .recalculate should have been called so the sticky JS picks up the controls
- expect(GOVUK.stickAtBottomWhenScrolling.recalculate.mock.calls.length).toEqual(1);
-
- // mode should have been set to 'default' as the controls only have one part
- expect(GOVUK.stickAtBottomWhenScrolling.setMode.mock.calls.length).toEqual(1);
- expect(GOVUK.stickAtBottomWhenScrolling.setMode.mock.calls[0][0]).toEqual('default');
-
- });
-
describe("When the 'Cancel' link is clicked after choosing to add a template or folder to a new folder", () => {
let moveToNewFolderButton;