Save

wp-content/themes/brpp-prawo-podatki/css/custom.css

@@ -808,6 +808,11 @@ body.page-id-25 main .box-1 .row {
   -moz-column-gap: 40px;
        column-gap: 40px;
 }
+@media (max-width: 575px) {
+  body.page-id-25 main .box-1 .row {
+    min-height: 500px;
+  }
+}
 body.page-id-25 main .box-1 .row .col-1 {
   max-width: 680px;
 }
@@ -846,6 +851,17 @@ body.page-id-25 main .box-1 .row .col-2 {
     max-width: 400px;
   }
 }
+@media (max-width: 575px) {
+  body.page-id-25 main .box-1 .row .col-2 {
+    max-width: unset;
+    width: 100svw;
+    inset: 0;
+  }
+  body.page-id-25 main .box-1 .row .col-2 img {
+    max-width: unset;
+    width: 100%;
+  }
+}
 body.page-id-25 main .box-1 .box-head {
   margin-bottom: 24px;
 }
@@ -1694,6 +1710,7 @@ body.page-id-38 main .box-2 .row .col-2 .tiles {
 }
 body.page-id-38 main .box-2 .row .col-2 .tiles .tile {
   flex-basis: 33.3333333333%;
+  padding-bottom: 230px;
 }
 @media (max-width: 991px) {
   body.page-id-38 main .box-2 .row .col-2 .tiles .tile {
@@ -2862,6 +2879,10 @@ body.blog main.blog-page {
 body.blog main.blog-page .box-1 {
   margin-bottom: 48px;
 }
+body.blog main.blog-page .box-1:hover .box-bg img {
+  transform: scale(1.3);
+  transition: all 10s ease-in-out;
+}
 body.blog main.blog-page .box-1 .box--wrapper {
   position: relative;
   height: 568px;
@@ -2882,6 +2903,7 @@ body.blog main.blog-page .box-1 .box-bg {
   position: absolute;
   inset: 0;
   filter: brightness(0.7);
+  overflow: hidden;
 }
 body.blog main.blog-page .box-1 .box-bg img {
   width: 100%;
@@ -2890,6 +2912,7 @@ body.blog main.blog-page .box-1 .box-bg img {
   height: 100%;
   -o-object-position: center;
      object-position: center;
+  transition: all 250ms ease-in-out;
 }
 body.blog main.blog-page .box-1 .row {
   position: relative;
@@ -3112,7 +3135,7 @@ body.page-id-59 main .box-1 .row .col-1 .contact-cards .contact-card .card-data
   letter-spacing: -0.32px;
 }
 body.page-id-59 main .box-1 .row .col-1 .contact-description p {
-  color: #747474;
+  color: #232323;
   font-weight: 500;
   font-size: 16px;
   line-height: 1.5;

wp-content/themes/brpp-prawo-podatki/css/custom.scss

@@ -829,6 +829,10 @@ body.page-id-25 {
 				align-items: center;
 				column-gap: 40px;
 
+				@include respond-below(sm) {
+					min-height: 500px;
+				}
+
 				.col {
 					&-1 {
 						max-width: 680px;
@@ -861,6 +865,16 @@ body.page-id-25 {
 							transform: translateX(100%);
 							max-width: 400px;
 						}
+						@include respond-below(sm) {
+							max-width: unset;
+							width: 100svw;
+							inset: 0;
+
+							img {
+								max-width: unset;
+								width: 100%;
+							}
+						}
 					}
 				}
 			}
@@ -1429,6 +1443,7 @@ body.page-id-38 {
 
 							.tile {
 								flex-basis: calc(100% / 3);
+								padding-bottom: 230px;
 
 								@include respond-below(lg) {
 									padding-left: 20px;
@@ -2585,6 +2600,15 @@ body.blog {
 		.box-1 {
 			margin-bottom: 48px;
 
+			&:hover {
+				.box-bg {
+					img {
+						transform: scale(1.3);
+						transition: all 10s ease-in-out;
+					}
+				}
+			}
+
 			.box--wrapper {
 				position: relative;
 				height: 568px;
@@ -2602,12 +2626,15 @@ body.blog {
 				position: absolute;
 				inset: 0;
 				filter: brightness(0.7);
+				overflow: hidden;
 
 				img {
 					width: 100%;
 					object-fit: cover;
 					height: 100%;
 					object-position: center;
+
+					transition: all 250ms ease-in-out;
 				}
 			}
 
@@ -2846,7 +2873,7 @@ body.page-id-59 {
 
 						.contact-description {
 							p {
-								color: #747474;
+								color: $cBlack;
 								font-weight: 500;
 								font-size: 16px;
 								line-height: 1.5;

wp-content/themes/brpp-prawo-podatki/js/custom.js

@@ -36,6 +36,26 @@ jQuery(function ($) {
 
 			$(window).on('resize orientationchange', () => ScrollTrigger.refresh())
 		}
+
+		if ($(window).width() <= 576) {
+			const box = document.querySelector('.box-1')
+			const col2 = box.querySelector('.col-2')
+			const row = box.querySelector('.row')
+
+			const moveX = row.offsetLeft - col2.offsetLeft - 30
+			gsap.to(col2, {
+				x: moveX,
+				ease: 'none',
+				scrollTrigger: {
+					trigger: box,
+					start: 'top-=15px top',
+					end: () => `+=${box.offsetHeight}`,
+					scrub: true,
+					pin: true,
+					markers: false,
+				},
+			})
+		}
 	}
 })
 
@@ -134,3 +154,51 @@ jQuery(function ($) {
 		$('body').toggleClass('no-scroll')
 	})
 })
+
+jQuery(function ($) {
+	document.querySelectorAll('.animate-text').forEach((block) => {
+		gsap.fromTo(
+			block.querySelectorAll('.word .char'),
+			{
+				opacity: 0.2,
+			},
+			{
+				scrollTrigger: {
+					trigger: block,
+					start: 'top 80%',
+					toggleActions: 'play none none none',
+				},
+				opacity: 1,
+				duration: 0.3,
+				stagger: {
+					each: 0.02,
+					from: 'start',
+				},
+				ease: 'power2.out',
+			}
+		)
+	})
+})
+
+jQuery(function ($) {
+	gsap.fromTo(
+		document.querySelectorAll('.animate-text-linear .word .char'),
+		{
+			opacity: 0.2,
+		},
+		{
+			scrollTrigger: {
+				trigger: '.animate-text-linear',
+				start: 'top 80%',
+				toggleActions: 'play none none none',
+			},
+			opacity: 1,
+			duration: 0.25,
+			stagger: {
+				each: 0.015,
+				from: 'start',
+			},
+			ease: 'power2.out',
+		}
+	)
+})

wp-content/themes/brpp-prawo-podatki/page-25.php

@@ -112,8 +112,8 @@
                 <div class="row">
                     <div class="big-quote" box-title="<?php echo $box5['mini_title']; ?>">
                         <h3><?php echo $box5['author']; ?></h3>
-                        <div class="big-quote-text">
+                        <div class="big-quote-text animate-text">
-                            <?php echo $box5['text']; ?>
+                            <?php echo split_text_into_spans($box5['text']); ?>
                         </div>
                         <a class="btn_3" href="<?php echo esc_url($box5['btn']['url']); ?>" target="<?php echo esc_attr($box5['btn']['target'] ?: '_self'); ?>">
                             <?php echo esc_html($box5['btn']['title']); ?>
@@ -134,8 +134,8 @@
             <div class="container">
                 <div class="row">
                     <div class="col col-1" box-title="<?php echo $box6['mini_title']; ?>">
-                        <div class="box-text">
+                        <div class="box-text animate-text">
-                            <p><?php echo $box6['text']; ?></p>
+                            <p><?php echo split_text_into_spans($box6['text']); ?></p>
                         </div>
                         <ul>
                             <a class="btn_3" href="<?php echo esc_url($box6['btn']['url']); ?>" target="<?php echo esc_attr($box6['btn']['target'] ?: '_self'); ?>">

wp-content/themes/brpp-prawo-podatki/page-38.php

@@ -23,8 +23,8 @@
                         </div>
                     </div>
                     <div class="col col-2">
-                        <div class="box-text">
+                        <div class="box-text animate-text">
-                            <?php echo wp_kses_post($box1['text']); ?>
+                            <?php echo split_text_into_spans(wp_kses_post($box1['text'])); ?>
                         </div>
                     </div>
                 </div>
@@ -60,11 +60,11 @@
             <div class="container">
                 <div class="row">
                     <div class="col col-1" box-title="<?php echo esc_html($box3['mini_title']); ?>">
-                        <div class="box-title">
+                        <div class="box-title animate-text">
-                            <p><?php echo esc_html($box3['title']); ?></p>
+                            <p><?php echo split_text_into_spans(esc_html($box3['title'])); ?></p>
                         </div>
-                        <div class="box-text">
+                        <div class="box-text animate-text">
-                            <p><?php echo esc_html($box3['text']); ?></p>
+                            <p><?php echo split_text_into_spans(esc_html($box3['text'])); ?></p>
                         </div>
                         <a class="btn_4" href="<?php echo esc_url($box3['btn']['url']); ?>" target="<?php echo esc_attr($box3['btn']['target'] ?: '_self'); ?>">
                             <?php echo esc_html($box3['btn']['title']); ?>
@@ -87,11 +87,11 @@
                         <img src="<?php echo esc_url($box4['img']); ?>" alt="">
                     </div>
                     <div class="col col-2">
-                        <div class="box-title">
+                        <div class="box-title animate-text">
-                            <p><?php echo esc_html($box4['title']); ?></p>
+                            <p><?php echo split_text_into_spans(esc_html($box4['title'])); ?></p>
                         </div>
-                        <div class="box-text">
+                        <div class="box-text animate-text">
-                            <p><?php echo esc_html($box4['text']); ?></p>
+                            <p><?php echo split_text_into_spans(esc_html($box4['text'])); ?></p>
                         </div>
                         <a class="btn_3" href="<?php echo esc_url($box4['btn']['url']); ?>" target="<?php echo esc_attr($box4['btn']['target'] ?: '_self'); ?>">
                             <?php echo esc_html($box4['btn']['title']); ?>

wp-content/themes/brpp-prawo-podatki/page-54.php

@@ -112,8 +112,8 @@
                     <div class="col col-2">
                         <p><?php echo esc_html($box3['title']); ?></p>
 
-                        <div class="box-text">
+                        <div class="box-text animate-text">
-                            <?php echo $box3['text']; ?>
+                            <?php echo split_text_into_spans(wp_kses_post($box3['text'])); ?>
                         </div>
 
                         <ul>

wp-content/themes/brpp-prawo-podatki/page-59.php

@@ -15,25 +15,28 @@
             <div class="container">
                 <div class="row">
                     <div class="col col-1">
-                        <div class="box-head">
+                        <div class="box-head animate-text-linear">
-                            <h2><?php echo esc_html($box1['title']); ?></h2>
+                            <h2><?php echo split_text_into_spans(esc_html($box1['title'])); ?></h2>
                         </div>
-                        <div class="box-text">
+
-                            <p><?php echo esc_html($box1['text']); ?></p>
+                        <div class="box-text animate-text-linear">
+                            <p><?php echo split_text_into_spans(esc_html($box1['text'])); ?></p>
                         </div>
 
                         <div class="contact-cards">
                             <?php foreach ($box1['contacts'] as $item) : ?>
                                 <div class="contact-card">
-                                    <div class="card-title">
+                                    <div class="card-title animate-text-linear">
-                                        <h3><?php echo esc_html($item['title']); ?></h3>
+                                        <h3><?php echo split_text_into_spans(esc_html($item['title'])); ?></h3>
                                     </div>
-                                    <div class="card-data">
+                                    <div class="card-data animate-text-linear">
-                                        <?php echo wp_kses_post($item['text']); ?>
+                                        <?php echo split_text_into_spans(wp_kses_post($item['text'])); ?>
                                         <ul class="card-list">
                                             <?php foreach ($item['contacts_types'] as $contact) : ?>
                                                 <li>
-                                                    <a href="<?php echo esc_url($contact['url']); ?>"><?php echo esc_html($contact['title']); ?></a>
+                                                    <a href="<?php echo esc_url($contact['url']); ?>" class="animate-text-linear">
+                                                        <?php echo split_text_into_spans(esc_html($contact['title'])); ?>
+                                                    </a>
                                                 </li>
                                             <?php endforeach; ?>
                                         </ul>
@@ -42,8 +45,8 @@
                             <?php endforeach; ?>
                         </div>
 
-                        <div class="contact-description">
+                        <div class="contact-description animate-text-linear">
-                            <?php echo wp_kses_post($box1['description']); ?>
+                            <?php echo split_text_into_spans(wp_kses_post($box1['description'])); ?>
                         </div>
                     </div>
                     <div class="col col-2">