diff --git a/src/apisof.net/Pages/_Host.cshtml b/src/apisof.net/Pages/_Host.cshtml index 14f066af..6a9e7283 100644 --- a/src/apisof.net/Pages/_Host.cshtml +++ b/src/apisof.net/Pages/_Host.cshtml @@ -16,8 +16,11 @@ + + + @@ -36,44 +39,6 @@ - + diff --git a/src/apisof.net/Shared/MainLayout.razor b/src/apisof.net/Shared/MainLayout.razor index 181b9ce1..6ef55ffc 100644 --- a/src/apisof.net/Shared/MainLayout.razor +++ b/src/apisof.net/Shared/MainLayout.razor @@ -1,5 +1,6 @@ @inherits LayoutComponentBase +
Skip to main content
-
+
@Body @@ -82,4 +83,45 @@ { @CatalogJobInfo.Date.Date.ToShortDateString() } +
+ +
\ No newline at end of file diff --git a/src/apisof.net/wwwroot/css/site.css b/src/apisof.net/wwwroot/css/site.css index 43466ff3..f1b1ae23 100644 --- a/src/apisof.net/wwwroot/css/site.css +++ b/src/apisof.net/wwwroot/css/site.css @@ -639,6 +639,83 @@ html, body { .table-responsive-stack th{ min-width: 200px; } + +/* UHF footer */ + +.page-shell { + min-height: 100vh; + display: flex; + flex-direction: column; +} + +.layout-main { + flex: 1 0 auto; +} + +.uhf-footer { + background-color: var(--dotnet-purple); + color: #ffffff; + margin-top: 1rem; + padding: 0.75rem 1rem; + font-size: 0.95rem; +} + +.uhf-footer-row { + margin-bottom: 0.35rem; +} + +.uhf-footer-links { + display: flex; + flex-wrap: wrap; + gap: 0; + list-style: none; + margin: 0; + padding: 0; +} + +.uhf-footer-links li { + white-space: nowrap; +} + +.uhf-footer-links li + li::before { + content: "|"; + color: rgba(255, 255, 255, 0.55); + margin: 0 0.55rem; +} + +.uhf-footer-links a, +.uhf-footer-links a:link, +.uhf-footer-links a:visited { + color: #d1c7f5; +} + +.uhf-footer-links a:hover, +.uhf-footer-links a:focus { + color: #ffffff; +} + +.uhf-privacy-choices { + display: inline-flex; + align-items: center; + gap: 0.35rem; +} + +.uhf-privacy-icon { + width: 1.65rem; + height: 0.9rem; + flex-shrink: 0; +} + +@media (max-width: 480px) { + .uhf-footer-links { + row-gap: 0.25rem; + } + + .uhf-footer-links li + li::before { + margin: 0 0.4rem; + } +} + /* Small screens (mobile and narrow windows) */ @media (max-width: 480px) { diff --git a/src/apisof.net/wwwroot/js/site.js b/src/apisof.net/wwwroot/js/site.js new file mode 100644 index 00000000..00f728ec --- /dev/null +++ b/src/apisof.net/wwwroot/js/site.js @@ -0,0 +1,79 @@ +var siteConsent = null; + +function setCookieManagementVisibility(isVisible) { + var elements = document.querySelectorAll(".manageCookieChoice"); + for (var i = 0; i < elements.length; i++) { + elements[i].style.display = isVisible ? "list-item" : "none"; + } +} + +function initializeCookieConsent() { + if (typeof WcpConsent === "undefined" || typeof WcpConsent.init !== "function") { + return; + } + + WcpConsent.init("en-US", "cookie-banner", function (err, consentInstance) { + if (err || !consentInstance) { + return; + } + + siteConsent = consentInstance; + setCookieManagementVisibility(!!siteConsent.isConsentRequired); + + if (typeof siteConsent.onConsentChanged === "function") { + siteConsent.onConsentChanged(function () { + setCookieManagementVisibility(!!siteConsent.isConsentRequired); + }); + } + }); +} + +function manageConsent() { + if (siteConsent && typeof siteConsent.manageConsent === "function") { + siteConsent.manageConsent(); + } +} + +if (document.readyState === "loading") { + document.addEventListener("DOMContentLoaded", initializeCookieConsent); +} else { + initializeCookieConsent(); +} + +function scrollIntoMainContent() { + var mainContent = document.getElementById("main-content"); + if (mainContent) { + mainContent.scrollIntoView({ behavior: "smooth" }); + mainContent.focus(); + } +} + +var observer = new MutationObserver(function () { + $('[data-toggle="popover"]').popover({ + placement: 'top', + trigger: 'hover', + boundary: 'body' + }); + $('[data-toggle="popover"]').on('click', function () { + $('[data-toggle="popover"]').popover('dispose'); + }); + $('.search-result-row.selected').each(function () { + this.scrollIntoView({ block: "nearest" }); + }); + $("#skipToMain").on('keydown', function (e) { + if (e.key === "Enter" || e.key === " ") { + scrollIntoMainContent(); + e.preventDefault(); + } + }); + $("#skipToMain").on('click', function (e) { + scrollIntoMainContent(); + e.preventDefault(); + }); +}); + +observer.observe(document, { + subtree: true, + childList: true, + attributes: true +});