diff --git a/src/Employer/Employer.Web/wwwroot/css/application.css b/src/Employer/Employer.Web/wwwroot/css/application.css
index 63cc7a52c8..cebda53708 100644
--- a/src/Employer/Employer.Web/wwwroot/css/application.css
+++ b/src/Employer/Employer.Web/wwwroot/css/application.css
@@ -953,390 +953,445 @@ a[rel="external"]:hover:after {
}
/*** end of search ***/
-/*cookie banner*/
-#global-cookie-message {
- background: none;
- padding: 0;
-}
-
- #global-cookie-message p {
- margin: 0 0 5px;
- font-size: 16px;
- }
-
-@media (min-width: 40.0625em) {
- #global-cookie-message p {
- font-size: 19px;
- }
-}
-
-.govuk-button {
- font-family: "nta", Arial, sans-serif;
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
- font-weight: 400;
- font-size: 16px;
- line-height: 1.1875;
- box-sizing: border-box;
- display: inline-block;
- position: relative;
- width: 100%;
- margin-top: 0;
- margin-bottom: 22px;
- padding: 7px 10px;
- border: 2px solid transparent;
- border-radius: 0;
- color: #ffffff;
- background-color: #00823b;
- box-shadow: 0 2px 0 #003418;
- text-align: center;
- vertical-align: top;
- cursor: pointer;
- -webkit-appearance: none;
-}
-
-@media print {
- .govuk-button {
- font-family: sans-serif;
- }
-}
-
-@media (min-width: 40.0625em) {
- .govuk-button {
- font-size: 19px;
- line-height: 1;
- }
-}
-
-@media print {
- .govuk-button {
- font-size: 14pt;
- line-height: 19px;
- }
-}
-
-.govuk-button:focus {
- outline: 3px solid #ffbf47;
- outline-offset: 0;
-}
-
-@media (min-width: 40.0625em) {
- .govuk-button {
- margin-bottom: 32px;
- }
-}
-
-@media (min-width: 40.0625em) {
- .govuk-button {
- width: auto;
- }
-}
-
-.govuk-button:link, .govuk-button:visited, .govuk-button:active, .govuk-button:hover {
- color: #ffffff;
- text-decoration: none;
-}
-
-.govuk-button::-moz-focus-inner {
- padding: 0;
- border: 0;
-}
-
-.govuk-button:hover, .govuk-button:focus {
- background-color: #00682f;
-}
-
-.govuk-button:active {
- top: 2px;
- box-shadow: none;
-}
-
-.govuk-button::before {
- content: "";
- display: block;
- position: absolute;
- top: -2px;
- right: -2px;
- bottom: -4px;
- left: -2px;
- background: transparent;
-}
-
-.govuk-button:active::before {
- top: -4px;
-}
-
-.govuk-width-container {
- max-width: 960px;
- margin: 0 15px;
-}
-@media (min-width: 40.0625em) {
- .govuk-width-container {
- margin: 0 30px;
- }
-}
+/* Cookie Banner */
-@media (min-width: 1020px) {
- .govuk-width-container {
- margin: 0 auto;
- }
-}
-
-.das-button--outline {
- border-color: #00823b;
- color: #00823b;
- background-color: #fff;
- box-shadow: 0 2px 0 #00823b;
-}
-
- .das-button--outline, .das-button--outline:link, .das-button--outline:visited, .das-button--outline:active, .das-button--outline:hover {
- color: #00823b;
- }
-
- .das-button--outline:hover, .das-button--outline:focus {
- background: #f8f8f8;
- color: #00823b;
- }
-
-.js-enabled #global-cookie-message {
- display: none;
-}
.das-cookie-banner {
- font-family: "nta", Arial, sans-serif;
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
- font-size: 14px;
- font-size: 0.875rem;
- line-height: 1.14286;
- background-color: #fff;
- border: 2px solid #0b0c0c;
- padding: 15px 0;
- box-sizing: border-box;
- width: 100%;
- position: relative;
- z-index: 2;
-}
-
-@media print {
+ display: none;
+ font-family: nta,Arial,sans-serif;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ font-size: 14px;
+ font-size: 0.875rem;
+ line-height: 1.14286;
+ padding: 15px 0;
+ box-sizing: border-box;
+ width: 100%;
+ position: relative;
+ z-index: 2;
+ background: #f3f2f1;
+ border: none; }
+ @media print {
.das-cookie-banner {
- font-family: sans-serif;
- }
-}
-
-@media (min-width: 40.0625em) {
+ font-family: sans-serif; } }
+ @media (min-width: 40.0625em) {
.das-cookie-banner {
- font-size: 16px;
- font-size: 1rem;
- line-height: 1.25;
- }
-}
-
-@media print {
+ font-size: 16px;
+ font-size: 1rem;
+ line-height: 1.25; } }
+ @media print {
.das-cookie-banner {
- font-size: 14pt;
- line-height: 1.2;
- }
-}
+ font-size: 14pt;
+ line-height: 1.2; } }
+ @media (min-width: 40.0625em) {
+ .das-cookie-banner {
+ padding: 20px 0; } }
.das-cookie-banner__header {
- color: #00823b;
- margin-bottom: .3em;
- display: none;
-}
+ margin-top: 0;
+ margin-bottom: 20px;
+ display: block;
+ color: #0b0c0c; }
.das-cookie-banner__message {
- display: inline-block;
- margin-top: 0;
- margin-bottom: 5px;
- padding-right: 20px;
- padding-bottom: 10px;
- color: #00823b;
-}
-
-@media (min-width: 48.0625em) {
+ display: inline-block;
+ margin-top: 0;
+ margin-bottom: 5px;
+ padding-right: 20px;
+ padding-bottom: 10px;
+ color: #0b0c0c; }
+ @media (min-width: 48.0625em) {
.das-cookie-banner__message {
- margin: 0;
- }
-}
+ margin: 0;
+ font-size: 19px; } }
+
+.das-cookie-banner__service-name {
+ display: inline-block; }
-.das-cookie-banner__buttons:after {
+.das-cookie-banner__buttons {
+ display: block; }
+ .das-cookie-banner__buttons:after {
content: "";
display: block;
- clear: both;
-}
-
-@media (min-width: 20em) {
+ clear: both; }
+ @media (min-width: 40.0625em) {
.das-cookie-banner__buttons {
- margin: 0 -5px;
- }
-}
-
-@media (min-width: 48.0625em) {
+ margin: 0 -10px; } }
+ @media (min-width: 48.0625em) {
.das-cookie-banner__buttons {
- display: inline-block;
- padding-top: 5px;
- }
-}
+ padding-bottom: 10px; } }
.das-cookie-banner__button-wrap {
- margin-bottom: 5px;
- vertical-align: top;
-}
-
-@media (min-width: 20em) {
- .das-cookie-banner__button-wrap {
- width: 50%;
- float: left;
- padding: 0 5px;
- box-sizing: border-box;
- }
-}
-
-@media (min-width: 48.0625em) {
+ margin-top: 10px;
+ vertical-align: top;
+ float: none;
+ width: 100%; }
+ @media (min-width: 40.0625em) {
.das-cookie-banner__button-wrap {
- float: none;
- width: auto;
- display: inline-block;
- vertical-align: baseline;
- }
-}
+ width: 50%;
+ float: left;
+ padding: 0 10px;
+ box-sizing: border-box; } }
.das-cookie-banner__button {
- margin: 0;
- width: 100%;
-}
-
-@media (min-width: 48.0625em) {
+ margin: 0;
+ width: 100%; }
+ @media (min-width: 48.0625em) {
.das-cookie-banner__button {
- vertical-align: baseline;
- }
-}
+ vertical-align: baseline; } }
.das-cookie-banner__confirmation {
- display: none;
-}
+ position: relative;
+ padding: 5px;
+ display: none; }
-.das-cookie-banner__hide-button {
- font-family: "nta", Arial, sans-serif;
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
- font-size: 16px;
- line-height: 1.25;
- outline: 0;
- border: 0;
- background: none;
- text-decoration: underline;
- color: #005ea5;
- padding: 0;
- margin-top: 10px;
- cursor: pointer;
-}
+.das-cookie-banner__confirmation-message {
+ margin: 0; }
-@media print {
+.das-cookie-banner__hide-button {
+ font-family: nta,Arial,sans-serif;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ font-size: 16px;
+ font-size: 1rem;
+ line-height: 1.25;
+ outline: 0;
+ border: 0;
+ background: none;
+ text-decoration: underline;
+ color: #005ea5;
+ padding: 0;
+ margin-top: 10px;
+ cursor: pointer; }
+ @media print {
.das-cookie-banner__hide-button {
- font-family: sans-serif;
- }
-}
-
-@media (min-width: 40.0625em) {
+ font-family: sans-serif; } }
+ @media (min-width: 40.0625em) {
.das-cookie-banner__hide-button {
- font-size: 19px;
- font-size: 1.1875rem;
- line-height: 1.31579;
- }
-}
-
-@media print {
+ font-size: 19px;
+ font-size: 1.1875rem;
+ line-height: 1.31579; } }
+ @media print {
.das-cookie-banner__hide-button {
- font-size: 14pt;
- line-height: 1.15;
- }
-}
-
-.das-cookie-banner__hide-button:hover {
- color: #2b8cc4;
-}
-
-.das-cookie-banner__hide-button:focus {
+ font-size: 14pt;
+ line-height: 1.15; } }
+ .das-cookie-banner__hide-button:hover {
+ color: #005ea5; }
+ .das-cookie-banner__hide-button:focus {
color: #0b0c0c;
background: #ffbf47;
- outline: 3px solid #ffbf47;
-}
-
-@media (min-width: 48.0625em) {
+ outline: 3px solid #ffbf47; }
+ @media (min-width: 48.0625em) {
.das-cookie-banner__hide-button {
- position: absolute;
- right: 5px;
- top: 5px;
- margin: 0;
- }
-}
+ position: absolute;
+ right: 5px;
+ top: 5px;
+ margin: 0; } }
-/* Modal variation */
-#global-cookie-message.global-cookie-message--modal {
- z-index: 10;
-}
+.das-cookie-settings__confirmation {
+ display: none; }
-@media (min-width: 48.0625em) {
- #global-cookie-message.global-cookie-message--modal {
- position: fixed;
- width: 40%;
- left: 30%;
- top: 50%;
- margin-top: -150px;
- }
- .global-cookie-message--modal .das-cookie-banner {
- padding: 30px 0;
- }
+
- .global-cookie-message--modal .das-cookie-banner__button-wrap {
- width: 100%;
- }
-}
+/* DAS Employer header and navigation */
-@media (min-width: 63.75em) {
- .global-cookie-message--modal .das-cookie-banner {
- padding: 30px;
- }
+.das-account-header {
+ font-family: nta,Arial,sans-serif;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ font-weight: 400;
+ font-size: 16px;
+ font-size: 1rem;
+ line-height: 1.25;
+ color: #fff;
+ padding: 5px 0; }
+ @media print {
+ .das-account-header {
+ font-family: sans-serif; } }
+ @media (min-width: 40.0625em) {
+ .das-account-header {
+ font-size: 19px;
+ font-size: 1.1875rem;
+ line-height: 1.31579; } }
+ @media print {
+ .das-account-header {
+ font-size: 14pt;
+ line-height: 1.15; } }
+ @media (min-width: 40.0625em) {
+ .das-account-header {
+ padding: 0; } }
+ .das-account-header > .govuk-width-container:after {
+ content: "";
+ display: block;
+ clear: both; }
+
+.das-account-header--provider {
+ background: #f47738; }
+
+.das-account-header--employer {
+ background: #6f72af; }
+
+.das-account-header__title {
+ margin: 0 -15px;
+ padding: 10px 15px;
+ font-weight: 700; }
+ @media (min-width: 40.0625em) {
+ .das-account-header__title {
+ float: left;
+ padding: 8px 15px; } }
+
+.das-account__title {
+ font-weight: 400;
+ color: #6f777b;
+ margin-bottom: 5px; }
+ @media (min-width: 40.0625em) {
+ .das-account__title {
+ margin-bottom: 0; } }
+
+.das-account__account-name {
+ margin: 0;
+ word-wrap: break-word;
+ word-break: break-all;
+ word-break: break-word;
+ max-width: 100%; }
+ @media (min-width: 48.0625em) {
+ .das-account__account-name {
+ font-size: 48px; } }
+
+.das-navigation {
+ color: #0b0c0c;
+ font-family: nta,Arial,sans-serif;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ font-weight: 400;
+ font-size: 16px;
+ font-size: 1rem;
+ line-height: 1.25;
+ border-bottom: 1px solid #6f777b; }
+ @media print {
+ .das-navigation {
+ color: #000000; } }
+ @media print {
+ .das-navigation {
+ font-family: sans-serif; } }
+ @media (min-width: 40.0625em) {
+ .das-navigation {
+ font-size: 19px;
+ font-size: 1.1875rem;
+ line-height: 1.31579; } }
+ @media print {
+ .das-navigation {
+ font-size: 14pt;
+ line-height: 1.15; } }
+
+.das-navigation__list {
+ list-style: none;
+ padding: 0;
+ margin: 0 -15px;
+ position: relative; }
+ .das-navigation__list:after {
+ content: "";
+ display: block;
+ clear: both; }
- .global-cookie-message--modal .das-cookie-banner__button-wrap {
- width: auto;
- }
-}
+.das-navigation__list-item {
+ float: left; }
-.global-cookie-message--modal:before {
- content: '';
- width: 100%;
- height: 100%;
- position: fixed;
- background: rgba(0, 0, 0, 0.4);
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- z-index: 1;
-}
+.das-navigation__link {
+ display: block;
+ padding: 10px 15px 8px;
+ color: #005ea5;
+ display: block; }
+ .das-navigation__link:focus {
+ outline: 3px solid #ffbf47;
+ outline-offset: 0; }
+ @media (min-width: 40.0625em) {
+ .das-navigation__link {
+ display: inline-block; } }
-.global-cookie-message--modal .das-cookie-banner__header {
+.das-navigation__link--current {
+ position: relative;
+ text-decoration: none;
+ font-weight: 700;
+ color: #0b0c0c; }
+ .das-navigation__link--current:after {
+ background: #005ea5;
+ bottom: -1px;
+ content: "";
display: block;
- margin-top: 0;
-}
+ left: 0;
+ top: 0;
+ width: 5px;
+ position: absolute;
+ z-index: 0; }
+ @media (min-width: 40.0625em) {
+ .das-navigation__link--current:after {
+ top: auto;
+ bottom: 0;
+ left: 15px;
+ right: 15px;
+ width: auto;
+ height: 5px; } }
+
+.das-navigation__priority-list {
+ background: #ccc;
+ list-style: none;
+ padding-left: 0;
+ clear: both; }
+ .das-navigation__priority-list > .das-navigation__list-item {
+ width: 100%;
+ border-top: 1px solid #ccc; }
-.global-cookie-message--modal .das-cookie-banner__hide-button {
- position: relative;
- top: auto;
- left: auto;
- margin-top: 15px;
-}
+.das-navigation__priority-button {
+ display: block;
+ padding: 10px 15px 8px;
+ padding-right: 35px;
+ color: #005ea5;
+ position: absolute;
+ top: 0;
+ right: 0; }
+ .das-navigation__priority-button:focus {
+ outline: 3px solid #ffbf47;
+ outline-offset: 0; }
+ .das-navigation__priority-button:after {
+ position: absolute;
+ right: 15px;
+ top: 17px;
+ border-color: transparent;
+ border-width: 10px;
+ border-style: solid;
+ width: 0;
+ height: 0;
+ content: "";
+ border-width: 10px 5.77367px 0 5.77367px;
+ border-color: #005ea5 transparent transparent transparent; }
+ .das-navigation__priority-button.open:after {
+ top: 15px;
+ border-color: transparent;
+ border-width: 10px;
+ border-style: solid;
+ width: 0;
+ height: 0;
+ content: "";
+ border-width: 0 5.77367px 10px 5.77367px;
+ border-color: transparent transparent #005ea5 transparent; }
-.das-cookie-settings__confirmation {
- display: none;
-}
-.js-enabled .das-cookie-settings__no-js {
- display: none;
-}
\ No newline at end of file
+ .das-user-navigation {
+ margin: 0 -15px; }
+ @media (min-width: 40.0625em) {
+ .das-user-navigation {
+ float: right; } }
+
+ .das-user-navigation__list {
+ list-style: none;
+ padding: 0;
+ margin: 0; }
+
+ @media (min-width: 40.0625em) {
+ .das-user-navigation__list-item {
+ float: left;
+ position: relative; } }
+
+ .das-user-navigation__link {
+ color: #fff;
+ text-decoration: none;
+ display: block;
+ padding: 10px 15px;
+ font-size: 16px;
+ border: 1px solid transparent; }
+ .das-user-navigation__link:focus {
+ outline: 3px solid #ffbf47;
+ outline-offset: 0; }
+ .das-user-navigation__link:hover {
+ text-decoration: underline; }
+ .das-user-navigation__list-item--has-sub-menu .das-user-navigation__link {
+ padding-right: 32px;
+ position: relative; }
+ .das-user-navigation__list-item--has-sub-menu .das-user-navigation__link:after {
+ position: absolute;
+ right: 15px;
+ top: 17px;
+ border-color: transparent;
+ border-width: 8px;
+ border-style: solid;
+ width: 0;
+ height: 0;
+ content: "";
+ border-width: 8px 4.61894px 0 4.61894px;
+ border-color: #fff transparent transparent transparent; }
+ @media (min-width: 40.0625em) {
+ .govuk-header .das-user-navigation__list-item--has-sub-menu .das-user-navigation__link:after {
+ top: 20px; } }
+ .das-user-navigation__sub-menu--open .das-user-navigation__link:after {
+ top: 15px;
+ border-color: transparent;
+ border-width: 8px;
+ border-style: solid;
+ width: 0;
+ height: 0;
+ content: "";
+ border-width: 0 4.61894px 8px 4.61894px;
+ border-color: transparent transparent #005ea5 transparent; }
+ @media (min-width: 40.0625em) {
+ .govuk-header .das-user-navigation__sub-menu--open .das-user-navigation__link:after {
+ top: 18px; } }
+ @media (min-width: 40.0625em) {
+ .govuk-header .das-user-navigation__link {
+ position: relative;
+ margin-top: -10px;
+ padding-top: 15px;
+ padding-bottom: 15px; } }
+
+ .das-user-navigation__sub-menu {
+ background: #6f777b;
+ list-style: none;
+ padding: 10px;
+ margin: 0;
+ z-index: 1; }
+ @media (min-width: 48.0625em) {
+ .das-user-navigation__sub-menu {
+ position: absolute;
+ top: 100%;
+ right: 0;
+ padding: 10px 20px;
+ background: #fff;
+ margin-top: -1px;
+ border: 1px solid #bfc1c3; } }
+
+ @media (min-width: 48.0625em) {
+ .das-user-navigation__sub-menu-list-item {
+ border-bottom: 1px solid #bfc1c3; }
+ .das-user-navigation__sub-menu-list-item:last-child {
+ border-bottom: none; } }
+
+ .das-user-navigation__sub-menu-link {
+ color: #fff;
+ text-decoration: none;
+ display: block;
+ padding: 8px 15px;
+ font-size: 15px; }
+ .das-user-navigation__sub-menu-link:focus {
+ outline: 3px solid #ffbf47;
+ outline-offset: 0; }
+ .das-user-navigation__sub-menu-link:hover {
+ text-decoration: underline; }
+ @media (min-width: 48.0625em) {
+ .das-user-navigation__sub-menu-link {
+ color: #005ea5;
+ text-decoration: underline;
+ white-space: nowrap;
+ font-size: inherit;
+ margin: 0 -15px;
+ padding: 10px 15px; } }
+
+ .das-user-navigation__sub-menu--open > a {
+ background: #fff;
+ color: #005ea5;
+ position: relative;
+ z-index: 2;
+ border: 1px solid #bfc1c3;
+ border-bottom: 1px solid #fff; }
\ No newline at end of file
diff --git a/src/Employer/Employer.Web/wwwroot/javascripts/application.js b/src/Employer/Employer.Web/wwwroot/javascripts/application.js
index 5e7f7f51f0..d487d5fabd 100644
--- a/src/Employer/Employer.Web/wwwroot/javascripts/application.js
+++ b/src/Employer/Employer.Web/wwwroot/javascripts/application.js
@@ -1,71 +1,115 @@
-// Legacy JavaScript from DAS
-var sfa;
-sfa = sfa || {};
-//Floating menus
-sfa.navigation = {
- elems: {
- userNav: $("nav#user-nav > ul"),
- levyNav: $("ul#global-nav-links")
- },
- init: function() {
- this.setupMenus(this.elems.userNav);
- this.setupEvents(this.elems.userNav)
- },
- setupMenus: function(n) {
- n.find("ul").addClass("js-hidden").attr("aria-hidden", "true")
- },
- setupEvents: function(n) {
- var t = this;
- n.find("li.has-sub-menu > a").on("click", function(n) {
- var i = $(this);
- t.toggleMenu(i, i.next("ul"));
- n.stopPropagation();
- n.preventDefault()
- });
- n.find("li.has-sub-menu > ul > li > a").on("focusout", function() {
- var n = $(this);
- $(this).parent().is(":last-child") && t.toggleMenu(n, n.next("ul"))
- })
- },
- toggleMenu: function(n, t) {
- var i = n.parent();
- i.hasClass("open") ? (i.removeClass("open"),
- t.addClass("js-hidden").attr("aria-hidden", "true")) : (this.closeAllOpenMenus(),
- i.addClass("open"),
- t.removeClass("js-hidden").attr("aria-hidden", "false"))
- },
- closeAllOpenMenus: function() {
- this.elems.userNav.find("li.has-sub-menu.open").removeClass("open").find("ul").addClass("js-hidden").attr("aria-hidden", "true");
- this.elems.levyNav.find("li.open").removeClass("open").addClass("js-hidden").attr("aria-hidden", "true")
- },
- linkSettings: function() {
- var n = $("a#link-settings")
- , t = this;
- this.toggleUserMenu();
- n.attr("aria-hidden", "false");
- n.on("click touchstart", function(n) {
- var i = $(this).attr("href");
- $(this).toggleClass("open");
- t.toggleUserMenu();
- n.preventDefault()
- })
- },
- toggleUserMenu: function() {
- var n = this.elems.userNav.parent();
- n.hasClass("close") ? n.removeClass("close").attr("aria-hidden", "false") : n.addClass("close").attr("aria-hidden", "true")
- }
+var navLinksContainer = document.getElementsByClassName('das-navigation__list');
+var navLinksListItems = document.getElementsByClassName('das-navigation__list-item');
+var availableSpace, currentVisibleLinks, numOfVisibleItems, requiredSpace, currentHiddenLinks;
+var totalSpace = 0;
+var breakWidths = [];
+
+var addMenuButton = function () {
+ var priorityLi = $('
').addClass('das-navigation__priority-list-item govuk-visually-hidden').attr('id', 'priority-list-menu');
+ var priorityUl = $('
').addClass('das-navigation__priority-list govuk-visually-hidden');
+ var priorityBut = $('
')
+ .addClass('das-navigation__priority-button')
+ .attr('href', '#')
+ .text('More')
+ .on('click', function(e) {
+ $(menuLinksContainer).toggleClass('govuk-visually-hidden');
+ $(this).toggleClass('open');
+ e.preventDefault();
+ });
+ priorityLi.append(priorityBut, priorityUl).appendTo($(navLinksContainer).eq(0));
+ return priorityUl;
};
-//Legacy floating header script
-$(window).scroll(function () {
- if ($(window).scrollTop() >= 110) {
- $('.floating-menu').addClass('fixed-header');
- $('.js-float').addClass('width-adjust');
+var checkSpaceForPriorityLinks = function () {
+ availableSpace = navLinksContainer[0].offsetWidth - 80;
+ currentVisibleLinks = document.querySelectorAll('.das-navigation__list > .das-navigation__list-item');
+ currentHiddenLinks = document.querySelectorAll('.das-navigation__priority-list > .das-navigation__list-item');
+ numOfVisibleItems = currentVisibleLinks.length;
+ requiredSpace = breakWidths[numOfVisibleItems - 1];
+
+ if (requiredSpace > availableSpace) {
+ numOfVisibleItems -= 1;
+ var lastVisibleLink = currentVisibleLinks[numOfVisibleItems];
+ menuLinksContainer[0].insertBefore(lastVisibleLink, menuLinksContainer[0].childNodes[0]);
+ $('#priority-list-menu').removeClass('govuk-visually-hidden');
+ checkSpaceForPriorityLinks();
+ } else if (availableSpace > breakWidths[numOfVisibleItems]) {
+ if (currentHiddenLinks.length > 0) {
+ var firstLink = currentHiddenLinks[0];
+ var priorityListItem = document.getElementsByClassName('das-navigation__priority-list-item');
+ navLinksContainer[0].insertBefore(firstLink, priorityListItem[0])
+ if (currentHiddenLinks.length === 1) {
+ $('#priority-list-menu').addClass('govuk-visually-hidden');
+ }
}
- else {
- $('.floating-menu').removeClass('fixed-header');
- $('.js-float').removeClass('width-adjust');
+ numOfVisibleItems += 1;
+ }
+};
+
+if (navLinksContainer.length > 0) {
+ var menuLinksContainer = addMenuButton();
+ for (var i = 0; i < navLinksListItems.length; i++) {
+ var width = navLinksListItems[i].offsetWidth;
+ totalSpace += width;
+ breakWidths.push(totalSpace);
+ }
+ checkSpaceForPriorityLinks();
+}
+
+$(window).resize(function() {
+ if (navLinksContainer.length > 0)
+ checkSpaceForPriorityLinks();
+});
+
+var dasJs = dasJs || {};
+
+dasJs.userNavigation = {
+ elems: {
+ settingsMenu: $('#das-user-navigation > ul')
+ },
+ init: function () {
+ this.setupMenus(this.elems.settingsMenu);
+ this.setupEvents(this.elems.settingsMenu);
+ },
+ setupMenus: function (menu) {
+ menu.find('ul').attr("aria-expanded", "false");
+ },
+ setupEvents: function (menu) {
+ var that = this;
+ var subMenuLi = menu.find('li.das-user-navigation__list-item--has-sub-menu');
+ subMenuLi.find('> a').on('click', function (e) {
+ var $that = $(this);
+ that.toggleMenu($that, $that.next('ul'));
+ e.stopPropagation();
+ e.preventDefault();
+ });
+ },
+ toggleMenu: function (link, subMenu) {
+ var $li = link.parent();
+ if ($li.hasClass("das-user-navigation__sub-menu--open")) {
+ $li.removeClass("das-user-navigation__sub-menu--open");
+ subMenu.addClass("js-hidden").attr("aria-expanded", "false");
+ } else {
+ this.closeAllOpenMenus();
+ $li.addClass("das-user-navigation__sub-menu--open");
+ subMenu.removeClass("js-hidden").attr("aria-expanded", "true");
}
+ },
+ closeAllOpenMenus: function () {
+ $('li.das-user-navigation__list-item--has-sub-menu').each(function () {
+ var listItem = $(this);
+ var subMenu = $(this).children('ul');
+ var openClass = 'das-user-navigation__sub-menu--open';
+ if (listItem.hasClass(openClass)) {
+ listItem.removeClass(openClass);
+ subMenu.addClass("js-hidden").attr("aria-expanded", "false");
+ }
+ });
+ }
+}
+
+$(document).click(function() {
+ dasJs.userNavigation.closeAllOpenMenus();
});
/* -----------------------
@@ -224,9 +268,9 @@ function setEditorMaxLength(element, tinyMceEditor) {
}
$(function () {
- //Legacy menu script
- sfa.navigation.init();
- $('ul#global-nav-links').collapsableNav();
+ if ($('#das-user-navigation')) {
+ dasJs.userNavigation.init();
+ }
// Dirty forms handling
$('form').areYouSure();
//handle anchor clicks to account for floating menu
diff --git a/src/Employer/Employer.Web/wwwroot/javascripts/cookiebanner.js b/src/Employer/Employer.Web/wwwroot/javascripts/cookiebanner.js
index 3697deb33a..8b54e30d44 100644
--- a/src/Employer/Employer.Web/wwwroot/javascripts/cookiebanner.js
+++ b/src/Employer/Employer.Web/wwwroot/javascripts/cookiebanner.js
@@ -1,292 +1,161 @@
-// used by the cookie banner component
-
-(function (root) {
- 'use strict'
- window.GOVUK = window.GOVUK || {}
-
- var DEFAULT_COOKIE_CONSENT = {
- 'AnalyticsConsent': 'true',
- 'MarketingConsent': 'false'
- }
-
- window.GOVUK.cookie = function (name, value, options) {
- if (typeof value !== 'undefined') {
- if (value === false || value === null) {
- return window.GOVUK.setCookie(name, '', { days: -1 })
- } else {
- // Default expiry date of 30 days
- if (typeof options === 'undefined') {
- options = { days: 30 }
- }
- return window.GOVUK.setCookie(name, value, options)
+function CookieBanner (module) {
+ this.module = module;
+ this.settings = {
+ seenCookieName: 'DASSeenCookieMessage',
+ env: window.GOVUK.getEnv(),
+ cookiePolicy: {
+ AnalyticsConsent: false
}
- } else {
- return window.GOVUK.getCookie(name)
}
- }
-
- window.GOVUK.approveAllCookieTypes = function () {
- Object.keys(DEFAULT_COOKIE_CONSENT).forEach(function (cookie) {
- window.GOVUK.setCookie(cookie, DEFAULT_COOKIE_CONSENT[cookie], {days: 365})
- });
- }
-
- window.GOVUK.getConsentCookie = function () {
- var consentCookie = window.GOVUK.cookie('cookie_policy')
- var consentCookieObj
-
- if (consentCookie) {
- try {
- consentCookieObj = JSON.parse(consentCookie)
- } catch (err) {
- return null
- }
-
- if (typeof consentCookieObj !== 'object' && consentCookieObj !== null) {
- consentCookieObj = JSON.parse(consentCookieObj)
- }
- } else {
- return null
+ if ( !window.GOVUK.cookie(this.settings.seenCookieName + this.settings.env) ) {
+ this.start()
}
-
- return consentCookieObj
}
-
- window.GOVUK.setConsentCookie = function (options) {
- var cookieConsent = window.GOVUK.getConsentCookie()
-
- if (!cookieConsent) {
- cookieConsent = JSON.parse(JSON.stringify(DEFAULT_COOKIE_CONSENT))
+
+ CookieBanner.prototype.start = function () {
+ this.module.cookieBanner = this.module.querySelector('.das-cookie-banner')
+ this.module.cookieBannerInnerWrap = this.module.querySelector('.das-cookie-banner__wrapper')
+ this.module.cookieBannerConfirmationMessage = this.module.querySelector('.das-cookie-banner__confirmation')
+ this.setupCookieMessage()
+ }
+
+ CookieBanner.prototype.setupCookieMessage = function () {
+ this.module.hideLink = this.module.querySelector('button[data-hide-cookie-banner]')
+ this.module.acceptCookiesButton = this.module.querySelector('button[data-accept-cookies]')
+
+ if (this.module.hideLink) {
+ this.module.hideLink.addEventListener('click', this.hideCookieBanner.bind(this))
}
-
- for (var cookieType in options) {
- cookieConsent[cookieType] = options[cookieType]
-
- // Delete cookies of that type if consent being set to false
- if (!options[cookieType]) {
- for (var cookie in COOKIE_CATEGORIES) {
- if (COOKIE_CATEGORIES[cookie] === cookieType) {
- window.GOVUK.cookie(cookie, null)
-
- if (window.GOVUK.cookie(cookie)) {
-
- document.cookie = cookie + '=;expires=' + new Date() + ';domain=.' + window.GOVUK.getDomain() + ';path=/'
- }
- }
- }
- }
+
+ if (this.module.acceptCookiesButton) {
+ this.module.acceptCookiesButton.addEventListener('click', this.acceptAllCookies.bind(this))
}
-
- window.GOVUK.setCookie('cookie_policy', JSON.stringify(cookieConsent), { days: 365 })
+ this.showCookieBanner()
}
-
- window.GOVUK.setCookie = function (name, value, options) {
-
- if (typeof options === 'undefined') {
- options = {}
- }
- var cookieString = name + '=' + value + '; path=/'
-
- if (options.days) {
- var date = new Date()
- date.setTime(date.getTime() + (options.days * 24 * 60 * 60 * 1000))
- cookieString = cookieString + '; expires=' + date.toGMTString()
- }
-
- if (document.location.protocol === 'https:') {
- cookieString = cookieString + '; Secure'
- }
-
- document.cookie = cookieString + ';domain=.' + window.GOVUK.getDomain()
+
+ CookieBanner.prototype.showCookieBanner = function () {
+ var cookiePolicy = this.settings.cookiePolicy,
+ that = this;
+ this.module.cookieBanner.style.display = 'block';
+
+ // Create the default cookies based on settings
+ Object.keys(cookiePolicy).forEach(function (cookieName) {
+ window.GOVUK.cookie(cookieName + that.settings.env, cookiePolicy[cookieName].toString(), { days: 365 })
+ });
+
}
-
- window.GOVUK.getCookie = function (name) {
- var nameEQ = name + '='
- var cookies = document.cookie.split(';')
- for (var i = 0, len = cookies.length; i < len; i++) {
- var cookie = cookies[i]
- while (cookie.charAt(0) === ' ') {
- cookie = cookie.substring(1, cookie.length)
- }
- if (cookie.indexOf(nameEQ) === 0) {
- return decodeURIComponent(cookie.substring(nameEQ.length))
- }
- }
- return null
+
+ CookieBanner.prototype.hideCookieBanner = function () {
+ this.module.cookieBanner.style.display = 'none';
+ window.GOVUK.cookie(this.settings.seenCookieName + this.settings.env, true, { days: 365 })
}
-
- window.GOVUK.getDomain = function () {
- return window.location.hostname !== 'localhost'
- ? window.location.hostname.slice(window.location.hostname.indexOf('.') + 1)
- : window.location.hostname;
+
+ CookieBanner.prototype.acceptAllCookies = function () {
+ var that = this;
+ this.module.cookieBannerInnerWrap.style.display = 'none';
+ this.module.cookieBannerConfirmationMessage.style.display = 'block';
+
+ window.GOVUK.cookie(this.settings.seenCookieName + this.settings.env, true, { days: 365 })
+
+ Object.keys(this.settings.cookiePolicy).forEach(function (cookieName) {
+ window.GOVUK.cookie(cookieName + that.settings.env, true, { days: 365 })
+ });
}
-}(window))
-
-function CookieSettings($module) {
- this.$module = $module;
- this.DEFAULT_COOKIE_CONSENT = [
- {
- name: 'AnalyticsConsent',
- value: true
- },
- {
- name: 'MarketingConsent',
- value: false
- }
- ]
- this.start()
-}
-
-CookieSettings.prototype.start = function () {
-
- this.$module.submitSettingsForm = this.submitSettingsForm.bind(this)
-
- document.querySelector('form[data-module=cookie-settings]').addEventListener('submit', this.$module.submitSettingsForm)
-
- this.setInitialFormValues()
-}
-
-CookieSettings.prototype.setInitialFormValues = function () {
-
- var cookieSettings = this.DEFAULT_COOKIE_CONSENT
-
- cookieSettings.forEach(function (cookieSetting) {
-
- var currentConsentCookie = window.GOVUK.cookie(cookieSetting.name)
- var radioButton
-
- if (currentConsentCookie === 'true' || cookieSetting.value === true) {
- radioButton = document.querySelector('input[name=cookies-' + cookieSetting.name + '][value=on]')
+
+ window.GOVUK = window.GOVUK || {}
+
+ window.GOVUK.cookie = function (name, value, options) {
+ if (typeof value !== 'undefined') {
+ if (value === false || value === null) {
+ return window.GOVUK.setCookie(name, '', { days: -1 })
} else {
- radioButton = document.querySelector('input[name=cookies-' + cookieSetting.name + '][value=off]')
- }
-
- radioButton.checked = true
-
- });
-
-}
-
-CookieSettings.prototype.submitSettingsForm = function (event) {
-
- event.preventDefault()
-
- var formInputs = event.target.getElementsByTagName("input")
-
- for (var i = 0; i < formInputs.length; i++) {
- var input = formInputs[i]
- if (input.checked) {
- var name = input.name.replace('cookies-', '')
- var value = input.value === "on" ? true : false
- window.GOVUK.setCookie(name, value, { days: 365 })
+ // Default expiry date of 30 days
+ if (typeof options === 'undefined') {
+ options = { days: 30 }
+ }
+ return window.GOVUK.setCookie(name, value, options)
}
+ } else {
+ return window.GOVUK.getCookie(name)
+ }
}
-
- if (!window.GOVUK.cookie("DASSeenCookieMessage")) {
- window.GOVUK.setCookie("DASSeenCookieMessage", true, { days: 365 })
- }
-
- this.showConfirmationMessage()
-
- return false
-}
-
-CookieSettings.prototype.showConfirmationMessage = function () {
- var confirmationMessage = document.querySelector('div[data-cookie-confirmation]')
- var previousPageLink = document.querySelector('.cookie-settings__prev-page')
-
- document.body.scrollTop = document.documentElement.scrollTop = 0
-
- confirmationMessage.style.display = "block"
-}
-
-CookieSettings.prototype.getReferrerLink = function () {
- return document.referrer ? new URL(document.referrer).pathname : false
-}
-
-
-function CookieBanner($module) {
- this.$module = $module;
- this.start()
-}
-
-CookieBanner.prototype.start = function () {
-
- this.$module.hideCookieMessage = this.hideCookieMessage.bind(this)
- this.$module.showConfirmationMessage = this.showConfirmationMessage.bind(this)
- this.$module.setDASSeenCookieMessage = this.setDASSeenCookieMessage.bind(this)
-
- this.$module.cookieBanner = document.querySelector('.das-cookie-banner')
- this.$module.cookieBannerConfirmationMessage = this.$module.querySelector('.das-cookie-banner__confirmation')
-
- this.setupCookieMessage()
-}
-
-CookieBanner.prototype.setupCookieMessage = function () {
- this.$hideLink = this.$module.querySelector('button[data-hide-cookie-banner]')
- if (this.$hideLink) {
- this.$hideLink.addEventListener('click', this.$module.hideCookieMessage)
- }
-
- this.$acceptCookiesLink = this.$module.querySelector('button[data-accept-cookies]')
- if (this.$acceptCookiesLink) {
- this.$acceptCookiesLink.addEventListener('click', this.$module.setDASSeenCookieMessage)
- }
-
- if (!window.GOVUK.cookie('DASSeenCookieMessage')) {
- if (window.GOVUK.cookie('DASSeenCookieMessage') === true) {
- window.GOVUK.cookie('DASSeenCookieMessage', false, { days: 365 })
+
+ window.GOVUK.setCookie = function (name, value, options) {
+
+ if (typeof options === 'undefined') {
+ options = {}
}
+
+ var cookieString = name + '=' + value + '; path=/;SameSite=None'
+
+ if (options.days) {
+ var date = new Date()
+ date.setTime(date.getTime() + (options.days * 24 * 60 * 60 * 1000))
+ cookieString = cookieString + '; expires=' + date.toGMTString()
+ }
+
+ if (!options.domain) {
+ options.domain = window.GOVUK.getDomain()
+ }
+
+ if (document.location.protocol === 'https:') {
+ cookieString = cookieString + '; Secure'
+ }
+
+ document.cookie = cookieString + ';domain=' + options.domain
}
- this.showCookieMessage()
-}
-
-CookieBanner.prototype.showCookieMessage = function () {
- if (!this.isInCookiesPage() && !this.isInIframe()) {
- var showCookieBanner = (this.$module && window.GOVUK.cookie('DASSeenCookieMessage') !== 'true')
- if (showCookieBanner) {
- this.$module.style.display = 'block'
+
+ window.GOVUK.getCookie = function (name) {
+ var nameEQ = name + '='
+ var cookies = document.cookie.split(';')
+ for (var i = 0, len = cookies.length; i < len; i++) {
+ var cookie = cookies[i]
+ while (cookie.charAt(0) === ' ') {
+ cookie = cookie.substring(1, cookie.length)
}
+ if (cookie.indexOf(nameEQ) === 0) {
+ return decodeURIComponent(cookie.substring(nameEQ.length))
+ }
+ }
+ return null
}
-}
-
-CookieBanner.prototype.hideCookieMessage = function (event) {
- if (this.$module) {
- this.$module.style.display = 'none'
- window.GOVUK.cookie('DASSeenCookieMessage', true, { days: 365 })
+
+ window.GOVUK.getDomain = function () {
+ return window.location.hostname.indexOf('.') !== -1
+ ? '.' + window.location.hostname.slice(window.location.hostname.indexOf('.') + 1)
+ : window.location.hostname;
}
- if (event.target) {
- event.preventDefault()
+
+ window.GOVUK.getEnv = function () {
+ var domain = window.location.hostname;
+ if (domain.indexOf("at-") >= 0) {
+ return "AT"
+ }
+ if (domain.indexOf("test-") >= 0) {
+ return "TEST"
+ }
+ if (domain.indexOf("test2-") >= 0) {
+ return "TEST2"
+ }
+ if (domain.indexOf("pp-") >= 0) {
+ return "PP"
+ }
+ return "";
}
-}
-
-CookieBanner.prototype.setDASSeenCookieMessage = function () {
- window.GOVUK.approveAllCookieTypes()
- this.$module.showConfirmationMessage()
- this.$module.cookieBannerConfirmationMessage.focus()
- window.GOVUK.cookie('DASSeenCookieMessage', true, { days: 365 })
-}
-
-CookieBanner.prototype.showConfirmationMessage = function () {
- this.$cookieBannerMainContent = document.querySelector('.das-cookie-banner__wrapper')
- this.$cookieBannerMainContent.style.display = 'none'
- this.$module.cookieBannerConfirmationMessage.style.display = 'block'
-}
-
-CookieBanner.prototype.isInCookiesPage = function () {
- return window.location.pathname === '/cookies'
-}
-
-CookieBanner.prototype.isInIframe = function () {
- return window.parent && window.location !== window.parent.location
-}
-
-var $cookieBanner = document.querySelector('[data-module="cookie-banner"]');
-if ($cookieBanner != null) {
- new CookieBanner($cookieBanner);
-}
-
-var $cookieSettings = document.querySelector('[data-module="cookie-settings"]');
-if ($cookieSettings != null) {
- new CookieSettings($cookieSettings);
-}
+
+ // Legacy cookie clean up
+
+ var currentDomain = window.location.hostname;
+ var cookieDomain = window.GOVUK.getDomain();
+
+ if (currentDomain !== cookieDomain) {
+ // Delete the 3 legacy cookies without the domain attribute defined
+ document.cookie = "DASSeenCookieMessage=false; path=/;SameSite=None; expires=Thu, 01 Jan 1970 00:00:01 GMT";
+ document.cookie = "AnalyticsConsent=false; path=/;SameSite=None; expires=Thu, 01 Jan 1970 00:00:01 GMT";
+ document.cookie = "MarketingConsent=false; path=/;SameSite=None; expires=Thu, 01 Jan 1970 00:00:01 GMT";
+ }
+
+ var $cookieBanner = document.querySelector('[data-module="cookie-banner"]');
+ if ($cookieBanner != null) {
+ new CookieBanner($cookieBanner);
+ }