From a13a7ec9012d4858d3ad1520c6cc812fe2a329f8 Mon Sep 17 00:00:00 2001 From: Martin Mikkelsen Date: Thu, 30 May 2024 08:46:33 +0200 Subject: [PATCH] remove universal top-header with related html, css, js and images --- _static/background-header.svg | 9 - _static/logo-link-documentation.svg | 4 - _static/logo-link-ncc.svg | 9 - _static/logo-link-sigma-nris.svg | 15 - _static/nris.css | 4 - _static/statuspal.css | 109 ----- _static/statuspal_widget.js | 434 -------------------- _static/universal-header-hamburger-menu.svg | 5 - _static/universal-header-sign-in.svg | 3 - _static/universal-header-statuspal.svg | 4 - _static/universal-navbar.css | 225 ---------- _templates/layout.html | 107 ----- 12 files changed, 928 deletions(-) delete mode 100644 _static/background-header.svg delete mode 100644 _static/logo-link-documentation.svg delete mode 100644 _static/logo-link-ncc.svg delete mode 100644 _static/logo-link-sigma-nris.svg delete mode 100644 _static/statuspal.css delete mode 100644 _static/statuspal_widget.js delete mode 100644 _static/universal-header-hamburger-menu.svg delete mode 100644 _static/universal-header-sign-in.svg delete mode 100644 _static/universal-header-statuspal.svg delete mode 100644 _static/universal-navbar.css diff --git a/_static/background-header.svg b/_static/background-header.svg deleted file mode 100644 index 1d1ff987d..000000000 --- a/_static/background-header.svg +++ /dev/null @@ -1,9 +0,0 @@ - - - - - - - - - diff --git a/_static/logo-link-documentation.svg b/_static/logo-link-documentation.svg deleted file mode 100644 index 0220e521e..000000000 --- a/_static/logo-link-documentation.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - \ No newline at end of file diff --git a/_static/logo-link-ncc.svg b/_static/logo-link-ncc.svg deleted file mode 100644 index 62e2729d8..000000000 --- a/_static/logo-link-ncc.svg +++ /dev/null @@ -1,9 +0,0 @@ - - - - - - - - - diff --git a/_static/logo-link-sigma-nris.svg b/_static/logo-link-sigma-nris.svg deleted file mode 100644 index c1ad9f4eb..000000000 --- a/_static/logo-link-sigma-nris.svg +++ /dev/null @@ -1,15 +0,0 @@ - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/_static/nris.css b/_static/nris.css index f47096fbc..613475f1d 100644 --- a/_static/nris.css +++ b/_static/nris.css @@ -10,10 +10,6 @@ color: #ffffff; } -.wy-grid-for-nav, .wy-nav-side { - margin-top: 50px; -} - /* * Carlito is licensed under the SIL Open Font License, Version 1.1 * see https://github.com/googlefonts/carlito/blob/main/OFL.txt diff --git a/_static/statuspal.css b/_static/statuspal.css deleted file mode 100644 index 88526b5e6..000000000 --- a/_static/statuspal.css +++ /dev/null @@ -1,109 +0,0 @@ -.sp-custom-widget { - position: relative; - padding: 0; - margin: 0; - background-image: url('universal-header-statuspal.svg'); - background-repeat: no-repeat; - background-position: center; - background-size: 28px; - height: 100%; - min-height: 28px; - min-width: 28px; - position: relative; - border: none; - outline: none; - background-color: transparent; -} - -.counter { - height: 16px; - width: 16px; - position: absolute; - top: 5px; - right: -5px; - background-color: white; - color: black; - text-indent: 0; - font-size: 14px; - line-height: 14px; - text-align: center; - border-radius: 50%; - padding: 2px 0 0 0; - box-sizing: border-box; -} - -.sp-has-unread .counter { - background-color: orange !important; -} - -.sp-custom-widget:hover { - cursor: pointer; -} - -.sp-custom-data-container { - display: none; - max-height: 80vh; - max-width: 50vw; - background-color: transparent; - color: #fff; - text-align: center; - font-size: 1em; - line-height: 1.2em; - z-index: 1; - overflow-y: scroll; - padding: 0 0.5em; -} - -.sp-event { - width: 100%; - max-width: 300px; - padding: 1em; - margin-bottom: 1em; - background-color: #1C2A34; - box-sizing: border-box; -} - -.sp-event p { - margin-bottom: 1em; -} - -.sp-event a { - color: white; -} - -.sp-event-type-scheduled { - /* background-color: #93BBC8; */ - border-bottom: 4px solid #1f77b4; -} - -.sp-event-type-minor { - /* background-color: orange; */ - border-bottom: 4px solid #D18500; -} - -.sp-event-type-major { - /* background-color: #FF0000; */ - border-bottom: 4px solid #990000; -} - -.position-middle { - position: fixed; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); -} - -.position-top-right { - position: fixed; - top: calc(50px + 2em); - left: calc(min(100vw, 1100px) - 300px); - transform: translate(0, 0); -} - -.position-bottom-right { - position: fixed; - bottom: 2em; - right: 2em; - transform: translate(0, 0); -} - \ No newline at end of file diff --git a/_static/statuspal_widget.js b/_static/statuspal_widget.js deleted file mode 100644 index 3c758ec81..000000000 --- a/_static/statuspal_widget.js +++ /dev/null @@ -1,434 +0,0 @@ -class CustomStatuspalWidget { - constructor( - widgetBtnId, - widgetDataContainerId, - statuspalUrl, - containerPosition, - devMode, - sessionStorageKey - ) { - // button settings - this.widgetBtn = document.getElementById(widgetBtnId); - this.widgetBtn.classList.add('sp-custom-widget'); - this.widgetBtn.setAttribute('aria-controls', widgetDataContainerId); - this.widgetBtn.setAttribute('aria-expanded', 'false'); - this.widgetBtn.addEventListener('click', this.toggleDisplay.bind(this)); - - // Create a span element for the counter - const counterSpan = document.createElement('span'); - counterSpan.classList.add('counter'); - this.widgetBtn.appendChild(counterSpan); - - // add counter element and unread class if new incident happen - document.addEventListener('statuspalNotification', () => { - this.toggleUnreadStatus(); - }); - - // container settings - this.widgetDataContainer = document.getElementById(widgetDataContainerId); - this.widgetDataContainer.classList.add('sp-custom-data-container'); - this.widgetDataContainer.style.display = 'none'; - this.widgetDataContainer.classList.add(containerPosition); - this.widgetDataContainer.setAttribute('aria-hidden', 'true'); - - // close container if clicking outside - document.addEventListener('click', this.blurwidgetDataContainer.bind(this)); - - // other settings - this.sessionStorageKey = sessionStorageKey; - this.devMode = devMode; - this.statuspalUrl = statuspalUrl; - - this.getStatuspalData(); - this.setCountInButton(); - } - - isDevMode() { - return this.devMode; - } - - toggleUnreadStatus() { - if (this.widgetBtn.classList.contains('sp-has-unread')) { - this.setReadStatus(); - } else { - this.setUnreadStatus(); - } - } - - setReadStatus() { - this.widgetBtn.classList.remove('sp-has-unread'); - } - - setUnreadStatus() { - this.widgetBtn.classList.add('sp-has-unread'); - } - - isWidgetDataContainerOpen() { - const isOpen = - this.widgetDataContainer.style.display === 'block' || - !this.widgetDataContainer.style.display.length; - return isOpen; - } - - toggleDisplay() { - if (this.isWidgetDataContainerOpen()) { - this.closeWidgetDataContainer(); - } else { - this.openWidgetDataContainer(); - } - // Update aria-expanded for the button - const isExpanded = this.isWidgetDataContainerOpen(); - this.widgetBtn.setAttribute('aria-expanded', isExpanded.toString()); - } - - closeWidgetDataContainer() { - this.widgetDataContainer.style.display = 'none'; - this.widgetDataContainer.setAttribute('aria-hidden', 'true'); - } - - openWidgetDataContainer() { - this.widgetDataContainer.style.display = 'block'; - this.widgetDataContainer.setAttribute('aria-hidden', 'false'); - this.statuspalData.viewed = true; - this.setReadStatus(); - this.saveJsonToSessionStorage(this.statuspalData); - } - - createEventDivs() { - this.statuspalData.incidents.forEach(incident => { - this.createEventDiv(incident, 'incident'); - }); - - this.statuspalData.maintenances.forEach(maintenance => { - this.createEventDiv(maintenance, 'maintenance'); - }); - - this.statuspalData.upcoming_maintenances.forEach(upcomingMaintenance => { - this.createEventDiv(upcomingMaintenance, 'upcoming maintenance'); - }); - } - - createEventDiv(event, eventName) { - const eventDiv = document.createElement('div'); - this.widgetDataContainer.appendChild(eventDiv); - - const spEvent = 'sp-event'; - const spEventType = `sp-event-type-${event.type}`; - eventDiv.classList.add(spEvent, spEventType); - - const eventType = document.createElement('p'); - eventType.classList.add('event-type'); - eventDiv.appendChild(eventType); - eventType.innerText = `${event.type} ${eventName}`; - - const eventTitle = document.createElement('strong'); - eventDiv.appendChild(eventTitle); - eventTitle.innerText = event.title; - - const eventUpdated = document.createElement('p'); - eventUpdated.classList.add('.event-updated-time'); - eventDiv.appendChild(eventUpdated); - eventUpdated.innerText = `Last updated: ${this.formatDate( - event.updated_at - )}`; - - const readMore = document.createElement('a'); - eventDiv.appendChild(readMore); - readMore.href = event.url; - readMore.innerText = 'Read more'; - } - - createfallbackEventDiv () { - const eventDiv = document.createElement('div'); - - const spEvent = 'sp-event'; - const spEventType = `sp-event-type-fallback`; - eventDiv.classList.add(spEvent, spEventType); - - const eventTitle = document.createElement('strong'); - eventDiv.appendChild(eventTitle); - eventTitle.innerText = 'There are no ongoing events'; - - this.widgetDataContainer.appendChild(eventDiv); - } - - getStatuspalData() { - // If we're in dev mode we use test data directly - if (this.isDevMode()) { - this.statuspalData = this.testData; - this.statuspalData.viewed = false; // set data as unread - console.log(this.statuspalData, 'Test data is loaded'); - this.getOpenIncidentCount(); - if (this.hasEvents()) { - this.createEventDivs(); - } else { - this.createfallbackEventDiv(); - } - } else { - // Normal behavior: check session storage or fetch new data - const statuspalData = this.getJsonFromSessionStorage(); - if (Object.keys(statuspalData).length === 0) { - this.fetchStatuspalData(); - } else { - this.statuspalData = statuspalData; - if (this.hasEvents()) { - this.createEventDivs(); - } else { - this.createfallbackEventDiv(); - } - if (!this.isStatuspalDataViewed()) { - this.dispatchStatuspalNotification(); - } - } - } - } - getOpenIncidentCount() { - const incidents = Array.isArray(this.statuspalData.incidents) - ? this.statuspalData.incidents.length - : 0; - const maintenances = Array.isArray(this.statuspalData.maintenances) - ? this.statuspalData.maintenances.length - : 0; - const upcomingMaintenances = Array.isArray( - this.statuspalData.upcoming_maintenances - ) - ? this.statuspalData.upcoming_maintenances.length - : 0; - - return incidents + maintenances + upcomingMaintenances; - } - - setCountInButton() { - const count = this.getOpenIncidentCount(); - const countContainer = this.widgetBtn.querySelector('.counter'); - - if (count > 0) { - countContainer.textContent = count; - countContainer.style.display = ''; // Show the counter - } else { - countContainer.style.display = 'none'; // Hide the counter - this.setReadStatus(); - } - } - - fetchStatuspalData() { - const statuspalUrl = this.statuspalUrl; - fetch(statuspalUrl) - .then(response => response.json()) - .then(data => { - this.statuspalData = data; - this.saveJsonToSessionStorage(data); - if (this.hasEvents()) { - this.createEventDivs(); - this.setCountInButton(); - this.dispatchStatuspalNotification(); - } - }) - .catch(error => { - console.error('Error fetching statuspal data:', error); - }); - } - - hasEvents() { - return ( - this.statuspalData.incidents.length > 0 || - this.statuspalData.maintenances.length > 0 || - this.statuspalData.upcoming_maintenances.length > 0 - ); - } - - isStatuspalDataViewed() { - return this.statuspalData && this.statuspalData.viewed === true; - } - - saveJsonToSessionStorage(value) { - sessionStorage.setItem(this.sessionStorageKey, JSON.stringify(value)); - } - - getJsonFromSessionStorage() { - const storedValue = sessionStorage.getItem(this.sessionStorageKey); - return storedValue ? JSON.parse(storedValue) : {}; - } - - formatDate(dateString) { - const date = new Date(dateString); - const day = String(date.getDate()).padStart(2, '0'); - const month = String(date.getMonth() + 1).padStart(2, '0'); - const year = String(date.getFullYear()); - const formattedDate = `${day}-${month}-${year}`; - return formattedDate; - } - - dispatchStatuspalNotification() { - document.dispatchEvent(new CustomEvent('statuspalNotification')); - } - - blurwidgetDataContainer(event) { - const isClickInside = this.widgetDataContainer.contains(event.target); - const isInsideBtn = this.widgetBtn.contains(event.target); - if (this.isWidgetDataContainerOpen() && !isClickInside && !isInsideBtn) { - this.setReadStatus(); - this.widgetDataContainer.style.display = 'none'; - this.widgetDataContainer.setAttribute('aria-hidden', 'true'); - } - } - - testData = { - status_page: { - url: 'example.com', - time_zone: 'CET', - subdomain: 'example-data', - name: 'Example', - current_incident_type: 'major' - }, - services: [ - { - name: 'Monitoring service', - id: 0, - current_incident_type: 'major', - children: [{}] - } - ], - incidents: [ - { - id: 89, - inserted_at: '2022-01-01T00:00:00', - updated_at: '2022-01-01T00:00:00', - title: 'We are having an incident with the DB connection', - starts_at: '2022-01-01T00:00:00', - ends_at: '2022-01-01T00:00:00', - type: 'major', - service_ids: [1], - updates: [ - { - id: 89, - inserted_at: '2022-01-01T00:00:00', - updated_at: '2022-01-01T00:00:00', - posted_at: '2022-01-01T00:00:00', - type: 'issue', - description: 'We have detected an issue with our CDN', - description_html: '

We have detected an issue with our CDN

', - translations: { - en: { - description: 'English description' - }, - es: { - description: 'Spanish description' - } - }, - subscribers_notified_at: '2022-01-01T00:00:00', - tweet: true - } - ], - url: 'https://status.example.com/incidents/123', - translations: { - en: { - title: 'English Title' - }, - es: { - title: 'Spanish Title' - } - } - } - ], - maintenances: [ - { - id: 89, - inserted_at: '2022-01-01T00:00:00', - updated_at: '2022-01-01T00:00:00', - title: 'We are doing maintenance with the DB connection', - starts_at: '2022-01-01T00:00:00', - ends_at: '2022-01-01T00:00:00', - type: 'minor', - service_ids: [1], - updates: [ - { - id: 89, - inserted_at: '2022-01-01T00:00:00', - updated_at: '2022-01-01T00:00:00', - posted_at: '2022-01-01T00:00:00', - type: 'issue', - description: 'We have detected an issue with our CDN', - description_html: '

We have detected an issue with our CDN

', - translations: { - en: { - description: 'English description' - }, - es: { - description: 'Spanish description' - } - }, - subscribers_notified_at: '2022-01-01T00:00:00', - tweet: true - } - ], - url: 'https://status.example.com/incidents/123', - translations: { - en: { - title: 'English Title' - }, - es: { - title: 'Spanish Title' - } - } - } - ], - upcoming_maintenances: [ - { - id: 89, - inserted_at: '2022-01-01T00:00:00', - updated_at: '2022-01-01T00:00:00', - title: 'We have a upcoming maintenanced planned', - starts_at: '2022-01-01T00:00:00', - ends_at: '2022-01-01T00:00:00', - type: 'scheduled', - service_ids: [1], - updates: [ - { - id: 89, - inserted_at: '2022-01-01T00:00:00', - updated_at: '2022-01-01T00:00:00', - posted_at: '2022-01-01T00:00:00', - type: 'issue', - description: 'We have detected an issue with our CDN', - description_html: '

We have detected an issue with our CDN

', - translations: { - en: { - description: 'English description' - }, - es: { - description: 'Spanish description' - } - }, - subscribers_notified_at: '2022-01-01T00:00:00', - tweet: true - } - ], - url: 'https://status.example.com/incidents/123', - translations: { - en: { - title: 'English Title' - }, - es: { - title: 'Spanish Title' - } - } - } - ], - viewed: false - }; - } - - // eslint-disable-next-line no-unused-vars - function initializeCustomStatuspalWidget(config) { - window.customStatuspalWidgetInstance = new CustomStatuspalWidget( - config.widgetBtnId, - config.widgetDataContainerId, - config.statuspalUrl, - config.containerPosition, - config.devMode, - config.sessionStorageKey || 'statuspalData', - ); - - window.dispatchEvent(new CustomEvent('customStatuspalWidgetInitialized')); - } \ No newline at end of file diff --git a/_static/universal-header-hamburger-menu.svg b/_static/universal-header-hamburger-menu.svg deleted file mode 100644 index 108c65cb9..000000000 --- a/_static/universal-header-hamburger-menu.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - \ No newline at end of file diff --git a/_static/universal-header-sign-in.svg b/_static/universal-header-sign-in.svg deleted file mode 100644 index 5965b3862..000000000 --- a/_static/universal-header-sign-in.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - \ No newline at end of file diff --git a/_static/universal-header-statuspal.svg b/_static/universal-header-statuspal.svg deleted file mode 100644 index e425ae644..000000000 --- a/_static/universal-header-statuspal.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - \ No newline at end of file diff --git a/_static/universal-navbar.css b/_static/universal-navbar.css deleted file mode 100644 index 05261a61f..000000000 --- a/_static/universal-navbar.css +++ /dev/null @@ -1,225 +0,0 @@ -.header-top { - position: absolute; - left: 0; - top: 0; - z-index: 1031; - width: 100%; - height: 50px; - max-height: 50px; - background-color: rgba(0, 0, 0, 0.05); - color: black; - font-family: 'Calibri', 'sans-serif'; - font-size: 18px; - line-height: 1.15; -} - -.inner-container { - position: fixed; - width: calc(300px + 800px); - max-width: calc(300px + 800px); - height: 50px; - max-height: 50px; - background-color: rgba(81, 106, 123); - padding: 0px 60px; - margin: 0; - box-sizing: border-box; - display: grid; - grid-template-columns: 3fr 1fr; - align-items: center; - background-image: url('background-header.svg'); - -} - -@media screen and (max-width: 1100px) { - .inner-container { - width: 100%; - } -} - -.menu { - padding: 0; - margin: 0; - height: 100%; - text-align: left; - list-style: none outside; -} - -.menu-item { - display: inline-block; - height: 100%; - padding: 0 30px 0 30px; - margin: 0; - background-color: transparent; -} - -.site-link { - text-decoration: none; -} - -.site-link:hover, .site-link:active, .site-link:visited, .site-link:focus { - text-decoration: none; -} - -.site-logos { - background-repeat: no-repeat; - background-color: transparent; - padding: 10px 0 10px 0; - line-height: 30px; - color: transparent; -} - -.site-logo-sigma { - width: 200px; - background-image: url('logo-link-sigma-nris.svg'); - background-position: center; - color: transparent !important; -} - -.site-logo-docs { - width: initial; - background-image: url('logo-link-documentation.svg'); - background-position: left; - padding-left: 24px; - color: white; - text-transform: uppercase; -} - -.site-logo-ncc { - padding: 10px 30px 10x 30px; - width: 60px; - background-image: url('logo-link-ncc.svg'); - background-position: center; - color: transparent !important; -} - -.mas-menu { - position: static; - display: flex; - justify-self: flex-end; - justify-content: space-between; - height: 100%; - padding: 0; - line-height: 30px; -} - -.statuspal-icon-container { - height: 100%; - padding: 0; - margin-right: 0.5em; -} - -.mas-login-container { - height: 100%; - max-height: 50px; - padding: 0 10px 0 17px; - margin: 0; - background-image: url('universal-header-sign-in.svg'); - background-repeat: no-repeat; - background-position: 10px center; - background-size: 28px; -} - -.mas-login-container:hover { - cursor: pointer; -} - -.mas-login { - height: 100%; - padding: 10px 0 10px 30px; - color: white; - white-space: nowrap; -} - -.mas-dropdown-menu { - display: none; - position: absolute; - top: calc(100% - 10px); - background-color: #1C2A34; - padding: 8px 16px; - margin: 0; - border-bottom-right-radius: 20px; - list-style-type: none; - text-align: left; -} - -.mas-login-container:hover .mas-dropdown-menu { - display: block; -} - -.mas-link { - color: white !important; - text-decoration: none !important; -} - -.site-active { - background-color: rgb(47, 68, 84); -} - - -.expandable-menu-btn { - width: 30px; - height: 100%; - display: none; - justify-self: flex-end; - color: white; - padding: 0; - margin: 0 30px 0 0; - cursor: pointer; - background: none; - border: none; -} - -.expandable-menu-icon { - width: 30px; - max-width: 30px; - height: 30px; - max-height: 30px; - background-image: url('universal-header-hamburger-menu.svg'); - background-repeat: no-repeat; - background-position: center; - color: transparent; -} - -@media screen and (max-width: 800px) { - /* screen is less than 800px */ - - .inner-container { - padding: 0; - } - .expandable-menu-btn { - display: block; - } - .mas-login-container { - display: none; - } - .menu .menu-item{ - display: none; - } - .site-active { - display: inline-block !important; - } -} - -@media screen and (min-width: 801px) { - /* screen is more than 800px */ - - .menu { - display: block !important; - } - .menu-expanded { - display: none !important; - } -} - -.expandable-menu { - position: fixed; - top: 50px; - background-color: rgba(81, 106, 123); - display: none; - width: 100%; - padding: 0; -} - -.menu-expanded { - display: block; -} \ No newline at end of file diff --git a/_templates/layout.html b/_templates/layout.html index b23438da1..37af8695b 100644 --- a/_templates/layout.html +++ b/_templates/layout.html @@ -1,113 +1,6 @@ {% extends '!layout.html' %} {% block extrabody %} -
-
- -
-
- -
- - -
-
-
-
- - - - - -
- -