init

articles/other/about-us.php

@@ -0,0 +1,35 @@
+<article class="responsive-shape about-us">
+    <header>
+        <h1>O nás</h1>
+    </header>
+    <section>
+        <div>
+            <a href="/img/other/sluzby_index/Epinger2_symbol_.svg"><img src="" alt=""></a>
+            
+        </div>
+    </section>
+</article>
+
+<script>
+function adjustClipPath() {
+    const shape = document.querySelector('.responsive-shape');
+    const width = shape.offsetWidth; // Get the element's width
+    const emUnit = width / 16; // Calculate `1em` in pixels (assuming 16px base)
+
+    // Adjust the clip-path with dynamic X-coordinates in `em`
+    const clipPath = `
+    polygon(
+        0em 93%, ${19 / 16}em 93%, ${27 / 16}em 106%, ${50 / 16}em 106%, 
+        ${56 / 16}em 98%, ${76 / 16}em 98%, ${79 / 16}em 93%, ${100 / 16}em 93%, 
+        ${100 / 16}em 7%, ${79 / 16}em 7%, ${73 / 16}em -6%, ${50 / 16}em -6%, 
+        ${44 / 16}em 2%, ${24 / 16}em 2%, ${21 / 16}em 7%, 0em 7%
+    )
+    `;
+
+    shape.style.clipPath = clipPath;
+}
+
+// Adjust clip-path on load and resize
+window.addEventListener('load', adjustClipPath);
+window.addEventListener('resize', adjustClipPath);
+</script>