moved a bunch of churned customers templates to a hidden folder. Added to Sandata's script and the new groups. Notes.
This commit is contained in:
Norm Rasmussen
213
Custom_Templates/.churned_customers/Omnisend/catalog.html.liquid
Normal file
213
Custom_Templates/.churned_customers/Omnisend/catalog.html.liquid
Normal file
@ -0,0 +1,213 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.in_catalog %}
|
||||
<div class="subheader">
|
||||
|
||||
</div>
|
||||
<main class="catalog container-fluid">
|
||||
<div class="catalog-wrapper row">
|
||||
|
||||
<div class="catalog-filter col-md-4 col-12 np-hidden-mobile">
|
||||
{% include 'catalog_filter' %}
|
||||
</div>
|
||||
<div class="catalog-filter-mobile-button np-hidden-desktop">
|
||||
Filter <i class="fa-solid fa-angle-down"></i>
|
||||
</div>
|
||||
<div class="catalog-courses container-fluid col-md-8 col-12">
|
||||
<div class="catalog-courses-container row">
|
||||
{% for course in courses.in_catalog %}
|
||||
{% include 'catalog_course_card' with course %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include 'catalog_filter_mobile' %}
|
||||
</main>
|
||||
|
||||
{% include "footer" %}
|
||||
<style>
|
||||
.catalog {
|
||||
padding: 40px 4% 80px;
|
||||
}
|
||||
.row > * {
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
}
|
||||
.catalog-filter-mobile-button {
|
||||
font-size: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.category-hidden {
|
||||
display: none;
|
||||
}
|
||||
.diff-hidden {
|
||||
display: none;
|
||||
}
|
||||
.time-hidden {
|
||||
display: none;
|
||||
}
|
||||
.course-card {
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
.course-card-content-title {
|
||||
font-weight: 400;
|
||||
line-height: 32px;
|
||||
font-size: 22px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.course-card-content-time {
|
||||
font-size: 12px;
|
||||
line-height: 16px;
|
||||
letter-spacing: -0.5px;
|
||||
opacity: 0.4;
|
||||
margin: 8px 0;
|
||||
}
|
||||
.course-card-content-description {
|
||||
font-size: 16px;
|
||||
line-height: 26px;
|
||||
letter-spacing: -0.5px;
|
||||
opacity: 0.4;
|
||||
}
|
||||
.course-card-content-footer {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.np-course-version-outdated-popup-trigger {
|
||||
color: #2F8481;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1800px) {
|
||||
.catalog {
|
||||
padding: 40px 10% 80px;
|
||||
}
|
||||
.course-card-content-time {
|
||||
font-size: 18px;
|
||||
}
|
||||
.course-card-content-description {
|
||||
font-size: 18px;
|
||||
}
|
||||
.course-card-content-title {
|
||||
font-size: 26px;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 1500px) {
|
||||
.row > * {
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 992px) {
|
||||
.course-card-content-description {
|
||||
font-size: 22px;
|
||||
}
|
||||
.course-card-content-title {
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
/* category */
|
||||
$('.course-card-content-title').each(function() {
|
||||
$clamp($(this)[0], {clamp: 3})
|
||||
})
|
||||
$('.course-card-content-description').each(function() {
|
||||
$(this).text($(this).text().trim())
|
||||
$clamp($(this)[0], {clamp: 4})
|
||||
})
|
||||
/* convert values to same format */
|
||||
$('[category]').each(function(){
|
||||
$(this).attr('category', $(this).attr('category').replaceAll(' ', '').replaceAll('+', ' ').toLowerCase());
|
||||
});
|
||||
/* add action to filters on click */
|
||||
$('.filter-element-category').click(function(){
|
||||
$('.category-selected').removeClass('category-selected');
|
||||
$(this).toggleClass('category-selected');
|
||||
$('.course-card').removeClass('category-hidden');
|
||||
/* hides all cards without selected category if the 'All' wasn't selected */
|
||||
if($(this).attr('category') != 'none') {
|
||||
$('.course-card').not('[category~='+$(this).attr('category')+']').addClass('category-hidden');
|
||||
}
|
||||
});
|
||||
/* difficulty */
|
||||
$('.filter-element-diff').click(function() {
|
||||
if ($('.diff-selected').length == 0) {
|
||||
/* first filter is being checked */
|
||||
$('.course-card').not('[diff=' + $(this).attr('diff') + ']').addClass('diff-hidden');
|
||||
}
|
||||
else if ($('.diff-selected').length == 1 && $(this).hasClass('diff-selected')) {
|
||||
/* last filter is being unchecked */
|
||||
$('.course-card').removeClass('diff-hidden');
|
||||
}
|
||||
else {
|
||||
$('.course-card[diff=' + $(this).attr('diff') + ']').toggleClass('diff-hidden');
|
||||
}
|
||||
$(this).toggleClass('diff-selected');
|
||||
});
|
||||
/* duration */
|
||||
$('.filter-element-time').click(function() {
|
||||
if ($('.time-selected').length == 0) {
|
||||
/* first filter is being checked */
|
||||
$('.course-card').not('[time=' + $(this).attr('time') + ']').addClass('time-hidden');
|
||||
}
|
||||
else if ($('.time-selected').length == 1 && $(this).hasClass('time-selected')) {
|
||||
/* last filter is being unchecked */
|
||||
$('.course-card').removeClass('time-hidden');
|
||||
}
|
||||
else {
|
||||
$('.course-card[time=' + $(this).attr('time') + ']').toggleClass('time-hidden');
|
||||
}
|
||||
$(this).toggleClass('time-selected');
|
||||
});
|
||||
/* handling hashes in URL */
|
||||
if (window.location.hash) {
|
||||
hash_1 = window.location.hash.slice(1).split('-')[0].toLowerCase();
|
||||
hash_2 = window.location.hash.slice(1).split('-')[1].toLowerCase();
|
||||
var a = $('.filter-element-' + hash_1 + '[' + hash_1 + '=' + hash_2 + ']');
|
||||
a.click();
|
||||
a.toggleClass("category-selected");
|
||||
history.pushState("", document.title, window.location.pathname + window.location.search);
|
||||
};
|
||||
$(window).on('hashchange', function() {
|
||||
if (window.location.hash) {
|
||||
hash_1 = window.location.hash.slice(1).split('-')[0].toLowerCase();
|
||||
hash_2 = window.location.hash.slice(1).split('-')[1].toLowerCase();
|
||||
var a = $('.filter-element-' + hash_1 + '[' + hash_1 + '=' + hash_2 + ']');
|
||||
a.click();
|
||||
a.toggleClass("category-selected");
|
||||
history.pushState("", document.title, window.location.pathname + window.location.search);
|
||||
};
|
||||
});
|
||||
/* parse time property to human format */
|
||||
$('.course-card-content-time[time]').each( function() {
|
||||
var a = parseInt($(this).text());
|
||||
var minutes = a % 60;
|
||||
var hours = Math.floor(a / 60);
|
||||
var time = '';
|
||||
if (hours > 0) {
|
||||
time = time + hours.toString() + 'h ';
|
||||
}
|
||||
if (minutes > 0) {
|
||||
time = time + minutes.toString() + 'm';
|
||||
}
|
||||
$(this).text(time);
|
||||
});
|
||||
/* mobile filter menu */
|
||||
$(".catalog-filter-mobile-button").click(function () {
|
||||
$(".mobile-filter").removeClass("np-hidden");
|
||||
document.body.style.overflow = "hidden";
|
||||
$(".greyed").removeClass("np-hidden");
|
||||
});
|
||||
$(".greyed").click(function () {
|
||||
document.body.style.overflow = "scroll";
|
||||
if(! $(".mobile-filter").hasClass('np-hidden')){
|
||||
$(".mobile-filter").addClass("np-hidden");
|
||||
}
|
||||
$(".greyed").addClass("np-hidden");
|
||||
});
|
||||
$(".mobile-filter-header").click(function () {
|
||||
$(".mobile-filter").addClass("np-hidden");
|
||||
document.body.style.overflow = "scroll";
|
||||
$(".greyed").addClass("np-hidden");
|
||||
});
|
||||
</script>
|
||||
Reference in New Issue
Block a user