Zenjob Notes, and new Templates
This commit is contained in:
Norm Rasmussen
BIN
Custom_Templates/.DS_Store
vendored
Normal file
BIN
Custom_Templates/.DS_Store
vendored
Normal file
Binary file not shown.
BIN
Custom_Templates/customer_templates/.DS_Store
vendored
Normal file
BIN
Custom_Templates/customer_templates/.DS_Store
vendored
Normal file
Binary file not shown.
@ -0,0 +1,49 @@
|
||||
<a class="np-card" href="{% route course_enrollment, code: course.enrollment_code %}">
|
||||
<div class="np-card-container">
|
||||
{% if course.ribbon %}
|
||||
<div class="np-card-ribbon">
|
||||
{{ course.ribbon }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<video class='left-video' autoplay muted loop>
|
||||
<source src="{{course.promo_video_embed_url}}" type="video/mp4" alt="{{ course.name }}">
|
||||
</video>
|
||||
<div class="np-card-content-bottom">
|
||||
<h3 class="np-card-content-title np-color-white">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
<div class='np-card-content-description'>
|
||||
{{ course.full_description }}
|
||||
</div>
|
||||
|
||||
<div class="np-card-content-progress np-button-color">
|
||||
{% t shared.progress, count: course.progress %}
|
||||
</div>
|
||||
<div class="np-card-content-category">
|
||||
{{course.categories.first.name}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<style>
|
||||
.np-card {
|
||||
text-decoration: none;
|
||||
color: white;
|
||||
}
|
||||
.np-card-content-category {
|
||||
border-top: 1px solid lightgray;
|
||||
padding: 10px;
|
||||
}
|
||||
.np-card-content-description {
|
||||
display: block;
|
||||
color: lightgray;
|
||||
}
|
||||
.np-card-content-bottom {
|
||||
padding: 15px;
|
||||
}
|
||||
.np-button-color {
|
||||
color: lightslategray;
|
||||
font-size: 15px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,44 @@
|
||||
<div class="np-card np-no-horizontal-padding">
|
||||
<div class="np-card-container">
|
||||
<div class="np-learning-path np-featured-course">
|
||||
<div class="np-featured-course-img-container" style="overflow: hidden">
|
||||
<video class='featured-video' autoplay muted loop style="margin-left: -60px;">
|
||||
<source id="featured_video" src="{{course.promo_video_embed_url}}" type="video/mp4" alt="{{ course.name }}" />
|
||||
</video>
|
||||
<div class="np-card-image-content-top">
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-card-text-wrapper">
|
||||
<div class="np-card-content np-card-padding np-card-content-vertical">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
<div class="np-card-content-description">
|
||||
{{ course.full_description }}
|
||||
</div>
|
||||
|
||||
<div class="np-card-content-footer" style='display: flex; flex-direction: row; justify-content: space-between;'>
|
||||
<a
|
||||
class="np-top-button np-button-font-color np-button" href="{% route course_enrollment, code: course.enrollment_code %}"
|
||||
>
|
||||
{% if course.enrolled? == false %}
|
||||
{% t shared.enroll %}
|
||||
{% elsif course.started? == false %}
|
||||
{% t shared.start, key: current_school.course_vocabulary %}
|
||||
{% elsif course.completed? %}
|
||||
{% t shared.course.view, key: current_school.course_vocabulary %}
|
||||
{% else %}
|
||||
{% t shared.continue %}
|
||||
{% endif %}
|
||||
</a>
|
||||
<div class="np-card-image-content-bottom" style="position: unset;">
|
||||
<div class="np-card-content-progress np-button-color">
|
||||
{% t shared.progress, count: course.progress %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,80 @@
|
||||
<footer class="np-footer">
|
||||
<div class="np-footer-top">
|
||||
{% if website_footer.show_navigation_links? %}
|
||||
<div class="np-footer-navigation">
|
||||
<ul class="np-footer-navigation-list">
|
||||
{% for website_navigation in navigations.footer_navigations %}
|
||||
{% if website_navigation.external? %}
|
||||
<li class="np-footer-navigation-item">
|
||||
<a
|
||||
class="np-footer-navigation-link np-button-color"
|
||||
href="{{ website_navigation.path }}"
|
||||
{% if website_navigation.external? %} target="_blank" {% endif %}
|
||||
>
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if current_school.logo_url %}
|
||||
<h2 class="np-footer-logo">
|
||||
<a href="{% route home %}">
|
||||
<img
|
||||
alt="{{ current_school.name }}"
|
||||
class="np-footer-logo-image"
|
||||
src="{{ current_school.logo_url }}"
|
||||
/>
|
||||
</a>
|
||||
</h2>
|
||||
{% else %}
|
||||
<div class="np-school-name np-header-font-color">
|
||||
{{ current_school.name }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="np-footer-bottom">
|
||||
<nav class="np-footer-social-links">
|
||||
{% if website_footer.show_social_media_links? %}
|
||||
<ul class="np-footer-social-links-list">
|
||||
{% for social_media_link in website_footer.social_media_links %}
|
||||
<li class="np-footer-social-links-item">
|
||||
<a
|
||||
class="np-footer-social-links-link np-button-color"
|
||||
href="{{ social_media_link.link }}"
|
||||
target="_blank" title="{{ social_media_link.name }}"
|
||||
>
|
||||
<i class="np-footer-social-links-icon
|
||||
np-button-color
|
||||
fab fa-{{ social_media_link.name }}"
|
||||
></i>
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</nav>
|
||||
|
||||
{% if website_footer.show_customer_service_email? and
|
||||
website_footer.school_customer_service_email
|
||||
%}
|
||||
<div class="np-footer-support">
|
||||
<div class="np-footer-support-item np-footer-support-help np-fc-white np-opacity-50">
|
||||
{% t .need_help %}
|
||||
</div>
|
||||
<div class="np-footer-support-item np-footer-support-email np-fc-white np-opacity-50">
|
||||
{% t .email %}
|
||||
</div>
|
||||
<a
|
||||
class="np-footer-support-item np-footer-support-link np-button-color"
|
||||
href="mailto:{{ website_footer.school_customer_service_email }}"
|
||||
>
|
||||
support@menlosecurity.com
|
||||
</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</footer>
|
||||
@ -0,0 +1,11 @@
|
||||
{% styles default %}
|
||||
{% styles colors %}
|
||||
{% styles custom %}
|
||||
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Raleway:wght@200;300;400;500&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.css" integrity="sha512-wR4oNhLBHf7smjy0K4oqzdWumd+r5/+6QO/vDda76MW5iug4PT7v86FoEkySIJft3XA0Ae6axhIvHrqwm793Nw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
||||
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js" type="text/javascript"></script>
|
||||
@ -0,0 +1,183 @@
|
||||
<header class="np-header np-header-color" >
|
||||
<div class="np-header-content">
|
||||
<div class="np-hidden-desktop np-header-mobile-menu-nav">
|
||||
{% if current_person.signed_in? %}
|
||||
<button
|
||||
data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button fal fa-times np-hidden np-header-font-color"
|
||||
data-toggle-target=".np-header-mobile-avatar-menu,
|
||||
.np-header-mobile-menu-content, .np-main, .np-footer"
|
||||
></button>
|
||||
<button
|
||||
data-test="open-mobile-menu"
|
||||
data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button np-header-mobile-avatar-menu"
|
||||
data-toggle-target=".fa-times, .np-header-mobile-menu-content, .np-main, .np-footer"
|
||||
>
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-avatar-image"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
/>
|
||||
</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if current_school.logo_url %}
|
||||
<h1 class="np-header-logo">
|
||||
<a href="{% route home %}">
|
||||
<img
|
||||
alt="{{ current_school.name }}"
|
||||
class="np-header-logo-image"
|
||||
src="{{ current_school.logo_url }}"
|
||||
/>
|
||||
</a>
|
||||
</h1>
|
||||
{% else %}
|
||||
<a href="{% route home %}" class="np-school-name np-header-font-color">
|
||||
{{ current_school.name }}
|
||||
</a>
|
||||
{% endif %}
|
||||
|
||||
<div class="np-hidden-mobile np-header-desktop-nav">
|
||||
<ul class="np-header-desktop-nav-list">
|
||||
{% for website_navigation in navigations.header_navigations_external %}
|
||||
<li class= "np-header-desktop-nav-item">
|
||||
<a
|
||||
href="{{ website_navigation.path }}"
|
||||
class="np-header-desktop-nav-link np-header-font-color"
|
||||
target="_blank"
|
||||
>
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
<div class="np-hidden-mobile np-header-search np-header-search-expanded">
|
||||
<form action="{% route search %}" method="get" data-test="desktop-search">
|
||||
<input
|
||||
aria-label="{% t .search %}"
|
||||
class="np-header-search-input np-header-font-background-color"
|
||||
type="text"
|
||||
name="q"
|
||||
placeholder="{% t .search %}"
|
||||
/>
|
||||
<i class="np-header-search-icon far fa-search"></i>
|
||||
</form>
|
||||
</div>
|
||||
<div class="np-hidden-mobile np-header-avatar">
|
||||
<button
|
||||
class="np-header-avatar-button"
|
||||
data-test="open-desktop-menu"
|
||||
data-toggle-class-on-target="np-hidden"
|
||||
data-toggle-target=".np-header-avatar-tooltip"
|
||||
data-toggle-outside
|
||||
>
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-avatar-image"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
>
|
||||
</button>
|
||||
<div class="np-header-avatar-tooltip np-hidden" role="tooltip">
|
||||
<span class="np-header-avatar-tooltip-arrow-up"></span>
|
||||
<div class="np-header-avatar-tooltip-learner">
|
||||
<div class="np-header-avatar-tooltip-learner-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
<div class="np-header-avatar-tooltip-learner-email">
|
||||
{{ current_person.email }}
|
||||
</div>
|
||||
</div>
|
||||
<nav class="np-header-avatar-tooltip-navigation">
|
||||
<a class="np-header-avatar-tooltip-navigation-link" onclick="buildURL(window.location.pathname)" style="cursor:pointer">
|
||||
Default
|
||||
</a>
|
||||
{% unless current_school.sso_active? %}
|
||||
<a
|
||||
class="np-header-avatar-tooltip-navigation-link"
|
||||
href="{% route account %}"
|
||||
>
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a
|
||||
class="np-header-avatar-tooltip-navigation-link np-danger"
|
||||
href="{% route logout %}"
|
||||
>
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<a
|
||||
class="np-header-sign-in np-header-desktop-nav-link np-header-font-color"
|
||||
href="{% route login %}"
|
||||
>
|
||||
{% t shared.sign_in %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="np-hidden-desktop">
|
||||
<div class="np-header-mobile-menu-content np-hidden">
|
||||
{% if current_person.signed_in? %}
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-mobile-menu-content-avatar"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
/>
|
||||
<div class="np-header-mobile-menu-content-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="np-header-mobile-menu-content-nav">
|
||||
<form
|
||||
class="np-header-search"
|
||||
data-test="mobile-search"
|
||||
method="get"
|
||||
action="{% route search %}"
|
||||
>
|
||||
<input
|
||||
aria-label="{% t .search %}"
|
||||
class="np-header-search-input"
|
||||
type="text"
|
||||
name="q"
|
||||
placeholder="{% t .search %}"
|
||||
/>
|
||||
<i class="np-header-search-icon far fa-search"></i>
|
||||
</form>
|
||||
{% for website_navigation in navigations.header_navigations %}
|
||||
<a
|
||||
href="{{ website_navigation.path }}"
|
||||
class="np-header-mobile-menu-content-button"
|
||||
{% if website_navigation.external? %} target="_blank" {% endif %}
|
||||
>
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
{% endfor %}
|
||||
<div class="np-header-mobile-menu-content-line"></div>
|
||||
{% unless current_school.sso_active? %}
|
||||
<a
|
||||
class="np-header-mobile-menu-content-button"
|
||||
href="{% route account %}"
|
||||
>
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a
|
||||
class="np-header-mobile-menu-content-button np-danger"
|
||||
href="{% route logout %}"
|
||||
>
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% include "messages" %}
|
||||
|
||||
@ -0,0 +1,109 @@
|
||||
<div class="np-homepage-featured np-faq np-max-width">
|
||||
<div class="np-homepage-featured-text">
|
||||
<div class="np-homepage-headline">
|
||||
Frequently Asked Questions
|
||||
</div>
|
||||
</div>
|
||||
<div class="row np-faqs">
|
||||
<div class="col-md-6">
|
||||
<div class="np-accordion">
|
||||
<div class="accordion-btn">
|
||||
<i class="fal fa-plus"></i>
|
||||
<div class="accordion-title"><strong>Q:</strong> I'm not in shape. Can I still go to a climbing gym?</div>
|
||||
</div>
|
||||
<div class="accordion-panel">
|
||||
<div class="accordion-panel-content">
|
||||
<p><strong>A:</strong> Absolutely. Climbing is a wonderful full-body and full-mind workout. If you're looking to get in shapre but tired of pumping iron, climbing is a fantastic option.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-accordion">
|
||||
<div class="accordion-btn">
|
||||
<i class="fal fa-plus"></i>
|
||||
<div class="accordion-title"><strong>Q:</strong> I'm scared of heights. Should I try climbing?</div>
|
||||
</div>
|
||||
<div class="accordion-panel">
|
||||
<div class="accordion-panel-content">
|
||||
<p><strong>A:</strong> Many climbers have a fear of heights! However, it goes away when you use your own strength and technique to get to the top of a wall. Start small by climbing in a gym first.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-accordion">
|
||||
<div class="accordion-btn">
|
||||
<i class="fal fa-plus"></i>
|
||||
<div class="accordion-title"><strong>Q:</strong> Should I hire someone to belay me at a gym?</div>
|
||||
</div>
|
||||
<div class="accordion-panel">
|
||||
<div class="accordion-panel-content">
|
||||
<p><strong>A:</strong> You absolutely can as a quick introduction. However, what would be even better is to grab a friend and take a belay class at your local gym.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="np-accordion">
|
||||
<div class="accordion-btn">
|
||||
<i class="fal fa-plus"></i>
|
||||
<div class="accordion-title"><strong>Q:</strong> What is bouldering?</div>
|
||||
</div>
|
||||
<div class="accordion-panel">
|
||||
<div class="accordion-panel-content">
|
||||
<p><strong>A:</strong> Great question! Bouldering is a form of climbing, done on shorter walls. You use a crash pad under your climb to cushion your fall. Be warned, bouldering is much more powerful and has a steeper learning curve.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-accordion">
|
||||
<div class="accordion-btn">
|
||||
<i class="fal fa-plus"></i>
|
||||
<div class="accordion-title"><strong>Q:</strong> What are those people with all that gear hanging from their harness doing?</div>
|
||||
</div>
|
||||
<div class="accordion-panel">
|
||||
<div class="accordion-panel-content">
|
||||
<p><strong>A:</strong> Chances are you saw a trad climber! Short for traditional climbing, that gear serves as removable protection. When the climbing pair is done with the climb, nothing is left on the rock.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-accordion">
|
||||
<div class="accordion-btn">
|
||||
<i class="fal fa-plus"></i>
|
||||
<div class="accordion-title"><strong>Q:</strong> None of my friends are interested in climbing. How can I find partners?</div>
|
||||
</div>
|
||||
<div class="accordion-panel">
|
||||
<div class="accordion-panel-content">
|
||||
<p><strong>A:</strong>The best way to meet people is to join a gym a start climbing! Climbers are social and you'll start meeting people. You can also use online resources like Mountain Project's Partner Finder.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
/
|
||||
<style>
|
||||
.fa-plus {
|
||||
background-image: unset;
|
||||
background: #0297FA;
|
||||
}
|
||||
.fa-minus {
|
||||
background-image: unset;
|
||||
background: #0297FA; }
|
||||
</style>
|
||||
|
||||
<script>
|
||||
let accordions = document.getElementsByClassName("accordion-btn");
|
||||
|
||||
for (let i = 0; i < accordions.length; i++) {
|
||||
accordions[i].addEventListener("click", function() {
|
||||
this.querySelector('.fal').classList.toggle("fa-plus");
|
||||
this.querySelector('.fal').classList.toggle("fa-minus");
|
||||
|
||||
let panel = this.nextElementSibling;
|
||||
panel.classList.toggle("panel-open");
|
||||
if (panel.style.maxHeight) {
|
||||
panel.style.maxHeight = null;
|
||||
} else {
|
||||
panel.style.maxHeight = panel.scrollHeight + "px";
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,91 @@
|
||||
<div class="np-homepage-featured np-homepage-featured-items np-max-width">
|
||||
<div class="np-homepage-featured-text">
|
||||
<div class="np-homepage-headline">
|
||||
Recommended Gear
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="featured-photography-carousel np-carousel np-carousel-bg-blue" id="featured-photography-carousel">
|
||||
<div class="np-carousel-card">
|
||||
<div>
|
||||
<img src=https://5prq858zcb-flywheel.netdna-ssl.com/wp-content/uploads/2016/12/50823_4WhiteBG-1-600x625.png" alt="Featured Photography" class='customer-carousel-image'/>
|
||||
<div class="slide-label">Misty Mountain Cadillav Harness</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="np-carousel-card">
|
||||
<div>
|
||||
<img src="https://outdoorgearlab-mvnab3pwrvp3t0.stackpathdns.com/photos/18/97/311203_1848_XXXL.jpg" alt="Featured Photography" class='customer-carousel-image'/>
|
||||
<div class="slide-label">Gri-Gri Belay Device</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="np-carousel-card">
|
||||
<div>
|
||||
<img src="https://lcdn.sportiva.com/pub/media/catalog/product/8/0/800_yellow_katanalace_1_7_4.jpg" alt="Featured Photography" class='customer-carousel-image'/>
|
||||
<div class="slide-label">La Sportiva Katana Lace Shoes</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-carousel-card">
|
||||
<div>
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/demos/hsbc-old-logo.png" alt="Featured Photography" class='customer-carousel-image'/>
|
||||
<div class="slide-label">Metolious Helmet</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="np-carousel-card">
|
||||
<div>
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/demos/sandia-labs-logo.jpg" alt="Featured Photography" class='customer-carousel-image'/>
|
||||
<div class="slide-label">Unknown</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
|
||||
$("#featured-photography-carousel").slick({
|
||||
slidesToShow: 3.5,
|
||||
prevArrow: '<i class="fal fa-chevron-left"></i>',
|
||||
nextArrow: '<i class="fal fa-chevron-right"></i>',
|
||||
infinite: false,
|
||||
responsive: [
|
||||
{
|
||||
breakpoint: 1350,
|
||||
settings: {
|
||||
slidesToShow: 2.3,
|
||||
}
|
||||
},
|
||||
{
|
||||
breakpoint: 1024,
|
||||
settings: {
|
||||
slidesToShow: 2,
|
||||
}
|
||||
},
|
||||
{
|
||||
breakpoint: 768,
|
||||
settings: {
|
||||
slidesToShow: 1,
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.featured-photography-carousel .fa-chevron-right::before {
|
||||
right: -6px !important;
|
||||
}
|
||||
.customer-carousel-image {
|
||||
width: 292px;
|
||||
height: 292px;
|
||||
object-fit: contain;
|
||||
}
|
||||
.featured-photography-carousel .slick-initialized .slick-slide {
|
||||
margin: 10px 10px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,15 @@
|
||||
<div class="np-homepage-featured np-homepage-topics np-max-width">
|
||||
<div class="np-homepage-featured-text">
|
||||
<div class="np-homepage-headline">
|
||||
Popular Topics
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-topics-list row">
|
||||
<div class="col-xs-12 np-stretch-content">
|
||||
{% assign categories_by_name = current_school.filterable_categories | sort: "name" %}
|
||||
{% for category in categories_by_name %}
|
||||
<a class="np-top-button np-button np-button-secondary" href="#">{{ category.name }}</a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,118 @@
|
||||
<div class="np-homepage-featured np-homepage-tips-tricks np-max-width">
|
||||
<div class="np-homepage-featured-text">
|
||||
<div class="np-homepage-headline">
|
||||
Professional Climbers
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tips-tricks-carousel np-carousel" id="tips-tricks-carousel">
|
||||
<div class="np-carousel-card">
|
||||
<video class='left-video' autoplay muted loop>
|
||||
<source type="video/mp4" src="https://i.imgur.com/IizyBxj.mp4">
|
||||
</video>
|
||||
<div class='review'>
|
||||
<div class='review-text'>
|
||||
“Enlightenment isn't found with a full stomach or a soft pillow.”
|
||||
</div>
|
||||
<div class='review-name'>
|
||||
Cory Richards
|
||||
</div>
|
||||
<div class='review-title'>
|
||||
Professional Mountain Climbers & Photographer
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-carousel-card">
|
||||
<video class='left-video' autoplay muted loop>
|
||||
<source type="video/mp4" src="https://i.imgur.com/HS7PW7n.mp4">
|
||||
</video>
|
||||
<div class='review'>
|
||||
<div class='review-text'>
|
||||
“If you don't own your grunt work, can you really say you've done the climb?” </div>
|
||||
<div class='review-name'>
|
||||
Tommy Caldwell
|
||||
</div>
|
||||
<div class='review-title'>
|
||||
Multiple First Ascents in Yosemite National Park
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-carousel-card">
|
||||
<video class='left-video' autoplay muted loop>
|
||||
<source type="video/mp4" src="https://i.imgur.com/wMtE1Yt.mp4">
|
||||
</video>
|
||||
<div class='review'>
|
||||
<div class='review-text'>
|
||||
“Fear is always there; it's a survival instinct. You just need to know how to manage it. </div>
|
||||
<div class='review-name'>
|
||||
Jimmy Chin
|
||||
</div>
|
||||
<div class='review-title'>
|
||||
World-class videographer, photographer, and climber.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.left-video {
|
||||
border-radius: 18px;
|
||||
border: black 8px solid;
|
||||
position: relative;
|
||||
height: 380px;
|
||||
width: 660px;
|
||||
object-fit: fill;
|
||||
left: 100px;
|
||||
top: -100px;
|
||||
}
|
||||
.review {
|
||||
background: black;
|
||||
border-radius: 5px;
|
||||
padding: 100px 150px;
|
||||
width: 70%;
|
||||
}
|
||||
.review-text {
|
||||
font-size: 24px;
|
||||
}
|
||||
.review-name {
|
||||
font-size: 18px;
|
||||
padding-top: 25px;
|
||||
padding-bottom: 10px;
|
||||
color: lightgrey;
|
||||
}
|
||||
.review-title {
|
||||
color: lightgray;
|
||||
}
|
||||
.tips-tricks-carousel .slick-list {
|
||||
height: 580px;
|
||||
}
|
||||
.tips-tricks-carousel .slick-initialized .slick-slide {
|
||||
width: 100% !important;
|
||||
margin: auto;
|
||||
position: relative;
|
||||
top: 100px;
|
||||
}
|
||||
.tips-tricks-carousel .np-carousel-card {
|
||||
margin: auto !important;
|
||||
}
|
||||
.tips-tricks-carousel div.slick-list:nth-child(1) > div:nth-child(1) {
|
||||
height: 700px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
$("#tips-tricks-carousel").slick({
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1,
|
||||
cssEase: 'linear',
|
||||
arrows: false,
|
||||
infinite: true,
|
||||
dots: true,
|
||||
autoplay: true,
|
||||
autoplaySpeed: 5000
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
@ -0,0 +1,44 @@
|
||||
<main class="np-main np-catalog np-subpage-container np-max-width">
|
||||
<div class="np-catalog-header-wrapper">
|
||||
<div class="filter-buttons">
|
||||
<button class="filter-buttons-button" id='home'>Home</button>
|
||||
<button class="filter-buttons-button" id='catalog'>Course Catalog</button>
|
||||
<button class="filter-buttons-button" id='videos'>Videos</button>
|
||||
<button class="filter-buttons-button" id='instructors'>Professional Climbers</button>
|
||||
<button class="filter-buttons-button" id='live-courses'>Live Courses</button>
|
||||
<button class="filter-buttons-button" id='community'>Mountain Project</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.np-catalog-header-wrapper {
|
||||
display: block;
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.filter-buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
|
||||
.filter-buttons-button {
|
||||
background: none;
|
||||
border: white 1px solid;
|
||||
border-radius: 30px;
|
||||
color: white;
|
||||
padding: 15px 20px;
|
||||
font-size: 18px;
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
$('#home').click(function () { window.location.replace('/app') })
|
||||
$('#catalog').click(function () { window.location.replace('/app/catalog') })
|
||||
$('#videos').click(function () { window.location.replace('/app/videos') })
|
||||
$('#instructors').click(function () { window.location.replace('/app/instructors') })
|
||||
$('#live-courses').click(function () { window.location.replace('/app/live-courses') })
|
||||
$('#community').click(function () { window.location.replace('/app/community') })
|
||||
</script>
|
||||
@ -0,0 +1,39 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.in_catalog %}
|
||||
<div class="np-homepage-hero">
|
||||
<div class="np-homepage-hero-image">
|
||||
</div>
|
||||
<div class="np-homepage-hero-content">
|
||||
<div class="np-homepage-headline np-header-font-color">
|
||||
Menlo Security Resrouces
|
||||
</div>
|
||||
<div class="np-homepage-subheadline np-header-font-color">
|
||||
Resources to help you make the most of your Security Training
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include "sub_navigation" %}
|
||||
{% include "courses_catalog" %}
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.np-card-content-description {
|
||||
height: 100px;
|
||||
}
|
||||
.np-card-content-title {
|
||||
height: 58px;
|
||||
overflow: clip;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
<script>
|
||||
window.onload = function() {
|
||||
[].slice.call(document.getElementsByClassName("np-card-content-description")).forEach(function(element) {
|
||||
if(element.innerText.length > 150){
|
||||
element.innerText = element.innerText.slice(0,150) + '...'
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,32 @@
|
||||
{% include 'header' %}
|
||||
<main class="np-main np-homepage">
|
||||
<div class="np-homepage-hero">
|
||||
<h1 class="community-headline">Explore</h1>
|
||||
</div>
|
||||
{% include 'sub_navigation' %}
|
||||
<div class='discussion-container' style="border: 18px solid rgb(0, 0, 0); overflow: hidden; margin-left: 100px; margin-top: 35px; width: 1065px;">
|
||||
<iframe scrolling="yes" src="https://www.mountainproject.com/partner-finder" style="border: 0px none; margin-left: 15px auto; height: 1954px; margin-top: -100px; width: 1060px;"></iframe>
|
||||
</div>
|
||||
</main>
|
||||
{% include 'footer' %}
|
||||
|
||||
<style>
|
||||
.discussion-frame {
|
||||
min-width: 100%;
|
||||
margin-left: -10px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.discussion-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.community-headline {
|
||||
font-size: 32px;
|
||||
line-height: 48px;
|
||||
font-family: "Raleway", "Helvetic", "Arial" sans-serif;
|
||||
color: #ffffff;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,81 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.featured %}
|
||||
<main class="np-main np-homepage">
|
||||
<div class="np-homepage-hero">
|
||||
<div class="np-homepage-hero-image">
|
||||
<img class="np-homepage-hero-image"
|
||||
src="{{ homepage.artwork_url }}"
|
||||
alt="{{ homepage.headline }}"
|
||||
/>
|
||||
</div>
|
||||
<div class="np-homepage-hero-content">
|
||||
<div class="np-homepage-headline np-header-font-color">
|
||||
<img src="https://i.imgur.com/TayoEHg.png" style="width: 500px">
|
||||
</div>
|
||||
<div class="np-homepage-subheadline np-header-font-color">
|
||||
{{ homepage.subheadline }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include "sub_navigation" %}
|
||||
<div class="np-homepage-featured np-max-width">
|
||||
<div class="np-homepage-featured-text">
|
||||
<div class="np-homepage-headline">
|
||||
{{ homepage.featured_courses_headline }}
|
||||
</div>
|
||||
<div class="np-homepage-subheadline">
|
||||
{{ homepage.featured_courses_subheadline }}
|
||||
</div>
|
||||
</div>
|
||||
{% if courses.in_catalog.any? %}
|
||||
{% capture course.properties.course_order %}{{ course.properties.course_order | plus: 1 }}{% endcapture %}
|
||||
{% assign catalog_courses = courses.in_catalog | sort: "course.properties.course_order" %}
|
||||
<div class="np-homepage-featured-courses row">
|
||||
{% for course in catalog_courses %}
|
||||
<div class="col-xs-12 col-sm-8 col-md-12" style="margin:auto;">
|
||||
{% include "cards_featured_course" with course %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="np-homepage-featured-empty">
|
||||
<div class="np-zero-state-text">
|
||||
{% t .empty, key: current_school.course_vocabulary %}
|
||||
</div>
|
||||
<img
|
||||
class="np-zero-state-courses"
|
||||
alt="{% t .empty, key: current_school.course_vocabulary %}"
|
||||
/>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include "section_popular_topics" %}
|
||||
|
||||
{% include "section_professionals" %}
|
||||
|
||||
{% include "section_faqs" %}
|
||||
|
||||
{% include "section_instructors" %}
|
||||
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.np-card-content-description {
|
||||
height: 100px;
|
||||
}
|
||||
.np-card-content-title {
|
||||
height: 28px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
window.onload = function() {
|
||||
[].slice.call(document.getElementsByClassName("np-card-content-description")).forEach(function(element) {
|
||||
if(element.innerText.length > 350){
|
||||
element.innerText = element.innerText.slice(0,350) + '...'
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,31 @@
|
||||
{% include "header" %}
|
||||
<div class="np-homepage-hero">
|
||||
<div class="np-homepage-hero-image">
|
||||
</div>
|
||||
<div class="np-homepage-hero-content">
|
||||
<div class="np-homepage-headline np-header-font-color">
|
||||
Menlo Learning Program
|
||||
</div>
|
||||
<div class="np-homepage-subheadline np-header-font-color">
|
||||
Resources to help you make the most of your Security Training
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include "sub_navigation" %}
|
||||
<main class="np-main np-training-events np-subpage-container np-max-width">
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-sm-10">
|
||||
<div class="np-resource-title">
|
||||
{% t .title %}
|
||||
</div>
|
||||
<div class="np-resource-subtitle">
|
||||
{% t .subtitle %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-2">
|
||||
{% include "training_events_filter" %}
|
||||
</div>
|
||||
</div>
|
||||
{% include "training_events_index" %}
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
@ -0,0 +1,117 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.in_catalog %}
|
||||
<div class="np-homepage-hero">
|
||||
<div class="np-homepage-hero-image">
|
||||
</div>
|
||||
<div class="np-homepage-hero-content">
|
||||
<div class="np-homepage-headline np-header-font-color">
|
||||
Video Tutorials
|
||||
</div>
|
||||
<div class="np-homepage-subheadline np-header-font-color">
|
||||
Beginner to advanced level training for the die-hard climber
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include "sub_navigation" %}
|
||||
<div class='video-carousel'>
|
||||
<div class='video-carousel-title'>
|
||||
Getting Started
|
||||
</div>
|
||||
<div class='video-carousel-carousel-1'>
|
||||
{% for course in courses.in_catalog %}
|
||||
<div class='col-xs-12 col-md-6 col-lg-4 np-stretch-content'>
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<div class='video-carousel'>
|
||||
<div class='video-carousel-title'>
|
||||
Bouldering
|
||||
</div>
|
||||
<div class='video-carousel-carousel-2'>
|
||||
{% for course in courses.in_catalog %}
|
||||
<div class='col-xs-12 col-md-6 col-lg-4 np-stretch-content'>
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<div class='video-carousel'>
|
||||
<div class='video-carousel-title'>
|
||||
Roped Climbing
|
||||
</div>
|
||||
<div class='video-carousel-carousel-3'>
|
||||
{% for course in courses.in_catalog %}
|
||||
<div class='col-xs-12 col-md-6 col-lg-4 np-stretch-content'>
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% include "footer" %}
|
||||
<style>
|
||||
.video-carousel {
|
||||
max-width: 85%;
|
||||
margin: auto;
|
||||
margin-top: 70px;
|
||||
}
|
||||
.video-carousel-title {
|
||||
font-size: 26px;
|
||||
padding: 15px 0;
|
||||
}
|
||||
.slick-slider {
|
||||
display: flex;
|
||||
}
|
||||
.slick-arrow {
|
||||
background: none;
|
||||
border: none;
|
||||
color: white;
|
||||
font-size: 82px;
|
||||
font-weight: 100;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
}
|
||||
.slick-prev {
|
||||
left: -20px;
|
||||
}
|
||||
.slick-next {
|
||||
right: -20px;
|
||||
}
|
||||
.np-card-content-description {
|
||||
height: 100px;
|
||||
}
|
||||
.np-card-content-title {
|
||||
height: 85px;
|
||||
overflow: clip;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
$(".np-sub-navigation-content-item:contains('Videos')").addClass('np-sub-navigation-content-item-active')
|
||||
$(".video-carousel-carousel-1").slick({
|
||||
prevArrow: '<button type="button" class="slick-prev"><i class="fas fa-chevron-left"></i></button>',
|
||||
nextArrow: '<button type="button" class="slick-next"><i class="fas fa-chevron-right"></i></button>',
|
||||
infinite: false,
|
||||
slidesToShow: 3,
|
||||
})
|
||||
$(".video-carousel-carousel-2").slick({
|
||||
prevArrow: '<button type="button" class="slick-prev"><i class="fas fa-chevron-left"></i></button>',
|
||||
nextArrow: '<button type="button" class="slick-next"><i class="fas fa-chevron-right"></i></button>',
|
||||
infinite: false,
|
||||
slidesToShow: 3,
|
||||
})
|
||||
$(".video-carousel-carousel-3").slick({
|
||||
prevArrow: '<button type="button" class="slick-prev"><i class="fas fa-chevron-left"></i></button>',
|
||||
nextArrow: '<button type="button" class="slick-next"><i class="fas fa-chevron-right"></i></button>',
|
||||
infinite: false,
|
||||
slidesToShow: 3,
|
||||
})
|
||||
window.onload = function() {
|
||||
[].slice.call(document.getElementsByClassName("np-card-content-description")).forEach(function(element) {
|
||||
if(element.innerText.length > 150){
|
||||
element.innerText = element.innerText.slice(0,150) + '...'
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,73 @@
|
||||
{% assign activities_count = 0 %}
|
||||
{% for course_section in course.sections %}
|
||||
{% for course_activity in course_section.activities %}
|
||||
{% assign activities_count = activities_count | plus: 1 %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
||||
<div class="np-card">
|
||||
<div class="np-card-container">
|
||||
<a href="{{ course_path }}">
|
||||
<img
|
||||
class="np-card-image"
|
||||
alt="{{ course.name }}"
|
||||
src="{{ course.image_url }}"
|
||||
>
|
||||
</a>
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding">
|
||||
<a class="np-card-content-title" href="{{ course_path }}">
|
||||
{{ course.name }}
|
||||
</a>
|
||||
<div class="np-card-content-subtitle">
|
||||
{{ course.full_description }}
|
||||
</div>
|
||||
<div class="np-card-content-lessons">
|
||||
{{ activities_count }} {% if activities_count == 1 %}Lesson{% else %}Lessons{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.np-card {
|
||||
padding: 25px 30px !important;
|
||||
}
|
||||
.np-card-content {
|
||||
padding: 10px 50px 40px;
|
||||
}
|
||||
.np-card-content-title {
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 28px;
|
||||
font-weight: 800;
|
||||
text-decoration: none;
|
||||
height: 65px;
|
||||
overflow: clip;
|
||||
}
|
||||
.np-card-content-subtitle {
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
color: rgba(0,0,0,.75);
|
||||
height: 100px;
|
||||
margin-top: 10px;
|
||||
|
||||
}
|
||||
.np-card-content-lessons {
|
||||
color: rgb(38, 49, 61);
|
||||
font-weight: 800;
|
||||
font-size: 21px;
|
||||
margin-top: 20px;
|
||||
line-height: 26px;
|
||||
}
|
||||
.np-card-content-footer {
|
||||
margin-top: 40px;
|
||||
}
|
||||
.np-button {
|
||||
height: 53px;
|
||||
border-radius: 100px;
|
||||
padding: 12px 45px;
|
||||
}
|
||||
.np-card-content-progress {
|
||||
font-size: 18px;
|
||||
margin: auto 0;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,127 @@
|
||||
<div class="np-card-container">
|
||||
<div class='np-course-header'>
|
||||
<img
|
||||
src="{{ course.image_url }}"
|
||||
class="np-top-image np-top-image-spacing"
|
||||
alt="{{ course.name }}"
|
||||
/>
|
||||
<div class='np-course-header-right'>
|
||||
<div class='np-course-header-right-name'>
|
||||
{{ course.name }}
|
||||
</div>
|
||||
<div class='np-course-header-right-short'>
|
||||
Learn the basics of profile value, how to customize your profile to catch the eyes of more buyers, and demand capture 101.
|
||||
</div>
|
||||
<div class='np-course-header-right-button'>
|
||||
{% include "course_progress_and_cta" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class='np-course-bottom'>
|
||||
<div class='np-course-bottom-left'>
|
||||
<div class='np-course-bottom-left-title'>
|
||||
Curriculum
|
||||
</div>
|
||||
<div class='np-course-bottom-left-outline'>
|
||||
{% for section in course.sections %}
|
||||
<div class='np-course-bottom-left-outline-section'>
|
||||
{{ section.name }}
|
||||
</div>
|
||||
{% for activity in section.activities %}
|
||||
<div class='np-course-bottom-left-outline-activity'>
|
||||
{{ activity.title }}
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<div class='np-course-bottom-right'>
|
||||
<div class='np-course-bottom-right-title'>
|
||||
About this course
|
||||
</div>
|
||||
<div class='np-course-bottom-right-description'>
|
||||
{{ course.full_description }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
body {
|
||||
background: rgb(254, 254, 254);
|
||||
}
|
||||
.np-card-container {
|
||||
background: rgb(254, 254, 254);
|
||||
box-shadow: none;
|
||||
}
|
||||
.np-course-header {
|
||||
display: flex;
|
||||
border-bottom: 1px solid #d6d6d6;
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
.np-top-image {
|
||||
height: 400;
|
||||
margin: auto 0;
|
||||
}
|
||||
.np-course-header-right {
|
||||
padding-left: 50px;
|
||||
}
|
||||
.np-course-header-right-name {
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 50px;
|
||||
font-weight: 800;
|
||||
margin-bottom: 25px;
|
||||
margin-top: 40px;
|
||||
}
|
||||
.np-course-header-right-short {
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 21px;
|
||||
font-weight: 400px;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
.np-course-bottom {
|
||||
display: flex;
|
||||
margin-top: 70px;
|
||||
}
|
||||
.np-course-bottom-left{
|
||||
width: 70%;
|
||||
}
|
||||
.np-course-bottom-left-title {
|
||||
font-weight: 900;
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 24px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.np-course-bottom-left-outline {
|
||||
border: 1px solid #979797 !important;
|
||||
border-radius: 10px;
|
||||
padding: 20px 0;
|
||||
}
|
||||
.np-course-bottom-left-outline-section {
|
||||
margin: 10px 0;
|
||||
padding: 0 40px 0 20px;
|
||||
font-size: 18px;
|
||||
line-height: 1.4;
|
||||
text-transform: uppercase;
|
||||
font-weight: 900;
|
||||
}
|
||||
.np-course-bottom-left-outline-activity {
|
||||
padding: 7px 30px;
|
||||
font-size: 18px;
|
||||
line-height: 28.8px;
|
||||
font-weight: 400;
|
||||
}
|
||||
.np-course-bottom-right {
|
||||
margin-left: 110px;
|
||||
}
|
||||
.np-course-bottom-right-title {
|
||||
font-weight: 900;
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 24px;
|
||||
}
|
||||
.np-course-bottom-right-description {
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
color: rgb(10, 10, 10);
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,38 @@
|
||||
{% if course.learner_can_retake? %}
|
||||
<form action="{% route course_retake, id: course.id %}" method="POST">
|
||||
{% form_authenticity_token %}
|
||||
<button type="submit" class="np-top-button np-button-font-color np-button np-button-big">
|
||||
{% t .retake, key: current_school.course_vocabulary %}
|
||||
</button>
|
||||
</form>
|
||||
{% else %}
|
||||
<a
|
||||
class="np-top-button np-button-font-color np-button np-button-big"
|
||||
{% if course.enrolled? %}
|
||||
href="{% route course_viewer, course_id: course.id, learning_path_id: params.learning_path_id %}"
|
||||
{% else %}
|
||||
href="{% route course_enrollment, code: course.enrollment_code %}"
|
||||
{% endif %}
|
||||
>
|
||||
{% if course.enrolled? == false %}
|
||||
{% t shared.enroll %}
|
||||
{% elsif course.started? == false %}
|
||||
{% t shared.course.start, key: current_school.course_vocabulary %}
|
||||
{% elsif course.completed? %}
|
||||
{% t shared.course.view, key: current_school.course_vocabulary %}
|
||||
{% else %}
|
||||
{% t shared.continue %}
|
||||
{% endif %}
|
||||
</a>
|
||||
{% endif %}
|
||||
<style>
|
||||
.np-top-button {
|
||||
height: 53px;
|
||||
border-radius: 100px;
|
||||
padding: 12px 45px;
|
||||
font-size: 16px;
|
||||
color: white;
|
||||
font-weight: 700;
|
||||
border-radius: 100px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,26 @@
|
||||
{% if courses.in_catalog.any? %}
|
||||
<div class="np-catalog-courses row row-with-thumbnails" id="courses">
|
||||
{% for course in courses.in_catalog %}
|
||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
{% capture message %}
|
||||
{% t shared.zero_state.courses.catalog,
|
||||
key: current_school.course_vocabulary
|
||||
%}
|
||||
{% endcapture %}
|
||||
{% include "courses_zero_state", message: message %}
|
||||
{% endif %}
|
||||
|
||||
<style>
|
||||
.np-catalog-courses {
|
||||
width: 70%;
|
||||
margin: 40px auto;
|
||||
}
|
||||
.np-card {
|
||||
padding: 20px;
|
||||
}
|
||||
</style>
|
||||
202
Custom_Templates/customer_templates/Akitabox/_footer.html.liquid
Normal file
202
Custom_Templates/customer_templates/Akitabox/_footer.html.liquid
Normal file
@ -0,0 +1,202 @@
|
||||
<footer class="np-footer">
|
||||
<div class='footer-top'>
|
||||
<ul class='footer-top-column'>
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/demos/conservis_wrap.png" class="float-left show-for-medium" style="width:20px;margin:15px 0 0 -29px;position: absolute;" alt="">
|
||||
<li class='footer-top-column-title'>
|
||||
For Farmers
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Platform Overview
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Software Reviews
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Products
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Partnerships
|
||||
</li>
|
||||
<button class='footer-top-column-button'>
|
||||
Submit Feedback
|
||||
</button>
|
||||
</ul>
|
||||
<ul class='footer-top-column'>
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/demos/conservis_wrap.png" class="float-left show-for-medium" style="width:20px;margin:15px 0 0 -29px;position: absolute;" alt="">
|
||||
<li class='footer-top-column-title'>
|
||||
For Financial Planners
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Market Profiles
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Minimizing Costs
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Buying Data
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Long Term Investments
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Competitive Insights
|
||||
</li>
|
||||
<button class='footer-top-column-button'>
|
||||
Add Your Financial Insight
|
||||
</button>
|
||||
</ul>
|
||||
<ul class='footer-top-column'>
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/demos/conservis_wrap.png" class="float-left show-for-medium" style="width:20px;margin:15px 0 0 -29px;position: absolute;" alt="">
|
||||
<li class='footer-top-column-title'>
|
||||
Company
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
About
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Leadership
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Careers
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Gives
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
News
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Contact
|
||||
</li>
|
||||
<li class='footer-top-column-socials'>
|
||||
|
||||
</li>
|
||||
</ul>
|
||||
<ul class='footer-top-column'>
|
||||
<img src=https://s3.amazonaws.com/static.northpass.com/demos/conservis_wrap.png" class="float-left show-for-medium" style="width:20px;margin:15px 0 0 -29px;position: absolute;" alt="">
|
||||
<li class='footer-top-column-title'>
|
||||
Resources
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Sell
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Learn
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Research
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Partner
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="footer-seperator"></div>
|
||||
<div class='footer-bottom'>
|
||||
<ul class='footer-bottom-links'>
|
||||
<li class='footer-botoom-links-elements'>Community Guidelines</li>
|
||||
<li class='footer-botoom-links-elements'>Conservis Methodologies</li>
|
||||
<li class='footer-botoom-links-elements'>Terms of Use </li>
|
||||
<li class='footer-botoom-links-elements'>Privacy Policy </li>
|
||||
<li class='footer-botoom-links-elements'>Cookie Policy </li>
|
||||
<li class='footer-botoom-links-elements'>Copyright Complaint Policy </li>
|
||||
<li class='footer-botoom-links-elements'>Content Usage Guidelines </li>
|
||||
<li class='footer-botoom-links-elements'>Do Not Sell My Personal Information </li>
|
||||
</ul>
|
||||
<div class='footer-bottom-logo'>
|
||||
<img
|
||||
alt="{{ current_school.name }}"
|
||||
class="footer-bottom-logo-img"
|
||||
src="{{ current_school.logo_url }}"
|
||||
/>
|
||||
<div class='footer-bottom-logo-right'>
|
||||
<div class='footer-bottom-logo-right-element'>
|
||||
1624 Harmon Place
|
||||
</div>
|
||||
<div class='footer-bottom-logo-right-element'>
|
||||
Ste. 304
|
||||
</div>
|
||||
<div class='footer-bottom-logo-right-element'>
|
||||
Minneapolis, MN 55403
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class='footer-bottom-subline'>
|
||||
© 2022, Conservis.ag, Inc. All Rights Reserved.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</footer>
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Assistant:wght@200;300;400;500;600;700;800&display=swap');
|
||||
</style>
|
||||
<style>
|
||||
.np-footer {
|
||||
background: rgb(6, 40, 70);
|
||||
}
|
||||
.footer-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-evenly;
|
||||
width: 100%;
|
||||
}
|
||||
.footer-top-column {
|
||||
list-style-type: none;
|
||||
}
|
||||
.footer-top-column-title {
|
||||
color: white;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.footer-top-column-element {
|
||||
color: white;
|
||||
font-size: 15px;
|
||||
line-height: 15px;
|
||||
font-weight: 400;
|
||||
padding: 9px 0;
|
||||
}
|
||||
.footer-top-column-button {
|
||||
background: none;
|
||||
border: 2px white solid;
|
||||
border-radius: 100px;
|
||||
padding: 9px 25px;
|
||||
font-size: 14px;
|
||||
color: white;
|
||||
font-weight: 600;
|
||||
}
|
||||
.footer-seperator {
|
||||
border-top: rgb(128, 128, 128) 1px solid;
|
||||
width: 90%;
|
||||
margin: auto;
|
||||
height: 1px;
|
||||
margin: 40px 0;
|
||||
}
|
||||
.footer-bottom-links {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
list-style-type: none;
|
||||
color: rgb(168, 168, 172);
|
||||
font-size: 14px;
|
||||
}
|
||||
.footer-botoom-links-elements {
|
||||
margin: 10px;
|
||||
}
|
||||
.footer-bottom-logo {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
color: rgb(168, 168, 172);
|
||||
font-size: 14px;
|
||||
}
|
||||
.footer-bottom-logo-img {
|
||||
height: 55px;
|
||||
margin: 0 10px 10px 0;
|
||||
}
|
||||
.footer-bottom-subline {
|
||||
color: rgb(168, 168, 172);
|
||||
font-size: 14px;
|
||||
}
|
||||
body {
|
||||
font-family: "Assistant", sans-serif !important;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,18 @@
|
||||
{% styles default %}
|
||||
{% styles colors %}
|
||||
{% styles custom %}
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
if (window.location.href.indexOf("/login") > -1 && window.location.href.indexOf("?email") > -1 ) {
|
||||
console.log(document.referrer)
|
||||
$('body').css("display", "none");
|
||||
$('input.np-button').click();
|
||||
}
|
||||
</script>
|
||||
|
||||
<script> window.intercomSettings = { app_id: "xocco3tv" }; </script>
|
||||
<script>
|
||||
(function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',w.intercomSettings);}else{var d=document;var i=function(){i.c(arguments);};i.q=[];i.c=function(args){i.q.push(args);};w.Intercom=i;var l=function(){var s=d.createElement('script');s.type='text/javascript';s.async=true;s.src='https://widget.intercom.io/widget/hal1rveh';var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);};if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})();
|
||||
</script>
|
||||
<style> .intercom-lightweight-app-launcher { float: right; bottom: 45px !important; margin-right: 40px; } </style>
|
||||
259
Custom_Templates/customer_templates/Akitabox/_header.html.liquid
Normal file
259
Custom_Templates/customer_templates/Akitabox/_header.html.liquid
Normal file
@ -0,0 +1,259 @@
|
||||
<header class="np-header np-header-color">
|
||||
<div class="np-header-content">
|
||||
<div class="np-hidden-desktop np-header-mobile-menu-nav">
|
||||
{% if current_person.signed_in? %}
|
||||
<button
|
||||
data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button fal fa-times np-hidden np-header-font-color"
|
||||
data-toggle-target=".np-header-mobile-avatar-menu,
|
||||
.np-header-mobile-menu-content, .np-main, .np-footer"
|
||||
></button>
|
||||
<button
|
||||
data-test="open-mobile-menu"
|
||||
data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button np-header-mobile-avatar-menu"
|
||||
data-toggle-target=".fa-times, .np-header-mobile-menu-content, .np-main, .np-footer"
|
||||
>
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-avatar-image"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
/>
|
||||
</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if current_school.logo_url %}
|
||||
<h1 class="np-header-logo">
|
||||
<a href="{% route home %}">
|
||||
<img
|
||||
alt="{{ current_school.name }}"
|
||||
class="np-header-logo-image"
|
||||
src="{{ current_school.logo_url }}"
|
||||
/>
|
||||
</a>
|
||||
</h1>
|
||||
{% else %}
|
||||
<a href="{% route home %}" class="np-school-name np-header-font-color">
|
||||
{{ current_school.name }}
|
||||
</a>
|
||||
{% endif %}
|
||||
|
||||
<div class="np-hidden-mobile np-header-desktop-nav">
|
||||
<ul class="np-header-desktop-nav-list">
|
||||
<li class='np-header-right-menu-label' id='label1'>
|
||||
Solutions
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
<ul class='np-header-right-menu-list' id='menu1'>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Row Crops
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Permanent Crops
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class='np-header-right-menu-label' id='label2'>
|
||||
Relationships
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
<ul class='np-header-right-menu-list' id='menu2'>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
AggOtter
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Climate FieldView
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
John Deer Operations Center
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Rabo AgriFinance
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class='np-header-right-menu-label' id='label3'>
|
||||
Stories
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
<ul class='np-header-right-menu-list' id='menu3'>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Blog Posts
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Case Studies
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
In the News
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Press Releases
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class='np-header-right-menu-label'>
|
||||
Plans
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
{% if current_person.signed_in? %}
|
||||
<div class="np-hidden-mobile np-header-search np-header-search-expanded">
|
||||
<form action="{% route search %}" method="get" data-test="desktop-search">
|
||||
<input
|
||||
aria-label="{% t .search %}"
|
||||
class="np-header-search-input np-header-font-background-color"
|
||||
type="text"
|
||||
name="q"
|
||||
placeholder="{% t .search %}"
|
||||
/>
|
||||
<i class="np-header-search-icon far fa-search"></i>
|
||||
</form>
|
||||
</div>
|
||||
<div class="np-hidden-mobile np-header-avatar">
|
||||
<button
|
||||
class="np-header-avatar-button"
|
||||
data-test="open-desktop-menu"
|
||||
data-toggle-class-on-target="np-hidden"
|
||||
data-toggle-target=".np-header-avatar-tooltip"
|
||||
data-toggle-outside
|
||||
>
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-avatar-image"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
>
|
||||
</button>
|
||||
<div class="np-header-avatar-tooltip np-hidden" role="tooltip">
|
||||
<span class="np-header-avatar-tooltip-arrow-up"></span>
|
||||
<div class="np-header-avatar-tooltip-learner">
|
||||
<div class="np-header-avatar-tooltip-learner-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
<div class="np-header-avatar-tooltip-learner-email">
|
||||
{{ current_person.email }}
|
||||
</div>
|
||||
</div>
|
||||
<nav class="np-header-avatar-tooltip-navigation">
|
||||
{% unless current_school.sso_active? %}
|
||||
<a
|
||||
class="np-header-avatar-tooltip-navigation-link"
|
||||
href="{% route account %}"
|
||||
>
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a
|
||||
class="np-header-avatar-tooltip-navigation-link np-danger"
|
||||
href="{% route logout %}"
|
||||
>
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<a
|
||||
class="np-header-sign-in np-header-desktop-nav-link np-header-font-color"
|
||||
href="{% route login %}"
|
||||
>
|
||||
{% t shared.sign_in %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="np-hidden-desktop">
|
||||
<div class="np-header-mobile-menu-content np-hidden">
|
||||
{% if current_person.signed_in? %}
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-mobile-menu-content-avatar"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
/>
|
||||
<div class="np-header-mobile-menu-content-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="np-header-mobile-menu-content-nav">
|
||||
<form
|
||||
class="np-header-search"
|
||||
data-test="mobile-search"
|
||||
method="get"
|
||||
action="{% route search %}"
|
||||
>
|
||||
<input
|
||||
aria-label="{% t .search %}"
|
||||
class="np-header-search-input"
|
||||
type="text"
|
||||
name="q"
|
||||
placeholder="{% t .search %}"
|
||||
/>
|
||||
<i class="np-header-search-icon far fa-search"></i>
|
||||
</form>
|
||||
{% for website_navigation in navigations.header_navigations %}
|
||||
<a
|
||||
href="{{ website_navigation.path }}"
|
||||
class="np-header-mobile-menu-content-button"
|
||||
{% if website_navigation.external? %} target="_blank" {% endif %}
|
||||
>
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
{% endfor %}
|
||||
<div class="np-header-mobile-menu-content-line"></div>
|
||||
{% unless current_school.sso_active? %}
|
||||
<a
|
||||
class="np-header-mobile-menu-content-button"
|
||||
href="{% route account %}"
|
||||
>
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a
|
||||
class="np-header-mobile-menu-content-button np-danger"
|
||||
href="{% route logout %}"
|
||||
>
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% include "messages" %}
|
||||
<style>
|
||||
.np-header-logo-image {
|
||||
height: 55px;
|
||||
}
|
||||
.np-header-right-menu-label {
|
||||
font-size: 18px;
|
||||
padding: 13px 18px;
|
||||
}
|
||||
.np-header-right-menu-list {
|
||||
position: absolute;
|
||||
top: 80px;
|
||||
display: none;
|
||||
padding: 15px;
|
||||
background: white;
|
||||
list-style-type: none;
|
||||
z-index: 10;
|
||||
border-top: 2px solid #5a39a2;
|
||||
margin-left: -25px;
|
||||
}
|
||||
.np-header-right-menu-list-element {
|
||||
padding: 10px 0;
|
||||
}
|
||||
#label1:hover > #menu1 {
|
||||
display: block
|
||||
}
|
||||
#menu1:hover {
|
||||
display: block;
|
||||
}
|
||||
#label2:hover > #menu2 {
|
||||
display: block
|
||||
}
|
||||
#menu2:hover {
|
||||
display: block;
|
||||
}
|
||||
#label3:hover > #menu3 {
|
||||
display: block
|
||||
}
|
||||
#menu3:hover {
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,193 @@
|
||||
<div class='events-wrapper' id="events">
|
||||
<div class='events'>
|
||||
<div class='events-header'>
|
||||
<div class='events-header-title'>
|
||||
Drive revenue & harvests with decisions informed from Conservis' Suite of Tools.
|
||||
</div>
|
||||
<div class='events-header-subtitle'>
|
||||
Hundres of customers have organized their fields and finances by using the Conservis Platform and their expert Customer Success plans. Why not join them?
|
||||
</div>
|
||||
</div>
|
||||
<div class='events-event'>
|
||||
<div class='events-event-left'>
|
||||
<div class='events-event-left-title'>
|
||||
Standardizing Inventory Management
|
||||
</div>
|
||||
<div class='events-event-left-subtitle'>
|
||||
From the moment you purchase to the moment you use it, standardizing your inventory leads to actionable results. Not to mention that it frees your staff up for other tasks!
|
||||
</div>
|
||||
<div class='events-event-left-date'>
|
||||
March 27, 2022 @ 2PM EST
|
||||
</div>
|
||||
<button class='events-event-left-button'>
|
||||
Register
|
||||
</button>
|
||||
</div>
|
||||
<div class='events-event-right'>
|
||||
<div class='events-event-right-title'>
|
||||
Hosts
|
||||
</div>
|
||||
<div class='events-event-right-person'>
|
||||
<img class='events-event-right-person-image' src='https://media-exp1.licdn.com/dms/image/C4E03AQHUBtcttBJTZw/profile-displayphoto-shrink_800_800/0/1516236401149?e=1651708800&v=beta&t=VkbQ1BwLZ_6YRdGxnvwiWS4PKx7RTlezN-sTKhY1dQo'>
|
||||
<div class='events-event-right-person-right'>
|
||||
<div class='events-event-right-person-right-name'>
|
||||
Aneetha Gopalan
|
||||
</div>
|
||||
<div class='events-event-right-person-right-title'>
|
||||
VP, Product & Engineering
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class='events-event-right-person'>
|
||||
<img class='events-event-right-person-image' src='https://media-exp1.licdn.com/dms/image/C5603AQGckaki_fPzkg/profile-displayphoto-shrink_800_800/0/1516585708428?e=1651708800&v=beta&t=8TXevG1-W4hPcNibAAYhhqfRNSrzNDF0OzvwBvr0UJ8'>
|
||||
<div class='events-event-right-person-right'>
|
||||
<div class='events-event-right-person-right-name'>
|
||||
Juliet Phillips
|
||||
</div>
|
||||
<div class='events-event-right-person-right-title'>
|
||||
Training & Development Manager
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class='events-event'>
|
||||
<div class='events-event-left'>
|
||||
<div class='events-event-left-title'>
|
||||
How to Financial Plan for a Full Future
|
||||
</div>
|
||||
<div class='events-event-left-subtitle'>
|
||||
Increase your harvest numbers for years to come with proper management.
|
||||
</div>
|
||||
<div class='events-event-left-date'>
|
||||
February TBD
|
||||
</div>
|
||||
<button class='events-event-left-button'>
|
||||
Register
|
||||
</button>
|
||||
</div>
|
||||
<div class='events-event-right'>
|
||||
<div class='events-event-right-title'>
|
||||
Host
|
||||
</div>
|
||||
<div class='events-event-right-person'>
|
||||
<img class='events-event-right-person-image' src='https://media-exp1.licdn.com/dms/image/C4E03AQELOcYI4FL7jg/profile-displayphoto-shrink_800_800/0/1582566920630?e=1651708800&v=beta&t=oDTc9zXONrDS8evefxY-Q1VnMVUUDl9ush2VqUJ4QGg'>
|
||||
<div class='events-event-right-person-right'>
|
||||
<div class='events-event-right-person-right-name'>
|
||||
Tyler Jaeger
|
||||
</div>
|
||||
<div class='events-event-right-person-right-title'>
|
||||
Commercial Operations
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.events-wrapper {
|
||||
background-image: url('https://conservis.ag/wp-content/uploads/bkr_pivot_scouting-scaled.jpg');
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
}
|
||||
.events {
|
||||
width: 70%;
|
||||
margin: auto;
|
||||
padding: 120px 0;
|
||||
}
|
||||
.events-header {
|
||||
width: 55%;
|
||||
margin: auto;
|
||||
margin-bottom: 100px;
|
||||
}
|
||||
.events-header-title {
|
||||
font-size: 43px;
|
||||
font-weight: 800;
|
||||
text-align: center;
|
||||
}
|
||||
.events-header-subtitle {
|
||||
font-size: 21px;
|
||||
font-weight: 400;
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
}
|
||||
.events-event {
|
||||
width: 70%;
|
||||
margin: 20px auto;
|
||||
background: rgb(255, 251, 238);
|
||||
padding: 50px 60px;
|
||||
display: flex;
|
||||
border-radius: 5px;
|
||||
box-shadow: rgba(0, 0, 0, 0.05) 0px 2px 20px 10px;
|
||||
|
||||
}
|
||||
.events-event-left {
|
||||
width: 55%;
|
||||
}
|
||||
.events-event-left-title {
|
||||
font-size: 28px;
|
||||
font-weight: 800;
|
||||
color: rgb(6, 40, 70);
|
||||
margin: 10px 0 20px;
|
||||
}
|
||||
.events-event-left-subtitle {
|
||||
font-size: 21px;
|
||||
font-weight: 400;
|
||||
color: rgba(0, 0, 0, 0.75);
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.events-event-left-date {
|
||||
font-size: 21px;
|
||||
font-weight: 800;
|
||||
color: rgb(6, 40, 70);
|
||||
margin: 10px 0;
|
||||
}
|
||||
.events-event-left-button {
|
||||
background: none;
|
||||
border: 2px solid rgb(6, 40, 70);
|
||||
color: rgb(6, 40, 70);
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
padding: 12px 45px;
|
||||
margin-top: 40px;
|
||||
border-radius: 25px;
|
||||
}
|
||||
.events-event-right {
|
||||
margin-left: 70px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.events-event-right-title {
|
||||
font-size: 21px;
|
||||
font-weight: 800;
|
||||
color: rgb(155, 169, 181);
|
||||
margin-top: 10px;
|
||||
}
|
||||
.events-event-right-person {
|
||||
display: flex;
|
||||
margin: 30px 0;
|
||||
}
|
||||
.events-event-right-person-image {
|
||||
border-radius: 50%;
|
||||
height: 52px;
|
||||
}
|
||||
.events-event-right-person-right {
|
||||
margin-left: 20px;
|
||||
}
|
||||
.events-event-right-person-right-name {
|
||||
color: rgb(6, 40, 70);
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
margin-bottom: 7px;
|
||||
}
|
||||
.events-event-right-person-right-title {
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,99 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.featured %}
|
||||
<main class="np-main np-homepage">
|
||||
<div class="np-homepage-hero">
|
||||
<img class="np-homepage-hero-image"
|
||||
src="{{ homepage.artwork_url }}"
|
||||
alt="{{ homepage.headline }}"
|
||||
/>
|
||||
<div class="np-homepage-hero-content">
|
||||
<img class='np-homepage-hero-logo' src='https://s3.amazonaws.com/static.northpass.com/demos/akitabox_emblem.png'>
|
||||
<div class="np-homepage-headline np-header-font-color">
|
||||
{{ homepage.headline }}
|
||||
</div>
|
||||
<div class="np-homepage-subheadline np-header-font-color">
|
||||
{{ homepage.subheadline }}
|
||||
</div>
|
||||
<hr class='np-divider-line'>
|
||||
<div class='np-homepage-buttons'>
|
||||
<a class="np-homepage-hero-cta np-button" href="#courses">
|
||||
Facilities Condition Management
|
||||
</a>
|
||||
<a class="np-homepage-hero-cta np-button" href="#events">
|
||||
Asset Management
|
||||
</a>
|
||||
<a class="np-homepage-hero-cta np-button" href="#courses">
|
||||
Maintenence Management
|
||||
</a>
|
||||
<a class="np-homepage-hero-cta np-button" href="#events">
|
||||
Capital Management
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include 'courses_catalog' %}
|
||||
{% include 'homepage_events' %}
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
body {
|
||||
background: #FEFEFE
|
||||
}
|
||||
.np-main {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.np-powered-by {
|
||||
background: rgb(6, 40, 70);
|
||||
}
|
||||
.np-homepage-hero-image {
|
||||
max-height: 612px;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
.np-homepage-hero-logo {
|
||||
width: 125px;
|
||||
}
|
||||
.np-homepage-headline {
|
||||
font-size: 67px !important;
|
||||
font-weight: 800 !important;
|
||||
}
|
||||
.np-homepage-subheadline {
|
||||
color: rgb(241,195,26) !important;
|
||||
font-size: 28px !important;
|
||||
font-weight: 400 !important;
|
||||
max-width: 630px !important;
|
||||
line-height: 1.2;
|
||||
margin-left: 255px;
|
||||
}
|
||||
.np-divider-line {
|
||||
width: 400px;
|
||||
margin: 40px auto 40px auto;
|
||||
border-width: 5px 0 0 0;
|
||||
border-style: solid;
|
||||
border-color: rgb(255,174,3);
|
||||
font-size: 1rem;
|
||||
transition-timing-function: cubic-bezier(0.400,0.000,0.200,1.000);
|
||||
}
|
||||
.np-homepage-buttons {
|
||||
display: flex;
|
||||
margin: 25px auto;
|
||||
justify-content: center;
|
||||
}
|
||||
.np-homepage-hero-cta {
|
||||
height: 53px !important;
|
||||
border-radius: 100px !important;
|
||||
padding: 12px 45px !important;
|
||||
margin: 0 15px !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
window.onload = function() {
|
||||
[].slice.call(document.getElementsByClassName("np-card-content-subtitle")).forEach(function(element) {
|
||||
if(element.innerText.length > 100){
|
||||
element.innerText = element.innerText.slice(0,100) + '...'
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,10 @@
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300&display=swap');
|
||||
</style>
|
||||
|
||||
<link rel="stylesheet" media="all" href="{{ routes.schoolkeep_v3_styles_url }}">
|
||||
<link rel="stylesheet" media="all" href="{{ routes.color_scheme_path }}">
|
||||
|
||||
{% if current_school.has_custom_styles? %}
|
||||
<link rel="stylesheet" media="all" href="{{ routes.custom_styles_path }}">
|
||||
{% endif %}
|
||||
@ -0,0 +1,6 @@
|
||||
{% styles default %}
|
||||
{% styles colors %}
|
||||
{% styles custom %}
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300&display=swap');
|
||||
</style>
|
||||
@ -0,0 +1,52 @@
|
||||
{% include "header" %}
|
||||
<main class="np-main np-homepage">
|
||||
<div class="np-homepage-hero">
|
||||
<img class="np-homepage-hero-image"
|
||||
src="{{ homepage.artwork_url }}"
|
||||
alt="{{ homepage.headline }}"
|
||||
/>
|
||||
<div class="np-homepage-hero-content">
|
||||
<div class="np-homepage-headline np-header-font-color">
|
||||
{{ homepage.headline }}
|
||||
</div>
|
||||
<div class="np-homepage-subheadline np-header-font-color">
|
||||
{{ homepage.subheadline }}
|
||||
</div>
|
||||
<a class="np-homepage-hero-cta np-button" href="{% route catalog %}">
|
||||
{% t .discover %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
{% include "sub_navigation" %}
|
||||
<div class="np-homepage-featured np-max-width">
|
||||
<div class="np-homepage-featured-text">
|
||||
<div class="np-homepage-headline">
|
||||
{{ homepage.featured_courses_headline }}
|
||||
</div>
|
||||
<div class="np-homepage-subheadline">
|
||||
{{ homepage.featured_courses_subheadline }}
|
||||
</div>
|
||||
</div>
|
||||
{% if courses.featured.any? %}
|
||||
<div class="np-homepage-featured-courses row">
|
||||
{% for course in courses.featured %}
|
||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="np-homepage-featured-empty">
|
||||
<div class="np-zero-state-text">
|
||||
{% t .empty, key: current_school.course_vocabulary %}
|
||||
</div>
|
||||
<img
|
||||
class="np-zero-state-courses"
|
||||
alt="{% t .empty, key: current_school.course_vocabulary %}"
|
||||
/>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</main>
|
||||
{% include "group_styles" %}
|
||||
{% include "footer" %}
|
||||
@ -0,0 +1,20 @@
|
||||
@font-face {
|
||||
font-family: 'Open Sans', sans-serif !important;
|
||||
src: url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300&display=swap');
|
||||
}
|
||||
body, html, div {
|
||||
font-family: 'Open Sans', sans-serif !important;
|
||||
}
|
||||
.np-main.np-dashboard.np-subpage-container {
|
||||
padding-top: 20px !important;
|
||||
}
|
||||
.np-sub-navigation {
|
||||
padding-top: 10px !important;
|
||||
padding-bottom: 10px !important;
|
||||
}
|
||||
.np-sub-navigation-content-item-bar {
|
||||
display: none !important;
|
||||
}
|
||||
.np-header-desktop-nav-link.np-header-font-color{
|
||||
color: #215eb8;
|
||||
}
|
||||
@ -0,0 +1,54 @@
|
||||
<a class="np-card" href="{% route course_enrollment, code: course.enrollment_code %}">
|
||||
<div class="np-card-container">
|
||||
{% if course.ribbon %}
|
||||
<div class="np-card-ribbon">
|
||||
{{ course.ribbon }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<img
|
||||
class="np-card-image"
|
||||
alt="{{ course.name }}"
|
||||
src="{{ course.image_url }}"
|
||||
>
|
||||
<div class="np-card-content-bottom">
|
||||
<h3 class="np-card-content-title np-color-white">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
<div class="np-card-content-subtitle np-color-white">
|
||||
{{ course.instructor_names }}
|
||||
</div>
|
||||
<div class='np-card-content-description'>
|
||||
{{ course.full_description }}
|
||||
</div>
|
||||
|
||||
<div class="np-card-content-progress np-button-color">
|
||||
{% t shared.progress, count: course.progress %}
|
||||
</div>
|
||||
<div class="np-card-content-category">
|
||||
{{course.categories.first.name}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<style>
|
||||
.np-card {
|
||||
text-decoration: none;
|
||||
color: white;
|
||||
}
|
||||
.np-card-content-category {
|
||||
border-top: 1px solid lightgray;
|
||||
padding: 10px;
|
||||
}
|
||||
.np-card-content-description {
|
||||
display: block;
|
||||
color: lightgray;
|
||||
}
|
||||
.np-card-content-bottom {
|
||||
padding: 15px;
|
||||
}
|
||||
.np-button-color {
|
||||
color: lightslategray;
|
||||
font-size: 15px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,52 @@
|
||||
<div class="np-card np-no-horizontal-padding">
|
||||
<div class="np-card-container">
|
||||
<div class="np-learning-path np-featured-course">
|
||||
<div class="np-featured-course-img-container">
|
||||
<div class="np-card-image-content-top">
|
||||
{% include "course_details" %}
|
||||
</div>
|
||||
<img
|
||||
class="np-card-image"
|
||||
alt="{{ course.name }}"
|
||||
src="{{ course.image_url }}"
|
||||
>
|
||||
</div>
|
||||
<div class="np-card-text-wrapper">
|
||||
|
||||
<div class="np-card-content np-card-padding np-card-content-vertical">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
<div class="np-card-content-subtitle np-color-white">
|
||||
{{ course.instructor_names }}
|
||||
</div>
|
||||
|
||||
<div class="np-card-content-description">
|
||||
{{ course.full_description }}
|
||||
</div>
|
||||
|
||||
<div class="np-card-content-footer" style='display: flex; flex-direction: row; justify-content: space-between;'>
|
||||
<a
|
||||
class="np-top-button np-button-font-color np-button" href="{% route course_enrollment, code: course.enrollment_code %}"
|
||||
>
|
||||
{% if course.enrolled? == false %}
|
||||
{% t shared.enroll %}
|
||||
{% elsif course.started? == false %}
|
||||
{% t shared.start, key: current_school.course_vocabulary %}
|
||||
{% elsif course.completed? %}
|
||||
{% t shared.course.view, key: current_school.course_vocabulary %}
|
||||
{% else %}
|
||||
{% t shared.continue %}
|
||||
{% endif %}
|
||||
</a>
|
||||
<div class="np-card-image-content-bottom" style="position: unset;">
|
||||
<div class="np-card-content-progress np-button-color">
|
||||
{% t shared.progress, count: course.progress %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,80 @@
|
||||
<footer class="np-footer">
|
||||
<div class="np-footer-top">
|
||||
{% if website_footer.show_navigation_links? %}
|
||||
<div class="np-footer-navigation">
|
||||
<ul class="np-footer-navigation-list">
|
||||
{% for website_navigation in navigations.footer_navigations %}
|
||||
{% if website_navigation.external? %}
|
||||
<li class="np-footer-navigation-item">
|
||||
<a
|
||||
class="np-footer-navigation-link np-button-color"
|
||||
href="{{ website_navigation.path }}"
|
||||
{% if website_navigation.external? %} target="_blank" {% endif %}
|
||||
>
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if current_school.logo_url %}
|
||||
<h2 class="np-footer-logo">
|
||||
<a href="{% route home %}">
|
||||
<img
|
||||
alt="{{ current_school.name }}"
|
||||
class="np-footer-logo-image"
|
||||
src="{{ current_school.logo_url }}"
|
||||
/>
|
||||
</a>
|
||||
</h2>
|
||||
{% else %}
|
||||
<div class="np-school-name np-header-font-color">
|
||||
{{ current_school.name }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="np-footer-bottom">
|
||||
<nav class="np-footer-social-links">
|
||||
{% if website_footer.show_social_media_links? %}
|
||||
<ul class="np-footer-social-links-list">
|
||||
{% for social_media_link in website_footer.social_media_links %}
|
||||
<li class="np-footer-social-links-item">
|
||||
<a
|
||||
class="np-footer-social-links-link np-button-color"
|
||||
href="{{ social_media_link.link }}"
|
||||
target="_blank" title="{{ social_media_link.name }}"
|
||||
>
|
||||
<i class="np-footer-social-links-icon
|
||||
np-button-color
|
||||
fab fa-{{ social_media_link.name }}"
|
||||
></i>
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</nav>
|
||||
|
||||
{% if website_footer.show_customer_service_email? and
|
||||
website_footer.school_customer_service_email
|
||||
%}
|
||||
<div class="np-footer-support">
|
||||
<div class="np-footer-support-item np-footer-support-help np-fc-white np-opacity-50">
|
||||
{% t .need_help %}
|
||||
</div>
|
||||
<div class="np-footer-support-item np-footer-support-email np-fc-white np-opacity-50">
|
||||
{% t .email %}
|
||||
</div>
|
||||
<a
|
||||
class="np-footer-support-item np-footer-support-link np-button-color"
|
||||
href="mailto:{{ website_footer.school_customer_service_email }}"
|
||||
>
|
||||
support@camera.iq
|
||||
</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</footer>
|
||||
@ -0,0 +1,11 @@
|
||||
{% styles default %}
|
||||
{% styles colors %}
|
||||
{% styles custom %}
|
||||
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Lexend:wght@100;400;500;600;700;800&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.css" integrity="sha512-wR4oNhLBHf7smjy0K4oqzdWumd+r5/+6QO/vDda76MW5iug4PT7v86FoEkySIJft3XA0Ae6axhIvHrqwm793Nw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
||||
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js" type="text/javascript"></script>
|
||||
183
Custom_Templates/customer_templates/CameraIQ/_header.html.liquid
Normal file
183
Custom_Templates/customer_templates/CameraIQ/_header.html.liquid
Normal file
@ -0,0 +1,183 @@
|
||||
<header class="np-header np-header-color" >
|
||||
<div class="np-header-content">
|
||||
<div class="np-hidden-desktop np-header-mobile-menu-nav">
|
||||
{% if current_person.signed_in? %}
|
||||
<button
|
||||
data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button fal fa-times np-hidden np-header-font-color"
|
||||
data-toggle-target=".np-header-mobile-avatar-menu,
|
||||
.np-header-mobile-menu-content, .np-main, .np-footer"
|
||||
></button>
|
||||
<button
|
||||
data-test="open-mobile-menu"
|
||||
data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button np-header-mobile-avatar-menu"
|
||||
data-toggle-target=".fa-times, .np-header-mobile-menu-content, .np-main, .np-footer"
|
||||
>
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-avatar-image"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
/>
|
||||
</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if current_school.logo_url %}
|
||||
<h1 class="np-header-logo">
|
||||
<a href="{% route home %}">
|
||||
<img
|
||||
alt="{{ current_school.name }}"
|
||||
class="np-header-logo-image"
|
||||
src="{{ current_school.logo_url }}"
|
||||
/>
|
||||
</a>
|
||||
</h1>
|
||||
{% else %}
|
||||
<a href="{% route home %}" class="np-school-name np-header-font-color">
|
||||
{{ current_school.name }}
|
||||
</a>
|
||||
{% endif %}
|
||||
|
||||
<div class="np-hidden-mobile np-header-desktop-nav">
|
||||
<ul class="np-header-desktop-nav-list">
|
||||
{% for website_navigation in navigations.header_navigations_external %}
|
||||
<li class= "np-header-desktop-nav-item">
|
||||
<a
|
||||
href="{{ website_navigation.path }}"
|
||||
class="np-header-desktop-nav-link np-header-font-color"
|
||||
target="_blank"
|
||||
>
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
<div class="np-hidden-mobile np-header-search np-header-search-expanded">
|
||||
<form action="{% route search %}" method="get" data-test="desktop-search">
|
||||
<input
|
||||
aria-label="{% t .search %}"
|
||||
class="np-header-search-input np-header-font-background-color"
|
||||
type="text"
|
||||
name="q"
|
||||
placeholder="{% t .search %}"
|
||||
/>
|
||||
<i class="np-header-search-icon far fa-search"></i>
|
||||
</form>
|
||||
</div>
|
||||
<div class="np-hidden-mobile np-header-avatar">
|
||||
<button
|
||||
class="np-header-avatar-button"
|
||||
data-test="open-desktop-menu"
|
||||
data-toggle-class-on-target="np-hidden"
|
||||
data-toggle-target=".np-header-avatar-tooltip"
|
||||
data-toggle-outside
|
||||
>
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-avatar-image"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
>
|
||||
</button>
|
||||
<div class="np-header-avatar-tooltip np-hidden" role="tooltip">
|
||||
<span class="np-header-avatar-tooltip-arrow-up"></span>
|
||||
<div class="np-header-avatar-tooltip-learner">
|
||||
<div class="np-header-avatar-tooltip-learner-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
<div class="np-header-avatar-tooltip-learner-email">
|
||||
{{ current_person.email }}
|
||||
</div>
|
||||
</div>
|
||||
<nav class="np-header-avatar-tooltip-navigation">
|
||||
<a class="np-header-avatar-tooltip-navigation-link" onclick="buildURL(window.location.pathname)" style="cursor:pointer">
|
||||
Default
|
||||
</a>
|
||||
{% unless current_school.sso_active? %}
|
||||
<a
|
||||
class="np-header-avatar-tooltip-navigation-link"
|
||||
href="{% route account %}"
|
||||
>
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a
|
||||
class="np-header-avatar-tooltip-navigation-link np-danger"
|
||||
href="{% route logout %}"
|
||||
>
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<a
|
||||
class="np-header-sign-in np-header-desktop-nav-link np-header-font-color"
|
||||
href="{% route login %}"
|
||||
>
|
||||
{% t shared.sign_in %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="np-hidden-desktop">
|
||||
<div class="np-header-mobile-menu-content np-hidden">
|
||||
{% if current_person.signed_in? %}
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-mobile-menu-content-avatar"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
/>
|
||||
<div class="np-header-mobile-menu-content-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="np-header-mobile-menu-content-nav">
|
||||
<form
|
||||
class="np-header-search"
|
||||
data-test="mobile-search"
|
||||
method="get"
|
||||
action="{% route search %}"
|
||||
>
|
||||
<input
|
||||
aria-label="{% t .search %}"
|
||||
class="np-header-search-input"
|
||||
type="text"
|
||||
name="q"
|
||||
placeholder="{% t .search %}"
|
||||
/>
|
||||
<i class="np-header-search-icon far fa-search"></i>
|
||||
</form>
|
||||
{% for website_navigation in navigations.header_navigations %}
|
||||
<a
|
||||
href="{{ website_navigation.path }}"
|
||||
class="np-header-mobile-menu-content-button"
|
||||
{% if website_navigation.external? %} target="_blank" {% endif %}
|
||||
>
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
{% endfor %}
|
||||
<div class="np-header-mobile-menu-content-line"></div>
|
||||
{% unless current_school.sso_active? %}
|
||||
<a
|
||||
class="np-header-mobile-menu-content-button"
|
||||
href="{% route account %}"
|
||||
>
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a
|
||||
class="np-header-mobile-menu-content-button np-danger"
|
||||
href="{% route logout %}"
|
||||
>
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% include "messages" %}
|
||||
|
||||
@ -0,0 +1,109 @@
|
||||
<div class="np-homepage-featured np-faq np-max-width">
|
||||
<div class="np-homepage-featured-text">
|
||||
<div class="np-homepage-headline">
|
||||
Frequently Asked Questions
|
||||
</div>
|
||||
</div>
|
||||
<div class="row np-faqs">
|
||||
<div class="col-md-6">
|
||||
<div class="np-accordion">
|
||||
<div class="accordion-btn">
|
||||
<i class="fal fa-plus"></i>
|
||||
<div class="accordion-title"><strong>Q:</strong> Do I need photography experience before signing up for a course on Pixel Academy?</div>
|
||||
</div>
|
||||
<div class="accordion-panel">
|
||||
<div class="accordion-panel-content">
|
||||
<p><strong>A:</strong> Absolutely not! We have courses available for every level and welcome any photographers - from beginners to advanced to take courses on Pixel Academy.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-accordion">
|
||||
<div class="accordion-btn">
|
||||
<i class="fal fa-plus"></i>
|
||||
<div class="accordion-title"><strong>Q:</strong> Do I need advanced computer skills to use the Pixel app?</div>
|
||||
</div>
|
||||
<div class="accordion-panel">
|
||||
<div class="accordion-panel-content">
|
||||
<p><strong>A:</strong> No, the Pixel app was built with modern design principles to ensure a sleek and frictionless photo editing experience. The app is very intuitive and does not require any technical computer skills to use.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-accordion">
|
||||
<div class="accordion-btn">
|
||||
<i class="fal fa-plus"></i>
|
||||
<div class="accordion-title"><strong>Q:</strong> What certificates are available for me when I complete a course on Pixel Academy?</div>
|
||||
</div>
|
||||
<div class="accordion-panel">
|
||||
<div class="accordion-panel-content">
|
||||
<p><strong>A:</strong> Pixel Academy has a number of certificates available to our photographers and is constantly creating new courses and certificate programs to elevate photography editing skills. Check out the Certification section in the Pixel app for more information.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="np-accordion">
|
||||
<div class="accordion-btn">
|
||||
<i class="fal fa-plus"></i>
|
||||
<div class="accordion-title"><strong>Q:</strong> Can I take courses on an iPad, iPhone or other mobile devices/tablets, etc?</div>
|
||||
</div>
|
||||
<div class="accordion-panel">
|
||||
<div class="accordion-panel-content">
|
||||
<p><strong>A:</strong> Yes! Our Pixel Academy is Designed with a mobile-first approach to ensure that the use experience is seamless on any device.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-accordion">
|
||||
<div class="accordion-btn">
|
||||
<i class="fal fa-plus"></i>
|
||||
<div class="accordion-title"><strong>Q:</strong> Do I need to buy any books or other reference material to augment the course work?</div>
|
||||
</div>
|
||||
<div class="accordion-panel">
|
||||
<div class="accordion-panel-content">
|
||||
<p><strong>A:</strong> Nope! Just come with your eagerness to learn! No additional books or reference material is needed to augment any of our courses.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-accordion">
|
||||
<div class="accordion-btn">
|
||||
<i class="fal fa-plus"></i>
|
||||
<div class="accordion-title"><strong>Q:</strong> How will my instructors communicate with me while I’m taking a course? Can I contact them?</div>
|
||||
</div>
|
||||
<div class="accordion-panel">
|
||||
<div class="accordion-panel-content">
|
||||
<p><strong>A:</strong> Instructors will send email notifications for any updates they want to provide to the learners of their lessons. Should you need to contact them, you can do so through email. Emails will be provided within the instructor section of the Pixel Academy.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
/
|
||||
<style>
|
||||
.fa-plus {
|
||||
background-image: unset;
|
||||
background: #0297FA;
|
||||
}
|
||||
.fa-minus {
|
||||
background-image: unset;
|
||||
background: #0297FA; }
|
||||
</style>
|
||||
|
||||
<script>
|
||||
let accordions = document.getElementsByClassName("accordion-btn");
|
||||
|
||||
for (let i = 0; i < accordions.length; i++) {
|
||||
accordions[i].addEventListener("click", function() {
|
||||
this.querySelector('.fal').classList.toggle("fa-plus");
|
||||
this.querySelector('.fal').classList.toggle("fa-minus");
|
||||
|
||||
let panel = this.nextElementSibling;
|
||||
panel.classList.toggle("panel-open");
|
||||
if (panel.style.maxHeight) {
|
||||
panel.style.maxHeight = null;
|
||||
} else {
|
||||
panel.style.maxHeight = panel.scrollHeight + "px";
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,91 @@
|
||||
<div class="np-homepage-featured np-homepage-featured-items np-max-width">
|
||||
<div class="np-homepage-featured-text">
|
||||
<div class="np-homepage-headline">
|
||||
Featured Customers
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="featured-photography-carousel np-carousel np-carousel-bg-blue" id="featured-photography-carousel">
|
||||
<div class="np-carousel-card">
|
||||
<div>
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/demos/iq-customers-1.png" alt="Featured Photography" class='customer-carousel-image'/>
|
||||
<div class="slide-label">Discovery</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="np-carousel-card">
|
||||
<div>
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/demos/iq-customers-2.jpeg" alt="Featured Photography" class='customer-carousel-image'/>
|
||||
<div class="slide-label">EA Sports</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="np-carousel-card">
|
||||
<div>
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/demos/iq-customers-3.png" alt="Featured Photography" class='customer-carousel-image'/>
|
||||
<div class="slide-label">M.A.C</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-carousel-card">
|
||||
<div>
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/demos/iq-customers-4.png" alt="Featured Photography" class='customer-carousel-image'/>
|
||||
<div class="slide-label">DOMONIQUE</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="np-carousel-card">
|
||||
<div>
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/demos/iq-customers-5.png" alt="Featured Photography" class='customer-carousel-image'/>
|
||||
<div class="slide-label">Nespresso</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
|
||||
$("#featured-photography-carousel").slick({
|
||||
slidesToShow: 3.5,
|
||||
prevArrow: '<i class="fal fa-chevron-left"></i>',
|
||||
nextArrow: '<i class="fal fa-chevron-right"></i>',
|
||||
infinite: false,
|
||||
responsive: [
|
||||
{
|
||||
breakpoint: 1350,
|
||||
settings: {
|
||||
slidesToShow: 2.3,
|
||||
}
|
||||
},
|
||||
{
|
||||
breakpoint: 1024,
|
||||
settings: {
|
||||
slidesToShow: 2,
|
||||
}
|
||||
},
|
||||
{
|
||||
breakpoint: 768,
|
||||
settings: {
|
||||
slidesToShow: 1,
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.featured-photography-carousel .fa-chevron-right::before {
|
||||
right: -6px !important;
|
||||
}
|
||||
.customer-carousel-image {
|
||||
width: 292px;
|
||||
height: 292px;
|
||||
object-fit: cover;
|
||||
}
|
||||
.featured-photography-carousel .slick-initialized .slick-slide {
|
||||
margin: 0 10px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,15 @@
|
||||
<div class="np-homepage-featured np-homepage-topics np-max-width">
|
||||
<div class="np-homepage-featured-text">
|
||||
<div class="np-homepage-headline">
|
||||
Popular Topics
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-topics-list row">
|
||||
<div class="col-xs-12 np-stretch-content">
|
||||
{% assign categories_by_name = current_school.filterable_categories | sort: "name" %}
|
||||
{% for category in categories_by_name %}
|
||||
<a class="np-top-button np-button np-button-secondary" href="#">{{ category.name }}</a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,121 @@
|
||||
<div class="np-homepage-featured np-homepage-tips-tricks np-max-width">
|
||||
<div class="np-homepage-featured-text">
|
||||
<div class="np-homepage-headline">
|
||||
Projects From Our Users
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tips-tricks-carousel np-carousel" id="tips-tricks-carousel">
|
||||
<div class="np-carousel-card">
|
||||
<video class='left-video' autoplay muted loop>
|
||||
<source src='https://cameraiq.com/wp-content/themes/cameraIQ/vid/purina-360x640-transcode.mp4' type="video/mp4">
|
||||
</video>
|
||||
<div class='review'>
|
||||
<div class='review-text'>
|
||||
“It's incredibly easy. I can design a high-quality make-up look and quickly post and promote on our social channels without ever leaving the Camera IQ platform.”
|
||||
</div>
|
||||
<div class='review-name'>
|
||||
Doug Wick
|
||||
</div>
|
||||
<div class='review-title'>
|
||||
Brand Relations Manager at Dominique Cosmetics
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-carousel-card">
|
||||
<video class='left-video' autoplay muted loop>
|
||||
<source src='https://cameraiq.com/wp-content/themes/cameraIQ/vid/smashbox-360x640-transcode.mp4' type="video/mp4">
|
||||
</video>
|
||||
<div class='review'>
|
||||
<div class='review-text'>
|
||||
“The new UI is super intuitive and extremely flexible. The ability to add 3D assets and manipulate them in a true 3D environment makes it possible to take our creative executions to the next level quickly and easily.” </div>
|
||||
<div class='review-name'>
|
||||
Jordan Specht
|
||||
</div>
|
||||
<div class='review-title'>
|
||||
Senior Manager, Interactive Design at Atlantic Records
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-carousel-card">
|
||||
<video class='left-video' autoplay muted loop>
|
||||
<source src='https://cameraiq.com/wp-content/themes/cameraIQ/vid/dominique-360x640-transcode.mp4' type="video/mp4">
|
||||
</video>
|
||||
<div class='review'>
|
||||
<div class='review-text'>
|
||||
“It's incredibly easy. I can design a high-quality make-up look and quickly post and promote on our social channels without ever leaving the Camera IQ platform.”
|
||||
</div>
|
||||
<div class='review-name'>
|
||||
Georgia Parent
|
||||
</div>
|
||||
<div class='review-title'>
|
||||
Global Content Strategy and Production, Consumer Engagement at Smashbox
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.left-video {
|
||||
border-radius: 18px;
|
||||
border: black 8px solid;
|
||||
position: relative;
|
||||
height: 500px;
|
||||
width: 350px;
|
||||
object-fit: fill;
|
||||
left: 100px;
|
||||
top: -100px;
|
||||
}
|
||||
.review {
|
||||
background: black;
|
||||
border-radius: 5px;
|
||||
padding: 100px 150px;
|
||||
width: 70%;
|
||||
}
|
||||
.review-text {
|
||||
font-size: 24px;
|
||||
}
|
||||
.review-name {
|
||||
font-size: 18px;
|
||||
padding-top: 25px;
|
||||
padding-bottom: 10px;
|
||||
color: lightgrey;
|
||||
}
|
||||
.review-title {
|
||||
color: lightgray;
|
||||
}
|
||||
.tips-tricks-carousel .slick-list {
|
||||
height: 580px;
|
||||
}
|
||||
.tips-tricks-carousel .slick-initialized .slick-slide {
|
||||
width: 100% !important;
|
||||
margin: auto;
|
||||
position: relative;
|
||||
top: 100px;
|
||||
}
|
||||
.tips-tricks-carousel .np-carousel-card {
|
||||
margin: auto !important;
|
||||
}
|
||||
.tips-tricks-carousel div.slick-list:nth-child(1) > div:nth-child(1) {
|
||||
height: 700px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
$(document).ready(function(){
|
||||
$("#tips-tricks-carousel").slick({
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1,
|
||||
cssEase: 'linear',
|
||||
arrows: false,
|
||||
infinite: true,
|
||||
dots: true,
|
||||
autoplay: true,
|
||||
autoplaySpeed: 5000
|
||||
});
|
||||
});
|
||||
|
||||
</script>
|
||||
@ -0,0 +1,45 @@
|
||||
<main class="np-main np-catalog np-subpage-container np-max-width">
|
||||
<div class="np-catalog-header-wrapper">
|
||||
<div class="filter-buttons">
|
||||
<button class="filter-buttons-button" id='home'>Home</button>
|
||||
<button class="filter-buttons-button" id='projects'>Projects</button>
|
||||
<button class="filter-buttons-button" id='video'>Video Tutorials</button>
|
||||
<button class="filter-buttons-button" id='webinar'>Webinars</button>
|
||||
<button class="filter-buttons-button" id='article' style="opacity: 0.3">Articles</button>
|
||||
<button class="filter-buttons-button" id='discover'>Discover</button>
|
||||
<button class="filter-buttons-button" id='community'>Community</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.np-catalog-header-wrapper {
|
||||
display: block;
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.filter-buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
|
||||
.filter-buttons-button {
|
||||
background: none;
|
||||
border: white 1px solid;
|
||||
border-radius: 30px;
|
||||
color: white;
|
||||
padding: 15px 20px;
|
||||
font-size: 18px;
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
$('#home').click(function () { window.location.replace('/app') })
|
||||
$('#projects').click(function () { window.location.replace('https://app.cameraiq.com/login/?redirect_uri=%2Fprojects%2F') })
|
||||
$('#video').click(function () { window.location.replace('/app/videos') })
|
||||
$('#webinar').click(function () { window.location.replace('/app/training_events') })
|
||||
$('#discover').click(function () { window.location.replace('/catalog') })
|
||||
$('#community').click(function () { window.location.replace('/app/community') })
|
||||
</script>
|
||||
@ -0,0 +1,39 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.in_catalog %}
|
||||
<div class="np-homepage-hero">
|
||||
<div class="np-homepage-hero-image">
|
||||
</div>
|
||||
<div class="np-homepage-hero-content">
|
||||
<div class="np-homepage-headline np-header-font-color">
|
||||
Camera IQ Learning Program
|
||||
</div>
|
||||
<div class="np-homepage-subheadline np-header-font-color">
|
||||
Resources to help you make the most of your AR Experiences
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include "sub_navigation" %}
|
||||
{% include "courses_catalog" %}
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.np-card-content-description {
|
||||
height: 100px;
|
||||
}
|
||||
.np-card-content-title {
|
||||
height: 58px;
|
||||
overflow: clip;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
<script>
|
||||
window.onload = function() {
|
||||
[].slice.call(document.getElementsByClassName("np-card-content-description")).forEach(function(element) {
|
||||
if(element.innerText.length > 150){
|
||||
element.innerText = element.innerText.slice(0,150) + '...'
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,45 @@
|
||||
{% include 'header' %}
|
||||
<main class="np-main np-homepage">
|
||||
<div class="np-homepage-hero">
|
||||
<h1 class="community-headline">Community page</h1>
|
||||
</div>
|
||||
{% include 'sub_navigation' %}
|
||||
<div class='discussion-container'>
|
||||
<iframe class="discussion-frame" src="https://northpass.tribeplatform.com/" title="tribeplatform"></iframe>
|
||||
</div>
|
||||
</main>
|
||||
{% include 'footer' %}
|
||||
|
||||
<style>
|
||||
.discussion-frame {
|
||||
min-width: 100%;
|
||||
height: 1000px;
|
||||
}
|
||||
|
||||
.discussion-container {
|
||||
margin-top: 50px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.community-headline {
|
||||
font-size: 32px;
|
||||
line-height: 48px;
|
||||
font-family: "Roboto", sans-serif;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
.community-headline {
|
||||
font-size: 36px;
|
||||
line-height: 45px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 992px) {
|
||||
.community-headline {
|
||||
font-size: 58px;
|
||||
line-height: 72px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,75 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.featured %}
|
||||
<main class="np-main np-homepage">
|
||||
<div class="np-homepage-hero">
|
||||
<div class="np-homepage-hero-image">
|
||||
</div>
|
||||
<div class="np-homepage-hero-content">
|
||||
<div class="np-homepage-headline np-header-font-color">
|
||||
{{ homepage.headline }}
|
||||
</div>
|
||||
<div class="np-homepage-subheadline np-header-font-color">
|
||||
{{ homepage.subheadline }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include "sub_navigation" %}
|
||||
<div class="np-homepage-featured np-max-width">
|
||||
<div class="np-homepage-featured-text">
|
||||
<div class="np-homepage-headline">
|
||||
{{ homepage.featured_courses_headline }}
|
||||
</div>
|
||||
<div class="np-homepage-subheadline">
|
||||
{{ homepage.featured_courses_subheadline }}
|
||||
</div>
|
||||
</div>
|
||||
{% if courses.featured.any? %}
|
||||
<div class="np-homepage-featured-courses row">
|
||||
{% for course in courses.featured %}
|
||||
<div class="col-xs-12 col-sm-8 col-md-12" style="margin:auto;">
|
||||
{% include "cards_featured_course" with course %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
<div class="np-homepage-featured-empty">
|
||||
<div class="np-zero-state-text">
|
||||
{% t .empty, key: current_school.course_vocabulary %}
|
||||
</div>
|
||||
<img
|
||||
class="np-zero-state-courses"
|
||||
alt="{% t .empty, key: current_school.course_vocabulary %}"
|
||||
/>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% include "section_popular_topics" %}
|
||||
|
||||
{% include "section_featured_photography" %}
|
||||
|
||||
{% include "section_tips_tricks" %}
|
||||
|
||||
{% include "section_faqs" %}
|
||||
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.np-card-content-description {
|
||||
height: 100px;
|
||||
}
|
||||
.np-card-content-title {
|
||||
height: 28px;
|
||||
overflow: clip;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
window.onload = function() {
|
||||
[].slice.call(document.getElementsByClassName("np-card-content-description")).forEach(function(element) {
|
||||
if(element.innerText.length > 350){
|
||||
element.innerText = element.innerText.slice(0,350) + '...'
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
1733
Custom_Templates/customer_templates/CameraIQ/styles.css.liquid
Normal file
1733
Custom_Templates/customer_templates/CameraIQ/styles.css.liquid
Normal file
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,31 @@
|
||||
{% include "header" %}
|
||||
<div class="np-homepage-hero">
|
||||
<div class="np-homepage-hero-image">
|
||||
</div>
|
||||
<div class="np-homepage-hero-content">
|
||||
<div class="np-homepage-headline np-header-font-color">
|
||||
Camera IQ Learning Program
|
||||
</div>
|
||||
<div class="np-homepage-subheadline np-header-font-color">
|
||||
Resources to help you make the most of your AR Experiences
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include "sub_navigation" %}
|
||||
<main class="np-main np-training-events np-subpage-container np-max-width">
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-sm-10">
|
||||
<div class="np-resource-title">
|
||||
{% t .title %}
|
||||
</div>
|
||||
<div class="np-resource-subtitle">
|
||||
{% t .subtitle %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-2">
|
||||
{% include "training_events_filter" %}
|
||||
</div>
|
||||
</div>
|
||||
{% include "training_events_index" %}
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
117
Custom_Templates/customer_templates/CameraIQ/videos.html.liquid
Normal file
117
Custom_Templates/customer_templates/CameraIQ/videos.html.liquid
Normal file
@ -0,0 +1,117 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.in_catalog %}
|
||||
<div class="np-homepage-hero">
|
||||
<div class="np-homepage-hero-image">
|
||||
</div>
|
||||
<div class="np-homepage-hero-content">
|
||||
<div class="np-homepage-headline np-header-font-color">
|
||||
Video Tutorials
|
||||
</div>
|
||||
<div class="np-homepage-subheadline np-header-font-color">
|
||||
Beginner to advanced level training for the Camera IQ project editor
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include "sub_navigation" %}
|
||||
<div class='video-carousel'>
|
||||
<div class='video-carousel-title'>
|
||||
Getting Started
|
||||
</div>
|
||||
<div class='video-carousel-carousel-1'>
|
||||
{% for course in courses.in_catalog %}
|
||||
<div class='col-xs-12 col-md-6 col-lg-4 np-stretch-content'>
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<div class='video-carousel'>
|
||||
<div class='video-carousel-title'>
|
||||
Fundamentals
|
||||
</div>
|
||||
<div class='video-carousel-carousel-2'>
|
||||
{% for course in courses.in_catalog %}
|
||||
<div class='col-xs-12 col-md-6 col-lg-4 np-stretch-content'>
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<div class='video-carousel'>
|
||||
<div class='video-carousel-title'>
|
||||
Creative Exploration
|
||||
</div>
|
||||
<div class='video-carousel-carousel-3'>
|
||||
{% for course in courses.in_catalog %}
|
||||
<div class='col-xs-12 col-md-6 col-lg-4 np-stretch-content'>
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
{% include "footer" %}
|
||||
<style>
|
||||
.video-carousel {
|
||||
max-width: 85%;
|
||||
margin: auto;
|
||||
margin-top: 70px;
|
||||
}
|
||||
.video-carousel-title {
|
||||
font-size: 26px;
|
||||
padding: 15px 0;
|
||||
}
|
||||
.slick-slider {
|
||||
display: flex;
|
||||
}
|
||||
.slick-arrow {
|
||||
background: none;
|
||||
border: none;
|
||||
color: white;
|
||||
font-size: 82px;
|
||||
font-weight: 100;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
}
|
||||
.slick-prev {
|
||||
left: -20px;
|
||||
}
|
||||
.slick-next {
|
||||
right: -20px;
|
||||
}
|
||||
.np-card-content-description {
|
||||
height: 100px;
|
||||
}
|
||||
.np-card-content-title {
|
||||
height: 85px;
|
||||
overflow: clip;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
$(".np-sub-navigation-content-item:contains('Videos')").addClass('np-sub-navigation-content-item-active')
|
||||
$(".video-carousel-carousel-1").slick({
|
||||
prevArrow: '<button type="button" class="slick-prev"><i class="fas fa-chevron-left"></i></button>',
|
||||
nextArrow: '<button type="button" class="slick-next"><i class="fas fa-chevron-right"></i></button>',
|
||||
infinite: false,
|
||||
slidesToShow: 3,
|
||||
})
|
||||
$(".video-carousel-carousel-2").slick({
|
||||
prevArrow: '<button type="button" class="slick-prev"><i class="fas fa-chevron-left"></i></button>',
|
||||
nextArrow: '<button type="button" class="slick-next"><i class="fas fa-chevron-right"></i></button>',
|
||||
infinite: false,
|
||||
slidesToShow: 3,
|
||||
})
|
||||
$(".video-carousel-carousel-3").slick({
|
||||
prevArrow: '<button type="button" class="slick-prev"><i class="fas fa-chevron-left"></i></button>',
|
||||
nextArrow: '<button type="button" class="slick-next"><i class="fas fa-chevron-right"></i></button>',
|
||||
infinite: false,
|
||||
slidesToShow: 3,
|
||||
})
|
||||
window.onload = function() {
|
||||
[].slice.call(document.getElementsByClassName("np-card-content-description")).forEach(function(element) {
|
||||
if(element.innerText.length > 150){
|
||||
element.innerText = element.innerText.slice(0,150) + '...'
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
119
Custom_Templates/customer_templates/Chek/_header.html.liquid
Normal file
119
Custom_Templates/customer_templates/Chek/_header.html.liquid
Normal file
@ -0,0 +1,119 @@
|
||||
<link rel="stylesheet" href="https://use.typekit.net/ghp1udi.css">
|
||||
<header class="np-header np-header-color">
|
||||
<div class="np-header-content">
|
||||
<div class="np-hidden-desktop np-header-mobile-menu-nav">
|
||||
{% if current_person.signed_in? %}
|
||||
<button data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button fal fa-times np-hidden np-header-font-color" data-toggle-target=".np-header-mobile-avatar-menu,
|
||||
.np-header-mobile-menu-content, .np-main, .np-footer"></button>
|
||||
<button data-test="open-mobile-menu" data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button np-header-mobile-avatar-menu"
|
||||
data-toggle-target=".fa-times, .np-header-mobile-menu-content, .np-main, .np-footer">
|
||||
<img alt="{{ current_person.name }}" class="np-header-avatar-image" src="{{ current_person.avatar_url }}" />
|
||||
</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if current_school.logo_url %}
|
||||
<h1 class="np-header-logo">
|
||||
<a href="{% route home %}">
|
||||
<img alt="{{ current_school.name }}" class="np-header-logo-image" src="{{ current_school.logo_url }}" />
|
||||
</a>
|
||||
</h1>
|
||||
{% else %}
|
||||
<a href="{% route home %}" class="np-school-name np-header-font-color">
|
||||
{{ current_school.name }}
|
||||
</a>
|
||||
{% endif %}
|
||||
|
||||
<div class="np-hidden-mobile np-header-desktop-nav">
|
||||
<ul class="np-header-desktop-nav-list">
|
||||
{% for website_navigation in navigations.header_navigations_external %}
|
||||
<li class="np-header-desktop-nav-item">
|
||||
<a href="{{ website_navigation.path }}" class="np-header-desktop-nav-link np-header-font-color"
|
||||
target="_blank">
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
<div class="np-hidden-mobile np-header-search np-header-search-expanded">
|
||||
<form action="{% route search %}" method="get" data-test="desktop-search">
|
||||
<input aria-label="{% t .search %}" class="np-header-search-input np-header-font-background-color" type="text"
|
||||
name="q" placeholder="{% t .search %}" />
|
||||
<i class="np-header-search-icon far fa-search"></i>
|
||||
</form>
|
||||
</div>
|
||||
<div class="np-hidden-mobile np-header-avatar">
|
||||
<button class="np-header-avatar-button" data-test="open-desktop-menu" data-toggle-class-on-target="np-hidden"
|
||||
data-toggle-target=".np-header-avatar-tooltip" data-toggle-outside>
|
||||
<img alt="{{ current_person.name }}" class="np-header-avatar-image" src="{{ current_person.avatar_url }}">
|
||||
</button>
|
||||
<div class="np-header-avatar-tooltip np-hidden" role="tooltip">
|
||||
<span class="np-header-avatar-tooltip-arrow-up"></span>
|
||||
<div class="np-header-avatar-tooltip-learner">
|
||||
<div class="np-header-avatar-tooltip-learner-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
<div class="np-header-avatar-tooltip-learner-email">
|
||||
{{ current_person.email }}
|
||||
</div>
|
||||
</div>
|
||||
<nav class="np-header-avatar-tooltip-navigation">
|
||||
{% unless current_school.sso_active? %}
|
||||
<a class="np-header-avatar-tooltip-navigation-link" href="{% route account %}">
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a class="np-header-avatar-tooltip-navigation-link np-danger" href="{% route logout %}">
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<a class="np-header-sign-in np-header-desktop-nav-link np-header-font-color" aria-label="{% t shared.sign_in %}"
|
||||
href="{% route login %}">
|
||||
{% t shared.sign_in %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="np-hidden-desktop">
|
||||
<div class="np-header-mobile-menu-content np-hidden">
|
||||
{% if current_person.signed_in? %}
|
||||
<img alt="{{ current_person.name }}" class="np-header-mobile-menu-content-avatar"
|
||||
src="{{ current_person.avatar_url }}" />
|
||||
<div class="np-header-mobile-menu-content-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="np-header-mobile-menu-content-nav">
|
||||
<form class="np-header-search" data-test="mobile-search" method="get" action="{% route search %}">
|
||||
<input aria-label="{% t .search %}" class="np-header-search-input" type="text" name="q"
|
||||
placeholder="{% t .search %}" />
|
||||
<i class="np-header-search-icon far fa-search"></i>
|
||||
</form>
|
||||
{% for website_navigation in navigations.header_navigations %}
|
||||
<a href="{{ website_navigation.path }}" class="np-header-mobile-menu-content-button"
|
||||
{% if website_navigation.external? %} target="_blank" {% endif %}>
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
{% endfor %}
|
||||
<div class="np-header-mobile-menu-content-line"></div>
|
||||
{% unless current_school.sso_active? %}
|
||||
<a class="np-header-mobile-menu-content-button" href="{% route account %}">
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a class="np-header-mobile-menu-content-button np-danger" href="{% route logout %}">
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% include "messages" %}
|
||||
@ -0,0 +1,85 @@
|
||||
<div id="path-banner" class="np-resource-header np-resource-header-card np-card-padding-large">
|
||||
<div id="path-text-title" class="np-top-vocabulary np-text-title">
|
||||
{% t shared.learning_path.title %}
|
||||
<i id="path-icon-lp" class="far fa-road np-button-color np-learning-path-icon"></i>
|
||||
</div>
|
||||
<div id="path-banner-title" class="np-top-title">
|
||||
<a href="{% route home %}" class="np-back-button" aria-label="{% t shared.go_back %}">
|
||||
<i id="path-arrow" class="far fa-arrow-left np-icon-back"></i>
|
||||
</a>
|
||||
{{ learning_path.name }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
<div class="np-card-container">
|
||||
<img src="{{ learning_path.image_url }}" class="np-top-image" alt="{{ learning_path.name }}" />
|
||||
<div class="np-card-padding-dynamic">
|
||||
{% include "learning_path_description" %}
|
||||
{% include "learning_path_instructors" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6 np-grid-spacing">
|
||||
<div class="np-top-cta">
|
||||
{% include "learning_path_progress_and_cta" %}
|
||||
</div>
|
||||
{% include "learning_path_outline" %}
|
||||
</div>
|
||||
</div>
|
||||
<script src="https://code.jquery.com/jquery-3.6.0.min.js"
|
||||
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
var url = window.location.pathname;
|
||||
if (url.indexOf('/app/learning_paths/283ab1f9-5bd5-4e64-b6e5-4a3a5e0cde5a') > -1) {
|
||||
$("#path-banner").attr("class", "path-banner-y1 np-resource-header np-resource-header-card np-card-padding-large");
|
||||
$("#path-banner-title").attr("class", "path-top-title");
|
||||
$("#path-arrow").attr("class", "far fa-arrow-left path-icon-arrow");
|
||||
$("#path-icon-lp").attr("class", "far fa-road path-icon-lp");
|
||||
$("#path-text-title").attr("class", "np-top-vocabulary path-text-title");
|
||||
|
||||
} else if (url.indexOf('/app/learning_paths/577d28e6-b581-44fe-90bf-aff269c8394d') > -1) {
|
||||
$("#path-banner").attr("class", "path-banner-y1 np-resource-header np-resource-header-card np-card-padding-large");
|
||||
$("#path-banner-title").attr("class", "path-top-title");
|
||||
$("#path-arrow").attr("class", "far fa-arrow-left path-icon-arrow");
|
||||
$("#path-icon-lp").attr("class", "far fa-road path-icon-lp");
|
||||
$("#path-text-title").attr("class", "np-top-vocabulary path-text-title");
|
||||
|
||||
} else if (url.indexOf('/app/learning_paths/b56514cf-6bfc-44f0-b213-089aed603961') > -1) {
|
||||
$("#path-banner").attr("class", "path-banner-y2 np-resource-header np-resource-header-card np-card-padding-large");
|
||||
$("#path-banner-title").attr("class", "path-top-title");
|
||||
$("#path-arrow").attr("class", "far fa-arrow-left path-icon-arrow");
|
||||
$("#path-icon-lp").attr("class", "far fa-road path-icon-lp");
|
||||
$("#path-text-title").attr("class", "np-top-vocabulary path-text-title");
|
||||
|
||||
} else if (url.indexOf('/app/learning_paths/93c7eb64-c9b6-4028-ab58-1ef5eeffb37e') > -1) {
|
||||
$("#path-banner").attr("class", "path-banner-y2 np-resource-header np-resource-header-card np-card-padding-large");
|
||||
$("#path-banner-title").attr("class", "path-top-title");
|
||||
$("#path-arrow").attr("class", "far fa-arrow-left path-icon-arrow");
|
||||
$("#path-icon-lp").attr("class", "far fa-road path-icon-lp");
|
||||
$("#path-text-title").attr("class", "np-top-vocabulary path-text-title");
|
||||
|
||||
} else if (url.indexOf('/app/learning_paths/3266a89f-8aa2-4f2e-9039-db5500e2d4ab') > -1) {
|
||||
$("#path-banner").attr("class", "path-banner-y3 np-resource-header np-resource-header-card np-card-padding-large");
|
||||
$("#path-banner-title").attr("class", "path-top-title");
|
||||
$("#path-arrow").attr("class", "far fa-arrow-left path-icon-arrow");
|
||||
$("#path-icon-lp").attr("class", "far fa-road path-icon-lp");
|
||||
$("#path-text-title").attr("class", "np-top-vocabulary path-text-title");
|
||||
|
||||
} else if (url.indexOf('/app/learning_paths/7f43d5da-1275-45bc-8618-29cb20c0a179') > -1) {
|
||||
$("#path-banner").attr("class", "path-banner-y4 np-resource-header np-resource-header-card np-card-padding-large");
|
||||
$("#path-banner-title").attr("class", "path-top-title");
|
||||
$("#path-arrow").attr("class", "far fa-arrow-left path-icon-arrow");
|
||||
$("#path-icon-lp").attr("class", "far fa-road path-icon-lp");
|
||||
$("#path-text-title").attr("class", "np-top-vocabulary path-text-title");
|
||||
|
||||
} else {
|
||||
$("#path-banner").attr("class", "np-resource-header np-resource-header-card np-card-padding-large");
|
||||
$("#path-banner-title").attr("class", "np-top-title");
|
||||
$("#path-arrow").attr("class", "far fa-arrow-left np-icon-back");
|
||||
$("#path-icon-lp").attr("class", "far fa-road np-button-color np-learning-path-icon");
|
||||
$("#path-text-title").attr("class", "np-top-vocabulary np-text-title");
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,32 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.enrolled %}
|
||||
{% include "sub_navigation" %}
|
||||
<main class="np-main np-dashboard np-subpage-container np-max-width">
|
||||
<div class="row np-flex-center">
|
||||
<div class="col-xs-12 col-sm-8">
|
||||
{% if features.learning_paths? %}
|
||||
<div class="np-dashboard-resources-title">
|
||||
{% t shared.learning_paths %}
|
||||
</div>
|
||||
{% include "learning_paths_index", items: learning_paths.enrolled %}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if features.training_events? %}
|
||||
<div class="np-grid-spacing col-xs-12 col-sm-4">
|
||||
<div class="np-dashboard-resources-title">
|
||||
{% t .upcoming_events %}
|
||||
</div>
|
||||
{% include "training_events_dashboard" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="row np-flex-center">
|
||||
<div class="col-xs-12 col-sm-12">
|
||||
<div class="np-dashboard-resources-title">
|
||||
{% t shared.course_vocabulary.plural, key: current_school.course_vocabulary %}
|
||||
</div>
|
||||
{% include "courses_index", class: "col-xs-12 col-sm-4 np-stretch-content" %}
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
69
Custom_Templates/customer_templates/Chek/styles.css.liquid
Normal file
69
Custom_Templates/customer_templates/Chek/styles.css.liquid
Normal file
@ -0,0 +1,69 @@
|
||||
/*
|
||||
Put your custom overlay styles in here
|
||||
You can use your northpass color palette in this file
|
||||
|
||||
{{ color_palette.button_font_color }}
|
||||
{{ color_palette.button_color }}
|
||||
{{ color_palette.button_hover_color }}
|
||||
{{ color_palette.header_font_color }}
|
||||
{{ color_palette.header_font_hover_color }}
|
||||
{{ color_palette.header_color }}
|
||||
*/
|
||||
|
||||
body {
|
||||
font-family: Soleil, Roboto, Helvetica Neue, Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
.np-header {
|
||||
height: 65px !important;
|
||||
}
|
||||
|
||||
.np-header-logo {
|
||||
justify-content: flex-end !important;
|
||||
}
|
||||
|
||||
.np-header-avatar-image,
|
||||
.np-header-logo-image {
|
||||
height: 38px !important;
|
||||
}
|
||||
|
||||
.np-header-desktop-nav {
|
||||
width: 0%;
|
||||
}
|
||||
}
|
||||
|
||||
.np-header-font-background-color {
|
||||
background: #1d1d1b;
|
||||
}
|
||||
|
||||
.np-footer {
|
||||
background: #1d1d1b;
|
||||
}
|
||||
|
||||
.np-footer-logo-image {
|
||||
filter: grayscale(0) contrast(1) !important;
|
||||
height: 40px !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
.np-footer-support-help {
|
||||
color: #fff !important;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.np-footer-support-item {
|
||||
color: #fff !important;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.np-footer+.np-powered-by {
|
||||
background: #1d1d1b !important;
|
||||
}
|
||||
|
||||
.np-powered-by-link {
|
||||
color: #fff !important;
|
||||
font-size: 13px;
|
||||
text-decoration: none;
|
||||
}
|
||||
@ -0,0 +1,6 @@
|
||||
{% styles default %}
|
||||
{% styles colors %}
|
||||
{% styles custom %}
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100&display=swap');
|
||||
</style>
|
||||
@ -0,0 +1,7 @@
|
||||
@font-face {
|
||||
font-family: 'Roboto Slab' !important;
|
||||
src: url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100&display=swap');
|
||||
}
|
||||
body, html, div {
|
||||
font-family: 'Roboto Slab' !important;
|
||||
}
|
||||
@ -0,0 +1,73 @@
|
||||
{% assign activities_count = 0 %}
|
||||
{% for course_section in course.sections %}
|
||||
{% for course_activity in course_section.activities %}
|
||||
{% assign activities_count = activities_count | plus: 1 %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
||||
<div class="np-card">
|
||||
<div class="np-card-container">
|
||||
<a href="{{ course_path }}">
|
||||
<img
|
||||
class="np-card-image"
|
||||
alt="{{ course.name }}"
|
||||
src="{{ course.image_url }}"
|
||||
>
|
||||
</a>
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding">
|
||||
<a class="np-card-content-title" href="{{ course_path }}">
|
||||
{{ course.name }}
|
||||
</a>
|
||||
<div class="np-card-content-subtitle">
|
||||
{{ course.full_description }}
|
||||
</div>
|
||||
<div class="np-card-content-lessons">
|
||||
{{ activities_count }} {% if activities_count == 1 %}Lesson{% else %}Lessons{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.np-card {
|
||||
padding: 25px 30px !important;
|
||||
}
|
||||
.np-card-content {
|
||||
padding: 10px 50px 40px;
|
||||
}
|
||||
.np-card-content-title {
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 28px;
|
||||
font-weight: 800;
|
||||
text-decoration: none;
|
||||
height: 65px;
|
||||
overflow: clip;
|
||||
}
|
||||
.np-card-content-subtitle {
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
color: rgba(0,0,0,.75);
|
||||
height: 100px;
|
||||
margin-top: 10px;
|
||||
|
||||
}
|
||||
.np-card-content-lessons {
|
||||
color: rgb(38, 49, 61);
|
||||
font-weight: 800;
|
||||
font-size: 21px;
|
||||
margin-top: 20px;
|
||||
line-height: 26px;
|
||||
}
|
||||
.np-card-content-footer {
|
||||
margin-top: 40px;
|
||||
}
|
||||
.np-button {
|
||||
height: 53px;
|
||||
border-radius: 100px;
|
||||
padding: 12px 45px;
|
||||
}
|
||||
.np-card-content-progress {
|
||||
font-size: 18px;
|
||||
margin: auto 0;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,127 @@
|
||||
<div class="np-card-container">
|
||||
<div class='np-course-header'>
|
||||
<img
|
||||
src="{{ course.image_url }}"
|
||||
class="np-top-image np-top-image-spacing"
|
||||
alt="{{ course.name }}"
|
||||
/>
|
||||
<div class='np-course-header-right'>
|
||||
<div class='np-course-header-right-name'>
|
||||
{{ course.name }}
|
||||
</div>
|
||||
<div class='np-course-header-right-short'>
|
||||
Learn the basics of profile value, how to customize your profile to catch the eyes of more buyers, and demand capture 101.
|
||||
</div>
|
||||
<div class='np-course-header-right-button'>
|
||||
{% include "course_progress_and_cta" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class='np-course-bottom'>
|
||||
<div class='np-course-bottom-left'>
|
||||
<div class='np-course-bottom-left-title'>
|
||||
Curriculum
|
||||
</div>
|
||||
<div class='np-course-bottom-left-outline'>
|
||||
{% for section in course.sections %}
|
||||
<div class='np-course-bottom-left-outline-section'>
|
||||
{{ section.name }}
|
||||
</div>
|
||||
{% for activity in section.activities %}
|
||||
<div class='np-course-bottom-left-outline-activity'>
|
||||
{{ activity.title }}
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<div class='np-course-bottom-right'>
|
||||
<div class='np-course-bottom-right-title'>
|
||||
About this course
|
||||
</div>
|
||||
<div class='np-course-bottom-right-description'>
|
||||
{{ course.full_description }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
body {
|
||||
background: rgb(254, 254, 254);
|
||||
}
|
||||
.np-card-container {
|
||||
background: rgb(254, 254, 254);
|
||||
box-shadow: none;
|
||||
}
|
||||
.np-course-header {
|
||||
display: flex;
|
||||
border-bottom: 1px solid #d6d6d6;
|
||||
padding-bottom: 40px;
|
||||
}
|
||||
.np-top-image {
|
||||
height: 400;
|
||||
margin: auto 0;
|
||||
}
|
||||
.np-course-header-right {
|
||||
padding-left: 50px;
|
||||
}
|
||||
.np-course-header-right-name {
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 50px;
|
||||
font-weight: 800;
|
||||
margin-bottom: 25px;
|
||||
margin-top: 40px;
|
||||
}
|
||||
.np-course-header-right-short {
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 21px;
|
||||
font-weight: 400px;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
.np-course-bottom {
|
||||
display: flex;
|
||||
margin-top: 70px;
|
||||
}
|
||||
.np-course-bottom-left{
|
||||
width: 70%;
|
||||
}
|
||||
.np-course-bottom-left-title {
|
||||
font-weight: 900;
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 24px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.np-course-bottom-left-outline {
|
||||
border: 1px solid #979797 !important;
|
||||
border-radius: 10px;
|
||||
padding: 20px 0;
|
||||
}
|
||||
.np-course-bottom-left-outline-section {
|
||||
margin: 10px 0;
|
||||
padding: 0 40px 0 20px;
|
||||
font-size: 18px;
|
||||
line-height: 1.4;
|
||||
text-transform: uppercase;
|
||||
font-weight: 900;
|
||||
}
|
||||
.np-course-bottom-left-outline-activity {
|
||||
padding: 7px 30px;
|
||||
font-size: 18px;
|
||||
line-height: 28.8px;
|
||||
font-weight: 400;
|
||||
}
|
||||
.np-course-bottom-right {
|
||||
margin-left: 110px;
|
||||
}
|
||||
.np-course-bottom-right-title {
|
||||
font-weight: 900;
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 24px;
|
||||
}
|
||||
.np-course-bottom-right-description {
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
color: rgb(10, 10, 10);
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,38 @@
|
||||
{% if course.learner_can_retake? %}
|
||||
<form action="{% route course_retake, id: course.id %}" method="POST">
|
||||
{% form_authenticity_token %}
|
||||
<button type="submit" class="np-top-button np-button-font-color np-button np-button-big">
|
||||
{% t .retake, key: current_school.course_vocabulary %}
|
||||
</button>
|
||||
</form>
|
||||
{% else %}
|
||||
<a
|
||||
class="np-top-button np-button-font-color np-button np-button-big"
|
||||
{% if course.enrolled? %}
|
||||
href="{% route course_viewer, course_id: course.id, learning_path_id: params.learning_path_id %}"
|
||||
{% else %}
|
||||
href="{% route course_enrollment, code: course.enrollment_code %}"
|
||||
{% endif %}
|
||||
>
|
||||
{% if course.enrolled? == false %}
|
||||
{% t shared.enroll %}
|
||||
{% elsif course.started? == false %}
|
||||
{% t shared.course.start, key: current_school.course_vocabulary %}
|
||||
{% elsif course.completed? %}
|
||||
{% t shared.course.view, key: current_school.course_vocabulary %}
|
||||
{% else %}
|
||||
{% t shared.continue %}
|
||||
{% endif %}
|
||||
</a>
|
||||
{% endif %}
|
||||
<style>
|
||||
.np-top-button {
|
||||
height: 53px;
|
||||
border-radius: 100px;
|
||||
padding: 12px 45px;
|
||||
font-size: 16px;
|
||||
color: white;
|
||||
font-weight: 700;
|
||||
border-radius: 100px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,26 @@
|
||||
{% if courses.in_catalog.any? %}
|
||||
<div class="np-catalog-courses row row-with-thumbnails" id="courses">
|
||||
{% for course in courses.in_catalog %}
|
||||
<div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
{% capture message %}
|
||||
{% t shared.zero_state.courses.catalog,
|
||||
key: current_school.course_vocabulary
|
||||
%}
|
||||
{% endcapture %}
|
||||
{% include "courses_zero_state", message: message %}
|
||||
{% endif %}
|
||||
|
||||
<style>
|
||||
.np-catalog-courses {
|
||||
width: 70%;
|
||||
margin: 40px auto;
|
||||
}
|
||||
.np-card {
|
||||
padding: 20px;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,202 @@
|
||||
<footer class="np-footer">
|
||||
<div class='footer-top'>
|
||||
<ul class='footer-top-column'>
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/demos/conservis_wrap.png" class="float-left show-for-medium" style="width:20px;margin:15px 0 0 -29px;position: absolute;" alt="">
|
||||
<li class='footer-top-column-title'>
|
||||
For Farmers
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Platform Overview
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Software Reviews
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Products
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Partnerships
|
||||
</li>
|
||||
<button class='footer-top-column-button'>
|
||||
Submit Feedback
|
||||
</button>
|
||||
</ul>
|
||||
<ul class='footer-top-column'>
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/demos/conservis_wrap.png" class="float-left show-for-medium" style="width:20px;margin:15px 0 0 -29px;position: absolute;" alt="">
|
||||
<li class='footer-top-column-title'>
|
||||
For Financial Planners
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Market Profiles
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Minimizing Costs
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Buying Data
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Long Term Investments
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Competitive Insights
|
||||
</li>
|
||||
<button class='footer-top-column-button'>
|
||||
Add Your Financial Insight
|
||||
</button>
|
||||
</ul>
|
||||
<ul class='footer-top-column'>
|
||||
<img src="https://s3.amazonaws.com/static.northpass.com/demos/conservis_wrap.png" class="float-left show-for-medium" style="width:20px;margin:15px 0 0 -29px;position: absolute;" alt="">
|
||||
<li class='footer-top-column-title'>
|
||||
Company
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
About
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Leadership
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Careers
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Gives
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
News
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Contact
|
||||
</li>
|
||||
<li class='footer-top-column-socials'>
|
||||
|
||||
</li>
|
||||
</ul>
|
||||
<ul class='footer-top-column'>
|
||||
<img src=https://s3.amazonaws.com/static.northpass.com/demos/conservis_wrap.png" class="float-left show-for-medium" style="width:20px;margin:15px 0 0 -29px;position: absolute;" alt="">
|
||||
<li class='footer-top-column-title'>
|
||||
Resources
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Sell
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Learn
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Research
|
||||
</li>
|
||||
<li class='footer-top-column-element'>
|
||||
Partner
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="footer-seperator"></div>
|
||||
<div class='footer-bottom'>
|
||||
<ul class='footer-bottom-links'>
|
||||
<li class='footer-botoom-links-elements'>Community Guidelines</li>
|
||||
<li class='footer-botoom-links-elements'>Conservis Methodologies</li>
|
||||
<li class='footer-botoom-links-elements'>Terms of Use </li>
|
||||
<li class='footer-botoom-links-elements'>Privacy Policy </li>
|
||||
<li class='footer-botoom-links-elements'>Cookie Policy </li>
|
||||
<li class='footer-botoom-links-elements'>Copyright Complaint Policy </li>
|
||||
<li class='footer-botoom-links-elements'>Content Usage Guidelines </li>
|
||||
<li class='footer-botoom-links-elements'>Do Not Sell My Personal Information </li>
|
||||
</ul>
|
||||
<div class='footer-bottom-logo'>
|
||||
<img
|
||||
alt="{{ current_school.name }}"
|
||||
class="footer-bottom-logo-img"
|
||||
src="{{ current_school.logo_url }}"
|
||||
/>
|
||||
<div class='footer-bottom-logo-right'>
|
||||
<div class='footer-bottom-logo-right-element'>
|
||||
1624 Harmon Place
|
||||
</div>
|
||||
<div class='footer-bottom-logo-right-element'>
|
||||
Ste. 304
|
||||
</div>
|
||||
<div class='footer-bottom-logo-right-element'>
|
||||
Minneapolis, MN 55403
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class='footer-bottom-subline'>
|
||||
© 2022, Conservis.ag, Inc. All Rights Reserved.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</footer>
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Arimo:wght@400;500;600;700&display=swap');
|
||||
</style>
|
||||
<style>
|
||||
.np-footer {
|
||||
background: rgb(6, 40, 70);
|
||||
}
|
||||
.footer-top {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-evenly;
|
||||
width: 100%;
|
||||
}
|
||||
.footer-top-column {
|
||||
list-style-type: none;
|
||||
}
|
||||
.footer-top-column-title {
|
||||
color: white;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.footer-top-column-element {
|
||||
color: white;
|
||||
font-size: 15px;
|
||||
line-height: 15px;
|
||||
font-weight: 400;
|
||||
padding: 9px 0;
|
||||
}
|
||||
.footer-top-column-button {
|
||||
background: none;
|
||||
border: 2px white solid;
|
||||
border-radius: 100px;
|
||||
padding: 9px 25px;
|
||||
font-size: 14px;
|
||||
color: white;
|
||||
font-weight: 600;
|
||||
}
|
||||
.footer-seperator {
|
||||
border-top: rgb(128, 128, 128) 1px solid;
|
||||
width: 90%;
|
||||
margin: auto;
|
||||
height: 1px;
|
||||
margin: 40px 0;
|
||||
}
|
||||
.footer-bottom-links {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
list-style-type: none;
|
||||
color: rgb(168, 168, 172);
|
||||
font-size: 14px;
|
||||
}
|
||||
.footer-botoom-links-elements {
|
||||
margin: 10px;
|
||||
}
|
||||
.footer-bottom-logo {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
color: rgb(168, 168, 172);
|
||||
font-size: 14px;
|
||||
}
|
||||
.footer-bottom-logo-img {
|
||||
height: 55px;
|
||||
margin: 0 10px 10px 0;
|
||||
}
|
||||
.footer-bottom-subline {
|
||||
color: rgb(168, 168, 172);
|
||||
font-size: 14px;
|
||||
}
|
||||
body {
|
||||
font-family: "Arimo", sans-serif !important;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,18 @@
|
||||
{% styles default %}
|
||||
{% styles colors %}
|
||||
{% styles custom %}
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
if (window.location.href.indexOf("/login") > -1 && window.location.href.indexOf("?email") > -1 ) {
|
||||
console.log(document.referrer)
|
||||
$('body').css("display", "none");
|
||||
$('input.np-button').click();
|
||||
}
|
||||
</script>
|
||||
|
||||
<script> window.intercomSettings = { app_id: "xocco3tv" }; </script>
|
||||
<script>
|
||||
(function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',w.intercomSettings);}else{var d=document;var i=function(){i.c(arguments);};i.q=[];i.c=function(args){i.q.push(args);};w.Intercom=i;var l=function(){var s=d.createElement('script');s.type='text/javascript';s.async=true;s.src='https://widget.intercom.io/widget/hal1rveh';var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);};if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})();
|
||||
</script>
|
||||
<style> .intercom-lightweight-app-launcher { float: right; bottom: 45px !important; margin-right: 40px; } </style>
|
||||
@ -0,0 +1,259 @@
|
||||
<header class="np-header np-header-color">
|
||||
<div class="np-header-content">
|
||||
<div class="np-hidden-desktop np-header-mobile-menu-nav">
|
||||
{% if current_person.signed_in? %}
|
||||
<button
|
||||
data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button fal fa-times np-hidden np-header-font-color"
|
||||
data-toggle-target=".np-header-mobile-avatar-menu,
|
||||
.np-header-mobile-menu-content, .np-main, .np-footer"
|
||||
></button>
|
||||
<button
|
||||
data-test="open-mobile-menu"
|
||||
data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button np-header-mobile-avatar-menu"
|
||||
data-toggle-target=".fa-times, .np-header-mobile-menu-content, .np-main, .np-footer"
|
||||
>
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-avatar-image"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
/>
|
||||
</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if current_school.logo_url %}
|
||||
<h1 class="np-header-logo">
|
||||
<a href="{% route home %}">
|
||||
<img
|
||||
alt="{{ current_school.name }}"
|
||||
class="np-header-logo-image"
|
||||
src="{{ current_school.logo_url }}"
|
||||
/>
|
||||
</a>
|
||||
</h1>
|
||||
{% else %}
|
||||
<a href="{% route home %}" class="np-school-name np-header-font-color">
|
||||
{{ current_school.name }}
|
||||
</a>
|
||||
{% endif %}
|
||||
|
||||
<div class="np-hidden-mobile np-header-desktop-nav">
|
||||
<ul class="np-header-desktop-nav-list">
|
||||
<li class='np-header-right-menu-label' id='label1'>
|
||||
Solutions
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
<ul class='np-header-right-menu-list' id='menu1'>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Row Crops
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Permanent Crops
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class='np-header-right-menu-label' id='label2'>
|
||||
Relationships
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
<ul class='np-header-right-menu-list' id='menu2'>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
AggOtter
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Climate FieldView
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
John Deer Operations Center
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Rabo AgriFinance
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class='np-header-right-menu-label' id='label3'>
|
||||
Stories
|
||||
<i class="fas fa-chevron-down"></i>
|
||||
<ul class='np-header-right-menu-list' id='menu3'>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Blog Posts
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Case Studies
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
In the News
|
||||
</li>
|
||||
<li class='np-header-right-menu-list-element'>
|
||||
Press Releases
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class='np-header-right-menu-label'>
|
||||
Plans
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
{% if current_person.signed_in? %}
|
||||
<div class="np-hidden-mobile np-header-search np-header-search-expanded">
|
||||
<form action="{% route search %}" method="get" data-test="desktop-search">
|
||||
<input
|
||||
aria-label="{% t .search %}"
|
||||
class="np-header-search-input np-header-font-background-color"
|
||||
type="text"
|
||||
name="q"
|
||||
placeholder="{% t .search %}"
|
||||
/>
|
||||
<i class="np-header-search-icon far fa-search"></i>
|
||||
</form>
|
||||
</div>
|
||||
<div class="np-hidden-mobile np-header-avatar">
|
||||
<button
|
||||
class="np-header-avatar-button"
|
||||
data-test="open-desktop-menu"
|
||||
data-toggle-class-on-target="np-hidden"
|
||||
data-toggle-target=".np-header-avatar-tooltip"
|
||||
data-toggle-outside
|
||||
>
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-avatar-image"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
>
|
||||
</button>
|
||||
<div class="np-header-avatar-tooltip np-hidden" role="tooltip">
|
||||
<span class="np-header-avatar-tooltip-arrow-up"></span>
|
||||
<div class="np-header-avatar-tooltip-learner">
|
||||
<div class="np-header-avatar-tooltip-learner-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
<div class="np-header-avatar-tooltip-learner-email">
|
||||
{{ current_person.email }}
|
||||
</div>
|
||||
</div>
|
||||
<nav class="np-header-avatar-tooltip-navigation">
|
||||
{% unless current_school.sso_active? %}
|
||||
<a
|
||||
class="np-header-avatar-tooltip-navigation-link"
|
||||
href="{% route account %}"
|
||||
>
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a
|
||||
class="np-header-avatar-tooltip-navigation-link np-danger"
|
||||
href="{% route logout %}"
|
||||
>
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<a
|
||||
class="np-header-sign-in np-header-desktop-nav-link np-header-font-color"
|
||||
href="{% route login %}"
|
||||
>
|
||||
{% t shared.sign_in %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="np-hidden-desktop">
|
||||
<div class="np-header-mobile-menu-content np-hidden">
|
||||
{% if current_person.signed_in? %}
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-mobile-menu-content-avatar"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
/>
|
||||
<div class="np-header-mobile-menu-content-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="np-header-mobile-menu-content-nav">
|
||||
<form
|
||||
class="np-header-search"
|
||||
data-test="mobile-search"
|
||||
method="get"
|
||||
action="{% route search %}"
|
||||
>
|
||||
<input
|
||||
aria-label="{% t .search %}"
|
||||
class="np-header-search-input"
|
||||
type="text"
|
||||
name="q"
|
||||
placeholder="{% t .search %}"
|
||||
/>
|
||||
<i class="np-header-search-icon far fa-search"></i>
|
||||
</form>
|
||||
{% for website_navigation in navigations.header_navigations %}
|
||||
<a
|
||||
href="{{ website_navigation.path }}"
|
||||
class="np-header-mobile-menu-content-button"
|
||||
{% if website_navigation.external? %} target="_blank" {% endif %}
|
||||
>
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
{% endfor %}
|
||||
<div class="np-header-mobile-menu-content-line"></div>
|
||||
{% unless current_school.sso_active? %}
|
||||
<a
|
||||
class="np-header-mobile-menu-content-button"
|
||||
href="{% route account %}"
|
||||
>
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a
|
||||
class="np-header-mobile-menu-content-button np-danger"
|
||||
href="{% route logout %}"
|
||||
>
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% include "messages" %}
|
||||
<style>
|
||||
.np-header-logo-image {
|
||||
height: 55px;
|
||||
}
|
||||
.np-header-right-menu-label {
|
||||
font-size: 18px;
|
||||
padding: 13px 18px;
|
||||
}
|
||||
.np-header-right-menu-list {
|
||||
position: absolute;
|
||||
top: 80px;
|
||||
display: none;
|
||||
padding: 15px;
|
||||
background: white;
|
||||
list-style-type: none;
|
||||
z-index: 10;
|
||||
border-top: 2px solid #5a39a2;
|
||||
margin-left: -25px;
|
||||
}
|
||||
.np-header-right-menu-list-element {
|
||||
padding: 10px 0;
|
||||
}
|
||||
#label1:hover > #menu1 {
|
||||
display: block
|
||||
}
|
||||
#menu1:hover {
|
||||
display: block;
|
||||
}
|
||||
#label2:hover > #menu2 {
|
||||
display: block
|
||||
}
|
||||
#menu2:hover {
|
||||
display: block;
|
||||
}
|
||||
#label3:hover > #menu3 {
|
||||
display: block
|
||||
}
|
||||
#menu3:hover {
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,193 @@
|
||||
<div class='events-wrapper' id="events">
|
||||
<div class='events'>
|
||||
<div class='events-header'>
|
||||
<div class='events-header-title'>
|
||||
Drive revenue & harvests with decisions informed from Conservis' Suite of Tools.
|
||||
</div>
|
||||
<div class='events-header-subtitle'>
|
||||
Hundres of customers have organized their fields and finances by using the Conservis Platform and their expert Customer Success plans. Why not join them?
|
||||
</div>
|
||||
</div>
|
||||
<div class='events-event'>
|
||||
<div class='events-event-left'>
|
||||
<div class='events-event-left-title'>
|
||||
Standardizing Inventory Management
|
||||
</div>
|
||||
<div class='events-event-left-subtitle'>
|
||||
From the moment you purchase to the moment you use it, standardizing your inventory leads to actionable results. Not to mention that it frees your staff up for other tasks!
|
||||
</div>
|
||||
<div class='events-event-left-date'>
|
||||
March 27, 2022 @ 2PM EST
|
||||
</div>
|
||||
<button class='events-event-left-button'>
|
||||
Register
|
||||
</button>
|
||||
</div>
|
||||
<div class='events-event-right'>
|
||||
<div class='events-event-right-title'>
|
||||
Hosts
|
||||
</div>
|
||||
<div class='events-event-right-person'>
|
||||
<img class='events-event-right-person-image' src='https://media-exp1.licdn.com/dms/image/C4E03AQHUBtcttBJTZw/profile-displayphoto-shrink_800_800/0/1516236401149?e=1651708800&v=beta&t=VkbQ1BwLZ_6YRdGxnvwiWS4PKx7RTlezN-sTKhY1dQo'>
|
||||
<div class='events-event-right-person-right'>
|
||||
<div class='events-event-right-person-right-name'>
|
||||
Aneetha Gopalan
|
||||
</div>
|
||||
<div class='events-event-right-person-right-title'>
|
||||
VP, Product & Engineering
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class='events-event-right-person'>
|
||||
<img class='events-event-right-person-image' src='https://media-exp1.licdn.com/dms/image/C5603AQGckaki_fPzkg/profile-displayphoto-shrink_800_800/0/1516585708428?e=1651708800&v=beta&t=8TXevG1-W4hPcNibAAYhhqfRNSrzNDF0OzvwBvr0UJ8'>
|
||||
<div class='events-event-right-person-right'>
|
||||
<div class='events-event-right-person-right-name'>
|
||||
Juliet Phillips
|
||||
</div>
|
||||
<div class='events-event-right-person-right-title'>
|
||||
Training & Development Manager
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class='events-event'>
|
||||
<div class='events-event-left'>
|
||||
<div class='events-event-left-title'>
|
||||
How to Financial Plan for a Full Future
|
||||
</div>
|
||||
<div class='events-event-left-subtitle'>
|
||||
Increase your harvest numbers for years to come with proper management.
|
||||
</div>
|
||||
<div class='events-event-left-date'>
|
||||
February TBD
|
||||
</div>
|
||||
<button class='events-event-left-button'>
|
||||
Register
|
||||
</button>
|
||||
</div>
|
||||
<div class='events-event-right'>
|
||||
<div class='events-event-right-title'>
|
||||
Host
|
||||
</div>
|
||||
<div class='events-event-right-person'>
|
||||
<img class='events-event-right-person-image' src='https://media-exp1.licdn.com/dms/image/C4E03AQELOcYI4FL7jg/profile-displayphoto-shrink_800_800/0/1582566920630?e=1651708800&v=beta&t=oDTc9zXONrDS8evefxY-Q1VnMVUUDl9ush2VqUJ4QGg'>
|
||||
<div class='events-event-right-person-right'>
|
||||
<div class='events-event-right-person-right-name'>
|
||||
Tyler Jaeger
|
||||
</div>
|
||||
<div class='events-event-right-person-right-title'>
|
||||
Commercial Operations
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.events-wrapper {
|
||||
background-image: url('https://conservis.ag/wp-content/uploads/bkr_pivot_scouting-scaled.jpg');
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
}
|
||||
.events {
|
||||
width: 70%;
|
||||
margin: auto;
|
||||
padding: 120px 0;
|
||||
}
|
||||
.events-header {
|
||||
width: 55%;
|
||||
margin: auto;
|
||||
margin-bottom: 100px;
|
||||
}
|
||||
.events-header-title {
|
||||
font-size: 43px;
|
||||
font-weight: 800;
|
||||
text-align: center;
|
||||
}
|
||||
.events-header-subtitle {
|
||||
font-size: 21px;
|
||||
font-weight: 400;
|
||||
text-align: center;
|
||||
margin-top: 40px;
|
||||
}
|
||||
.events-event {
|
||||
width: 70%;
|
||||
margin: 20px auto;
|
||||
background: rgb(255, 251, 238);
|
||||
padding: 50px 60px;
|
||||
display: flex;
|
||||
border-radius: 5px;
|
||||
box-shadow: rgba(0, 0, 0, 0.05) 0px 2px 20px 10px;
|
||||
|
||||
}
|
||||
.events-event-left {
|
||||
width: 55%;
|
||||
}
|
||||
.events-event-left-title {
|
||||
font-size: 28px;
|
||||
font-weight: 800;
|
||||
color: rgb(6, 40, 70);
|
||||
margin: 10px 0 20px;
|
||||
}
|
||||
.events-event-left-subtitle {
|
||||
font-size: 21px;
|
||||
font-weight: 400;
|
||||
color: rgba(0, 0, 0, 0.75);
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.events-event-left-date {
|
||||
font-size: 21px;
|
||||
font-weight: 800;
|
||||
color: rgb(6, 40, 70);
|
||||
margin: 10px 0;
|
||||
}
|
||||
.events-event-left-button {
|
||||
background: none;
|
||||
border: 2px solid rgb(6, 40, 70);
|
||||
color: rgb(6, 40, 70);
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
padding: 12px 45px;
|
||||
margin-top: 40px;
|
||||
border-radius: 25px;
|
||||
}
|
||||
.events-event-right {
|
||||
margin-left: 70px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.events-event-right-title {
|
||||
font-size: 21px;
|
||||
font-weight: 800;
|
||||
color: rgb(155, 169, 181);
|
||||
margin-top: 10px;
|
||||
}
|
||||
.events-event-right-person {
|
||||
display: flex;
|
||||
margin: 30px 0;
|
||||
}
|
||||
.events-event-right-person-image {
|
||||
border-radius: 50%;
|
||||
height: 52px;
|
||||
}
|
||||
.events-event-right-person-right {
|
||||
margin-left: 20px;
|
||||
}
|
||||
.events-event-right-person-right-name {
|
||||
color: rgb(6, 40, 70);
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
margin-bottom: 7px;
|
||||
}
|
||||
.events-event-right-person-right-title {
|
||||
color: rgb(38, 49, 61);
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,92 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.featured %}
|
||||
<main class="np-main np-homepage">
|
||||
<div class="np-homepage-hero">
|
||||
<img class="np-homepage-hero-image"
|
||||
src="{{ homepage.artwork_url }}"
|
||||
alt="{{ homepage.headline }}"
|
||||
/>
|
||||
<div class="np-homepage-hero-content">
|
||||
<img class='np-homepage-hero-logo' src='https://s3.amazonaws.com/static.northpass.com/demos/conservis_wrap.png'>
|
||||
<div class="np-homepage-headline np-header-font-color">
|
||||
{{ homepage.headline }}
|
||||
</div>
|
||||
<div class="np-homepage-subheadline np-header-font-color">
|
||||
{{ homepage.subheadline }}
|
||||
</div>
|
||||
<hr class='np-divider-line'>
|
||||
<div class='np-homepage-buttons'>
|
||||
<a class="np-homepage-hero-cta np-button" href="#courses">
|
||||
Crop Management
|
||||
</a>
|
||||
<a class="np-homepage-hero-cta np-button" href="#events">
|
||||
Financial Management
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include 'courses_catalog' %}
|
||||
{% include 'homepage_events' %}
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
body {
|
||||
background: #FEFEFE
|
||||
}
|
||||
.np-main {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.np-powered-by {
|
||||
background: rgb(6, 40, 70);
|
||||
}
|
||||
.np-homepage-hero-image {
|
||||
max-height: 612px;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
.np-homepage-hero-logo {
|
||||
width: 125px;
|
||||
}
|
||||
.np-homepage-headline {
|
||||
font-size: 67px !important;
|
||||
font-weight: 800 !important;
|
||||
}
|
||||
.np-homepage-subheadline {
|
||||
color: rgb(38, 49, 61) !important;
|
||||
font-size: 28px !important;
|
||||
font-weight: 400 !important;
|
||||
max-width: 630px !important;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.np-divider-line {
|
||||
width: 400px;
|
||||
margin: 40px auto 40px auto;
|
||||
border-width: 5px 0 0 0;
|
||||
border-style: solid;
|
||||
border-color: rgb(255,174,3);
|
||||
font-size: 1rem;
|
||||
transition-timing-function: cubic-bezier(0.400,0.000,0.200,1.000);
|
||||
}
|
||||
.np-homepage-buttons {
|
||||
display: flex;
|
||||
margin: 25px auto;
|
||||
justify-content: center;
|
||||
}
|
||||
.np-homepage-hero-cta {
|
||||
height: 53px !important;
|
||||
border-radius: 100px !important;
|
||||
padding: 12px 45px !important;
|
||||
margin: 0 15px !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
window.onload = function() {
|
||||
[].slice.call(document.getElementsByClassName("np-card-content-subtitle")).forEach(function(element) {
|
||||
if(element.innerText.length > 100){
|
||||
element.innerText = element.innerText.slice(0,100) + '...'
|
||||
}
|
||||
});
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,57 @@
|
||||
<div class="np-card">
|
||||
<div class="np-card-container">
|
||||
{% if course.ribbon %}
|
||||
<div class="np-card-ribbon">
|
||||
{{ course.ribbon }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<img
|
||||
class="np-card-image"
|
||||
alt="{{ course.name }}"
|
||||
src="{{ course.image_url }}"
|
||||
>
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
<div class="np-card-content-subtitle">
|
||||
{{ course.instructor_names }}
|
||||
</div>
|
||||
<div class="np-card-content-footer">
|
||||
{% if course.progress == 100 %}
|
||||
{% comment %}<img class="np-dashboard-medal-icon" src="{{course.properties.course_badge}}" alt="{{course.name}}-medal-icon"/>{% endcomment %}
|
||||
<span class="np-dashboard-medal-icon">👍</span>
|
||||
{% endif %}
|
||||
|
||||
<div class="np-card-content-progress np-button-color">
|
||||
{% t shared.progress, count: course.progress %}
|
||||
</div>
|
||||
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
||||
{% if course.has_to_restart? %}
|
||||
{% include "course_version_outdated_popup", path: course_path %}
|
||||
{% endif %}
|
||||
|
||||
{% if course.name == 'Accelerator Certification Course' %}
|
||||
<a class="np-button np-button-wide np-course-card-button"
|
||||
{% if course.enrolled? %}
|
||||
href="#" style="pointer-events: none; color: #486776; background: #F2F4F5"
|
||||
{% else %}
|
||||
href="{% route course_enrollment, code: course.enrollment_code %}"
|
||||
{% endif %}
|
||||
>
|
||||
{% if course.enrolled? == false %}
|
||||
Pre-Register
|
||||
{% else %}
|
||||
Coming Soon
|
||||
{% endif %}
|
||||
</a>
|
||||
{% else %}
|
||||
<a class="np-button np-button-wide np-course-card-button" href="{{ course_path }}">
|
||||
{% t shared.view %}
|
||||
</a>
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,16 @@
|
||||
<div class="np-top-vocabulary np-text-title np-text-muted">
|
||||
{{ current_school.course_vocabulary }}
|
||||
<i class="far fa-graduation-cap np-button-color np-learning-path-icon np-hidden-mobile">
|
||||
</i>
|
||||
</div>
|
||||
<div class="np-top-title" style='font-weight: 600;'>
|
||||
<a href="{% route home %}" class="np-back-button" aria-label="{% t shared.go_back %}">
|
||||
<i class="far fa-arrow-left np-hidden-mobile np-icon-back"></i>
|
||||
</a>
|
||||
{{ course.name }}
|
||||
</div>
|
||||
<img
|
||||
src="{{ course.image_url }}"
|
||||
class="np-top-image np-hidden-desktop"
|
||||
alt="{{ course.name }}"
|
||||
/>
|
||||
@ -0,0 +1,16 @@
|
||||
<div class="np-course-outline">
|
||||
<div class="np-text-title np-course-outline-title">
|
||||
{% t .header, key: current_school.course_vocabulary %}
|
||||
</div>
|
||||
<div class="np-course-outline-content">
|
||||
<ol class="np-course-outline-content-section">
|
||||
{% for section in course.sections %}
|
||||
<li class="np-course-outline-content-section-list">
|
||||
<div class="np-course-outline-content-section-name np-text-title-bold np-text-title-bold" style='font-weight: 600;'>
|
||||
{{ section.name }}
|
||||
</div>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
10
Custom_Templates/customer_templates/Crayon/_head.html.liquid
Normal file
10
Custom_Templates/customer_templates/Crayon/_head.html.liquid
Normal file
@ -0,0 +1,10 @@
|
||||
{% styles default %}
|
||||
{% styles colors %}
|
||||
{% styles custom %}
|
||||
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js" type="text/javascript"></script>
|
||||
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500;600;700&display=swap');
|
||||
</style>
|
||||
@ -0,0 +1,15 @@
|
||||
<nav class="np-sub-navigation">
|
||||
<div class="np-sub-navigation-content">
|
||||
{% for link in navigations.sub_navigation %}
|
||||
{% if link.label == 'Home'%}
|
||||
<div class="np-sub-navigation-content-item {{ link.active_class }}">
|
||||
<a class="np-sub-navigation-content-item-link" href="{{ link.url }}">
|
||||
<i class="{{ link.icon }} np-button-color np-sub-navigation-content-item-icon"></i>
|
||||
{{ link.label }}
|
||||
</a>
|
||||
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</nav>
|
||||
262
Custom_Templates/customer_templates/Crayon/catalog.html.liquid
Normal file
262
Custom_Templates/customer_templates/Crayon/catalog.html.liquid
Normal file
@ -0,0 +1,262 @@
|
||||
<!-- {% comment %}{% include "header" %}{% endcomment %}
|
||||
{% include "course_version_outdated_alert", courses: courses.in_catalog %}
|
||||
{% comment %}{% include "sub_navigation" %}{% endcomment %}
|
||||
{% comment %} https://s3.amazonaws.com/static.northpass.com/Crayon/acceleratorBadge.png {% endcomment %}
|
||||
{% comment %} https://s3.amazonaws.com/static.northpass.com/Crayon/activatorBadge.png {% endcomment %}
|
||||
{% comment %} https://s3.amazonaws.com/static.northpass.com/Crayon/architectBadge.png {% endcomment %}
|
||||
|
||||
<main class="np-main np-dashboard np-subpage-container np-max-width">
|
||||
<div class="row np-flex-center">
|
||||
<div class="col-xs-12">
|
||||
<div class="np-dashboard-header">
|
||||
<div class="np-resource-title">Hi {{current_person.first_name}}! 👋</div>
|
||||
<div class="np-resource-subtitle">This is what’s relevant to you right now in Competitive Advantage Academy</div>
|
||||
</div>
|
||||
</div>
|
||||
{% comment %}<div class="np-grid-spacing col-xs-12 col-md-6">
|
||||
<div class="np-dashboard-achievements-panel col-xs-12 row">
|
||||
<div class="np-resource-title col-xs-5">Achievements</div>
|
||||
<div class="col-xs-7">
|
||||
<div class="np-dashboard-medal-card">
|
||||
<div class="col-xs-12 row" style="margin: 0">
|
||||
{% for course in courses.in_catalog %}
|
||||
{% if course.name == 'Activator Certification Course' %}
|
||||
{% if course.progress == 100 %}
|
||||
<img class="np-dashboard-medal-icon" src="{{course.properties.course_badge}}" alt="{{course.name}}-medal-icon"/>
|
||||
{% else %}
|
||||
<div class="np-dashboard-medal-circle"></div>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% for course in courses.in_catalog %}
|
||||
{% if course.name == 'Architect Certification Course' %}
|
||||
{% if course.progress == 100 %}
|
||||
<img class="np-dashboard-medal-icon" src="{{course.properties.course_badge}}" alt="{{course.name}}-medal-icon"/>
|
||||
{% else %}
|
||||
<div class="np-dashboard-medal-circle"></div>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% for course in courses.in_catalog %}
|
||||
{% if course.name == 'Accelerator Certification Course' %}
|
||||
{% if course.progress == 100 %}
|
||||
<img class="np-dashboard-medal-icon" src="{{course.properties.course_badge}}" alt="{{course.name}}-medal-icon"/>
|
||||
{% else %}
|
||||
<div class="np-dashboard-medal-circle"></div>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
<div class="np-dashboard-medal-circle"></div>
|
||||
<div class="np-dashboard-medal-circle"></div>
|
||||
<div class="np-dashboard-medal-circle"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>{% endcomment %}
|
||||
</div>
|
||||
|
||||
<div class="row dashboard-section-courses">
|
||||
<div class="col-xs-12 col-sm-6 col-lg-4">
|
||||
|
||||
{% for course in courses.in_catalog %}
|
||||
{% if course.name == 'Activator Certification Course' %}
|
||||
<div class="np-md-flex-wrapper" style="text-align: center;">
|
||||
<div class="np-dashboard-resources-title">
|
||||
Beginner
|
||||
</div>
|
||||
</div>
|
||||
{% include 'cards_course' with course %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-6 col-lg-4">
|
||||
{% for course in courses.in_catalog %}
|
||||
{% if course.name == 'Architect Certification Course' %}
|
||||
<div class="np-md-flex-wrapper" style="text-align: center;">
|
||||
<div class="np-dashboard-resources-title">
|
||||
Intermediate
|
||||
</div>
|
||||
</div>
|
||||
{% include 'cards_course' with course %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-6 col-lg-4">
|
||||
{% for course in courses.in_catalog %}
|
||||
{% if course.name == 'Accelerator Certification Course' %}
|
||||
<div class="np-md-flex-wrapper" style="text-align: center;">
|
||||
<div class="np-dashboard-resources-title">
|
||||
Advanced
|
||||
</div>
|
||||
</div>
|
||||
{% include 'cards_course' with course %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% comment %}{% if courses.enrolled.any? %}
|
||||
{% assign course_limiter = 0 %}
|
||||
{% if categories.enrolled.any? %}
|
||||
{% assign all_categories = categories.enrolled | map: "name" %}
|
||||
{% for enrolled_category in all_categories %}
|
||||
{% for course in courses.enrolled%}
|
||||
{% if course_limiter < 1%}
|
||||
<div class="np-md-flex-wrapper" style="text-align: center;">
|
||||
<div class="np-dashboard-resources-title">
|
||||
{{ course.name }}
|
||||
</div>
|
||||
<div class="np-dashboard-resources-category">
|
||||
{{ enrolled_category }}
|
||||
</div>
|
||||
{%
|
||||
include "filter_by_progress",
|
||||
label: "Filter by Progress:",
|
||||
default_option: "All Courses",
|
||||
topic: enrolled_category,
|
||||
%}
|
||||
</div>
|
||||
{% include 'cards_course' with course %}
|
||||
|
||||
{% assign course_limiter = course_limiter | plus: 1 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
{% assign enrolled_category = "Not Categorized" %}
|
||||
{% for course in courses.enrolled%}
|
||||
{% if course_limiter < 1%}
|
||||
<div class="np-md-flex-wrapper" style="text-align: center;">
|
||||
<div>
|
||||
<div class="np-dashboard-resources-title">
|
||||
{{ course.name }}
|
||||
</div>
|
||||
<div class="np-dashboard-resources-category">
|
||||
{{ enrolled_category }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% include 'cards_course' with course %}
|
||||
|
||||
{% assign course_limiter = course_limiter | plus: 1 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<div class="np-dashboard-resources-title" style="margin-bottom:19px;">
|
||||
Courses
|
||||
</div>
|
||||
{% capture message %}
|
||||
{% t shared.zero_state.courses.index,
|
||||
key: current_school.course_vocabulary
|
||||
%}
|
||||
{% endcapture %}
|
||||
<div style="margin-bottom:3rem;">
|
||||
{% include "courses_zero_state", message: message %}
|
||||
{% endif %}{% endcomment %}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
{% comment %}<script>
|
||||
// Creates the custom dropdown and dropdown functionality
|
||||
var x, i, j, l, ll, selElmnt, a, b, c;
|
||||
/* Look for any elements with the class “select-wrapper”: */
|
||||
x = document.getElementsByClassName("progress-filter");
|
||||
l = x.length;
|
||||
for (i = 0; i < l; i++) {
|
||||
selElmnt = x[i].getElementsByTagName("select")[0];
|
||||
ll = selElmnt.length;
|
||||
a = document.createElement("DIV");
|
||||
a.setAttribute("class", "select-selected");
|
||||
a.innerHTML = selElmnt.options[selElmnt.selectedIndex].innerHTML;
|
||||
x[i].appendChild(a);
|
||||
b = document.createElement("DIV");
|
||||
b.setAttribute("class", "select-items select-hide");
|
||||
for (j = 1; j < ll; j++) {
|
||||
c = document.createElement("DIV");
|
||||
c.innerHTML = selElmnt.options[j].innerHTML;
|
||||
c.addEventListener("click", function(e) {
|
||||
var y, i, k, s, h, sl, yl;
|
||||
s = this.parentNode.parentNode.getElementsByTagName("select")[0];
|
||||
sl = s.length;
|
||||
h = this.parentNode.previousSibling;
|
||||
for (i = 0; i < sl; i++) {
|
||||
if (s.options[i].innerHTML == this.innerHTML) {
|
||||
s.selectedIndex = i;
|
||||
h.innerHTML = this.innerHTML;
|
||||
y = this.parentNode.getElementsByClassName("same-as-selected");
|
||||
yl = y.length;
|
||||
for (k = 0; k < yl; k++) {
|
||||
y[k].removeAttribute("class");
|
||||
}
|
||||
this.setAttribute("class", "same-as-selected");
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
filterCourses(this);
|
||||
|
||||
h.click();
|
||||
});
|
||||
b.appendChild(c);
|
||||
}
|
||||
x[i].appendChild(b);
|
||||
a.addEventListener("click", function(e) {
|
||||
e.stopPropagation();
|
||||
closeAllSelect(this);
|
||||
this.nextSibling.classList.toggle("select-hide");
|
||||
this.classList.toggle("select-arrow-active");
|
||||
});
|
||||
}
|
||||
|
||||
function closeAllSelect(elmnt) {
|
||||
var x, y, i, xl, yl, arrNo = [];
|
||||
x = document.getElementsByClassName("select-items");
|
||||
y = document.getElementsByClassName("select-selected");
|
||||
xl = x.length;
|
||||
yl = y.length;
|
||||
for (i = 0; i < yl; i++) {
|
||||
if (elmnt == y[i]) {
|
||||
arrNo.push(i)
|
||||
} else {
|
||||
y[i].classList.remove("select-arrow-active");
|
||||
}
|
||||
}
|
||||
for (i = 0; i < xl; i++) {
|
||||
if (arrNo.indexOf(i)) {
|
||||
x[i].classList.add("select-hide");
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* If the user clicks anywhere outside the select box,
|
||||
then close all select boxes: */
|
||||
document.addEventListener("click", closeAllSelect);
|
||||
$(".select-items div").each(function() {
|
||||
if($( this ).text() == $(".select-selected").text()) {
|
||||
$(this).addClass("same-as-selected");
|
||||
}
|
||||
});
|
||||
|
||||
function filterCourses(selectedItem) {
|
||||
|
||||
let filterGroup = $(selectedItem).closest(".progress-filter").data("topic");
|
||||
let selectedFilter = $(selectedItem).text().replace(" ", "-").toLowerCase();
|
||||
let carouselGroup = $('.courses-carousel[data-topic="' + filterGroup + '"]');
|
||||
|
||||
carouselGroup.slick('slickUnfilter');
|
||||
|
||||
if (selectedFilter != "all-courses") {
|
||||
carouselGroup.slick('slickFilter', `.${selectedFilter}`);
|
||||
}
|
||||
|
||||
}
|
||||
</script>{% endcomment %} -->
|
||||
|
||||
<script>
|
||||
window.location.replace('/app')
|
||||
</script>
|
||||
@ -0,0 +1,16 @@
|
||||
<script>
|
||||
if(window.location.pathname === '/app/courses/ab4f0c0b-e506-42df-9e81-e97da5fe7d5b'){
|
||||
window.location.replace('/app/catalog')
|
||||
}
|
||||
</script>
|
||||
{% include "header" %}
|
||||
<main class="np-main np-max-width np-page-container">
|
||||
<div class="np-hidden-mobile" id="course-desktop">
|
||||
{% include "course_desktop_view" %}
|
||||
</div>
|
||||
<div class="np-hidden-desktop" id="course-mobile">
|
||||
{% include "course_mobile_view" %}
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
@ -0,0 +1,3 @@
|
||||
<script>
|
||||
window.location.replace('/app')
|
||||
</script>
|
||||
@ -0,0 +1,64 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.in_catalog %}
|
||||
{% comment %}{% include "sub_navigation" %}{% endcomment %}
|
||||
{% comment %} https://s3.amazonaws.com/static.northpass.com/Crayon/acceleratorBadge.png {% endcomment %}
|
||||
{% comment %} https://s3.amazonaws.com/static.northpass.com/Crayon/activatorBadge.png {% endcomment %}
|
||||
{% comment %} https://s3.amazonaws.com/static.northpass.com/Crayon/architectBadge.png {% endcomment %}
|
||||
|
||||
<main class="np-main np-dashboard np-subpage-container np-max-width">
|
||||
<div class="row np-flex-center">
|
||||
<div class="col-xs-12">
|
||||
<div class="np-dashboard-header">
|
||||
<div class="np-resource-title">Hi {{current_person.first_name}}! 👋</div>
|
||||
{% comment %}<div class="np-resource-subtitle">This is what’s relevant to you right now in Competitive Advantage Academy</div>{%endcomment%}
|
||||
<div class="np-resource-subtitle">Take the courses. Get your certificates. Compete like you mean it.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row dashboard-section-courses">
|
||||
<div class="col-xs-12 col-sm-6 col-lg-4">
|
||||
|
||||
{% for course in courses.in_catalog %}
|
||||
{% if course.name == 'Activator Certification Course' %}
|
||||
<div class="np-md-flex-wrapper" style="text-align: center;">
|
||||
<div class="np-dashboard-resources-title">
|
||||
Beginner
|
||||
</div>
|
||||
</div>
|
||||
{% include 'cards_course' with course %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-6 col-lg-4">
|
||||
{% for course in courses.in_catalog %}
|
||||
{% if course.name == 'Architect Certification Course' %}
|
||||
<div class="np-md-flex-wrapper" style="text-align: center;">
|
||||
<div class="np-dashboard-resources-title">
|
||||
Intermediate
|
||||
</div>
|
||||
</div>
|
||||
{% include 'cards_course' with course %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-6 col-lg-4">
|
||||
{% for course in courses.in_catalog %}
|
||||
{% if course.name == 'Accelerator Certification Course' %}
|
||||
<div class="np-md-flex-wrapper" style="text-align: center;">
|
||||
<div class="np-dashboard-resources-title">
|
||||
Advanced
|
||||
</div>
|
||||
</div>
|
||||
{% include 'cards_course' with course %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
@ -0,0 +1,19 @@
|
||||
{% comment %}{% include "header" %}
|
||||
{% include "sub_navigation" %}
|
||||
<main class="np-main np-learning-paths np-subpage-container np-max-width">
|
||||
<div class="np-learning-paths-main">
|
||||
<div class="np-resource-title">
|
||||
{% t shared.learning_paths %}
|
||||
</div>
|
||||
<div class="np-resource-subtitle">
|
||||
{% t .subtitle %}
|
||||
</div>
|
||||
{% include "learning_paths_index", items: learning_paths.available %}
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}{% endcomment %}
|
||||
|
||||
<script>
|
||||
window.location.replace('/app/courses/f1d39335-8ca2-4b6e-98c6-02b2144fb02a')
|
||||
// window.location.replace('/app/catalog')
|
||||
</script>
|
||||
@ -0,0 +1,8 @@
|
||||
<script>
|
||||
var year = new Date().getFullYear();
|
||||
var month = new Date().getMonth() + 1;
|
||||
var adress = window.location.hash
|
||||
var newAdress = 'https://www.linkedin.com/profile/add?startTask=CERTIFICATION_NAME&' + adress.slice(1).replaceAll('~space~' , '%20').replaceAll('~customyear~', year).replaceAll('~customonth~', month)
|
||||
console.log(newAdress)
|
||||
window.location.replace(newAdress)
|
||||
</script>
|
||||
325
Custom_Templates/customer_templates/Crayon/styles.css.liquid
Normal file
325
Custom_Templates/customer_templates/Crayon/styles.css.liquid
Normal file
@ -0,0 +1,325 @@
|
||||
@font-face {
|
||||
font-family: 'Jost', sans-serif !important;
|
||||
src: url('https://fonts.googleapis.com/css2?family=Jost:wght@300&display=swap');
|
||||
}
|
||||
body, html, div {
|
||||
font-family: 'Jost', sans-serif !important;
|
||||
}
|
||||
|
||||
.np-card-content{
|
||||
max-height: 140px;
|
||||
}
|
||||
|
||||
@media (max-width: 1199px){
|
||||
.np-card-content{
|
||||
padding-top: 0.5rem;
|
||||
}
|
||||
|
||||
.np-card-content-title{
|
||||
font-size: 1.1rem !important;
|
||||
}
|
||||
}
|
||||
|
||||
.np-card-content-title{
|
||||
font-size: 1rem !important;
|
||||
}
|
||||
|
||||
.np-course-card-button{
|
||||
width: 8rem;
|
||||
}
|
||||
|
||||
/* ------------------------------------------------------------------------------------------------------ */
|
||||
/* Achievements Panel */
|
||||
/* .np-dashboard-achievements-panel{
|
||||
background: #ffffff;
|
||||
height: 8rem;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.np-dashboard-achievements-card{
|
||||
background: #F3F8FF;
|
||||
color: #1C6FE8;
|
||||
height: 6rem;
|
||||
width: 5.25rem;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.np-dashboard-achievements-card-text{
|
||||
font-size: 0.75rem;
|
||||
margin-top: -0.5rem;
|
||||
}
|
||||
|
||||
.np-dashboard-medal-card{
|
||||
background: #3f0c59;
|
||||
height: 6rem;
|
||||
border-radius: 10px;
|
||||
display: flex;
|
||||
align-content: center;
|
||||
} */
|
||||
|
||||
/* .np-dashboard-medal-icon{
|
||||
margin-right: -4rem;
|
||||
} */
|
||||
|
||||
@media (min-width: 395px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -4rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 410px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -5rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 425px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -6rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 440px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -7rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 465px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -8rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 480px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -9rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 495px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -10rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 510px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -11rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 525px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -12rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 540px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -13rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 555px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -14rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 570px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -15rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 595px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -16rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 610px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -17rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 625px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -18rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 640px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -19rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 655px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -20rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 670px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -21rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 695px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -22rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 710px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -23rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 725px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -24rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 740px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -25rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 755px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -26rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: 0rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 830px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -1rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 860px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -2rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 925px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -3rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 975px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -4rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 990px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -5rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1005px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -6rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1030px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -7rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1055px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -8rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1125px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -9rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1150px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -10rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1185px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -11rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: 0rem;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1250px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -1rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1300px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -2rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1350px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -3rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1400px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -4rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1675px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -3rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 2200px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -2rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 2550px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: -1rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 3050px){
|
||||
.np-dashboard-medal-icon{
|
||||
margin-right: 0rem;
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,23 @@
|
||||
{% comment %}{% include "header" %}
|
||||
{% include "sub_navigation" %}
|
||||
<main class="np-main np-training-events np-subpage-container np-max-width">
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-sm-10">
|
||||
<div class="np-resource-title">
|
||||
{% t .title %}
|
||||
</div>
|
||||
<div class="np-resource-subtitle">
|
||||
{% t .subtitle %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-2">
|
||||
{% include "training_events_filter" %}
|
||||
</div>
|
||||
</div>
|
||||
{% include "training_events_index" %}
|
||||
</main>
|
||||
{% include "footer" %}{% endcomment%}
|
||||
|
||||
<script>
|
||||
window.location.replace('/app')
|
||||
</script>
|
||||
BIN
Custom_Templates/customer_templates/Crossbeam/.DS_Store
vendored
Normal file
BIN
Custom_Templates/customer_templates/Crossbeam/.DS_Store
vendored
Normal file
Binary file not shown.
@ -0,0 +1,56 @@
|
||||
<div class="np-card {{ card_classes }}">
|
||||
<div class="np-card-container">
|
||||
<div class="card__image" style="background-image: url({{ course.image_url }})">
|
||||
{% if course.ribbon and course.ribbon.size > 0 %}
|
||||
<div class="np-card-ribbon">
|
||||
{{ course.ribbon }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
{% if course.instructor_names and course.instructor_names.size > 0 %}
|
||||
<div class="np-card-content-subtitle">
|
||||
{{ course.instructor_names }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if course.short_description and course.short_description.size > 0 %}
|
||||
<div class="np-card-content-description">
|
||||
{{ course.short_description | split: " --- " | last }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="np-card-content-footer">
|
||||
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
||||
{% if course.name == "Developer Coding Challenge Mission" %}
|
||||
<a class ="np-button np-button-wide" href="https://stripedemo.northpass.com/courses/e805c2c2-9be1-46b9-9a1f-7c26a99a8e22/activities/7886cee7-904f-435f-9c9d-f966b3536aae">
|
||||
{% t shared.view %}
|
||||
</a>
|
||||
{% elsif course.name == "MCQ Exam Sign up" %}
|
||||
<a class = "np-button np-button-wide" href=https://stripedemo.northpass.com/courses/fa2b4ce1-8e59-4ba8-b2ea-8f20d101daa2/activities/4ba10994-8512-4245-adeb-d30bf8d1c98f">
|
||||
{% t shared.view %}
|
||||
</a>
|
||||
{% else %}
|
||||
<a class="np-button np-button-wide" href="{{ course_path }}">
|
||||
{% t shared.view %}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if course.enrolled? %}
|
||||
{% if course.has_to_restart? %}
|
||||
{% include "course_version_outdated_popup", path: course_path %}
|
||||
{% endif %}
|
||||
<div class="np-card-content-progress np-button-color">
|
||||
{% if course.completed? %}
|
||||
Complete
|
||||
{% elsif course.started? == false %}
|
||||
Enrolled
|
||||
{% else %}
|
||||
{{ course.progress }}% Complete
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,61 @@
|
||||
<div class="np-card card--horizontal {{ card_classes }}">
|
||||
<div class="np-card-container">
|
||||
<div class="card__image" style="background-image: url({{ learning_path.image_url }})">
|
||||
<div class="np-card-ribbon np-hidden-mobile">
|
||||
<i class="fa fa-book-open" aria-hidden="true"></i>
|
||||
{{ learning_path.items.count }} Tutorial{% if learning_path.items.count > 1%}s{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-card-text-wrapper">
|
||||
|
||||
<div class="np-card-content np-card-padding np-card-content-vertical">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ learning_path.name }}
|
||||
</h3>
|
||||
|
||||
{% if learning_path.has_instructors? %}
|
||||
<div class="np-card-content-subtitle">
|
||||
{{ learning_path.instructor_names }}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<div class="np-card-ribbon np-hidden-desktop">
|
||||
<i class="fa fa-book-open" aria-hidden="true"></i>
|
||||
{{ learning_path.items.count }} Tutorial{% if learning_path.items.count > 1%}s{% endif %}
|
||||
</div>
|
||||
|
||||
{% comment %} Currently hiding the description {% endcomment %}
|
||||
{% comment %}
|
||||
{% if learning_path.description and learning_path.description.size > 0 %}
|
||||
<div class="np-hidden-mobile np-card-content-description">
|
||||
{{ learning_path.description }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endcomment %}
|
||||
|
||||
<div class="np-card-content-footer">
|
||||
<a class="np-button" href="{% route learning_path, id: learning_path.id %}">
|
||||
<span class="np-hidden-desktop">View</span>
|
||||
<span class="np-hidden-mobile">View Path</span>
|
||||
</a>
|
||||
{% if learning_path.enrolled? %}
|
||||
<div class="np-card-content-progress
|
||||
np-button-color">
|
||||
{% if learning_path.completed? %}
|
||||
Complete
|
||||
{% elsif learning_path.started? == false %}
|
||||
Enrolled
|
||||
{% else %}
|
||||
{{ learning_path.progress }}% Complete
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-card-stack">
|
||||
<div class="np-card-stack-level-1"></div>
|
||||
<div class="np-card-stack-level-2"></div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,59 @@
|
||||
<div class="np-card card--training-event {{ card_classes }}">
|
||||
<div class="np-card-container">
|
||||
<div class="np-card-content np-card-padding np-card-content-vertical">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ training_event.title }}
|
||||
</h3>
|
||||
<div class="np-card-content-subtitle">
|
||||
{% case training_event.event_type %}
|
||||
{% when "online" %}
|
||||
Online Event
|
||||
{% when "in_person" %}
|
||||
In-Person Event
|
||||
{% endcase %}
|
||||
</div>
|
||||
{% if training_event.description and training_event.description.size > 0 %}
|
||||
<div class="np-card-content-description">
|
||||
|
||||
{{ training_event.description | strip }}
|
||||
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="np-card-training-session-date">
|
||||
|
||||
{% comment %} Fallback to the first session {% endcomment %}
|
||||
{% assign session_to_display = training_event.sessions | first %}
|
||||
{% comment %} Check for an enrolled session and preferrably display that {% endcomment %}
|
||||
{% assign enrolled_sessions = training_event.sessions | where: "registered?", true %}
|
||||
{% if enrolled_sessions and enrolled_sessions.size > 0 %}
|
||||
{% assign session_to_display = enrolled_sessions | first %}
|
||||
{% endif %}
|
||||
|
||||
{% include "training_session_date", training_session: session_to_display %}
|
||||
{% if training_event.sessions and training_event.sessions.size > 1 %}
|
||||
<div class="session-date__other-info-container">
|
||||
<div class="session-date__other-info-wrapper">
|
||||
<i class="np-card-training-sessions-icon far fa-calendar-star" aria-hidden="true"></i>
|
||||
<span class="np-card-training-sessions-label">
|
||||
{{ training_event.sessions.size | minus: 1 }}
|
||||
{% if training_event.sessions.size == 2 %}
|
||||
Other Session
|
||||
{% else %}
|
||||
Other Sessions
|
||||
{% endif %}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="np-card-content-footer">
|
||||
<a
|
||||
class="np-button np-button-wide"
|
||||
href="{% route training_session, id: session_to_display.id %}"
|
||||
>
|
||||
{% t shared.view %} Event
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,4 @@
|
||||
<span class="np-course-outline-content-activity-title">
|
||||
{{ activity.title }}
|
||||
</span>
|
||||
|
||||
@ -0,0 +1,9 @@
|
||||
<a
|
||||
href="{% route activity_viewer,
|
||||
id: activity.id,
|
||||
course_id: params.course_id,
|
||||
learning_path_id: params.learning_path_id
|
||||
%}" class="{{ activity_classes }}"
|
||||
>
|
||||
{{ activity.title }}
|
||||
</a>
|
||||
@ -0,0 +1,27 @@
|
||||
{% if course.learner_can_retake? %}
|
||||
<form action="{% route course_retake, id: course.id %}" method="POST">
|
||||
{% form_authenticity_token %}
|
||||
<button type="submit" class="np-top-button np-button-font-color np-button np-button-big">
|
||||
Restart Course
|
||||
</button>
|
||||
</form>
|
||||
{% else %}
|
||||
<a
|
||||
class="np-top-button np-button-font-color np-button np-button-big"
|
||||
{% if course.enrolled? %}
|
||||
href="{% route course_viewer, course_id: course.id, learning_path_id: params.learning_path_id %}"
|
||||
{% else %}
|
||||
href="{% route course_enrollment, code: course.enrollment_code %}"
|
||||
{% endif %}
|
||||
>
|
||||
{% if course.enrolled? == false %}
|
||||
Enroll in Course
|
||||
{% elsif course.started? == false %}
|
||||
Start Course
|
||||
{% elsif course.completed? %}
|
||||
View Course
|
||||
{% else %}
|
||||
Continue Course
|
||||
{% endif %}
|
||||
</a>
|
||||
{% endif %}
|
||||
@ -0,0 +1,6 @@
|
||||
<h3 class="np-card-heading">
|
||||
About This Tutorial
|
||||
</h3>
|
||||
<div class="np-card-text">
|
||||
{{ course.full_description }}
|
||||
</div>
|
||||
@ -0,0 +1,26 @@
|
||||
<h3 class="np-card-heading">
|
||||
{% t .header %}
|
||||
</h3>
|
||||
{% for event in course.events %}
|
||||
<div class="np-course-events-content-item">
|
||||
<div class="np-course-events-content-date">
|
||||
<div class="np-course-events-content-month">
|
||||
{{ event.sessions.first.abbreviated_month }}
|
||||
</div>
|
||||
<div class="np-course-events-content-day">
|
||||
{{ event.sessions.first.day }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-course-events-content-details">
|
||||
<div class="np-course-events-content-name">
|
||||
{{ event.title }}
|
||||
</div>
|
||||
<div class="np-course-events-content-type np-text-light">
|
||||
{% t shared.event_types, key: event.event_type %}
|
||||
</div>
|
||||
<div class="np-course-events-content-time">
|
||||
{{ event.sessions.first.time_period | replace: "AM", "am" | replace: "PM", "pm" | replace: "-", "–" }} {{ event.sessions.first.time_zone }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
@ -0,0 +1,6 @@
|
||||
<div class="np-top-title">
|
||||
{{ course.name }}
|
||||
</div>
|
||||
<div>
|
||||
{% include "course_cta_button" %}
|
||||
</div>
|
||||
@ -0,0 +1,26 @@
|
||||
<h3 class="np-card-heading">
|
||||
Instructors
|
||||
</h3>
|
||||
<div class="instructors-list__container">
|
||||
{% for instructor in course.instructors %}
|
||||
<div class="np-content-instructors-content-item">
|
||||
<img
|
||||
src="{{ instructor.avatar_url }}"
|
||||
class="np-content-instructors-content-image"
|
||||
alt="{{ instructor.name }}"
|
||||
/>
|
||||
<div class="np-content-instructors-content-description">
|
||||
<div class="np-content-instructors-content-name">
|
||||
{{ instructor.name }}
|
||||
</div>
|
||||
|
||||
{% if instructor.title and instructor.title.size > 0 %}
|
||||
<div class="np-content-instructors-content-info">
|
||||
{{ instructor.title }}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
@ -0,0 +1,57 @@
|
||||
<div class="np-course-outline np-card-content-divider">
|
||||
<h3 class="np-card-heading">
|
||||
Outline
|
||||
</h3>
|
||||
<div class="np-course-outline-content">
|
||||
<ol class="np-course-outline-content-section">
|
||||
{% for section in course.sections %}
|
||||
<li class="np-course-outline-content-section-list">
|
||||
<div class="np-course-outline-content-section-name np-text-title-bold np-text-title-bold">
|
||||
{{ section.name }}
|
||||
</div>
|
||||
<ol class="np-course-outline-content-activity">
|
||||
{% for activity in section.activities %}
|
||||
|
||||
<li class="np-course-outline-content-activity-list">
|
||||
<i
|
||||
class="fas np-course-outline-content-activity-icon
|
||||
{% if activity.completed? %}
|
||||
fa-check-circle np-progress-color
|
||||
{% else %}
|
||||
fa-circle
|
||||
{% endif %}"
|
||||
{% if activity.completed? %}
|
||||
aria-label="Chapter Complete"
|
||||
{% else %}
|
||||
aria-hidden="true"
|
||||
{% endif %}
|
||||
>
|
||||
</i>
|
||||
|
||||
{% comment %} If the activity is locked show a locked icon and then a text title {% endcomment %}
|
||||
{% if activity.locked? %}
|
||||
<i
|
||||
class="far fa-lock-alt np-course-outline-content-activity-icon-locked"
|
||||
aria-label="Chapter Locked"
|
||||
></i>
|
||||
{% include "course_activity_locked" %}
|
||||
|
||||
{% comment %} If the user is not enrolled in the course show a text title {% endcomment %}
|
||||
{% elsif course.enrolled? == false %}
|
||||
{% include "course_activity_locked" %}
|
||||
|
||||
{% comment %} Otherwise include a link {% endcomment %}
|
||||
{% else %}
|
||||
{% include "course_activity_unlocked", activity_classes: "np-course-outline-content-activity-link-completed" %}
|
||||
{% endif %}
|
||||
|
||||
<div class="np-course-outline-content-activity-list-bar
|
||||
{% if activity.completed? %} np-progress-background-color {% endif %}"></div>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,29 @@
|
||||
<div class="np-top-cta">
|
||||
<div class="np-hidden-mobile">
|
||||
{% include "course_cta_button" %}
|
||||
</div>
|
||||
<div class="np-top-cta-progress-content">
|
||||
<div class="np-top-cta-progress-title np-text-title">
|
||||
Progress
|
||||
</div>
|
||||
<div class="np-progress-bar-container">
|
||||
<div
|
||||
style="width: {{ course.progress }}%"
|
||||
class="np-progress-background-color np-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="np-top-cta-progress-text">
|
||||
{{ course.progress }}% Complete
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-hidden-desktop">
|
||||
{% include "course_cta_button" %}
|
||||
</div>
|
||||
|
||||
|
||||
{% if course.activites | count > 2 %}
|
||||
<div class="al"
|
||||
{% else %}
|
||||
<div
|
||||
@ -0,0 +1,49 @@
|
||||
<div class="np-course-version-outdated-popup np-popup">
|
||||
<div class="np-popup-positioner">
|
||||
<i
|
||||
class="np-course-version-outdated-popup-trigger fas fa-exclamation-circle"
|
||||
data-toggle-class-on-target="np-popup-tooltip--visible"
|
||||
data-toggle-target-parent=".np-popup-tooltip"
|
||||
data-toggle-outside
|
||||
aria-label="New Version Available"
|
||||
tabindex="0"
|
||||
></i>
|
||||
<div
|
||||
class="np-popup-tooltip"
|
||||
role="tooltip"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<header class="np-popup-header">
|
||||
<i class="np-popup-header-icon fas fa-exclamation-circle" aria-hidden="true"></i>
|
||||
<h3 class="np-popup-header-title">
|
||||
{% t .title %}
|
||||
</h3>
|
||||
</header>
|
||||
<div class="np-popup-body">
|
||||
<h4>
|
||||
{% capture header_text %}
|
||||
{% t .body.header %}
|
||||
{% endcapture %}
|
||||
{{ header_text | replace: "course", "tutorial" }}
|
||||
|
||||
</h4>
|
||||
<p>
|
||||
{% capture body_text %}
|
||||
{% t .body.content %}
|
||||
{% endcapture %}
|
||||
{{ body_text | replace: "course", "tutorial" }}
|
||||
</p>
|
||||
<a
|
||||
class="np-popup-body-button"
|
||||
href="{{ path }}"
|
||||
>
|
||||
{% capture button_text %}
|
||||
{% t .body.button %}
|
||||
{% endcapture %}
|
||||
{{ button_text | replace: "Course", "Tutorial" }}
|
||||
</a>
|
||||
</div>
|
||||
<div class="np-popup-tail"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,15 @@
|
||||
{% if courses.enrolled and courses.enrolled.any? %}
|
||||
<div class="blocks-layout">
|
||||
{% for course in courses.enrolled %}
|
||||
{% include "cards_course", course: course, card_classes: card_classes %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
{% capture message %}
|
||||
{% t shared.zero_state.courses.index,
|
||||
key: current_school.course_vocabulary
|
||||
%}
|
||||
{% endcapture %}
|
||||
{% assign message = message | replace: "Courses", "tutorials" %}
|
||||
{% include "courses_zero_state", message: message, filters_applied: false %}
|
||||
{% endif %}
|
||||
@ -0,0 +1,20 @@
|
||||
{% if courses.enrolled and courses.enrolled.any? %}
|
||||
<div class="blocks-layout">
|
||||
{% for course in courses.enrolled %}
|
||||
{% for category in course.categories %}
|
||||
{% if category.name == 'Partner Certification' %}
|
||||
{% include "cards_course", course: course, card_classes: card_classes %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
{% capture message %}
|
||||
{% t shared.zero_state.courses.index,
|
||||
key: current_school.course_vocabulary
|
||||
%}
|
||||
{% endcapture %}
|
||||
{% assign message = message | replace: "Courses", "tutorials" %}
|
||||
{% include "courses_zero_state", message: message, filters_applied: false %}
|
||||
{% endif %}
|
||||
@ -0,0 +1,155 @@
|
||||
{% comment %} Initialize Variables {% endcomment %}
|
||||
{% assign show_learning_paths_section = false %}
|
||||
{% assign show_events_section = false %}
|
||||
{% assign learning_path_section_classes = "" %}
|
||||
{% assign event_section_classes = "" %}
|
||||
{% assign learning_path_card_classes = "col-md-6" %}
|
||||
{% assign event_card_classes = "col-x-sm-6 col-sm-6 col-md-4 col-lg-3" %}
|
||||
|
||||
{% comment %} Determine if learning paths are enabled and the user is enrolled in at least one learning path {% endcomment %}
|
||||
{% if features.learning_paths? and learning_paths.enrolled and learning_paths.enrolled.any? %}
|
||||
{% assign show_learning_paths_section = true %}
|
||||
{% endif %}
|
||||
|
||||
{% comment %} Determine if events are enabled and the user is registsered for at least one event {% endcomment %}
|
||||
{% if features.training_events? and training_events.enrolled and training_events.enrolled.any? %}
|
||||
{% assign show_events_section = true %}
|
||||
{% endif %}
|
||||
|
||||
{% comment %} Determine whether special classes need to be added to non course sections and the cards within {% endcomment %}
|
||||
{% if show_learning_paths_section %}
|
||||
{% assign learning_path_section_classes = "col-md-6" %}
|
||||
{%comment%}{% assign learning_path_section_classes = "col-md-8 col-lg-6" %}{%endcomment%}
|
||||
{% assign learning_path_card_classes = "" %}
|
||||
{% endif %}
|
||||
|
||||
{%if show_events_section%}
|
||||
{% assign event_section_classes = "col-md-3" %}
|
||||
{%comment%}{% assign event_section_classes = "col-md-4 col-lg-6" %}{%endcomment%}
|
||||
{% assign event_card_classes = "col-x-sm-12" %}
|
||||
{%comment%}{% assign event_card_classes = "col-x-sm-6 col-sm-6 col-md-12 col-lg-6" %}{%endcomment%}
|
||||
{%endif%}
|
||||
|
||||
<main class="np-main np-dashboard np-subpage-container">
|
||||
|
||||
<div class="blocks-layout">
|
||||
|
||||
{% comment %} Show the first featured course as a banner {% endcomment %}
|
||||
{% if courses.featured and courses.featured.any? %}
|
||||
<div>
|
||||
{% include "banner_course", course: courses.featured.first, button_text: "Get Started" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% comment %} Show this section if either the event section or learning path section has content {% endcomment %}
|
||||
{% if show_learning_paths_section or show_events_section %}
|
||||
|
||||
<div class="blocks-layout">
|
||||
|
||||
{% if show_learning_paths_section %}
|
||||
<div class="{{ learning_path_section_classes }}">
|
||||
<h2 class="np-dashboard-resources-title">
|
||||
Learning Paths
|
||||
</h2>
|
||||
{% include "learning_paths_index", items: learning_paths.enrolled, card_classes: learning_path_card_classes %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if show_events_section %}
|
||||
<div class="{{ event_section_classes }}">
|
||||
<h2 class="np-dashboard-resources-title">
|
||||
Upcoming Events
|
||||
</h2>
|
||||
{% include "training_events_dashboard", card_classes: event_card_classes %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{%comment%} This is a test section for understanding blocks-layout and the formatting required to render an additional 'achievements' section {%endcomment%}
|
||||
{% if show_events_section %}
|
||||
<div class="{{ event_section_classes }}">
|
||||
<h2 class="np-dashboard-resources-title" style="width: 265px">
|
||||
Recent Achievements
|
||||
</h2>
|
||||
{% include "widget_achievements", card_classes: event_card_classes %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{% endif %}
|
||||
|
||||
<div>
|
||||
<h2 class="np-dashboard-resources-title">
|
||||
My Courses
|
||||
</h2>
|
||||
{% if courses.enrolled and courses.enrolled.any? %}
|
||||
|
||||
|
||||
{% comment %} Sort enrolled courses by progress {% endcomment %}
|
||||
{% assign enrolled_courses_sorted = courses.enrolled | sort_natural: "short_description" | reverse | sort_natural: "progress" | reverse %}
|
||||
|
||||
{% comment %} Divide courses by progress/completion state {% endcomment %}
|
||||
{% assign courses_completed = enrolled_courses_sorted | where: "completed?", true %}
|
||||
{% assign courses_in_progress = enrolled_courses_sorted | where: "completed?", false | where: "started?", true %}
|
||||
{% assign courses_enrolled = enrolled_courses_sorted | where: "started?", false %}
|
||||
|
||||
{% comment %} In Progress & Enrolled courses {% endcomment %}
|
||||
{% if courses_in_progress.size > 0 or courses_enrolled.size > 0 %}
|
||||
<h3 class="dashboard-layout__subtitle">
|
||||
Courses In Progress
|
||||
</h3>
|
||||
<div class="blocks-layout">
|
||||
|
||||
{% comment %} In Progress courses {% endcomment %}
|
||||
{% if courses_in_progress.size > 0 %}
|
||||
{% for course in courses_in_progress %}
|
||||
{% for category in course.categories %}
|
||||
{% if category.name == 'Partner Training'%}
|
||||
{% include "cards_course", course: course, card_classes: "col-x-sm-6 col-sm-6 col-md-4 col-lg-3" %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
{% comment %} Enrolled courses {% endcomment %}
|
||||
{% if courses_enrolled.size > 0 %}
|
||||
{% for course in courses_enrolled %}
|
||||
{% for category in course.categories %}
|
||||
{% if category.name == 'Partner Training'%}
|
||||
{% include "cards_course", course: course, card_classes: "col-x-sm-6 col-sm-6 col-md-4 col-lg-3" %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% comment %} Completed courses {% endcomment %}
|
||||
{% if courses_completed.size > 0 %}
|
||||
<h3 class="dashboard-layout__subtitle">
|
||||
Completed Courses
|
||||
</h3>
|
||||
<div class="blocks-layout">
|
||||
{% for course in courses_completed %}
|
||||
{% for category in course.categories %}
|
||||
{% if category.name == 'Partner Training'%}
|
||||
{% include "cards_course", course: course, card_classes: "col-x-sm-6 col-sm-6 col-md-4 col-lg-3" %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% else %}
|
||||
{% capture message %}
|
||||
{% t shared.zero_state.courses.index,
|
||||
key: current_school.course_vocabulary
|
||||
%}
|
||||
{% endcapture %}
|
||||
{% assign message = message | replace: "Courses", "tutorials" %}
|
||||
{% include "courses_zero_state", message: message, filters_applied: false %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
@ -0,0 +1,9 @@
|
||||
<div class="np-dashboard-resources-container">
|
||||
<div class="np-zero-state-text">
|
||||
<p>{{ message }}</p>
|
||||
{% if filters_applied %}
|
||||
<button class="np-button np-button-wide js-clear-filter-button js-filter-type__all">Clear All Filters</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
<img class="np-zero-state-courses" alt="{{ message }}" />
|
||||
</div>
|
||||
@ -0,0 +1,81 @@
|
||||
{% comment %}
|
||||
<footer class="np-footer">
|
||||
<div class="np-footer-top">
|
||||
{% if website_footer.show_navigation_links? %}
|
||||
<div class="np-footer-navigation">
|
||||
<ul class="np-footer-navigation-list">
|
||||
{% for website_navigation in navigations.footer_navigations %}
|
||||
<li class="np-footer-navigation-item">
|
||||
<a
|
||||
class="np-footer-navigation-link np-button-color"
|
||||
href="{{ website_navigation.path }}"
|
||||
{% if website_navigation.external? %} target="_blank" {% endif %}
|
||||
>
|
||||
{{ website_navigation.name }}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% if current_school.logo_url %}
|
||||
<h2 class="np-footer-logo">
|
||||
<a href="{% route home %}">
|
||||
<img
|
||||
alt="{{ current_school.name }}"
|
||||
class="np-footer-logo-image"
|
||||
src="{{ current_school.logo_url }}"
|
||||
/>
|
||||
</a>
|
||||
</h2>
|
||||
{% else %}
|
||||
<div class="np-school-name np-header-font-color">
|
||||
{{ current_school.name }}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="np-footer-bottom">
|
||||
<nav class="np-footer-social-links">
|
||||
{% if website_footer.show_social_media_links? %}
|
||||
<ul class="np-footer-social-links-list">
|
||||
{% for social_media_link in website_footer.social_media_links %}
|
||||
<li class="np-footer-social-links-item">
|
||||
<a
|
||||
class="np-footer-social-links-link np-button-color"
|
||||
href="{{ social_media_link.link }}"
|
||||
target="_blank" title="{{ social_media_link.name }}"
|
||||
>
|
||||
<i class="np-footer-social-links-icon
|
||||
np-button-color
|
||||
fab fa-{{ social_media_link.name }}"
|
||||
aria-label="{{ social_media_linke.name }}"
|
||||
></i>
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
</nav>
|
||||
|
||||
{% if website_footer.show_customer_service_email? and
|
||||
website_footer.school_customer_service_email
|
||||
%}
|
||||
<div class="np-footer-support">
|
||||
<div class="np-footer-support-item np-footer-support-help">
|
||||
{% t .need_help %}
|
||||
</div>
|
||||
<div class="np-footer-support-item np-footer-support-email">
|
||||
{% t .email %}
|
||||
</div>
|
||||
<a
|
||||
class="np-footer-support-item np-footer-support-link np-button-color"
|
||||
href="mailto:{{ website_footer.school_customer_service_email }}"
|
||||
>
|
||||
{{ website_footer.school_customer_service_email }}
|
||||
</a>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</footer>
|
||||
{% endcomment %}
|
||||
@ -0,0 +1,8 @@
|
||||
{% styles default %}
|
||||
{% styles colors %}
|
||||
{% styles custom %}
|
||||
|
||||
{% comment %} Install Lato {% endcomment %}
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;0,900;1,400;1,700;1,900&display=swap" rel="stylesheet">
|
||||
@ -0,0 +1,199 @@
|
||||
<header class="np-header np-header-color">
|
||||
<div class="np-header-content">
|
||||
<div class="np-hidden-desktop np-header-mobile-menu-nav">
|
||||
{% if current_person.signed_in? %}
|
||||
<button
|
||||
data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button fal fa-times np-hidden np-header-font-color"
|
||||
data-toggle-target=".np-header-mobile-avatar-menu,
|
||||
.np-header-mobile-menu-content, .np-main, .np-footer"
|
||||
></button>
|
||||
<button
|
||||
data-test="open-mobile-menu"
|
||||
data-toggle-class="np-hidden"
|
||||
class="np-header-mobile-menu-nav-button np-header-mobile-avatar-menu"
|
||||
data-toggle-target=".fa-times, .np-header-mobile-menu-content, .np-main, .np-footer"
|
||||
>
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-avatar-image"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
/>
|
||||
</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% if current_school.logo_url %}
|
||||
<h1 class="np-header-logo">
|
||||
<a href="{% route home %}">
|
||||
<img
|
||||
alt="{{ current_school.name }}"
|
||||
class="np-header-logo-image"
|
||||
src="{{ current_school.logo_url }}"
|
||||
/>
|
||||
</a>
|
||||
</h1>
|
||||
{% else %}
|
||||
<a href="{% route home %}" class="np-school-name np-header-font-color">
|
||||
{{ current_school.name }}
|
||||
</a>
|
||||
{% endif %}
|
||||
|
||||
<!-- <div class="np-hidden-mobile np-header-desktop-nav">
|
||||
<ul class="np-header-desktop-nav-list">
|
||||
{% comment %} All Courses {% endcomment %}
|
||||
{% include "header_desktop_menu_item", label: 'Courses', url: '/app/courses', external: false %}
|
||||
|
||||
{% comment %} Learning Paths {% endcomment %}
|
||||
{% assign navigation_guides = navigations.sub_navigation | where: "label", "Learning Paths" | first %}
|
||||
{% include "header_desktop_menu_item", label: "Learning Paths", url: navigation_guides.url, external: false %}
|
||||
|
||||
{% comment %} Events {% endcomment %}
|
||||
{% assign navigation_events = navigations.sub_navigation | where: "label", "Events" | first %}
|
||||
{% include "header_desktop_menu_item", label: navigation_events.label, url: navigation_events.url, external: false %}
|
||||
|
||||
{% for website_navigation in navigations.header_navigations_external %}
|
||||
{% include "header_desktop_menu_item", label: website_navigation.name, url: website_navigation.path, external: true %}
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div> -->
|
||||
|
||||
{% if current_person.signed_in? %}
|
||||
<div class="np-hidden-mobile np-header-search np-header-search-expanded">
|
||||
<form action="{% route search %}" method="get" data-test="desktop-search">
|
||||
<input
|
||||
aria-label="{% t .search %}"
|
||||
class="np-header-search-input np-header-font-background-color"
|
||||
type="text"
|
||||
name="q"
|
||||
placeholder="{% t .search %}"
|
||||
/>
|
||||
<i class="np-header-search-icon far fa-search" aria-label="Search"></i>
|
||||
</form>
|
||||
</div>
|
||||
<div class="np-hidden-mobile np-header-avatar">
|
||||
<button
|
||||
class="np-header-avatar-button"
|
||||
data-test="open-desktop-menu"
|
||||
data-toggle-class-on-target="np-hidden"
|
||||
data-toggle-target=".np-header-avatar-tooltip"
|
||||
data-toggle-outside
|
||||
>
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-avatar-image"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
>
|
||||
</button>
|
||||
<div class="np-header-avatar-tooltip np-hidden" role="tooltip">
|
||||
<span class="np-header-avatar-tooltip-arrow-up"></span>
|
||||
<div class="np-header-avatar-tooltip-learner">
|
||||
<div class="np-header-avatar-tooltip-learner-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
<div class="np-header-avatar-tooltip-learner-email">
|
||||
{{ current_person.email }}
|
||||
</div>
|
||||
</div>
|
||||
<nav class="np-header-avatar-tooltip-navigation">
|
||||
{% unless current_school.sso_active? %}
|
||||
<a
|
||||
class="np-header-avatar-tooltip-navigation-link"
|
||||
href="{% route account %}"
|
||||
>
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a
|
||||
class="np-header-avatar-tooltip-navigation-link np-danger"
|
||||
href="{% route logout %}"
|
||||
>
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
{% else %}
|
||||
<a
|
||||
class="np-header-sign-in np-header-desktop-nav-link np-header-font-color"
|
||||
href="{% route login %}"
|
||||
>
|
||||
{% t shared.sign_in %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="np-hidden-desktop">
|
||||
<div class="np-header-mobile-menu-content np-hidden">
|
||||
{% if current_person.signed_in? %}
|
||||
<img
|
||||
alt="{{ current_person.name }}"
|
||||
class="np-header-mobile-menu-content-avatar"
|
||||
src="{{ current_person.avatar_url }}"
|
||||
/>
|
||||
<div class="np-header-mobile-menu-content-name">
|
||||
{{ current_person.name }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="np-header-mobile-menu-content-nav">
|
||||
<form
|
||||
class="np-header-search"
|
||||
data-test="mobile-search"
|
||||
method="get"
|
||||
action="{% route search %}"
|
||||
>
|
||||
<input
|
||||
aria-label="{% t .search %}"
|
||||
class="np-header-search-input"
|
||||
type="text"
|
||||
name="q"
|
||||
placeholder="{% t .search %}"
|
||||
/>
|
||||
<i class="np-header-search-icon far fa-search" aria-label="search"></i>
|
||||
</form>
|
||||
|
||||
{% comment %} Home {% endcomment %}
|
||||
{% assign mobile_navigation_home = navigations.header_navigations | where: "name", "Home" | first %}
|
||||
{% include "header_mobile_menu_item", label: mobile_navigation_home.name, url: mobile_navigation_home.path, external: false %}
|
||||
|
||||
{% comment %} Dashboard {% endcomment %}
|
||||
{% assign mobile_navigation_my_training = navigations.header_navigations | where: "name", "Dashboard" | first %}
|
||||
{% include "header_mobile_menu_item", label: "Dashboard", url: mobile_navigation_my_training.path, external: false %}
|
||||
|
||||
{% comment %} All Courses {% endcomment %}
|
||||
{% include "header_mobile_menu_item", label: "Tutorials", url: "/app/courses", external: false %}
|
||||
|
||||
{% comment %} Learning Paths {% endcomment %}
|
||||
{% assign mobile_navigation_guides = navigations.header_navigations | where: "name", "Learning Paths" | first %}
|
||||
{% include "header_mobile_menu_item", label: "Learning Paths", url: mobile_navigation_guides.path, external: false %}
|
||||
|
||||
{% comment %} Events {% endcomment %}
|
||||
{% assign mobile_navigation_events = navigations.header_navigations | where: "name", "Events" | first %}
|
||||
{% include "header_mobile_menu_item", label: mobile_navigation_events.name, url: mobile_navigation_events.path, external: false %}
|
||||
|
||||
{% comment %} External Links {% endcomment %}
|
||||
{% assign mobile_navigation_external = navigations.header_navigations | where: "external?", true %}
|
||||
{% for website_navigation in mobile_navigation_external %}
|
||||
{% include "header_mobile_menu_item", label: website_navigation.name, url: website_navigation.path, external: true %}
|
||||
{% endfor %}
|
||||
|
||||
<div class="np-header-mobile-menu-content-line"></div>
|
||||
{% unless current_school.sso_active? %}
|
||||
<a
|
||||
class="np-header-mobile-menu-content-button"
|
||||
href="{% route account %}"
|
||||
>
|
||||
{% t .profile_settings %}
|
||||
</a>
|
||||
{% endunless %}
|
||||
<a
|
||||
class="np-header-mobile-menu-content-button np-danger"
|
||||
href="{% route logout %}"
|
||||
>
|
||||
{% t .sign_out %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% include "messages" %}
|
||||
@ -0,0 +1,32 @@
|
||||
<li class="np-header-desktop-nav-item">
|
||||
<a
|
||||
href="{{ url }}"
|
||||
class="np-header-desktop-nav-link np-header-font-color
|
||||
{% if url contains current_page_orgin %}
|
||||
is-active white-text
|
||||
{% else %}
|
||||
white-text
|
||||
{% endif %}
|
||||
"
|
||||
{% if external %}target="_blank"{% endif %}
|
||||
>
|
||||
{{ label }}
|
||||
</a>
|
||||
</li>
|
||||
<style>
|
||||
.white-text{
|
||||
color: white
|
||||
}
|
||||
|
||||
.black-text{
|
||||
color: black
|
||||
}
|
||||
|
||||
.black-text:hover{
|
||||
color: white;
|
||||
}
|
||||
|
||||
.white-text:hover{
|
||||
color: black;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,8 @@
|
||||
<a
|
||||
href="{{ url }}"
|
||||
class="np-header-mobile-menu-content-button"
|
||||
{% if external %} target="_blank" {% endif %}
|
||||
style="color: white"
|
||||
>
|
||||
{{ label }}
|
||||
</a>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user