35 lines
1.1 KiB
PHP
35 lines
1.1 KiB
PHP
<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> |