test
Signed-off-by: Jeff <jeff@gotenzing.com>
Showing
13 changed files
with
161 additions
and
98 deletions
| ... | @@ -11,19 +11,19 @@ | ... | @@ -11,19 +11,19 @@ |
| 11 | 11 | ||
| 12 | // Create id attribute allowing for custom "anchor" value. | 12 | // Create id attribute allowing for custom "anchor" value. |
| 13 | $id = 'carousel-' . $block['id']; | 13 | $id = 'carousel-' . $block['id']; |
| 14 | if( !empty($block['anchor']) ) { | 14 | if (!empty($block['anchor'])) { |
| 15 | $id = $block['anchor']; | 15 | $id = $block['anchor']; |
| 16 | } | 16 | } |
| 17 | 17 | ||
| 18 | // Create class attribute allowing for custom "className" and "align" values. | 18 | // Create class attribute allowing for custom "className" and "align" values. |
| 19 | $className = 'carousel'; | 19 | $className = 'carousel'; |
| 20 | if( !empty($block['className']) ) { | 20 | if (!empty($block['className'])) { |
| 21 | $className .= ' ' . $block['className']; | 21 | $className .= ' ' . $block['className']; |
| 22 | } | 22 | } |
| 23 | if( !empty($block['align']) ) { | 23 | if (!empty($block['align'])) { |
| 24 | $className .= ' align' . $block['align']; | 24 | $className .= ' align' . $block['align']; |
| 25 | } | 25 | } |
| 26 | if( $is_preview ) { | 26 | if ($is_preview) { |
| 27 | $className .= ' is-admin'; | 27 | $className .= ' is-admin'; |
| 28 | } | 28 | } |
| 29 | 29 | ||
| ... | @@ -38,14 +38,17 @@ $carousel_style = get_field('carousel_style'); | ... | @@ -38,14 +38,17 @@ $carousel_style = get_field('carousel_style'); |
| 38 | ); | 38 | ); |
| 39 | $testimonial_query = new WP_Query($args); | 39 | $testimonial_query = new WP_Query($args); |
| 40 | if ($testimonial_query->have_posts()): ?> | 40 | if ($testimonial_query->have_posts()): ?> |
| 41 | <div class="testimonials-carousel carousel-items <?php echo $size; ?>"><div class='swiper-wrapper'> | 41 | <div class="testimonials-carousel carousel-items <?php echo $size; ?>"> |
| 42 | <?php while ($testimonial_query->have_posts()): $testimonial_query->the_post(); ?> | 42 | <div class='swiper-wrapper'> |
| 43 | <?php while ($testimonial_query->have_posts()): | ||
| 44 | $testimonial_query->the_post(); ?> | ||
| 43 | <div class="swiper-slide"> | 45 | <div class="swiper-slide"> |
| 44 | <div class="testimonials"> | 46 | <div class="testimonials"> |
| 45 | <div class="row"> | ||
| 46 | <div class="col-md-12"> | ||
| 47 | <div class="testimonial-text"> | 47 | <div class="testimonial-text"> |
| 48 | <div class="testimonial-copy"> | 48 | <div class="row"> |
| 49 | <div class="col-md-2 quotes col-sm-12"> | ||
| 50 | </div> | ||
| 51 | <div class="testimonial-copy col-md-10 col-sm-12"> | ||
| 49 | <?php the_content(); ?> | 52 | <?php the_content(); ?> |
| 50 | <div class="testimonial-author"><?php the_title(); ?></div> | 53 | <div class="testimonial-author"><?php the_title(); ?></div> |
| 51 | </div> | 54 | </div> |
| ... | @@ -54,8 +57,8 @@ $carousel_style = get_field('carousel_style'); | ... | @@ -54,8 +57,8 @@ $carousel_style = get_field('carousel_style'); |
| 54 | </div> | 57 | </div> |
| 55 | </div> | 58 | </div> |
| 56 | </div> | 59 | </div> |
| 57 | </div> | 60 | <?php endwhile; |
| 58 | <?php endwhile; wp_reset_postdata(); ?> | 61 | wp_reset_postdata(); ?> |
| 59 | </div> | 62 | </div> |
| 60 | <div class="swiper-pagination"></div> | 63 | <div class="swiper-pagination"></div> |
| 61 | <div class="swiper-button-prev" data-id="<?php echo esc_attr($id); ?>"></div> | 64 | <div class="swiper-button-prev" data-id="<?php echo esc_attr($id); ?>"></div> | ... | ... |
| ... | @@ -14969,6 +14969,10 @@ figure.woocommerce-product-gallery__wrapper { | ... | @@ -14969,6 +14969,10 @@ figure.woocommerce-product-gallery__wrapper { |
| 14969 | font-family: "PT Sans", sans-serif; | 14969 | font-family: "PT Sans", sans-serif; |
| 14970 | } | 14970 | } |
| 14971 | 14971 | ||
| 14972 | html { | ||
| 14973 | overflow-x: hidden; | ||
| 14974 | } | ||
| 14975 | |||
| 14972 | h1, .h1 { | 14976 | h1, .h1 { |
| 14973 | font-family: "Raleway", sans-serif; | 14977 | font-family: "Raleway", sans-serif; |
| 14974 | font-size: 2.5rem; | 14978 | font-size: 2.5rem; |
| ... | @@ -15289,6 +15293,9 @@ ol li ol { | ... | @@ -15289,6 +15293,9 @@ ol li ol { |
| 15289 | margin: 0px -25% 0px -25%; | 15293 | margin: 0px -25% 0px -25%; |
| 15290 | padding: 0px 25%; | 15294 | padding: 0px 25%; |
| 15291 | } | 15295 | } |
| 15296 | .join-callout h2, .join-callout .h2 { | ||
| 15297 | color: #231F20; | ||
| 15298 | } | ||
| 15292 | @media screen and (max-width: 900px) { | 15299 | @media screen and (max-width: 900px) { |
| 15293 | .join-callout { | 15300 | .join-callout { |
| 15294 | margin: 0px -20% 0px -20%; | 15301 | margin: 0px -20% 0px -20%; |
| ... | @@ -15314,6 +15321,9 @@ ol li ol { | ... | @@ -15314,6 +15321,9 @@ ol li ol { |
| 15314 | margin-top: -40px; | 15321 | margin-top: -40px; |
| 15315 | } | 15322 | } |
| 15316 | } | 15323 | } |
| 15324 | .join-callout .wp-block-group__inner-container .wp-block-columns { | ||
| 15325 | margin-bottom: 0px; | ||
| 15326 | } | ||
| 15317 | .join-callout .wp-block-group__inner-container .wp-block-column { | 15327 | .join-callout .wp-block-group__inner-container .wp-block-column { |
| 15318 | display: flex; | 15328 | display: flex; |
| 15319 | flex-direction: column; | 15329 | flex-direction: column; |
| ... | @@ -15346,13 +15356,13 @@ ol li ol { | ... | @@ -15346,13 +15356,13 @@ ol li ol { |
| 15346 | margin: 0px -20% 0px -20%; | 15356 | margin: 0px -20% 0px -20%; |
| 15347 | padding: 0px 20%; | 15357 | padding: 0px 20%; |
| 15348 | width: 140%; | 15358 | width: 140%; |
| 15349 | top: -75px; | 15359 | top: -73px; |
| 15350 | height: 75px; | 15360 | height: 75px; |
| 15351 | } | 15361 | } |
| 15352 | } | 15362 | } |
| 15353 | @media screen and (max-width: 600px) { | 15363 | @media screen and (max-width: 600px) { |
| 15354 | .join-callout::before { | 15364 | .join-callout::before { |
| 15355 | top: -50px; | 15365 | top: -48px; |
| 15356 | height: 50px; | 15366 | height: 50px; |
| 15357 | width: calc(100% + 60px); | 15367 | width: calc(100% + 60px); |
| 15358 | margin: 0 -30px !important; | 15368 | margin: 0 -30px !important; |
| ... | @@ -15556,6 +15566,8 @@ ol li ol { | ... | @@ -15556,6 +15566,8 @@ ol li ol { |
| 15556 | margin-left: 0px; | 15566 | margin-left: 0px; |
| 15557 | } | 15567 | } |
| 15558 | #menu-social.page li { | 15568 | #menu-social.page li { |
| 15569 | height: 48px; | ||
| 15570 | width: 48px; | ||
| 15559 | margin-right: 14px; | 15571 | margin-right: 14px; |
| 15560 | } | 15572 | } |
| 15561 | #menu-social.page li a { | 15573 | #menu-social.page li a { |
| ... | @@ -15655,8 +15667,8 @@ ol li ol { | ... | @@ -15655,8 +15667,8 @@ ol li ol { |
| 15655 | margin-inline-start: 0px; | 15667 | margin-inline-start: 0px; |
| 15656 | -webkit-margin-end: 0px; | 15668 | -webkit-margin-end: 0px; |
| 15657 | margin-inline-end: 0px; | 15669 | margin-inline-end: 0px; |
| 15658 | -webkit-padding-start: 20px; | 15670 | -webkit-padding-start: 0px; |
| 15659 | padding-inline-start: 20px; | 15671 | padding-inline-start: 0px; |
| 15660 | background-color: transparent !important; | 15672 | background-color: transparent !important; |
| 15661 | } | 15673 | } |
| 15662 | @media only screen and (max-width: 768px) { | 15674 | @media only screen and (max-width: 768px) { |
| ... | @@ -15671,10 +15683,6 @@ ol li ol { | ... | @@ -15671,10 +15683,6 @@ ol li ol { |
| 15671 | pointer-events: all !important; | 15683 | pointer-events: all !important; |
| 15672 | } | 15684 | } |
| 15673 | 15685 | ||
| 15674 | .carousel-items.slick-initialized.slick-slider { | ||
| 15675 | margin-right: 15px; | ||
| 15676 | } | ||
| 15677 | |||
| 15678 | .carousel { | 15686 | .carousel { |
| 15679 | width: 100vw; | 15687 | width: 100vw; |
| 15680 | margin-left: calc((100% - 100vw) / 2); | 15688 | margin-left: calc((100% - 100vw) / 2); |
| ... | @@ -15685,8 +15693,20 @@ ol li ol { | ... | @@ -15685,8 +15693,20 @@ ol li ol { |
| 15685 | .carousel .swiper-pagination { | 15693 | .carousel .swiper-pagination { |
| 15686 | bottom: 70px !important; | 15694 | bottom: 70px !important; |
| 15687 | } | 15695 | } |
| 15696 | @media screen and (max-width: 1200px) { | ||
| 15697 | .carousel .swiper-pagination { | ||
| 15698 | bottom: 80px !important; | ||
| 15699 | } | ||
| 15700 | } | ||
| 15688 | .carousel .swiper-wrapper { | 15701 | .carousel .swiper-wrapper { |
| 15689 | gap: 1rem; | 15702 | gap: 0rem; |
| 15703 | width: 100vw; | ||
| 15704 | padding-bottom: 60px; | ||
| 15705 | } | ||
| 15706 | @media screen and (max-width: 1200px) { | ||
| 15707 | .carousel .swiper-wrapper { | ||
| 15708 | padding-bottom: 0px; | ||
| 15709 | } | ||
| 15690 | } | 15710 | } |
| 15691 | 15711 | ||
| 15692 | .testimonials-carousel { | 15712 | .testimonials-carousel { |
| ... | @@ -15694,33 +15714,20 @@ ol li ol { | ... | @@ -15694,33 +15714,20 @@ ol li ol { |
| 15694 | background-size: cover; | 15714 | background-size: cover; |
| 15695 | background-repeat: no-repeat; | 15715 | background-repeat: no-repeat; |
| 15696 | background-position: center; | 15716 | background-position: center; |
| 15697 | height: 337px; | 15717 | height: auto; |
| 15698 | } | ||
| 15699 | @media only screen and (max-width: 768px) { | ||
| 15700 | .testimonials-carousel { | ||
| 15701 | width: calc(100% - 2rem) !important; | ||
| 15702 | margin-left: auto !important; | ||
| 15703 | margin-ight: auto !important; | ||
| 15704 | } | ||
| 15705 | } | 15718 | } |
| 15706 | .testimonials-carousel .swiper-slide { | 15719 | .testimonials-carousel .swiper-slide { |
| 15707 | width: 100%; | 15720 | width: 100% !important; |
| 15708 | } | 15721 | } |
| 15709 | .testimonials-carousel .swiper-slide .testimonials { | 15722 | .testimonials-carousel .swiper-slide .testimonials { |
| 15710 | background: transparent; | 15723 | background: transparent; |
| 15711 | margin-right: 20px; | ||
| 15712 | } | ||
| 15713 | .testimonials-carousel .swiper-slide .testimonials .row { | ||
| 15714 | margin-right: 0rem !important; | ||
| 15715 | margin-left: -15px !important; | ||
| 15716 | min-height: 316px !important; | ||
| 15717 | } | 15724 | } |
| 15718 | .testimonials-carousel .swiper-slide .testimonials .col-md-1 { | 15725 | .testimonials-carousel .swiper-slide .testimonials .col-md-1 { |
| 15719 | background-size: cover; | 15726 | background-size: cover; |
| 15720 | } | 15727 | } |
| 15721 | .testimonials-carousel .swiper-slide .testimonials .testimonial-text { | 15728 | .testimonials-carousel .swiper-slide .testimonials .testimonial-text { |
| 15722 | padding: 30px 50px; | 15729 | padding: 30px 50px; |
| 15723 | width: 80%; | 15730 | width: 100%; |
| 15724 | margin: auto; | 15731 | margin: auto; |
| 15725 | margin-top: 50px; | 15732 | margin-top: 50px; |
| 15726 | background-color: #fff; | 15733 | background-color: #fff; |
| ... | @@ -15729,10 +15736,21 @@ ol li ol { | ... | @@ -15729,10 +15736,21 @@ ol li ol { |
| 15729 | max-width: 1068px; | 15736 | max-width: 1068px; |
| 15730 | position: relative; | 15737 | position: relative; |
| 15731 | } | 15738 | } |
| 15732 | .testimonials-carousel .swiper-slide .testimonials .testimonial-copy::after { | 15739 | @media screen and (max-width: 1200px) { |
| 15740 | .testimonials-carousel .swiper-slide .testimonials .testimonial-text { | ||
| 15741 | width: 80%; | ||
| 15742 | min-height: unset; | ||
| 15743 | margin-bottom: 60px; | ||
| 15744 | padding-bottom: 70px; | ||
| 15745 | } | ||
| 15746 | } | ||
| 15747 | .testimonials-carousel .swiper-slide .testimonials .quotes { | ||
| 15748 | height: 120px; | ||
| 15749 | } | ||
| 15750 | .testimonials-carousel .swiper-slide .testimonials .quotes::after { | ||
| 15733 | position: absolute; | 15751 | position: absolute; |
| 15734 | top: 0px; | 15752 | top: 0px; |
| 15735 | left: 69px; | 15753 | left: 40px; |
| 15736 | background-repeat: no-repeat; | 15754 | background-repeat: no-repeat; |
| 15737 | background-size: contain; | 15755 | background-size: contain; |
| 15738 | width: 94px; | 15756 | width: 94px; |
| ... | @@ -15741,9 +15759,13 @@ ol li ol { | ... | @@ -15741,9 +15759,13 @@ ol li ol { |
| 15741 | display: block; | 15759 | display: block; |
| 15742 | background-image: url("/wp-content/themes/understrap-child/images/qu.png"); | 15760 | background-image: url("/wp-content/themes/understrap-child/images/qu.png"); |
| 15743 | } | 15761 | } |
| 15744 | .testimonials-carousel .swiper-slide .testimonials .testimonial-copy { | 15762 | @media screen and (max-width: 768px) { |
| 15745 | margin-left: 15%; | 15763 | .testimonials-carousel .swiper-slide .testimonials .quotes::after { |
| 15746 | margin-right: 7%; | 15764 | position: relative; |
| 15765 | top: 0px; | ||
| 15766 | margin: auto; | ||
| 15767 | left: unset; | ||
| 15768 | } | ||
| 15747 | } | 15769 | } |
| 15748 | .testimonials-carousel .swiper-slide .testimonials p { | 15770 | .testimonials-carousel .swiper-slide .testimonials p { |
| 15749 | font-size: 1.13rem !important; | 15771 | font-size: 1.13rem !important; |
| ... | @@ -15761,8 +15783,11 @@ ol li ol { | ... | @@ -15761,8 +15783,11 @@ ol li ol { |
| 15761 | font-family: "Chalkduster", sans-serif; | 15783 | font-family: "Chalkduster", sans-serif; |
| 15762 | } | 15784 | } |
| 15763 | 15785 | ||
| 15764 | .page:not(.page-template-no-title) .testimonials-carousel { | 15786 | .page-template-no-title .testimonials { |
| 15765 | padding-right: 25%; | 15787 | margin-right: 0 !important; |
| 15788 | } | ||
| 15789 | .page-template-no-title .testimonials-carousel { | ||
| 15790 | padding-right: 0%; | ||
| 15766 | } | 15791 | } |
| 15767 | 15792 | ||
| 15768 | .has-blue-color, | 15793 | .has-blue-color, | ... | ... |
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
| ... | @@ -12236,24 +12236,22 @@ | ... | @@ -12236,24 +12236,22 @@ |
| 12236 | 12236 | ||
| 12237 | jQuery(document).ready(function ($) { | 12237 | jQuery(document).ready(function ($) { |
| 12238 | jQuery('.carousel-items').each(function () { | 12238 | jQuery('.carousel-items').each(function () { |
| 12239 | var offset = (window.innerWidth - $('.entry-content').width()) / 2 - 28; | 12239 | // var offset = ((window.innerWidth - $('.entry-content').width()) / 2) - 28; |
| 12240 | var offsetAfter = (window.innerWidth - $('.entry-content').width()) / 2 - 28; | 12240 | // var offsetAfter = ((window.innerWidth - $('.entry-content').width()) / 2) - 28; |
| 12241 | var PerView = 'auto'; | 12241 | var PerView = 'auto'; |
| 12242 | var space = 20; | 12242 | var space = 20; |
| 12243 | var SlidesPerGroup = 1; | 12243 | var SlidesPerGroup = 1; |
| 12244 | var _id = jQuery(this).parent().attr('id'); | 12244 | var _id = jQuery(this).parent().attr('id'); |
| 12245 | if ($(window).width() < 600) { | 12245 | if ($(window).width() < 600) { |
| 12246 | offset = 0; | ||
| 12247 | PerView = 1; | 12246 | PerView = 1; |
| 12248 | SlidesPerGroup = 1; | 12247 | SlidesPerGroup = 1; |
| 12249 | space = 0; | 12248 | space = 0; |
| 12250 | offsetAfter = 0; | ||
| 12251 | } | 12249 | } |
| 12252 | var swiper_params = { | 12250 | var swiper_params = { |
| 12253 | modules: [Navigation, Pagination, A11y, Keyboard], | 12251 | modules: [Navigation, Pagination, A11y, Keyboard], |
| 12254 | slidesPerView: PerView, | 12252 | slidesPerView: PerView, |
| 12255 | slidesOffsetAfter: offsetAfter, | 12253 | //slidesOffsetAfter: offsetAfter, |
| 12256 | slidesOffsetBefore: offset, | 12254 | //slidesOffsetBefore: offset, |
| 12257 | spaceBetween: space, | 12255 | spaceBetween: space, |
| 12258 | slidesPerGroup: SlidesPerGroup, | 12256 | slidesPerGroup: SlidesPerGroup, |
| 12259 | pagination: { | 12257 | pagination: { | ... | ... |
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
This diff could not be displayed because it is too large.
| ... | @@ -17,8 +17,8 @@ jQuery(document).ready(function($) { | ... | @@ -17,8 +17,8 @@ jQuery(document).ready(function($) { |
| 17 | 17 | ||
| 18 | jQuery('.carousel-items').each(function() { | 18 | jQuery('.carousel-items').each(function() { |
| 19 | 19 | ||
| 20 | var offset = ((window.innerWidth - $('.entry-content').width()) / 2) - 28; | 20 | // var offset = ((window.innerWidth - $('.entry-content').width()) / 2) - 28; |
| 21 | var offsetAfter = ((window.innerWidth - $('.entry-content').width()) / 2) - 28; | 21 | // var offsetAfter = ((window.innerWidth - $('.entry-content').width()) / 2) - 28; |
| 22 | var PerView = 'auto'; | 22 | var PerView = 'auto'; |
| 23 | var space = 20; | 23 | var space = 20; |
| 24 | var SlidesPerGroup= 1; | 24 | var SlidesPerGroup= 1; |
| ... | @@ -28,11 +28,11 @@ jQuery(document).ready(function($) { | ... | @@ -28,11 +28,11 @@ jQuery(document).ready(function($) { |
| 28 | 28 | ||
| 29 | 29 | ||
| 30 | if ($(window).width() < 600) { | 30 | if ($(window).width() < 600) { |
| 31 | offset = 0; | 31 | var offset = 0; |
| 32 | PerView = 1; | 32 | PerView = 1; |
| 33 | SlidesPerGroup = 1; | 33 | SlidesPerGroup = 1; |
| 34 | space = 0; | 34 | space = 0; |
| 35 | offsetAfter = 0; | 35 | var offsetAfter = 0; |
| 36 | 36 | ||
| 37 | } | 37 | } |
| 38 | 38 | ||
| ... | @@ -41,8 +41,8 @@ jQuery(document).ready(function($) { | ... | @@ -41,8 +41,8 @@ jQuery(document).ready(function($) { |
| 41 | var swiper_params = { | 41 | var swiper_params = { |
| 42 | modules: [Navigation, Pagination, A11y, Keyboard], | 42 | modules: [Navigation, Pagination, A11y, Keyboard], |
| 43 | slidesPerView: PerView, | 43 | slidesPerView: PerView, |
| 44 | slidesOffsetAfter: offsetAfter, | 44 | //slidesOffsetAfter: offsetAfter, |
| 45 | slidesOffsetBefore: offset, | 45 | //slidesOffsetBefore: offset, |
| 46 | spaceBetween: space, | 46 | spaceBetween: space, |
| 47 | slidesPerGroup: SlidesPerGroup , | 47 | slidesPerGroup: SlidesPerGroup , |
| 48 | pagination: { | 48 | pagination: { | ... | ... |
| ... | @@ -5,6 +5,7 @@ | ... | @@ -5,6 +5,7 @@ |
| 5 | width: 13px !important; | 5 | width: 13px !important; |
| 6 | opacity: 1 !important; | 6 | opacity: 1 !important; |
| 7 | } | 7 | } |
| 8 | |||
| 8 | .swiper-pagination-bullet-active { | 9 | .swiper-pagination-bullet-active { |
| 9 | background: #3f9c35 !important; | 10 | background: #3f9c35 !important; |
| 10 | border: 2px solid #3f9c35 !important; | 11 | border: 2px solid #3f9c35 !important; |
| ... | @@ -22,8 +23,9 @@ | ... | @@ -22,8 +23,9 @@ |
| 22 | margin-block-end: 0em; | 23 | margin-block-end: 0em; |
| 23 | margin-inline-start: 0px; | 24 | margin-inline-start: 0px; |
| 24 | margin-inline-end: 0px; | 25 | margin-inline-end: 0px; |
| 25 | padding-inline-start: 20px; | 26 | padding-inline-start: 0px; |
| 26 | background-color: transparent !important; | 27 | background-color: transparent !important; |
| 28 | |||
| 27 | @media only screen and (max-width: 768px) { | 29 | @media only screen and (max-width: 768px) { |
| 28 | padding-inline-start: 0px; | 30 | padding-inline-start: 0px; |
| 29 | } | 31 | } |
| ... | @@ -34,9 +36,7 @@ | ... | @@ -34,9 +36,7 @@ |
| 34 | pointer-events: all !important; | 36 | pointer-events: all !important; |
| 35 | } | 37 | } |
| 36 | 38 | ||
| 37 | .carousel-items.slick-initialized.slick-slider { | 39 | .carousel-items.slick-initialized.slick-slider {} |
| 38 | margin-right: 15px; //for the scroll bar | ||
| 39 | } | ||
| 40 | 40 | ||
| 41 | .carousel { | 41 | .carousel { |
| 42 | width: 100vw; | 42 | width: 100vw; |
| ... | @@ -45,54 +45,52 @@ | ... | @@ -45,54 +45,52 @@ |
| 45 | 45 | ||
| 46 | left: 0 !important; | 46 | left: 0 !important; |
| 47 | min-height: 340px !important; | 47 | min-height: 340px !important; |
| 48 | |||
| 48 | .swiper-button-next { | 49 | .swiper-button-next { |
| 49 | //right: 15% !important; | 50 | //right: 15% !important; |
| 50 | } | 51 | } |
| 52 | |||
| 51 | .swiper-button-prev { | 53 | .swiper-button-prev { |
| 52 | //left: 11% !important; | 54 | //left: 11% !important; |
| 53 | 55 | ||
| 54 | } | 56 | } |
| 57 | |||
| 55 | .swiper-pagination { | 58 | .swiper-pagination { |
| 56 | bottom: 70px !important; | 59 | bottom: 70px !important; |
| 60 | @media screen and (max-width: 1200px) { | ||
| 61 | bottom: 80px !important; | ||
| 57 | } | 62 | } |
| 58 | .carousel-items { | ||
| 59 | |||
| 60 | } | 63 | } |
| 61 | .swiper-wrapper { | ||
| 62 | gap: 1rem; | ||
| 63 | 64 | ||
| 65 | .carousel-items {} | ||
| 66 | |||
| 67 | .swiper-wrapper { | ||
| 68 | gap: 0rem; | ||
| 69 | width: 100vw; | ||
| 70 | padding-bottom: 60px; | ||
| 71 | @media screen and (max-width: 1200px) { | ||
| 72 | padding-bottom: 0px; | ||
| 73 | } | ||
| 64 | } | 74 | } |
| 65 | } | 75 | } |
| 66 | 76 | ||
| 67 | 77 | ||
| 68 | // testimonials carousel css | 78 | // testimonials carousel css |
| 69 | .testimonials-carousel { | 79 | .testimonials-carousel { |
| 70 | background-image:url("/wp-content/themes/understrap-child/images/orange-background.png"); | 80 | background-image: url("/wp-content/themes/understrap-child/images/orange-background.png"); |
| 71 | background-size: cover; | 81 | background-size: cover; |
| 72 | background-repeat: no-repeat; | 82 | background-repeat: no-repeat; |
| 73 | background-position: center; | 83 | background-position: center; |
| 74 | height: 337px; | 84 | height: auto; |
| 75 | @media only screen and (max-width: 768px) { | 85 | |
| 76 | width: calc(100% - 2rem) !important; | ||
| 77 | margin-left: auto !important; | ||
| 78 | margin-ight: auto !important; | ||
| 79 | } | ||
| 80 | .swiper-slide { | 86 | .swiper-slide { |
| 81 | width: 100%; | 87 | width: 100% !important; |
| 82 | 88 | ||
| 83 | .testimonials { | 89 | .testimonials { |
| 84 | 90 | ||
| 85 | background: transparent; | 91 | background: transparent; |
| 86 | 92 | ||
| 87 | 93 | ||
| 88 | margin-right: 20px; | ||
| 89 | |||
| 90 | .row { | ||
| 91 | margin-right: 0rem !important; | ||
| 92 | margin-left: -15px !important; | ||
| 93 | min-height: 316px !important; | ||
| 94 | |||
| 95 | } | ||
| 96 | 94 | ||
| 97 | .col-md-1 { | 95 | .col-md-1 { |
| 98 | background-size: cover; | 96 | background-size: cover; |
| ... | @@ -101,31 +99,50 @@ | ... | @@ -101,31 +99,50 @@ |
| 101 | 99 | ||
| 102 | .testimonial-text { | 100 | .testimonial-text { |
| 103 | padding: 30px 50px; | 101 | padding: 30px 50px; |
| 104 | width: 80%; | 102 | width: 100%; |
| 105 | margin: auto; | 103 | margin: auto; |
| 106 | margin-top:50px ; | 104 | margin-top: 50px; |
| 107 | background-color: #fff; | 105 | background-color: #fff; |
| 108 | border-radius: 25px; | 106 | border-radius: 25px; |
| 109 | min-height: 230px; | 107 | min-height: 230px; |
| 110 | max-width: 1068px; | 108 | max-width: 1068px; |
| 111 | position: relative; | 109 | position: relative; |
| 110 | |||
| 111 | @media screen and (max-width: 1200px) { | ||
| 112 | width: 80%; | ||
| 113 | min-height: unset; | ||
| 114 | margin-bottom: 60px; | ||
| 115 | padding-bottom: 70px; | ||
| 116 | } | ||
| 112 | } | 117 | } |
| 113 | 118 | ||
| 114 | .testimonial-copy::after{ | 119 | .quotes { |
| 120 | height: 120px; | ||
| 121 | } | ||
| 122 | |||
| 123 | .quotes::after { | ||
| 115 | position: absolute; | 124 | position: absolute; |
| 116 | top: 0px; | 125 | top: 0px; |
| 117 | left: 69px; | 126 | left: 40px; |
| 118 | background-repeat: no-repeat; | 127 | background-repeat: no-repeat; |
| 119 | background-size: contain; | 128 | background-size: contain; |
| 120 | width:94px; | 129 | width: 94px; |
| 121 | height:150px; | 130 | height: 150px; |
| 122 | content:""; | 131 | content: ""; |
| 123 | display: block; | 132 | display: block; |
| 124 | background-image:url("/wp-content/themes/understrap-child/images/qu.png"); | 133 | background-image: url("/wp-content/themes/understrap-child/images/qu.png"); |
| 134 | |||
| 135 | @media screen and (max-width: 768px) { | ||
| 136 | position: relative; | ||
| 137 | top: 0px; | ||
| 138 | margin: auto; | ||
| 139 | left: unset; | ||
| 140 | } | ||
| 125 | } | 141 | } |
| 126 | .testimonial-copy{ | 142 | |
| 127 | margin-left:15%; | 143 | .testimonial-copy { |
| 128 | margin-right:7%; | 144 | //margin-left: 15%; |
| 145 | //margin-right: 7%; | ||
| 129 | } | 146 | } |
| 130 | 147 | ||
| 131 | p { | 148 | p { |
| ... | @@ -134,7 +151,8 @@ | ... | @@ -134,7 +151,8 @@ |
| 134 | color: #63656B; | 151 | color: #63656B; |
| 135 | font-family: "PT Sans", sans-serif; | 152 | font-family: "PT Sans", sans-serif; |
| 136 | } | 153 | } |
| 137 | .testimonial-author{ | 154 | |
| 155 | .testimonial-author { | ||
| 138 | font-size: 1.13rem !important; | 156 | font-size: 1.13rem !important; |
| 139 | line-height: 1.5rem !important; | 157 | line-height: 1.5rem !important; |
| 140 | font-weight: 700; | 158 | font-weight: 700; |
| ... | @@ -151,8 +169,14 @@ | ... | @@ -151,8 +169,14 @@ |
| 151 | 169 | ||
| 152 | } | 170 | } |
| 153 | 171 | ||
| 154 | .page:not(.page-template-no-title){ | 172 | .page-template-no-title { |
| 155 | .testimonials-carousel{ | 173 | .testimonials { |
| 156 | padding-right: 25%; | 174 | margin-right: 0 !important; |
| 157 | } | 175 | } |
| 176 | |||
| 177 | .testimonials-carousel { | ||
| 178 | padding-right: 0%; | ||
| 179 | } | ||
| 180 | |||
| 181 | |||
| 158 | } | 182 | } |
| ... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
| ... | @@ -5,6 +5,10 @@ | ... | @@ -5,6 +5,10 @@ |
| 5 | } | 5 | } |
| 6 | 6 | ||
| 7 | 7 | ||
| 8 | html { | ||
| 9 | overflow-x: hidden; | ||
| 10 | } | ||
| 11 | |||
| 8 | h1{ | 12 | h1{ |
| 9 | font-family: "Raleway", sans-serif; | 13 | font-family: "Raleway", sans-serif; |
| 10 | font-size: 2.5rem; | 14 | font-size: 2.5rem; |
| ... | @@ -316,6 +320,9 @@ ul:not(.navbar-nav):not(.menu){ | ... | @@ -316,6 +320,9 @@ ul:not(.navbar-nav):not(.menu){ |
| 316 | background-color: #a3d55f; | 320 | background-color: #a3d55f; |
| 317 | margin: 0px -25% 0px -25%; | 321 | margin: 0px -25% 0px -25%; |
| 318 | padding: 0px 25%; | 322 | padding: 0px 25%; |
| 323 | h2{ | ||
| 324 | color:#231F20 ; | ||
| 325 | } | ||
| 319 | @media screen and (max-width: 900px) { | 326 | @media screen and (max-width: 900px) { |
| 320 | margin: 0px -20% 0px -20%; | 327 | margin: 0px -20% 0px -20%; |
| 321 | padding: 0px 20%; | 328 | padding: 0px 20%; |
| ... | @@ -333,7 +340,9 @@ ul:not(.navbar-nav):not(.menu){ | ... | @@ -333,7 +340,9 @@ ul:not(.navbar-nav):not(.menu){ |
| 333 | @media screen and (max-width: 600px) { | 340 | @media screen and (max-width: 600px) { |
| 334 | margin-top:-40px; | 341 | margin-top:-40px; |
| 335 | } | 342 | } |
| 336 | 343 | .wp-block-columns{ | |
| 344 | margin-bottom: 0px; | ||
| 345 | } | ||
| 337 | .wp-block-column{ | 346 | .wp-block-column{ |
| 338 | display: flex; | 347 | display: flex; |
| 339 | flex-direction: column; | 348 | flex-direction: column; |
| ... | @@ -366,11 +375,11 @@ ul:not(.navbar-nav):not(.menu){ | ... | @@ -366,11 +375,11 @@ ul:not(.navbar-nav):not(.menu){ |
| 366 | margin: 0px -20% 0px -20%; | 375 | margin: 0px -20% 0px -20%; |
| 367 | padding: 0px 20%; | 376 | padding: 0px 20%; |
| 368 | width: 140%; | 377 | width: 140%; |
| 369 | top: -75px; | 378 | top: -73px; |
| 370 | height: 75px; | 379 | height: 75px; |
| 371 | } | 380 | } |
| 372 | @media screen and (max-width: 600px) { | 381 | @media screen and (max-width: 600px) { |
| 373 | top: -50px; | 382 | top: -48px; |
| 374 | height: 50px; | 383 | height: 50px; |
| 375 | width: calc(100% + 60px); | 384 | width: calc(100% + 60px); |
| 376 | margin: 0 -30px !important; | 385 | margin: 0 -30px !important; | ... | ... |
| ... | @@ -132,11 +132,15 @@ | ... | @@ -132,11 +132,15 @@ |
| 132 | #menu-social.page{ | 132 | #menu-social.page{ |
| 133 | margin-left: 0px; | 133 | margin-left: 0px; |
| 134 | li { | 134 | li { |
| 135 | height:48px; | ||
| 136 | width:48px; | ||
| 137 | margin-right:14px; | ||
| 135 | a{ | 138 | a{ |
| 136 | height:48px; | 139 | height:48px; |
| 137 | width:48px; | 140 | width:48px; |
| 141 | |||
| 138 | } | 142 | } |
| 139 | margin-right:14px; | 143 | |
| 140 | } | 144 | } |
| 141 | a::after{ | 145 | a::after{ |
| 142 | top: 11px; | 146 | top: 11px; | ... | ... |
-
Please register or sign in to post a comment