[ADD] sliding text

main/styleguide/source/css/atoms/heading.pcss

@@ -171,23 +171,41 @@ p {
   display: block;
   margin: 0 auto;
   position: relative;
-  .slick-slide {
-    overflow: hidden;
-    clip-path: polygon(0 0, 100% 0, 100% 90%, 0% 100%);
+  h1 {
+    @apply text-7xl;
+    position: absolute;
+    top: 40%;
+    left: 10%;
+    max-width: 850px;
   }
+
+
   img {
+    clip-path: polygon(0 0, 100% 0, 100% 90%, 0% 100%);
     bottom: 0;
     top: 0;
     left: 0;
     right: 0;
     width: 100%;
-    transition: all 500ms ease-in-out;
-    transform: scale(1.25, 1.25);
+    transition: all 800ms ease-in-out;
+    transform: scale(1.15, 1.15);
   }
   .slick-active {
     img {
       transform: scale(1, 1);
     }
+    h1 {
+      animation: right_to_left 500ms ease;
+    }
+  }
+
+  @keyframes right_to_left {
+    from {
+      left: 15%;
+    }
+    to {
+      left: 10%;
+    }
   }
 
   .slick-arrow {

main/styleguide/source/js/components/header/HeaderCarousel.vue

 <template>
   <div class="header-carousel">
     <vue-slick-carousel v-bind="settings">
-      <div class="xl:h-screen">
+      <div class="xl:h-screen relative">
         <img src="https://unsplash.it/792/387?image=4" draggable="false">
+        <h1>72% domácností bylo násilně digitalizováno</h1>
       </div>
-      <div class="xl:h-screen">
-        <img src="https://unsplash.it/792/387?image=1" draggable="false">
+      <div class="xl:h-screen relative">
+        <img src="https://unsplash.it/792/387?image=4" draggable="false">
+        <h1>72% domácností bylo násilně digitalizováno</h1>
       </div>
-      <div class="xl:h-screen">
-        <img src="https://unsplash.it/792/387?image=2" draggable="false">
+      <div class="xl:h-screen relative">
+        <img src="https://unsplash.it/792/387?image=4" draggable="false">
+        <h1>72% domácností bylo násilně digitalizováno</h1>
       </div>
 <!--      <div class="homepage-item" style="background: url('https://placeimg.com/1920/1080/any?1') no-repeat center / cover">-->
 <!--        <div class="container">-->