hr-design-system-handlebars 1.61.4 → 1.63.0

package/CHANGELOG.md

@@ -1,3 +1,28 @@
+# v1.63.0 (Thu Apr 04 2024)
+
+#### 🚀 Enhancement
+
+- Dpe 2975+2962 [#893](https://github.com/mumprod/hr-design-system-handlebars/pull/893) ([@Paul-Atreidis](https://github.com/Paul-Atreidis) [@hanswurstsalat](https://github.com/hanswurstsalat))
+
+#### Authors: 2
+
+- [@Paul-Atreidis](https://github.com/Paul-Atreidis)
+- Geraldo ([@hanswurstsalat](https://github.com/hanswurstsalat))
+
+---
+
+# v1.62.0 (Thu Apr 04 2024)
+
+#### 🚀 Enhancement
+
+- :bug: Add the possibilty to turn [#892](https://github.com/mumprod/hr-design-system-handlebars/pull/892) ([@mariokinzel](https://github.com/mariokinzel))
+
+#### Authors: 1
+
+- [@mariokinzel](https://github.com/mariokinzel)
+
+---
+
 # v1.61.4 (Wed Apr 03 2024)
 
 #### 🐛 Bug Fix

package/dist/assets/index.css

@@ -3321,7 +3321,7 @@ article.indexTextDS .indexTextHighlighted .link {
   border-bottom-color: var(--color-secondary-ds);
 }
 .counter-reset {
-  counter-reset: cnt1712153484418;
+  counter-reset: cnt1712251189185;
 }
 .hyphens-auto {
   -webkit-hyphens: auto;
@@ -3358,49 +3358,113 @@ article.indexTextDS .indexTextHighlighted .link {
             clear: both;
         }
     }
-.ar-16-9, .ar-16x9-DS {
+.ar-16-9 {
         aspect-ratio: 16 / 9;
     }
 @supports not (aspect-ratio: 16 / 9) {
-        .ar-16-9::before, .ar-16x9-DS::before {
+        .ar-16-9::before {
             float: left;
             padding-top: calc(9 / 16 * 100%);
             content: '';
         }
 
-        .ar-16-9::after, .ar-16x9-DS::after {
+        .ar-16-9::after {
             display: block;
             content: '';
             clear: both;
         }
     }
-.ar-4-3, .ar-4x3-DS {
+.ar-16-7 {
+        aspect-ratio: 16 / 7;
+    }
+@supports not (aspect-ratio: 16 / 7) {
+        .ar-16-7::before {
+            float: left;
+            padding-top: calc(7 / 16 * 100%);
+            content: '';
+        }
+
+        .ar-16-7::after {
+            display: block;
+            content: '';
+            clear: both;
+        }
+    }
+.ar-4-3 {
         aspect-ratio: 4 / 3;
     }
 @supports not (aspect-ratio: 4 / 3) {
-        .ar-4-3::before, .ar-4x3-DS::before {
+        .ar-4-3::before {
             float: left;
             padding-top: calc(3 / 4 * 100%);
             content: '';
         }
 
-        .ar-4-3::after, .ar-4x3-DS::after {
+        .ar-4-3::after {
             display: block;
             content: '';
             clear: both;
         }
     }
-.ar-1-1, .ar-100-DS {
+.ar-1-1 {
         aspect-ratio: 1 / 1;
     }
 @supports not (aspect-ratio: 1 / 1) {
-        .ar-1-1::before, .ar-100-DS::before {
+        .ar-1-1::before {
             float: left;
             padding-top: 100%;
             content: '';
         }
 
-        .ar-1-1::after, .ar-100-DS::after {
+        .ar-1-1::after {
+            display: block;
+            content: '';
+            clear: both;
+        }
+    }
+.ar-100-27 {
+        aspect-ratio: 100 / 27.1;
+    }
+@supports not (aspect-ratio: 100 / 27.1) {
+        .ar-100-27::before {
+            float: left;
+            padding-top: calc(27.1 / 100 * 100%);
+            content: '';
+        }
+
+        .ar-100-27::after {
+            display: block;
+            content: '';
+            clear: both;
+        }
+    }
+.ar-9-16 {
+        aspect-ratio: 9 / 16;
+    }
+@supports not (aspect-ratio: 9 / 16) {
+        .ar-9-16::before {
+            float: left;
+            padding-top: calc(16 / 9 * 100%);
+            content: '';
+        }
+
+        .ar-9-16::after {
+            display: block;
+            content: '';
+            clear: both;
+        }
+    }
+.ar-7-16 {
+        aspect-ratio: 7 / 16;
+    }
+@supports not (aspect-ratio: 7 / 16) {
+        .ar-7-16::before {
+            float: left;
+            padding-top: calc(16 / 7 * 100%);
+            content: '';
+        }
+
+        .ar-7-16::after {
             display: block;
             content: '';
             clear: both;
@@ -3630,7 +3694,7 @@ article.indexTextDS .indexTextHighlighted .link {
   --tw-ring-color: rgba(255, 255, 255, 0.5);
 }
 .-ordered {
-  counter-increment: cnt1712153484418 1;
+  counter-increment: cnt1712251189185 1;
 }
 .-ordered::before {
   position: absolute;
@@ -3646,7 +3710,7 @@ article.indexTextDS .indexTextHighlighted .link {
   letter-spacing: .0125em;
   --tw-text-opacity: 1;
   color: rgba(0, 0, 0, var(--tw-text-opacity));
-  content: counter(cnt1712153484418);
+  content: counter(cnt1712251189185);
 }
 /*! ****************************/
 /*! DataPolicy stuff           */

package/dist/assets/js/components/externalService/dataWrapperContentRefresher.subfeature.js

@@ -0,0 +1,85 @@
+        
+const DataWrapperContentRefresher = function (context, uniqueID) {
+        const { element: rootElement } = context
+        let remainingTime
+        let timer
+        let iframeRefresh = document.getElementById('datawrapper-chart-' + uniqueID)
+        
+        const createRefresher = function (uniqueID) {
+            let divCounter = document.createElement('div')
+            let divOverlay = document.createElement('div')
+            let divTextOverlay = document.createElement('div')
+            divOverlay.id = 'overlay' + uniqueID
+            divOverlay.style.position = 'absolute'
+            divOverlay.style.top = '0'
+            divOverlay.style.display = 'none'
+            divOverlay.style.alignItems = 'center'
+            divOverlay.style.justifyContent = 'center'
+            divOverlay.style.backgroundColor = '#fff'
+            divOverlay.style.width = '100%'
+            divOverlay.style.height = 'calc(100% - 36px)'
+            divOverlay.style.backgroundColor = '#d8e9f6'
+            divTextOverlay.innerHTML = 'Lade Inhalt neu...'
+            divTextOverlay.style.backgroundColor = '#005293'
+            divTextOverlay.style.padding = '8px'
+            divTextOverlay.style.color = '#fff'
+            divTextOverlay.style.fontWeight = '800'
+            divTextOverlay.style.fontFamily = 'RobotoSlab'
+            divTextOverlay.style.borderRadius = '6px 6px 6px 6px'
+            divOverlay.appendChild(divTextOverlay)
+            divCounter.id = 'counter' + uniqueID
+            divCounter.style.backgroundColor = '#006dc1'
+            divCounter.style.color = '#fff'
+            divCounter.style.fontSize = '12px'
+            divCounter.style.padding = '8px'
+            divCounter.style.borderRadius = '0 0 4px 4px'
+            
+            rootElement.style.position = 'relative'
+            rootElement.appendChild(divCounter)
+            rootElement.appendChild(divOverlay)
+            startCountdown()
+        }
+
+        const refreshIframe = function () {
+            console.log('Reload')
+            iframeRefresh.style.opacity = '0'
+            iframeRefresh.src =
+                iframeRefresh.src.split('?')[0] + '?_=' + new Date().getTime()
+            clearInterval(timer)
+        }
+        const startCountdown = function () {
+            remainingTime = Number(iFrameConfig.refreshIntervall)
+            setTimeout(function () {
+                iframeRefresh.style.opacity = '1'
+                document.getElementById('overlay' + uniqueID).style.display = 'none'
+            }, 1000)
+            timer = setInterval(function () {
+                checkTimer()
+            }, 1000)
+        }
+        const checkTimer = function () {
+            if (remainingTime >= 0) {
+                document.getElementById('counter' + uniqueID).innerHTML =
+                    'Dieser Inhalt wird automatisch aktualisiert in ' +
+                    secondsToTimeString(remainingTime) +
+                    ' Min.'
+                remainingTime -= 1
+                if (remainingTime == -1) {
+                    document.getElementById('overlay' + uniqueID).style.display = 'flex'
+                    document.getElementById('counter' + uniqueID).innerHTML =
+                        'Zeitintervall wird neu gestartet...'
+                }
+            } else {
+                refreshIframe()
+                startCountdown()
+            }
+        }
+        const secondsToTimeString = function (seconds) {
+            return new Date(seconds * 1000).toISOString().substr(14, 5)
+        }
+        return {
+            createRefresher: createRefresher
+        }
+    }
+
+    export default DataWrapperContentRefresher            

package/dist/assets/js/components/externalService/dataWrapperNoResponsiveIframe.subfeature.js

@@ -0,0 +1,44 @@
+const DataWrapperNoResponsiveIframe = function (context, configAR, configFixedHeight, comfigEmbedCode) {
+    
+    const { element: rootElement } = context
+    let aspectRatio = configAR
+    let fixedHeight = configFixedHeight
+    let embedCode = comfigEmbedCode
+
+    const createNoResponsiveIframe = function (aspectRatioClass) {
+
+   
+    var parentDiv = document.createElement('div')
+    parentDiv.className = 'copytext__scrollWrapper'
+    var div = document.createElement('div')
+    //Keine Aspect-Ratio ausgewählt aber eine feste Höhe
+    if (aspectRatio === undefined) {
+            div.className = 'noaspect_datawrapper_cdn'
+            div.style.height = fixedHeight + 'px'
+            div.style.width = '100%'
+    } 
+    // Aspect-Ratio ausgewählt
+    else {
+            div.className = aspectRatioClass + ' datawrapper_cdn'
+    }
+    var iframe = document.createElement('iframe')
+    iframe.className = 'w-full h-full datawrapper_cdn'
+    iframe.setAttribute('id', 'i_frame')
+    iframe.setAttribute('data-isloaded', '0')
+    iframe.setAttribute('webkitallowfullscreen', '')
+    iframe.setAttribute('mozallowfullscreen', '')
+    iframe.setAttribute('allowfullscreen', '')
+    iframe.setAttribute('scrolling', 'no')
+    iframe.setAttribute('frameborder', '0')
+    iframe.src = embedCode
+
+    div.appendChild(iframe)
+    parentDiv.appendChild(div)
+    rootElement.appendChild(parentDiv)
+    }
+    return {
+        createNoResponsiveIframe: createNoResponsiveIframe
+    }
+}
+
+export default DataWrapperNoResponsiveIframe