Skip to content

Jeff Balicki / st_joseph

Go to a project
Toggle navigation
Toggle navigation pinning
2566d956 by Jeff Balicki
Options

course page done 

Signed-off-by: Jeff <jeff@gotenzing.com>
1 parent 2b0f5b2c
Inline Side-by-side
Showing 18 changed files with 531 additions and 162 deletions
...@@ -86,9 +86,9 @@ error_log($carousel_style ); ...@@ -86,9 +86,9 @@ error_log($carousel_style );
86 <?php $image = get_sub_field('image'); ?> 86 <?php $image = get_sub_field('image'); ?>
87 87
88 <div class="row"> 88 <div class="row">
89 <div class="col col-sm-4" style=background-image:url(<?php echo $image['url'];?>); > 89 <div class="col-lg-4 col-md-1" style=background-image:url(<?php echo $image['url'];?>); >
90 </div> 90 </div>
91 <div class="col col-sm-8"> 91 <div class="col-lg-8 col-md-1">
92 <div class="testimonial-text"><p><?php the_sub_field('text'); ?></p></div></div> 92 <div class="testimonial-text"><p><?php the_sub_field('text'); ?></p></div></div>
93 </div> 93 </div>
94 94
......
...@@ -14469,6 +14469,17 @@ body { ...@@ -14469,6 +14469,17 @@ body {
14469 font-family: "Open Sans", sans-serif; 14469 font-family: "Open Sans", sans-serif;
14470 } 14470 }
14471 14471
14472 @media only screen and (max-width: 600px) {
14473 .site {
14474 overflow-x: hidden;
14475 }
14476 #full-width-page-wrapper {
14477 overflow-x: hidden;
14478 }
14479 #content {
14480 overflow-x: hidden;
14481 }
14482 }
14472 h1, .h1 { 14483 h1, .h1 {
14473 font-size: 58px; 14484 font-size: 58px;
14474 line-height: 72px; 14485 line-height: 72px;
...@@ -14913,6 +14924,12 @@ input[type=checkbox] { ...@@ -14913,6 +14924,12 @@ input[type=checkbox] {
14913 padding-inline-start: 20px; 14924 padding-inline-start: 20px;
14914 background-color: transparent !important; 14925 background-color: transparent !important;
14915 } 14926 }
14927 @media only screen and (max-width: 600px) {
14928 .carousel-items {
14929 -webkit-padding-start: 0px;
14930 padding-inline-start: 0px;
14931 }
14932 }
14916 14933
14917 .swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled { 14934 .swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
14918 pointer-events: all !important; 14935 pointer-events: all !important;
...@@ -14928,12 +14945,23 @@ input[type=checkbox] { ...@@ -14928,12 +14945,23 @@ input[type=checkbox] {
14928 left: 0 !important; 14945 left: 0 !important;
14929 min-height: 340px !important; 14946 min-height: 340px !important;
14930 } 14947 }
14948 @media only screen and (max-width: 600px) {
14949 .carousel {
14950 width: 95%;
14951 margin-left: 0px;
14952 }
14953 }
14931 .carousel .swiper-button-next { 14954 .carousel .swiper-button-next {
14932 right: 8px !important; 14955 right: 8px !important;
14933 } 14956 }
14934 .carousel .swiper-button-prev { 14957 .carousel .swiper-button-prev {
14935 left: 7px !important; 14958 left: 7px !important;
14936 } 14959 }
14960 @media only screen and (max-width: 600px) {
14961 .carousel .swiper-button-prev {
14962 left: -5px !important;
14963 }
14964 }
14937 .carousel .swiper-pagination { 14965 .carousel .swiper-pagination {
14938 bottom: -20px !important; 14966 bottom: -20px !important;
14939 } 14967 }
...@@ -14944,24 +14972,50 @@ input[type=checkbox] { ...@@ -14944,24 +14972,50 @@ input[type=checkbox] {
14944 gap: 1rem; 14972 gap: 1rem;
14945 } 14973 }
14946 14974
14975 @media only screen and (max-width: 600px) {
14976 .testimonials-carousel {
14977 margin-left: 0px !important;
14978 }
14979 }
14947 .testimonials-carousel .swiper-slide { 14980 .testimonials-carousel .swiper-slide {
14948 width: 890px !important; 14981 width: 890px !important;
14949 } 14982 }
14983 @media only screen and (max-width: 600px) {
14984 .testimonials-carousel .swiper-slide {
14985 width: 98% !important;
14986 }
14987 }
14950 .testimonials-carousel .swiper-slide .testimonials { 14988 .testimonials-carousel .swiper-slide .testimonials {
14951 width: 890px; 14989 width: 890px;
14952 background: #E5F2F8; 14990 background: #E5F2F8;
14953 border-radius: 25px 25px 0px 0px; 14991 border-radius: 25px 25px 0px 0px;
14954 margin-right: 20px; 14992 margin-right: 20px;
14955 } 14993 }
14994 @media only screen and (max-width: 600px) {
14995 .testimonials-carousel .swiper-slide .testimonials {
14996 width: 98%;
14997 margin-right: 0px;
14998 }
14999 }
14956 .testimonials-carousel .swiper-slide .testimonials .row { 15000 .testimonials-carousel .swiper-slide .testimonials .row {
14957 margin-right: 0rem !important; 15001 margin-right: 0rem !important;
14958 border-bottom: 20px solid #FFA300; 15002 border-bottom: 20px solid #FFA300;
14959 margin-left: -15px !important; 15003 margin-left: -15px !important;
14960 min-height: 316px !important; 15004 min-height: 316px !important;
14961 } 15005 }
14962 .testimonials-carousel .swiper-slide .testimonials .col { 15006 @media only screen and (max-width: 600px) {
15007 .testimonials-carousel .swiper-slide .testimonials .row {
15008 margin-left: 0px !important;
15009 }
15010 }
15011 .testimonials-carousel .swiper-slide .testimonials .col-md-1 {
14963 background-size: cover; 15012 background-size: cover;
14964 } 15013 }
15014 @media only screen and (max-width: 600px) {
15015 .testimonials-carousel .swiper-slide .testimonials .col-md-1 {
15016 padding-left: 0px;
15017 }
15018 }
14965 .testimonials-carousel .swiper-slide .testimonials .testimonial-text { 15019 .testimonials-carousel .swiper-slide .testimonials .testimonial-text {
14966 padding: 30px 50px; 15020 padding: 30px 50px;
14967 } 15021 }
...@@ -15102,13 +15156,17 @@ input[type=checkbox] { ...@@ -15102,13 +15156,17 @@ input[type=checkbox] {
15102 .custom-addtoany { 15156 .custom-addtoany {
15103 background-color: #0484B8; 15157 background-color: #0484B8;
15104 position: fixed; 15158 position: fixed;
15105 top: 217px; 15159 top: 185px;
15106 z-index: 999; 15160 z-index: 999;
15107 right: 0px; 15161 right: 0px;
15108 width: 48px; 15162 width: 48px;
15109 padding: 8px 10px; 15163 padding: 8px 10px;
15110 } 15164 }
15111 15165
15166 .admin-bar .custom-addtoany {
15167 top: 217px;
15168 }
15169
15112 .jssocials-share-logo { 15170 .jssocials-share-logo {
15113 width: 1em; 15171 width: 1em;
15114 vertical-align: top; 15172 vertical-align: top;
...@@ -15431,6 +15489,81 @@ label[for=quicksearch] { ...@@ -15431,6 +15489,81 @@ label[for=quicksearch] {
15431 display: none; 15489 display: none;
15432 } 15490 }
15433 15491
15492 .type-sfwd-courses {
15493 margin-top: 30px;
15494 }
15495
15496 .program-info {
15497 background: #FFFFFF 0% 0% no-repeat padding-box;
15498 box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1607843137);
15499 max-width: 531px;
15500 }
15501 .program-info #program-info .nav-item {
15502 width: 50%;
15503 border: 0px solid #ccc;
15504 }
15505 .program-info #program-info .nav-item .nav-link {
15506 width: 100%;
15507 border-radius: 0px;
15508 background-color: #0081BC;
15509 color: #FFFFFF;
15510 border: 0px solid #ccc;
15511 font-size: 18px;
15512 padding: 20px 20px;
15513 font-family: "Poppins", sans-serif;
15514 }
15515 .program-info #program-info .nav-item .nav-link.active {
15516 background-color: #FFFFFF;
15517 color: #0081BC;
15518 }
15519 .program-info #program-info-content {
15520 padding: 20px 40px 40px 40px;
15521 }
15522 .program-info #program-info-content table {
15523 width: 100%;
15524 }
15525 .program-info #program-info-content table tr th {
15526 width: 33%;
15527 font-size: 18px;
15528 color: #0081BC;
15529 font-family: "Poppins", sans-serif;
15530 }
15531 .program-info #program-info-content table tr:not(.not) {
15532 border-bottom: 1px solid #FFA300;
15533 }
15534 .program-info #program-info-content table tr:not(.not) td {
15535 font-size: 16px;
15536 padding: 10px 0px;
15537 }
15538
15539 .outcomes {
15540 margin: 70px 0px;
15541 }
15542 .outcomes .outcome {
15543 width: 100%;
15544 min-height: 227px;
15545 background-color: #E2F2F9;
15546 padding: 25px 25px 25px 15px;
15547 border-radius: 25px 25px 0px 0px;
15548 border-bottom: 22px solid #FFA300;
15549 font-size: 16px;
15550 line-height: 24px;
15551 }
15552 @media only screen and (max-width: 600px) {
15553 .outcomes .col-out {
15554 margin-top: 20px;
15555 }
15556 }
15557 .outcomes .col-out:nth-of-type(2) .outcome {
15558 border-bottom: 22px solid #3F9C35;
15559 }
15560 .outcomes .col-out:nth-of-type(3) .outcome {
15561 border-bottom: 22px solid #0484B8;
15562 }
15563 .outcomes .col-out:nth-of-type(4) .outcome {
15564 border-bottom: 22px solid #E04E39;
15565 }
15566
15434 .has-blue-color, 15567 .has-blue-color,
15435 .has-blue-color:visited { 15568 .has-blue-color:visited {
15436 color: #0d6efd; 15569 color: #0d6efd;
......
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.
...@@ -13787,6 +13787,12 @@ ...@@ -13787,6 +13787,12 @@
13787 offsetAfter = 0; 13787 offsetAfter = 0;
13788 _id = jQuery(this).attr('id'); 13788 _id = jQuery(this).attr('id');
13789 } 13789 }
13790 if ($(window).width() < 600) {
13791 offset = 0;
13792 PerView = 1;
13793 space = 0;
13794 offsetAfter = 0;
13795 }
13790 var swiper_params = { 13796 var swiper_params = {
13791 modules: [Navigation, Pagination, A11y, Keyboard], 13797 modules: [Navigation, Pagination, A11y, Keyboard],
13792 slidesPerView: PerView, 13798 slidesPerView: PerView,
...@@ -17627,159 +17633,161 @@ ...@@ -17627,159 +17633,161 @@
17627 17633
17628 jQueryBridget('isotope', Isotope, $); 17634 jQueryBridget('isotope', Isotope, $);
17629 require$$0__default["default"](document).ready(function ($) { 17635 require$$0__default["default"](document).ready(function ($) {
17630 // quick search regex 17636 if ($('.grid').length) {
17631 var qsRegex; 17637 // quick search regex
17632 17638 var qsRegex;
17633 // init Isotope 17639
17634 var $grid = $('.grid').isotope({ 17640 // init Isotope
17635 itemSelector: '.element-item', 17641 var $grid = $('.grid').isotope({
17636 layoutMode: 'fitRows', 17642 itemSelector: '.element-item',
17637 getSortData: { 17643 layoutMode: 'fitRows',
17638 coursename: '.name', 17644 getSortData: {
17639 date: '[data-ticks]' 17645 coursename: '.name',
17640 }, 17646 date: '[data-ticks]'
17641 filter: function () { 17647 },
17642 var $this = $(this); 17648 filter: function () {
17643 var filterText = qsRegex ? $(this).text().match(qsRegex) : true; 17649 var $this = $(this);
17644 var buttonResult = filterValue ? $this.is(filterValue) : true; 17650 var filterText = qsRegex ? $(this).text().match(qsRegex) : true;
17645 return filterText && buttonResult; 17651 var buttonResult = filterValue ? $this.is(filterValue) : true;
17652 return filterText && buttonResult;
17653 }
17654 });
17655
17656 // use value of search field to filter
17657 var $quicksearch = $('#quicksearch').keyup(debounce(function () {
17658 console.log($quicksearch.val());
17659 qsRegex = new RegExp($quicksearch.val(), 'gi');
17660 $grid.isotope();
17661 }, 200));
17662
17663 // debounce so filtering doesn't happen every millisecond
17664 function debounce(fn, threshold) {
17665 var timeout;
17666 threshold = threshold || 100;
17667 return function debounced() {
17668 clearTimeout(timeout);
17669 var args = arguments;
17670 var _this = this;
17671 function delayed() {
17672 fn.apply(_this, args);
17673 }
17674 timeout = setTimeout(delayed, threshold);
17675 };
17646 } 17676 }
17647 });
17648 17677
17649 // use value of search field to filter 17678 // filter with selects and checkboxes
17650 var $quicksearch = $('#quicksearch').keyup(debounce(function () { 17679 var $checkboxes = $('.category-filter input');
17651 console.log($quicksearch.val()); 17680 var filterValue;
17652 qsRegex = new RegExp($quicksearch.val(), 'gi'); 17681 $checkboxes.change(function () {
17653 $grid.isotope(); 17682 // map input values to an array
17654 }, 200)); 17683 var inclusives = [];
17655 17684 // inclusive filters from checkboxes
17656 // debounce so filtering doesn't happen every millisecond 17685 $checkboxes.each(function (i, elem) {
17657 function debounce(fn, threshold) { 17686 // if checkbox, use value if checked
17658 var timeout; 17687 if (elem.checked) {
17659 threshold = threshold || 100; 17688 inclusives.push(elem.value);
17660 return function debounced() { 17689 }
17661 clearTimeout(timeout); 17690 });
17662 var args = arguments;
17663 var _this = this;
17664 function delayed() {
17665 fn.apply(_this, args);
17666 }
17667 timeout = setTimeout(delayed, threshold);
17668 };
17669 }
17670 17691
17671 // filter with selects and checkboxes 17692 // combine inclusive filters
17672 var $checkboxes = $('.category-filter input'); 17693 filterValue = inclusives.length ? inclusives.join(', ') : '*';
17673 var filterValue; 17694 $grid.isotope();
17674 $checkboxes.change(function () { 17695 updateFilterCounts();
17675 // map input values to an array
17676 var inclusives = [];
17677 // inclusive filters from checkboxes
17678 $checkboxes.each(function (i, elem) {
17679 // if checkbox, use value if checked
17680 if (elem.checked) {
17681 inclusives.push(elem.value);
17682 }
17683 }); 17696 });
17684 17697 $('.sort-button-group').on('click', 'button', function () {
17685 // combine inclusive filters 17698 var sortValue = $(this).attr('data-sort-value');
17686 filterValue = inclusives.length ? inclusives.join(', ') : '*'; 17699 var direction = $(this).attr('data-sort-direction');
17687 $grid.isotope(); 17700 var isAscending = direction == 'asc';
17688 updateFilterCounts(); 17701 var newDirection = isAscending ? 'desc' : 'asc';
17689 }); 17702 $grid.isotope({
17690 $('.sort-button-group').on('click', 'button', function () { 17703 sortBy: sortValue,
17691 var sortValue = $(this).attr('data-sort-value'); 17704 sortAscending: isAscending
17692 var direction = $(this).attr('data-sort-direction'); 17705 });
17693 var isAscending = direction == 'asc'; 17706 $(this).attr('data-sort-direction', newDirection);
17694 var newDirection = isAscending ? 'desc' : 'asc'; 17707 var span = $(this).find('.glyphicon');
17695 $grid.isotope({ 17708 span.toggleClass('glyphicon-chevron-up glyphicon-chevron-down');
17696 sortBy: sortValue,
17697 sortAscending: isAscending
17698 }); 17709 });
17699 $(this).attr('data-sort-direction', newDirection); 17710 function updateFilterCounts() {
17700 var span = $(this).find('.glyphicon'); 17711 var itemElems = $grid.isotope('getFilteredItemElements');
17701 span.toggleClass('glyphicon-chevron-up glyphicon-chevron-down'); 17712 var count_items = $(itemElems).length;
17702 }); 17713 if (count_items > counter) {
17703 function updateFilterCounts() { 17714 $("#load-more").hide();
17704 var itemElems = $grid.isotope('getFilteredItemElements'); 17715 } else {
17705 var count_items = $(itemElems).length; 17716 $("#load-more").show();
17706 if (count_items > counter) {
17707 $("#load-more").hide();
17708 } else {
17709 $("#load-more").show();
17710 }
17711 if ($('.element-item').hasClass('hidden')) {
17712 $('.element-item').removeClass('hidden');
17713 }
17714 var index = 0;
17715 $(itemElems).each(function () {
17716 if (index >= counter) {
17717 $(this).addClass('hidden');
17718 } 17717 }
17719 index++; 17718 if ($('.element-item').hasClass('hidden')) {
17720 }); 17719 $('.element-item').removeClass('hidden');
17721 console.log('updateFilterCounts'); 17720 }
17722 console.log(index); 17721 var index = 0;
17723 if (index === 0) { 17722 $(itemElems).each(function () {
17724 $("#load-more").hide(); 17723 if (index >= counter) {
17725 } else { 17724 $(this).addClass('hidden');
17726 $("#load-more").show(); 17725 }
17726 index++;
17727 });
17728 console.log('updateFilterCounts');
17729 console.log(index);
17730 if (index === 0) {
17731 $("#load-more").hide();
17732 } else {
17733 $("#load-more").show();
17734 }
17735 $grid.isotope('layout');
17727 } 17736 }
17728 $grid.isotope('layout');
17729 }
17730 17737
17731 //**************************** 17738 //****************************
17732 // Isotope Load more button 17739 // Isotope Load more button
17733 //**************************** 17740 //****************************
17734 17741
17735 var initShow = 3; //number of images loaded on init & onclick load more button 17742 var initShow = 3; //number of images loaded on init & onclick load more button
17736 var counter = initShow; //counter for load more button 17743 var counter = initShow; //counter for load more button
17737 var iso = $grid.data('isotope'); // get Isotope instance 17744 var iso = $grid.data('isotope'); // get Isotope instance
17738 console.log('iso'); 17745 console.log('iso');
17739 console.log(iso); 17746 console.log(iso);
17740 console.log(iso.elemCount); 17747 console.log(iso.elemCount);
17741 loadMore(initShow); //execute function onload 17748 loadMore(initShow); //execute function onload
17742 17749
17743 function loadMore(toShow) { 17750 function loadMore(toShow) {
17744 $grid.find(".hidden").removeClass("hidden"); 17751 $grid.find(".hidden").removeClass("hidden");
17745 var hiddenElems = iso.filteredItems.slice(toShow, iso.filteredItems.length).map(function (item) { 17752 var hiddenElems = iso.filteredItems.slice(toShow, iso.filteredItems.length).map(function (item) {
17746 console.log('hiddenElem'); 17753 console.log('hiddenElem');
17747 console.log(item.element); 17754 console.log(item.element);
17748 return item.element; 17755 return item.element;
17749 }); 17756 });
17750 $(hiddenElems).addClass('hidden'); 17757 $(hiddenElems).addClass('hidden');
17751 $grid.isotope('layout'); 17758 $grid.isotope('layout');
17752 17759
17753 //when no more to load, hide show more button 17760 //when no more to load, hide show more button
17754 if (hiddenElems.length == 0) { 17761 if (hiddenElems.length == 0) {
17755 $("#load-more").hide(); 17762 $("#load-more").hide();
17756 } else { 17763 } else {
17757 $("#load-more").show(); 17764 $("#load-more").show();
17765 }
17758 } 17766 }
17759 }
17760 17767
17761 //append load more button 17768 //append load more button
17762 $grid.after('<div class="view-plan"><a class="btn" href="#" id="load-more">LOAD MORE programs</a></div>'); 17769 $grid.after('<div class="view-plan"><a class="btn" href="#" id="load-more">LOAD MORE programs</a></div>');
17763 17770
17764 //when load more button clicked 17771 //when load more button clicked
17765 $(document).on("click", "#load-more", function (e) { 17772 $(document).on("click", "#load-more", function (e) {
17766 e.preventDefault(); 17773 e.preventDefault();
17767 if ($('#filters').data('clicked')) { 17774 if ($('#filters').data('clicked')) {
17768 //when filter button clicked, set initial value for counter 17775 //when filter button clicked, set initial value for counter
17769 counter = initShow; 17776 counter = initShow;
17770 j$('#filters').data('clicked', false); 17777 j$('#filters').data('clicked', false);
17771 } else { 17778 } else {
17772 counter = counter; 17779 counter = counter;
17773 } 17780 }
17774 counter = counter + initShow; 17781 counter = counter + initShow;
17775 loadMore(counter); 17782 loadMore(counter);
17776 }); 17783 });
17777 $(document).on("click", "#filter-more", function (e) { 17784 $(document).on("click", "#filter-more", function (e) {
17778 e.preventDefault(); 17785 e.preventDefault();
17779 $('.filter-group').toggleClass('open'); 17786 $('.filter-group').toggleClass('open');
17780 var span = $(this).find('.glyphicon'); 17787 var span = $(this).find('.glyphicon');
17781 span.toggleClass('glyphicon-chevron-up glyphicon-chevron-down'); 17788 span.toggleClass('glyphicon-chevron-up glyphicon-chevron-down');
17782 }); 17789 });
17790 }
17783 }); 17791 });
17784 17792
17785 // Add your custom JS here. 17793 // Add your custom JS here.
......
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.
1 <?php
2 /**
3 * Partial template for content in page.php
4 *
5 * @package Understrap
6 */
7
8 // Exit if accessed directly.
9 defined( 'ABSPATH' ) || exit;
10 $program_info = get_field('program_info');
11 ?>
12
13 <article <?php post_class(); ?> id="post-<?php the_ID(); ?>">
14
15 <div class="entry-content">
16 <div class="row align-items-start">
17 <div class="col-lg-6 col-md-1">
18 <?php
19 the_content();
20 ?>
21 </div>
22 <div class="col-lg-6 col-md-1">
23 <div class="program-info">
24 <ul class="nav nav-tabs" id="program-info" role="tablist">
25 <li class="nav-item" role="presentation">
26 <button class="nav-link active" id="home-tab" data-bs-toggle="tab" data-bs-target="#who" type="button" role="tab" aria-controls="who" aria-selected="true">Who is this for?</button>
27 </li>
28 <li class="nav-item" role="presentation">
29 <button class="nav-link" id="profile-tab" data-bs-toggle="tab" data-bs-target="#costs" type="button" role="tab" aria-controls="costs" aria-selected="false">Cost & Date(s)</button>
30 </li>
31 </ul>
32 <div class="tab-content" id="program-info-content">
33 <div class="tab-pane fade show active" id="who" role="tabpanel" aria-labelledby="who-tab" tabindex="0">
34 <?php echo $program_info['who_is_this_for']; ?>
35 </div>
36 <div class="tab-pane fade" id="costs" role="tabpanel" aria-labelledby="costs-tab" tabindex="0">
37 <?php if(is_array($program_info['cost_&_dates'])): ?>
38 <table>
39 <tr class="not"><th>Cost</th><th>Duration</th><th>Date</th></tr>
40 <tr><td>PUBLIC | STAFF</td><td></td><td></td></tr>
41 <?php foreach ( $program_info['cost_&_dates'] as $cost_dates){
42 echo "<tr><td>".$cost_dates['cost']."</td><td>".$cost_dates['duration']."</td><td>".$cost_dates['date']."</td></tr>";
43 };?>
44 </table>
45 <?php endif; ?>
46
47 </div>
48 </div>
49 </div>
50 </div>
51 </div>
52 <?php if( have_rows('outcomes') ): ?>
53 <div class="outcomes">
54 <h2>Outcomes</h2>
55 <p>By the end of this workshop, participants will be able to:<p>
56 <div class="row">
57 <?php while( the_repeater_field('outcomes') ): ?>
58 <div class="col-out col-lg-3 col-md-1">
59 <div class="outcome">
60 <?php the_sub_field('content'); ?>
61 </div>
62 </div>
63 <?php endwhile; ?>
64 </div>
65 </div>
66 <?php endif; ?>
67 <?php if( have_rows('testimonials_items') ): ?>
68 <div id="<?php echo esc_attr($id); ?>" class="carousel">
69 <div class="testimonials-carousel carousel-items <?php echo $size; ?>">
70 <div class='swiper-wrapper'>
71 <?php while( the_repeater_field('testimonials_items') ): ?>
72 <div class="swiper-slide">
73 <div id="<?php echo esc_attr($id); ?>" class=" testimonials">
74 <?php $image = get_sub_field('image'); ?>
75 <div class="row">
76 <div class="col-lg-4 col-md-1" style=background-image:url(<?php echo $image['url'];?>); ></div>
77 <div class="col-lg-8 col-md-1">
78 <div class="testimonial-text"><p><?php the_sub_field('text'); ?></p></div>
79 </div>
80 </div>
81 </div>
82 </div>
83 <?php endwhile; ?>
84 </div>
85 <div class="swiper-pagination"></div>
86 <div class="swiper-button-prev" data-id="<?= $id ?>"></div>
87 <div class="swiper-button-next" data-id="<?= $id ?>"></div>
88 </div>
89 </div>
90 <?php endif; ?>
91 </div><!-- .entry-content -->
92
93 <footer class="entry-footer">
94
95 <?php understrap_edit_post_link(); ?>
96
97 </footer><!-- .entry-footer -->
98
99 </article><!-- #post-<?php the_ID(); ?> -->
...@@ -3,11 +3,6 @@ ...@@ -3,11 +3,6 @@
3 * 3 *
4 */ 4 */
5 5
6 global $user_ID;
7 get_currentuserinfo();
8 if (!$user_ID) {
9 auth_redirect();
10 }
11 6
12 get_header(); 7 get_header();
13 $container = get_theme_mod( 'understrap_container_type' ); 8 $container = get_theme_mod( 'understrap_container_type' );
...@@ -17,7 +12,7 @@ if ( is_front_page() ) { ...@@ -17,7 +12,7 @@ if ( is_front_page() ) {
17 } 12 }
18 13
19 $wrapper_id = 'full-width-page-wrapper'; 14 $wrapper_id = 'full-width-page-wrapper';
20 15 $id = get_the_id();
21 ?> 16 ?>
22 <div class="hero-container header-section blur-image" data-src="<?php echo the_post_thumbnail_url(); ?>" style="--med-image: url(<?php echo the_post_thumbnail_url('medium'); ?>);"> 17 <div class="hero-container header-section blur-image" data-src="<?php echo the_post_thumbnail_url(); ?>" style="--med-image: url(<?php echo the_post_thumbnail_url('medium'); ?>);">
23 <div class="full-image"> 18 <div class="full-image">
...@@ -46,14 +41,13 @@ $wrapper_id = 'full-width-page-wrapper'; ...@@ -46,14 +41,13 @@ $wrapper_id = 'full-width-page-wrapper';
46 <?php 41 <?php
47 while ( have_posts() ) { 42 while ( have_posts() ) {
48 the_post(); 43 the_post();
49 get_template_part( 'loop-templates/content', 'page' ); 44 get_template_part( 'loop-templates/content', 'course' );
50 45
51 // If comments are open or we have at least one comment, load up the comment template. 46 }?>
52 if ( comments_open() || get_comments_number() ) { 47
53 comments_template(); 48
54 } 49
55 } 50 <?php $call_out_block = get_field('call_out_block');
56 $call_out_block = get_field('call_out_block');
57 if($call_out_block['text_content'] !=""){ ?> 51 if($call_out_block['text_content'] !=""){ ?>
58 <div class='call-out-block'> 52 <div class='call-out-block'>
59 <div class='content'> 53 <div class='content'>
......
...@@ -26,6 +26,13 @@ jQuery(document).ready(function($) { ...@@ -26,6 +26,13 @@ jQuery(document).ready(function($) {
26 _id = jQuery(this).attr('id'); 26 _id = jQuery(this).attr('id');
27 } 27 }
28 28
29 if ($(window).width() < 600) {
30 offset = 0;
31 PerView = 1;
32 space = 0;
33 offsetAfter = 0;
34 }
35
29 36
30 37
31 var swiper_params = { 38 var swiper_params = {
......
...@@ -6,6 +6,10 @@ jQueryBridget( 'isotope', Isotope, $ ); ...@@ -6,6 +6,10 @@ jQueryBridget( 'isotope', Isotope, $ );
6 6
7 jQuery( document ).ready(function($) { 7 jQuery( document ).ready(function($) {
8 8
9
10 if($('.grid').length){
11
12
9 // quick search regex 13 // quick search regex
10 var qsRegex; 14 var qsRegex;
11 15
...@@ -186,5 +190,5 @@ function updateFilterCounts() { ...@@ -186,5 +190,5 @@ function updateFilterCounts() {
186 span.toggleClass('glyphicon-chevron-up glyphicon-chevron-down'); 190 span.toggleClass('glyphicon-chevron-up glyphicon-chevron-down');
187 }); 191 });
188 192
189 193 }
190 }); 194 });
......
...@@ -15,6 +15,7 @@ ...@@ -15,6 +15,7 @@
15 @import "theme/accordion"; 15 @import "theme/accordion";
16 @import "theme/sharethis"; 16 @import "theme/sharethis";
17 @import "theme/course_list"; 17 @import "theme/course_list";
18 @import "theme/course";
18 19
19 20
20 @import "assets/understrap/theme/colors"; // <-------- This creates the necessary bootstrap color classes. 21 @import "assets/understrap/theme/colors"; // <-------- This creates the necessary bootstrap color classes.
......
...@@ -30,6 +30,9 @@ ...@@ -30,6 +30,9 @@
30 margin-inline-end: 0px; 30 margin-inline-end: 0px;
31 padding-inline-start: 20px; 31 padding-inline-start: 20px;
32 background-color: transparent !important; 32 background-color: transparent !important;
33 @media only screen and (max-width: 600px) {
34 padding-inline-start: 0px;
35 }
33 36
34 } 37 }
35 38
...@@ -45,6 +48,10 @@ ...@@ -45,6 +48,10 @@
45 .carousel { 48 .carousel {
46 width:100vw; 49 width:100vw;
47 margin-left:calc((100% - 100vw) / 2); 50 margin-left:calc((100% - 100vw) / 2);
51 @media only screen and (max-width: 600px) {
52 width:95%;
53 margin-left:0px;
54 }
48 left:0 !important; 55 left:0 !important;
49 min-height: 340px!important; 56 min-height: 340px!important;
50 .swiper-button-next { 57 .swiper-button-next {
...@@ -52,6 +59,9 @@ ...@@ -52,6 +59,9 @@
52 } 59 }
53 .swiper-button-prev { 60 .swiper-button-prev {
54 left:7px !important; 61 left:7px !important;
62 @media only screen and (max-width: 600px) {
63 left:-5px !important;
64 }
55 } 65 }
56 .swiper-pagination{ 66 .swiper-pagination{
57 bottom: -20px !important; 67 bottom: -20px !important;
...@@ -66,23 +76,39 @@ ...@@ -66,23 +76,39 @@
66 76
67 // testimonials carousel css 77 // testimonials carousel css
68 .testimonials-carousel{ 78 .testimonials-carousel{
79 @media only screen and (max-width: 600px) {
80 margin-left: 0px !important;
81 }
69 .swiper-slide{ 82 .swiper-slide{
70 width:890px !important; 83 width:890px !important;
71 84 @media only screen and (max-width: 600px) {
85 width:98% !important;
86 }
72 .testimonials{ 87 .testimonials{
73 width:890px; 88 width:890px;
74 background:#E5F2F8; 89 background:#E5F2F8;
75 border-radius: 25px 25px 0px 0px; 90 border-radius: 25px 25px 0px 0px;
76 margin-right: 20px; 91 margin-right: 20px;
92 @media only screen and (max-width: 600px) {
93 width:98%;
94 margin-right: 0px;
95 }
77 .row{ 96 .row{
78 margin-right: 0rem !important; 97 margin-right: 0rem !important;
79 border-bottom:20px solid #FFA300; 98 border-bottom:20px solid #FFA300;
80 margin-left: -15px !important; 99 margin-left: -15px !important;
81 min-height:316px !important; 100 min-height:316px !important;
101 @media only screen and (max-width: 600px) {
102 margin-left: 0px !important;
103 }
82 104
83 } 105 }
84 .col { 106
107 .col-md-1 {
85 background-size: cover; 108 background-size: cover;
109 @media only screen and (max-width: 600px) {
110 padding-left: 0px;
111 }
86 } 112 }
87 .testimonial-text{ 113 .testimonial-text{
88 padding: 30px 50px; 114 padding: 30px 50px;
......
...@@ -2,6 +2,18 @@ ...@@ -2,6 +2,18 @@
2 2
3 body{ 3 body{
4 font-family: 'Open Sans', sans-serif; 4 font-family: 'Open Sans', sans-serif;
5
6 }
7 @media only screen and (max-width: 600px) {
8 .site{
9 overflow-x: hidden;
10 }
11 #full-width-page-wrapper{
12 overflow-x: hidden;
13 }
14 #content{
15 overflow-x: hidden;
16 }
5 } 17 }
6 h1{ 18 h1{
7 font-size: 58px; 19 font-size: 58px;
......
1 .type-sfwd-courses{
2 margin-top: 30px;
3 }
4
5
6
7 .program-info{
8 background: #FFFFFF 0% 0% no-repeat padding-box;
9 box-shadow: 0px 3px 6px #00000029;
10
11 max-width: 531px;
12 #program-info{
13
14 .nav-item{
15 width: 50%;
16 border: 0px solid #ccc;
17 .nav-link{
18 width: 100%;
19 border-radius: 0px;
20 background-color: #0081BC;
21 color: #FFFFFF;
22 border: 0px solid #ccc;
23 font-size: 18px;
24 padding: 20px 20px;
25 font-family: 'Poppins', sans-serif;
26 }
27 .nav-link.active{
28 background-color:#FFFFFF;
29 color: #0081BC;
30 }
31 }
32 }
33 #program-info-content{
34 padding:20px 40px 40px 40px;
35 table{
36 width: 100%;
37 tr{
38 th{
39 width: 33%;
40 font-size: 18px;
41 color: #0081BC;
42 font-family: 'Poppins', sans-serif;
43 }
44 }
45 tr:not(.not){
46 border-bottom:1px solid #FFA300;
47 td{
48 font-size: 16px;
49 padding: 10px 0px;
50 }
51 }
52 }
53 }
54 }
55 .outcomes{
56 margin: 70px 0px;
57 .outcome{
58 width: 100%;
59 min-height: 227px;
60 background-color: #E2F2F9;
61 padding:25px 25px 25px 15px;
62 border-radius: 25px 25px 0px 0px;
63 border-bottom: 22px solid #FFA300;
64 font-size: 16px;
65 line-height: 24px;
66 }
67 .col-out{
68 @media only screen and (max-width: 600px) {
69 margin-top: 20px;
70 }
71 }
72 .col-out:nth-of-type(2) .outcome{
73 border-bottom: 22px solid #3F9C35;
74 }
75 .col-out:nth-of-type(3) .outcome{
76 border-bottom: 22px solid #0484B8;
77 }
78 .col-out:nth-of-type(4) .outcome{
79 border-bottom: 22px solid #E04E39;
80 }
81
82 }
83
1 .custom-addtoany{ 1 .custom-addtoany{
2 background-color: #0484B8; 2 background-color: #0484B8;
3 position: fixed; 3 position: fixed;
4 top: 217px; 4 top: 185px;
5 z-index: 999; 5 z-index: 999;
6 right: 0px; 6 right: 0px;
7 width: 48px; 7 width: 48px;
8 padding:8px 10px; 8 padding:8px 10px;
9 } 9 }
10 10
11 11 .admin-bar .custom-addtoany{
12 top: 217px;
13 }
12 14
13 15
14 .jssocials-share-logo { 16 .jssocials-share-logo {
......