moved a bunch of churned customers templates to a hidden folder. Added to Sandata's script and the new groups. Notes.
This commit is contained in:
Norm Rasmussen
BIN
Custom_Templates/customer_templates/.DS_Store
vendored
BIN
Custom_Templates/customer_templates/.DS_Store
vendored
Binary file not shown.
@ -1,61 +0,0 @@
|
||||
{% if training_session.approved? %}
|
||||
<div class="np-training-session-cta-note">
|
||||
<i class="far fa-check np-training-session-icon"></i>
|
||||
{% t .registered %}
|
||||
</div>
|
||||
{% elsif training_session.pending? %}
|
||||
<div class="np-training-session-cta-note np-training-session-cta-note-error">
|
||||
{% t .pending %}
|
||||
</div>
|
||||
{% elsif training_session.denied? %}
|
||||
<div class="np-training-session-cta-note np-training-session-cta-note-error">
|
||||
{% t .denied %}
|
||||
</div>
|
||||
{% elsif training_session.too_late? %}
|
||||
<div class="np-training-session-cta-note np-training-session-cta-note-error">
|
||||
{% t .too_late %}
|
||||
</div>
|
||||
{% elsif training_session.no_seats? %}
|
||||
<div class="np-training-session-cta-note np-training-session-cta-note-error">
|
||||
{% t .no_seats %}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="np-training-session-cta">
|
||||
<div class="np-training-session-cta-buttons">
|
||||
{% if training_session.session_url != "" %}
|
||||
<a href={{ training_session.session_url }}>
|
||||
<button class="np-top-button np-button np-button-big ">
|
||||
Register
|
||||
</button>
|
||||
{% else %}
|
||||
<form
|
||||
action="{% route training_session_registration, id: training_session.id %}"
|
||||
method="post"
|
||||
>
|
||||
{% form_authenticity_token %}
|
||||
|
||||
{% if training_session.internal? and training_session.approved? %}
|
||||
{% if features.training_events_google_calendar? %}
|
||||
{% include "training_session_calendars" %}
|
||||
<button type="submit" class="np-top-button np-button np-button-big np-button-secondary">
|
||||
{% t .unregister %}
|
||||
</button>
|
||||
{% else %}
|
||||
<button type="submit" class="np-top-button np-button-font-color np-button np-button-big">
|
||||
{% t .unregister %}
|
||||
</button>
|
||||
{% endif %}
|
||||
|
||||
<input type="hidden" name="_method" value="delete" />
|
||||
{% endif %}
|
||||
|
||||
{% if training_session.not_registered? %}
|
||||
<button type="submit" class="np-top-button np-button np-button-big">
|
||||
{% t .register %}
|
||||
</button>
|
||||
{% endif %}
|
||||
</form>
|
||||
{% endif %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,73 +0,0 @@
|
||||
{% 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>
|
||||
@ -1,127 +0,0 @@
|
||||
<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>
|
||||
@ -1,38 +0,0 @@
|
||||
{% 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>
|
||||
@ -1,26 +0,0 @@
|
||||
{% 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>
|
||||
@ -1,202 +0,0 @@
|
||||
<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>
|
||||
@ -1,18 +0,0 @@
|
||||
{% 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>
|
||||
@ -1,259 +0,0 @@
|
||||
<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>
|
||||
@ -1,193 +0,0 @@
|
||||
<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>
|
||||
@ -1,99 +0,0 @@
|
||||
{% 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>
|
||||
@ -1,120 +0,0 @@
|
||||
{% comment %}
|
||||
For this widget to work you must import Slick CSS and JS
|
||||
{% endcomment %}
|
||||
|
||||
<div class="np-dashboard-resources">
|
||||
<div class="np-card">
|
||||
<div class="np-card-container np-dashboard-border">
|
||||
{% if courses.enrolled.any? %}
|
||||
<div class="np-card-content-achievements">
|
||||
<div class="achievements-carousel">
|
||||
{% for course in courses.enrolled %}
|
||||
{% if course.progress == 100 %}
|
||||
<div>
|
||||
<div class="np-card-content-title col-12">
|
||||
{{ course.name }}
|
||||
</div>
|
||||
<div class="col-12 ">
|
||||
<img class="np-achievement-icon" src="{{ course.properties.course_badge }}" />
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
<a href="#" class="np-view-all-achievements">View All</a>
|
||||
{% else %}
|
||||
{% capture message %}
|
||||
{% t shared.zero_state.courses.index,
|
||||
key: current_school.course_vocabulary
|
||||
%}
|
||||
{% endcapture %}
|
||||
{% include "courses_zero_state", message: message %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
$('.achivements-carousel').slick({
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1,
|
||||
dots: false,
|
||||
infinite: true,
|
||||
autoplay: false,
|
||||
autoplaySpeed: 5000,
|
||||
cssEase: 'linear',
|
||||
prevArrow: '<i class="fal fa-chevron-left"></i>',
|
||||
nextArrow: '<i class="fal fa-chevron-right"></i>',
|
||||
responsive: [{
|
||||
breakpoint: 991,
|
||||
settings: {
|
||||
|
||||
dots: false
|
||||
}
|
||||
}]
|
||||
})
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.achievements-carousel{
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.np-card-content-achievements .np-card-content-title {
|
||||
font-size: 0.937rem;
|
||||
text-align:center;
|
||||
font-weight:500;
|
||||
}
|
||||
|
||||
.np-achievement-icon {
|
||||
color: #bec2c6;
|
||||
margin:14px auto 26px;
|
||||
width:130px;
|
||||
}
|
||||
|
||||
.np-card-content-achievements .slick-slider {
|
||||
width:100%;
|
||||
max-width: 375px;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.np-view-all-achievements {
|
||||
color:#2BB24C;
|
||||
font-size:0.75rem;
|
||||
text-transform:uppercase;
|
||||
text-align:center;
|
||||
text-decoration:none;
|
||||
margin-bottom:1.5rem;
|
||||
}
|
||||
|
||||
.np-card-content-achievements {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 2rem 2rem .5rem;
|
||||
}
|
||||
|
||||
.slick-arrow {
|
||||
color: rgba(255, 255, 255, 0.5);
|
||||
opacity: 0.5;
|
||||
font-size: 1.5rem;
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
top: 50%;
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
.slick-arrow.fa-chevron-left { left:0 }
|
||||
.slick-arrow.fa-chevron-right { right:0; }
|
||||
|
||||
@media (min-width:1024px) {
|
||||
.np-card-content-achievements .slick-slider {
|
||||
max-width: none;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -1,68 +0,0 @@
|
||||
{% 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 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-6 np-stretch-content" %}
|
||||
</div>
|
||||
|
||||
<div class="np-grid-spacing col-xs-12 col-sm-4">
|
||||
<div>
|
||||
<div class="np-dashboard-resources-title">My Points</div>
|
||||
<div class="np-card">
|
||||
<div class="np-card-container np-dashboard-border" style="text-align: center;">
|
||||
<h1 class="user-point-num" style="margin-bottom: 1rem;">{{ current_person.properties.learner_points }}</h1>
|
||||
<h3 class="user-point-label" style="margin-top: 1rem;">Points</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% assign courseCompletedCouter = 0 %}
|
||||
{% for course in courses.enrolled %}
|
||||
{% if course.progress == 100 %}
|
||||
{% assign courseCompletedCouter = courseCompletedCouter | plus: 1 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
<div class="achievements-box" style="{% if courseCompletedCouter > 0%}display: block !important;{% endif %}">
|
||||
<div class="np-dashboard-resources-title">Recent Achievements</div>
|
||||
{% include "widget_achievements" %}
|
||||
</div>
|
||||
|
||||
{% if features.training_events? %}
|
||||
<div>
|
||||
<div class="np-dashboard-resources-title">
|
||||
{% t .upcoming_events %}
|
||||
</div>
|
||||
{% include "training_events_dashboard" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.achievements-box{
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (max-width: 767px){
|
||||
.user-point-num{
|
||||
padding-top: 1rem;
|
||||
}
|
||||
|
||||
.user-point-label{
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,10 +0,0 @@
|
||||
<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 %}
|
||||
@ -1,6 +0,0 @@
|
||||
{% styles default %}
|
||||
{% styles colors %}
|
||||
{% styles custom %}
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300&display=swap');
|
||||
</style>
|
||||
@ -1,52 +0,0 @@
|
||||
{% 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" %}
|
||||
@ -1,20 +0,0 @@
|
||||
@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;
|
||||
}
|
||||
@ -1,69 +0,0 @@
|
||||
{% assign cat_name = "" %}
|
||||
{% assign cat_class = "" %}
|
||||
{% for category in course.categories limit: 1 %}
|
||||
{% unless category.name contains "Focus-" or category.name contains "Production Applications-" or category.name contains "Materials-" or category.name contains "Cleaning Methods-" %}
|
||||
{% assign cat_name = category.name %}
|
||||
{% assign cat_class = cat_name | replace: " ", "-" | downcase | replace: "&", "and" %}
|
||||
{% endunless % %}
|
||||
{% endfor %}
|
||||
|
||||
<div class="np-card course-card">
|
||||
|
||||
<div class="np-card-container">
|
||||
{% if course.ribbon %}
|
||||
<div class="np-card-ribbon">
|
||||
{{ course.ribbon }}
|
||||
</div>
|
||||
{% endif %}
|
||||
<div style="position: relative;">
|
||||
<div class="course-category {{cat_class}}">
|
||||
<span>{{ cat_name }}</span>
|
||||
</div>
|
||||
<div class="course-image-container">
|
||||
<img
|
||||
class="np-card-image"
|
||||
alt="{{ course.name }}"
|
||||
src="{{ course.image_url }}">
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ course.name }}
|
||||
</h3>
|
||||
{% unless course.instructor_names == "" %}
|
||||
<div class="np-card-content-subtitle">
|
||||
{{ course.instructor_names }}
|
||||
</div>
|
||||
{% endunless %}
|
||||
<div class="np-card-content-footer">
|
||||
<div class="np-card-content-progress np-button-color">
|
||||
{% if course.progress == 100 %}
|
||||
<i class="far fa-check-circle"></i>
|
||||
<span>completed</span>
|
||||
{% elsif course.progress > 0 and course.progress < 100 %}
|
||||
<i class="fas fa-spinner"></i>
|
||||
<span>{% t shared.progress, count: course.progress %}</span>
|
||||
{% else %}
|
||||
<i class="not-started-circle"></i>
|
||||
<span>{% t shared.progress, count: course.progress %}</span>
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
{% capture course_path %}
|
||||
{% route course, id: course.id %}{% endcapture %}
|
||||
{% if course.has_to_restart? %}
|
||||
{% include "course_version_outdated_popup", path: course_path %}
|
||||
{% endif %}
|
||||
<a class="np-button" href="{{ course_path }}">
|
||||
{% if course.progress > 0 and course.progress < 100 %}
|
||||
Continue
|
||||
{% elsif course.progress == 100 %}
|
||||
Retake
|
||||
{% else %}
|
||||
Start
|
||||
{% endif %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,84 +0,0 @@
|
||||
<div class="np-card np-no-horizontal-padding learning-path-card">
|
||||
<div class="np-card-container">
|
||||
<div class="np-learning-path">
|
||||
<div class="learning-path-image-container">
|
||||
<img
|
||||
alt="{{ learning_path.name }}"
|
||||
class="np-card-image np-learning-path-image"
|
||||
src="{{ learning_path.image_url }}"
|
||||
/>
|
||||
</div>
|
||||
<div class="np-card-text-wrapper">
|
||||
<div class="np-hidden-desktop np-card-header">
|
||||
<div class="np-card-header-type">{% t shared.learning_path.title %}</div>
|
||||
<div class="np-hidden-desktop np-card-header-items-count">
|
||||
{{ learning_path.items.count }} {% t .items %}
|
||||
</div>
|
||||
</div>
|
||||
{% comment %} <div class="np-hidden-mobile np-card-header">
|
||||
<div class="np-card-header-type">{% t shared.learning_path.title %}</div>
|
||||
</div> {% endcomment %}
|
||||
|
||||
<div class="np-card-content np-card-padding np-card-content-vertical">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ learning_path.name }}
|
||||
</h3>
|
||||
|
||||
<div class="np-card-content-subtitle">
|
||||
{{ learning_path.instructor_names }}
|
||||
</div>
|
||||
|
||||
{% comment %} <div class="np-hidden-mobile np-card-content-description">
|
||||
{{ learning_path.description }}
|
||||
</div> {% endcomment %}
|
||||
|
||||
<div class="np-hidden-mobile np-card-content-progress
|
||||
np-button-color">
|
||||
{% if learning_path.progress == 100 %}
|
||||
<i class="far fa-check-circle"></i> <span>completed</span>
|
||||
{% elsif learning_path.progress > 0 and learning_path.progress < 100 %}
|
||||
<i class="fas fa-spinner"></i> <span>{% t shared.progress, count: learning_path.progress %}</span>
|
||||
{% else %}
|
||||
<i class="not-started-circle"></i> <span>{% t shared.progress, count: learning_path.progress %}</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div class="np-hidden-mobile np-card-progress-bar-container">
|
||||
<div
|
||||
style="width: {{ learning_path.progress }}%; {% if learning_path.progress == 100 %}background-color: #16C466;{% endif %}"
|
||||
class="np-button-background-color np-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="np-card-content-footer">
|
||||
<div class="np-hidden-desktop np-card-content-progress
|
||||
np-button-color">
|
||||
{% if learning_path.progress == 100 %}
|
||||
<i class="far fa-check-circle"></i> <span>completed</span>
|
||||
{% elsif learning_path.progress > 0 and learning_path.progress < 100 %}
|
||||
<i class="fas fa-spinner"></i> <span>{% t shared.progress, count: learning_path.progress %}</span>
|
||||
{% else %}
|
||||
<i class="not-started-circle"></i> <span>{% t shared.progress, count: learning_path.progress %}</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
<a class="np-button" href="{% route learning_path, id: learning_path.id %}">
|
||||
{% if learning_path.progress > 0 and learning_path.progress < 100 %}
|
||||
Continue
|
||||
{% else %}
|
||||
{% t shared.view %}
|
||||
{% endif %}
|
||||
</a>
|
||||
<span class="np-hidden-mobile np-learning-path-items">
|
||||
<svg width="18" height="16" viewBox="0 0 18 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M0.84375 0.9375H2.53125C2.98828 0.9375 3.375 1.32422 3.375 1.78125V3.46875C3.375 3.96094 2.98828 4.3125 2.53125 4.3125V7.40625H4.5C4.5 6.94922 4.85156 6.5625 5.34375 6.5625H7.03125C7.48828 6.5625 7.875 6.94922 7.875 7.40625V9.09375C7.875 9.58594 7.48828 9.9375 7.03125 9.9375H5.34375C4.85156 9.9375 4.5 9.58594 4.5 9.09375H2.53125V12.75C2.53125 12.9258 2.63672 13.0312 2.8125 13.0312H4.5C4.5 12.5742 4.85156 12.1875 5.34375 12.1875H7.03125C7.48828 12.1875 7.875 12.5742 7.875 13.0312V14.7188C7.875 15.2109 7.48828 15.5625 7.03125 15.5625H5.34375C4.85156 15.5625 4.5 15.2109 4.5 14.7188H2.8125C1.72266 14.7188 0.84375 13.8398 0.84375 12.75V8.25V4.3125C0.351562 4.3125 0 3.96094 0 3.46875V1.78125C0 1.32422 0.351562 0.9375 0.84375 0.9375ZM5.625 2.625C5.625 2.16797 5.97656 1.78125 6.46875 1.78125H17.1562C17.6133 1.78125 18 2.16797 18 2.625C18 3.11719 17.6133 3.46875 17.1562 3.46875H6.46875C5.97656 3.46875 5.625 3.11719 5.625 2.625ZM10.125 8.25C10.125 7.79297 10.4766 7.40625 10.9688 7.40625H17.1562C17.6133 7.40625 18 7.79297 18 8.25C18 8.74219 17.6133 9.09375 17.1562 9.09375H10.9688C10.4766 9.09375 10.125 8.74219 10.125 8.25ZM10.125 13.875C10.125 13.418 10.4766 13.0312 10.9688 13.0312H17.1562C17.6133 13.0312 18 13.418 18 13.875C18 14.3672 17.6133 14.7188 17.1562 14.7188H10.9688C10.4766 14.7188 10.125 14.3672 10.125 13.875Z" fill="#185A7D"/>
|
||||
</svg>
|
||||
<span class="np-learning-path-items-count">
|
||||
{{ learning_path.items.count }} Courses
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,28 +0,0 @@
|
||||
<div class="np-card previous-event-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-footer">
|
||||
<div class="np-card-content-progress np-button-color">
|
||||
{{ course.properties.previous_event_date_and_time}}
|
||||
</div>
|
||||
{% capture course_path %}{% route course, id: course.id %}{% endcapture %}
|
||||
<a class="np-button" href="{{ course_path }}">
|
||||
Watch
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,42 +0,0 @@
|
||||
{% if courses.enrolled.any? %}
|
||||
<div class="row row-with-thumbnails">
|
||||
{% assign enrolled_courses_alphabetical = courses.enrolled | sort: "name" %}
|
||||
{% for course in enrolled_courses_alphabetical %}
|
||||
|
||||
{% assign course_progress = "" %}
|
||||
{% if course.progress == 100 %}
|
||||
{% assign course_progress = "completed" %}
|
||||
{% elsif course.progress < 100 and course.progress > 0 %}
|
||||
{% assign course_progress = "in-progress" %}
|
||||
{% else %}
|
||||
{% assign course_progress = "not-started" %}
|
||||
{% endif %}
|
||||
|
||||
{% assign cat_name = "" %}
|
||||
{% for category in course.categories limit: 1 %}
|
||||
{% assign cat_name = category.name %}
|
||||
{% endfor %}
|
||||
<div class="{{ class }}" data-progress="{{course_progress}}" data-category="{{cat_name}}">
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
{% capture message %}
|
||||
{% t shared.zero_state.courses.index,
|
||||
key: current_school.course_vocabulary
|
||||
%}
|
||||
{% endcapture %}
|
||||
{% include "courses_zero_state", message: message %}
|
||||
{% endif %}
|
||||
|
||||
<style>
|
||||
|
||||
@media (min-width:768px) {
|
||||
.np-card.course-card {
|
||||
padding: 0 0 100px;
|
||||
height:100%;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -1,108 +0,0 @@
|
||||
<footer class="np-footer">
|
||||
<div class="footer-container">
|
||||
<div class="footer-title">Brighton Science Service and Support</div>
|
||||
<a
|
||||
class="footer-item"
|
||||
href="https://customer.brighton-science.com/myinstruments"
|
||||
target="_blank">
|
||||
<span>
|
||||
Instrument Records and Support
|
||||
</span>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
height="1em"
|
||||
viewBox="0 0 512 512"><!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M320 0c-17.7 0-32 14.3-32 32s14.3 32 32 32h82.7L201.4 265.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L448 109.3V192c0 17.7 14.3 32 32 32s32-14.3 32-32V32c0-17.7-14.3-32-32-32H320zM80 32C35.8 32 0 67.8 0 112V432c0 44.2 35.8 80 80 80H400c44.2 0 80-35.8 80-80V320c0-17.7-14.3-32-32-32s-32 14.3-32 32V432c0 8.8-7.2 16-16 16H80c-8.8 0-16-7.2-16-16V112c0-8.8 7.2-16 16-16H192c17.7 0 32-14.3 32-32s-14.3-32-32-32H80z" /></svg>
|
||||
</a>
|
||||
<a
|
||||
class="footer-item"
|
||||
href="https://customer.brighton-science.com/knowledge"
|
||||
target="_blank">
|
||||
<span>
|
||||
Knowledge Base
|
||||
</span>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
height="1em"
|
||||
viewBox="0 0 512 512"><!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M320 0c-17.7 0-32 14.3-32 32s14.3 32 32 32h82.7L201.4 265.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L448 109.3V192c0 17.7 14.3 32 32 32s32-14.3 32-32V32c0-17.7-14.3-32-32-32H320zM80 32C35.8 32 0 67.8 0 112V432c0 44.2 35.8 80 80 80H400c44.2 0 80-35.8 80-80V320c0-17.7-14.3-32-32-32s-32 14.3-32 32V432c0 8.8-7.2 16-16 16H80c-8.8 0-16-7.2-16-16V112c0-8.8 7.2-16 16-16H192c17.7 0 32-14.3 32-32s-14.3-32-32-32H80z" /></svg>
|
||||
</a>
|
||||
<a
|
||||
class="footer-item"
|
||||
href="https://store.brighton-science.com"
|
||||
target="_blank">
|
||||
<span>
|
||||
Instrument Parts and Service
|
||||
</span>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
height="1em"
|
||||
viewBox="0 0 512 512"><!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M320 0c-17.7 0-32 14.3-32 32s14.3 32 32 32h82.7L201.4 265.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L448 109.3V192c0 17.7 14.3 32 32 32s32-14.3 32-32V32c0-17.7-14.3-32-32-32H320zM80 32C35.8 32 0 67.8 0 112V432c0 44.2 35.8 80 80 80H400c44.2 0 80-35.8 80-80V320c0-17.7-14.3-32-32-32s-32 14.3-32 32V432c0 8.8-7.2 16-16 16H80c-8.8 0-16-7.2-16-16V112c0-8.8 7.2-16 16-16H192c17.7 0 32-14.3 32-32s-14.3-32-32-32H80z" /></svg>
|
||||
</a>
|
||||
<a
|
||||
class="footer-item"
|
||||
href="https://app.brighton-science.com/experiments/list"
|
||||
target="_blank">
|
||||
<span>
|
||||
BConnect
|
||||
</span>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
height="1em"
|
||||
viewBox="0 0 512 512"><!--! Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M320 0c-17.7 0-32 14.3-32 32s14.3 32 32 32h82.7L201.4 265.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L448 109.3V192c0 17.7 14.3 32 32 32s32-14.3 32-32V32c0-17.7-14.3-32-32-32H320zM80 32C35.8 32 0 67.8 0 112V432c0 44.2 35.8 80 80 80H400c44.2 0 80-35.8 80-80V320c0-17.7-14.3-32-32-32s-32 14.3-32 32V432c0 8.8-7.2 16-16 16H80c-8.8 0-16-7.2-16-16V112c0-8.8 7.2-16 16-16H192c17.7 0 32-14.3 32-32s-14.3-32-32-32H80z" /></svg>
|
||||
</a>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<style>
|
||||
.np-footer {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: 100%;
|
||||
height: 373px;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.footer-container {
|
||||
width: 85%;
|
||||
border-top: 6px solid #185A7D;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.footer-title {
|
||||
color: #185A7D;
|
||||
font-family: Helvetica Neue;
|
||||
font-size: 34px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
margin-bottom: 16px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.footer-item {
|
||||
color: #0077B8;
|
||||
font-size: 19px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 49px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.footer-item:hover {
|
||||
color: #185A7D;
|
||||
}
|
||||
|
||||
.footer-item svg {
|
||||
margin-left: 10px;
|
||||
fill: #0077B8;
|
||||
}
|
||||
|
||||
.footer-item:hover svg {
|
||||
fill: #185A7D;
|
||||
}
|
||||
</style>
|
||||
@ -1,9 +0,0 @@
|
||||
{% 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=Heebo:wght@400;500;600;700;900&display=swap" rel="stylesheet">
|
||||
|
||||
<script src="https://code.jquery.com/jquery-3.7.0.min.js" integrity="sha256-2Pmvv0kuTBOenSvLm6bvfBSSHrUJ+3A7x6P5Ebd07/g=" crossorigin="anonymous"></script>
|
||||
@ -1,309 +0,0 @@
|
||||
<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 }}" />
|
||||
<div class="logo-text">Brighton Academy</div>
|
||||
</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 link in navigations.sub_navigation %}
|
||||
{% unless link.label == "Dashboard" %}
|
||||
<li class="np-header-desktop-nav-item">
|
||||
<a href="{% if link.label == 'Catalog' %}/app/courses{% else %}{{ link.url }}{% endif %}" class="np-header-desktop-nav-link np-header-font-color {{ link.active_class }}">
|
||||
{% if link.label == "Home" %}
|
||||
Dashboard
|
||||
{% elsif link.label == "Catalog" %}
|
||||
Courses
|
||||
{% elsif link.label == "Events" %}
|
||||
Upcoming Events
|
||||
{% else %}
|
||||
{{ link.label }}
|
||||
{% endif %}
|
||||
</a>
|
||||
</li>
|
||||
{% endunless %}
|
||||
{% endfor %}
|
||||
{% 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"
|
||||
type="text"
|
||||
name="q"
|
||||
placeholder="{% t .search %}" />
|
||||
<i class="np-header-search-icon far fa-search np-header-font-color"></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>
|
||||
<div>
|
||||
<span class="welcome-text">Welcome back,</span><br>
|
||||
<strong class="person-name-text">
|
||||
{% if current_person.first_name %}
|
||||
{{ current_person.first_name }}{% endif %}
|
||||
{% if current_person.last_name %}
|
||||
{{ current_person.last_name }}{% endif %}
|
||||
</strong>
|
||||
</div>
|
||||
<svg
|
||||
style="margin-left: 13px"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="18"
|
||||
height="9"
|
||||
viewBox="0 0 21 13"
|
||||
fill="none">
|
||||
<path
|
||||
d="M1.0376 1.23193L10.5188 10.7129L20 1.23193"
|
||||
stroke="#0077B8"
|
||||
stroke-width="2" />
|
||||
</svg>
|
||||
</button>
|
||||
<div class="np-header-avatar-tooltip np-hidden" role="tooltip">
|
||||
<div>
|
||||
<span class="welcome-text">Welcome back,</span><br>
|
||||
<strong class="person-name-text">
|
||||
{% if current_person.first_name %}
|
||||
{{ current_person.first_name }}{% endif %}
|
||||
{% if current_person.last_name %}
|
||||
{{ current_person.last_name }}{% endif %}
|
||||
</strong>
|
||||
</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" href="/app/profile">
|
||||
Your Profile
|
||||
</a>
|
||||
<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 %}
|
||||
</a>
|
||||
{% 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 link in navigations.sub_navigation %}
|
||||
<a href="{{ link.url }}" class="np-header-mobile-menu-content-button {{ link.active_class }}">
|
||||
{% if link.label == "Home" %}
|
||||
Dashboard
|
||||
{% elsif link.label == "Events" %}
|
||||
Upcoming Events
|
||||
{% else %}
|
||||
{{ link.label }}
|
||||
{% endif %}
|
||||
</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" href="/app/profile">
|
||||
Your Profile
|
||||
</a>
|
||||
<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 a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.np-header-logo img {
|
||||
border-right: 1px solid #707070;
|
||||
padding-right: 16px;
|
||||
}
|
||||
|
||||
.np-header-logo .logo-text {
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
letter-spacing: -0.4px;
|
||||
margin-left: 16px;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.np-sub-navigation-content-item-inactive {
|
||||
color: #0077B8;
|
||||
font-size: 20px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.np-sub-navigation-content-item-active {
|
||||
color: #185A7D!important;
|
||||
font-size: 20px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: normal;
|
||||
border-bottom: 1px solid #185A7D;
|
||||
}
|
||||
|
||||
.np-header {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
border-bottom: 1px solid #185A7D;
|
||||
padding: 0 4%;
|
||||
}
|
||||
|
||||
.np-header-avatar-button {
|
||||
text-align: left;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.np-header-avatar-button i {
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
.np-header-search-icon {
|
||||
color: #0077B8;
|
||||
font-size: 23px;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.welcome-text {
|
||||
color: #185A7D;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.person-name-text {
|
||||
color: #185A7D;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.np-header-avatar-tooltip {
|
||||
top: 0;
|
||||
width: 100%;
|
||||
border: 1px solid #F0F0F0;
|
||||
background: #fff;
|
||||
box-shadow: 2px 1px 1.5px 0 rgba(0, 0, 0, 0.16);
|
||||
}
|
||||
|
||||
.np-header-avatar-tooltip > div {
|
||||
padding-left: 20px;
|
||||
padding-top: 10px
|
||||
}
|
||||
|
||||
.np-header-avatar-tooltip-navigation-link {
|
||||
color: #0077B8;
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
line-height: 46px;
|
||||
}
|
||||
|
||||
@media(min-width:768px) {
|
||||
.np-header {
|
||||
height: 120px;
|
||||
}
|
||||
|
||||
.np-header-logo .logo-text {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,31 +0,0 @@
|
||||
<div class="progress-activity-section-container">
|
||||
<div class="np-main np-dashboard np-subpage-container np-max-width progress-activity-section">
|
||||
<div class="row">
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
<div class="dashboard-title">YOUR PROGRESS</div>
|
||||
{% include "section_progress_widget" %}
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
{% include "section_recent_activity", enrolled_courses: enrolled_courses, enrolled_learning_paths: enrolled_learning_paths %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.progress-activity-section-container {
|
||||
margin-bottom: 6px;
|
||||
box-shadow: 0px 3px 2.5px 0px rgba(0, 0, 0, 0.42);
|
||||
}
|
||||
|
||||
.progress-activity-section-container,
|
||||
.progress-activity-section {
|
||||
background-color: #f7fbfe;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.progress-activity-section {
|
||||
padding: 42px 60px 54px 60px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,29 +0,0 @@
|
||||
<div class="np-learning-paths-resources row">
|
||||
{% if learning_paths.available.any? %}
|
||||
{% for learning_path in items %}
|
||||
|
||||
{% assign learning_path_progress = "" %}
|
||||
{% if learning_path.progress == 100 %}
|
||||
{% assign learning_path_progress = "completed" %}
|
||||
{% elsif learning_path.progress < 100 and learning_path.progress > 0 %}
|
||||
{% assign learning_path_progress = "in-progress" %}
|
||||
{% endif %}
|
||||
|
||||
{% assign cat_name = "" %}
|
||||
{% for category in learning_path.categories limit: 1 %}
|
||||
{% assign cat_name = category.name %}
|
||||
{% endfor %}
|
||||
|
||||
<div class="col-xs-12 col-md-6 lp-column" data-progress="{{learning_path_progress}}" data-category="{{cat_name}}">
|
||||
{% include "cards_learning_path" with learning_path %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
<div class="np-learning-paths-resources-container">
|
||||
<div class="np-zero-state-text">
|
||||
{% t .empty %}
|
||||
</div>
|
||||
<img class="np-zero-state-learning-paths" alt="{% t .empty %}" />
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
@ -1,41 +0,0 @@
|
||||
{% assign radius = 93 %}
|
||||
{% assign pi = 3.14159 %}
|
||||
{% assign circumference = radius | times: 2 | times: pi %}
|
||||
{% assign progress = count | times: 1.0 | divided_by: total %}
|
||||
{% assign offset = 1 | minus: progress | times: circumference %}
|
||||
|
||||
{% assign circle_background_color = '#e5e9eb' %}
|
||||
{% assign progress_number_color = '#1b3e4f' %}
|
||||
|
||||
<div class="progress-circle-wrapper">
|
||||
<svg
|
||||
class="progress-circle"
|
||||
width="212"
|
||||
height="212">
|
||||
<circle
|
||||
class="circle circle-bg"
|
||||
stroke="#6FCFEB"
|
||||
stroke-width="17"
|
||||
fill="transparent"
|
||||
r="{{ radius }}"
|
||||
cx="106"
|
||||
cy="106"
|
||||
/>
|
||||
<circle
|
||||
class="circle"
|
||||
stroke="#185A7D"
|
||||
stroke-width="17"
|
||||
fill="transparent"
|
||||
r="{{ radius }}"
|
||||
cx="106"
|
||||
cy="106"
|
||||
stroke-dasharray="{{ circumference }} {{ circumference }}"
|
||||
stroke-dashoffset="{{ offset }}"
|
||||
style='transform: rotate(-90deg);transform-origin: 50% 50%;'
|
||||
/>
|
||||
<text class='dt' x="50%" y="60%" text-anchor="middle" stroke="t#fff" stroke-width="1px" fill="{{ progress_number_color }}" dy=".3em">
|
||||
<tspan x="50%" dy="0em" class="progress-circle-big-text">{{count}}</tspan>
|
||||
<tspan x="50%" dy="1.4em" class="progress-circle-text">of {{ total }}</tspan>
|
||||
</text>
|
||||
</svg>
|
||||
</div>
|
||||
@ -1,168 +0,0 @@
|
||||
<div class="row lps-row">
|
||||
{% assign displayed_learning_paths_count = 0 %}
|
||||
<div class="col-xs-12">
|
||||
<div class="flex-wrapper">
|
||||
<div class="dashboard-title">LEARNING PATHS: NEW AND IN PROGRESS</div>
|
||||
<div class="learning-paths-link">
|
||||
<a href="/app/learning_paths?category=completed">View completed Learning Paths</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% if learning_paths.enrolled.any? %}
|
||||
{% assign learning_paths_by_progress = learning_paths.enrolled | sort: "progress" | reverse %}
|
||||
{% assign learning_paths_index = 1 %}
|
||||
|
||||
{% for learning_path in learning_paths_by_progress %}
|
||||
{% if learning_path.progress < 100 and learning_paths_index < 3 %}
|
||||
{% include "cards_learning_path" with learning_path %}
|
||||
{% assign learning_paths_index = learning_paths_index | plus: 1 %}
|
||||
{% assign displayed_learning_paths_count = displayed_learning_paths_count | plus: 1 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
{% if displayed_learning_paths_count == 0 %}
|
||||
<div class="learning-paths-completed-card np-card">
|
||||
<div>
|
||||
<div class="flex-wrapper">
|
||||
<div class="completion-icon">
|
||||
<svg
|
||||
width="102"
|
||||
height="103"
|
||||
viewBox="0 0 102 103"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M48.4102 68.4844C46.2188 70.6758 42.832 70.6758 40.6406 68.4844L27.8906 55.7344C25.6992 53.543 25.6992 50.1562 27.8906 47.9648C30.082 45.7734 33.4688 45.7734 35.6602 47.9648L44.625 56.7305L66.1406 35.2148C68.332 33.0234 71.7188 33.0234 73.9102 35.2148C76.1016 37.4062 76.1016 40.793 73.9102 42.9844L48.4102 68.4844ZM102 51.75C102 80.0391 79.0898 102.75 51 102.75C22.7109 102.75 0 80.0391 0 51.75C0 23.6602 22.7109 0.75 51 0.75C79.0898 0.75 102 23.6602 102 51.75ZM51 10.3125C28.0898 10.3125 9.5625 29.0391 9.5625 51.75C9.5625 74.6602 28.0898 93.1875 51 93.1875C73.7109 93.1875 92.4375 74.6602 92.4375 51.75C92.4375 29.0391 73.7109 10.3125 51 10.3125Z" fill="#16C466" />
|
||||
</svg>
|
||||
</div>
|
||||
<div>
|
||||
<div class='completion-title-message'>Congratulations, you've completed all your assigned Learning Paths!</div>
|
||||
<div class="completion-subtitle-message">When new learning paths become available we'll send an email announcing it and they'll always appear here.<br>For now you can
|
||||
<a href="/app/courses">browse your courses</a>,
|
||||
<a href="/app/courses">watch previous events</a>, and sign-up for any
|
||||
<a href="/app/training_events">upcoming events</a>.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.learning-paths-link {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<div class="np-learning-paths-resources-container">
|
||||
<div class="np-zero-state-text">
|
||||
{% t.empty %}
|
||||
</div>
|
||||
<img class="np-zero-state-learning-paths" alt="{% t .empty %}" />
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.completion-title-message {
|
||||
color: #000;
|
||||
font-size: 22px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: normal;
|
||||
margin-bottom: 10px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.completion-subtitle-message a {
|
||||
color: #0077B8;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
|
||||
.completion-subtitle-message {
|
||||
color: #000;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.completion-icon {
|
||||
margin-right: 14px;
|
||||
}
|
||||
|
||||
.learning-paths-link {
|
||||
margin-bottom: 32px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.learning-paths-link a {
|
||||
color: #0077B8;
|
||||
font-size: 15px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
|
||||
.learning-paths-link a:hover {
|
||||
color: #185A7D;
|
||||
}
|
||||
|
||||
.learning-path-card.np-card {
|
||||
height: unset;
|
||||
min-height: unset;
|
||||
}
|
||||
|
||||
.learning-paths-completed-card.np-card {
|
||||
padding: 0 !important;
|
||||
margin-bottom: 150px !important;
|
||||
}
|
||||
|
||||
.learning-paths-completed-card .np-card-container {
|
||||
padding: 32px 16px;
|
||||
}
|
||||
|
||||
.learning-paths-completed-card .learning-paths-completed-heading {
|
||||
font-size: 22px;
|
||||
font-weight: 500;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
@media(min-width:768px) {
|
||||
|
||||
.lps-row .flex-wrapper {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lps-row .learning-paths-link {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.learning-paths-completed-card .flex-wrapper {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.learning-paths-completed-card .np-card-container {
|
||||
padding: 32px;
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
// hide title and link if no laernings paths to display
|
||||
$(document).ready(function() {
|
||||
const displayedLps = {{displayed_learning_paths_count}}
|
||||
|
||||
if (displayedLps == 0) {
|
||||
$(".lps-row .dashboard-title").hide()
|
||||
$(".learning-paths-link").hide()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
@ -1,67 +0,0 @@
|
||||
<div class="previous-events">
|
||||
<div class="dashboard-title">WATCH PREVIOUS EVENTS</div>
|
||||
<div class="previous-events-widget">
|
||||
<div class="row">
|
||||
{% assign index = 0 %}
|
||||
|
||||
{% for course in enrolled_courses %}
|
||||
{% assign is_event_course = false %}
|
||||
{% for cat in course.categories %}
|
||||
{% assign cat_name = cat.name | downcase %}
|
||||
{% if cat_name contains "webinars" or cat_name contains "events" %}
|
||||
{% assign is_event_course = true %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% if course.properties.previous_event_display_on_dashboard and index < 2 and is_event_course %}
|
||||
<div class="col-xs-12 col-sm-6 previous-event" data-date="{{course.properties.course_publish_date}}">
|
||||
{% include "cards_previous_event" with course %}
|
||||
</div>
|
||||
{% assign index = index | plus: 1 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var eventIndexes = document.querySelectorAll(".previous-event:not([data-date=''])");
|
||||
var eventIndexesArray = Array.from(eventIndexes);
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.previous-event-card .np-card-content-title {
|
||||
color: #0077B8;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
margin-top:0;
|
||||
}
|
||||
|
||||
.previous-event-card .np-button {
|
||||
background-color: #0077B8;
|
||||
color: #FFF;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.previous-event-card .np-card-container:hover .np-card-content-title {
|
||||
color: #185A7D;
|
||||
}
|
||||
|
||||
.previous-event-card .np-card-container:hover .np-button {
|
||||
background-color: #185A7D;;
|
||||
}
|
||||
|
||||
.previous-event-card .course-image-container {
|
||||
width: auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.previous-event-card .np-card-container:hover .np-card-image {
|
||||
scale: 1.25;
|
||||
transition: .5s ease all;
|
||||
}
|
||||
</style>
|
||||
@ -1,121 +0,0 @@
|
||||
<div class="progress-widget">
|
||||
<div class="progress-widget-flex-wrapper">
|
||||
<div class="progress-item courses-progress">
|
||||
{% assign completed_courses_count = 0 %}
|
||||
{% for course in courses.enrolled %}
|
||||
{% if course.progress == 100 %}
|
||||
{% assign completed_courses_count = completed_courses_count | plus: 1 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
<div class="progress-header">Courses Completed</div>
|
||||
<a href="/app/courses?category=not-started" class="progress-link">View Courses not started</a>
|
||||
{%
|
||||
include "progress_circle",
|
||||
count: completed_courses_count,
|
||||
total: courses.enrolled.size %}
|
||||
</div>
|
||||
<div class="progress-item courses-progress">
|
||||
{% assign completed_lps_count = 0 %}
|
||||
{% for learning_path in learning_paths.enrolled %}
|
||||
{% if learning_path.progress == 100 %}
|
||||
{% assign completed_lps_count = completed_lps_count | plus: 1 %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
<div class="progress-header">Learning Paths Completed</div>
|
||||
<a href="/app/learning_paths?category=completed" class="progress-link">View all Learning Paths</a>
|
||||
{%
|
||||
include "progress_circle",
|
||||
count: completed_lps_count,
|
||||
total: learning_paths.enrolled.size %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
|
||||
.progress-widget {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
.progress-widget .progress-item {
|
||||
width: 100%;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
.progress-widget .progress-header {
|
||||
color: #000;
|
||||
font-size: 20px;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.progress-circle-wrapper {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.progress-circle-wrapper:before {
|
||||
content: "";
|
||||
background-color: #fff;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
width: 195px;
|
||||
height: 195px;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.progress-circle {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.progress-widget .progress-link {
|
||||
color: #0077B8;
|
||||
text-decoration: none;
|
||||
font-size: 15px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
margin-bottom: 16px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.progress-widget .progress-link:hover {
|
||||
color: #185A7D;
|
||||
}
|
||||
|
||||
.progress-circle-big-text {
|
||||
color: #002745;
|
||||
font-size: 80px;
|
||||
font-weight: 600;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.progress-circle-text {
|
||||
color: #000;
|
||||
text-align: center;
|
||||
font-size: 23px;
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
@media(min-width:500px) {
|
||||
.progress-widget .progress-widget-flex-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.progress-widget .progress-item {
|
||||
width: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
@media(min-width: 1200px) {
|
||||
.progress-widget .progress-widget-flex-wrapper {
|
||||
flex-direction: row;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,138 +0,0 @@
|
||||
{% assign courses_by_progress = enrolled_courses | sort: "progress" %}
|
||||
{% assign learning_paths_by_progress = enrolled_learning_paths | sort: "progress" %}
|
||||
|
||||
<div class="dashboard-title">RECENT ACTIVITY</div>
|
||||
<div class="recent-activity-widget">
|
||||
<table class="recent-activity-table" id='recentActivityTable'>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Status</th>
|
||||
</tr>
|
||||
{% for course in courses_by_progress %}
|
||||
{% if course.progress > 0 %}
|
||||
<tr data-progress="{{course.progress}}">
|
||||
<td width="70%" class="name-element"><a href="{% route course, id: course.id %}">{{course.name}}</a></td>
|
||||
<td width="30%" class="progress-element">
|
||||
<div>
|
||||
{% if course.progress == 100 %}
|
||||
<i class="far fa-check-circle"></i> <span>completed</span>
|
||||
{% else %}
|
||||
<i class="fas fa-spinner"></i> <span>in progress</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% for learning_path in learning_paths_by_progress %}
|
||||
{% if learning_path.progress > 0 %}
|
||||
<tr data-progress="{{learning_path.progress}}">
|
||||
<td width="70%"><a class="name-element" href="{% route learning_path, id: learning_path.id %}">{{learning_path.name}}</a></td>
|
||||
<td width="30%" class="progress-element">
|
||||
<div>
|
||||
{% if learning_path.progress == 100 %}
|
||||
<i class="far fa-check-circle"></i> <span>completed</span>
|
||||
{% else %}
|
||||
<i class="fas fa-spinner"></i> <span>in progress</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.progress-element div {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.progress-element span {
|
||||
margin-left: 9px;
|
||||
color: #000;
|
||||
text-align: right;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.recent-activity-table th {
|
||||
color: #FFF;
|
||||
font-size: 15px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
text-align: left;
|
||||
padding: 6px 0 6px 12px;
|
||||
}
|
||||
|
||||
.recent-activity-widget {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
.recent-activity-widget table {
|
||||
border-collapse: collapse;
|
||||
width: 100%;
|
||||
box-shadow: 0px 3px 2.5px 0px rgba(0, 0, 0, 0.42);
|
||||
background-color:#fff;
|
||||
border-bottom: 2px solid #185A7D;
|
||||
}
|
||||
|
||||
.progress-element {
|
||||
border-left: none !important;
|
||||
}
|
||||
|
||||
.name-element {
|
||||
border-right: none !important;
|
||||
}
|
||||
|
||||
.recent-activity-widget td {
|
||||
border: 1px solid #dddddd;
|
||||
text-align: left;
|
||||
padding: 12px;
|
||||
border-bottom: 1px solid #185A7D;
|
||||
}
|
||||
|
||||
.recent-activity-widget th {
|
||||
color:#fff;
|
||||
border-color: #185A7D;
|
||||
background-color: #185A7D;
|
||||
}
|
||||
|
||||
.name-element a,
|
||||
.name-element a:visited {
|
||||
color: #0077B8;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
|
||||
.name-element a:hover {
|
||||
color: #185A7D;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
|
||||
const table = document.getElementById('recentActivityTable');
|
||||
const tbody = table.querySelector('tbody'); // Select the tbody element
|
||||
const rows = Array.from(tbody.querySelectorAll('tr'));
|
||||
|
||||
const sortedRows = rows
|
||||
.map(row => ({ progress: parseInt(row.getAttribute('data-progress')), element: row }))
|
||||
.sort((a, b) => a.progress - b.progress);
|
||||
|
||||
rows.forEach(row => tbody.removeChild(row));
|
||||
|
||||
sortedRows.forEach((sortedRow, index) => {
|
||||
if (index < 6) {
|
||||
tbody.appendChild(sortedRow.element)
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
@ -1,77 +0,0 @@
|
||||
<div class="row recent-courses-row">
|
||||
<div class="col-xs-12">
|
||||
<div class="recent-courses-flex-wrapper">
|
||||
<div>
|
||||
<div class="dashboard-title">COURSES: RECENTLY ADDED</div>
|
||||
<div class="dashboard-subtitle">See what's new from Brighton Science</div>
|
||||
</div>
|
||||
<div class="recent-courses-link">
|
||||
<a href="/app/courses" class="recent-courses-link">View all Courses</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-12">
|
||||
<div class="row recent-courses-list">
|
||||
{% for course in enrolled_courses %}
|
||||
{% unless course.properties.course_publish_date == "MM/DD/YYYY" %}
|
||||
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-3 recent-course np-hidden" data-date="{{course.properties.course_publish_date}}">
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endunless %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var indexes = document.querySelectorAll(".recent-course:not([data-date=''])");
|
||||
var indexesArray = Array.from(indexes);
|
||||
|
||||
const sortByDate = arr => {
|
||||
const dateSorter = (a, b) => {
|
||||
return new Date(b.dataset.date).getTime() - new Date(a.dataset.date).getTime();
|
||||
}
|
||||
arr.sort(dateSorter);
|
||||
};
|
||||
|
||||
sortByDate(indexesArray);
|
||||
|
||||
$(".recent-courses-list").empty()
|
||||
|
||||
for (let i = 0; i < indexesArray.length; i++) {
|
||||
if (i < 4) {
|
||||
document.querySelector(".recent-courses-list").appendChild(indexesArray[i])
|
||||
}
|
||||
}
|
||||
|
||||
$(".recent-course").removeClass("np-hidden")
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.recent-courses-flex-wrapper {
|
||||
margin:32px 0;
|
||||
}
|
||||
|
||||
.recent-courses.link {
|
||||
margin-bottom: 32px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.recent-courses-flex-wrapper .dashboard-title {
|
||||
margin-bottom:4px;
|
||||
}
|
||||
|
||||
@media (min-width:768px) {
|
||||
.recent-courses-flex-wrapper {
|
||||
display:flex;
|
||||
justify-content:space-between;
|
||||
align-items:flex-end;
|
||||
margin:64px 0 32px ;
|
||||
}
|
||||
|
||||
.recent-courses-row .np-card {
|
||||
padding: 0 0 32px;
|
||||
height:100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,206 +0,0 @@
|
||||
<div class="row recommended-courses-row">
|
||||
<div class="col-xs-12">
|
||||
<div class="recommended-courses-flex-wrapper">
|
||||
<div>
|
||||
<div class="dashboard-title">COURSES: RECOMMENDED</div>
|
||||
<div class="dashboard-subtitle">Personalized list of courses just for you</div>
|
||||
</div>
|
||||
<div style="display: flex; align-items: row;">
|
||||
<div class="recommended-courses-container">
|
||||
<strong>Why am I seeing these?</strong>
|
||||
<a href="/app/profile" class="recommended-courses-link">Review and update your interest profile</a>
|
||||
</div>
|
||||
|
||||
<div class="recent-courses-link view-all-courses">
|
||||
<a href="/app/courses" class="recent-courses-link">View all Courses</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-xs-12">
|
||||
<div class="row" id="recommended-courses-row">
|
||||
{% assign focus_groups = "" %}
|
||||
{% assign materials_groups = "" %}
|
||||
{% assign cleaning_method_groups = "" %}
|
||||
{% assign production_application_groups = "" %}
|
||||
{% for group in current_person.groups %}
|
||||
{% if group.name contains "Focus" %}
|
||||
{% assign focus_groups = focus_groups | append: "," | append: group.name %}
|
||||
{% endif %}
|
||||
|
||||
{% if group.name contains "Materials" %}
|
||||
{% assign materials_groups = materials_groups | append: "," | append: group.name %}
|
||||
{% endif %}
|
||||
|
||||
{% if group.name contains "Production Application" %}
|
||||
{% assign production_application_groups = production_application_groups | append: "," | append: group.name %}
|
||||
{% endif %}
|
||||
|
||||
{% if group.name contains "Cleaning Method" %}
|
||||
{% assign cleaning_method_groups = cleaning_method_groups | append: "," | append: group.name %}
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
|
||||
<div class="col-xs-12 np-hidden" id="recommended-courses-zero-state">
|
||||
{% capture message %}
|
||||
Update your interest profile to gain recommended content
|
||||
{% endcapture %}
|
||||
{% include "courses_zero_state", message: message %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="unfilteredRecommendedCourses" style="display:none">
|
||||
{% for course in enrolled_courses %}
|
||||
{% if course.progress < 100 %}
|
||||
{% assign course_categories_list = "" %}
|
||||
{% for category in course.categories %}
|
||||
{% assign course_categories_list = course_categories_list | append: category.name | append: "," %}
|
||||
{% endfor %}
|
||||
<div
|
||||
class="recommended-course"
|
||||
data-categories="{{course_categories_list}}"
|
||||
data-id="{{course.id}}">
|
||||
{% include "cards_course" with course %}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
$("document").ready(function() {
|
||||
const allCourses = $(".recommended-course")
|
||||
const focusGroups = "{{focus_groups}}"
|
||||
const productionApplicationGroups = "{{production_application_groups}}"
|
||||
const materialsGroups = "{{materials_groups}}"
|
||||
const cleaningMethodGroups = "{{cleaning_method_groups}}"
|
||||
|
||||
const focusGroupsArray = focusGroups.split(",").filter(item => item !== "");
|
||||
const productionApplicationGroupsArray = productionApplicationGroups.split(",").filter(item => item !== "");
|
||||
const materialsGroupsArray = materialsGroups.split(",").filter(item => item !== "");
|
||||
const cleaningMethodGroupsArray = cleaningMethodGroups.split(",").filter(item => item !== "");
|
||||
|
||||
let focusCourses = []
|
||||
let productionApplicationsCourses = []
|
||||
let materialsCourses = []
|
||||
let cleaningMethodCourses = []
|
||||
|
||||
$(allCourses).each((index, course) => {
|
||||
if (course.getAttribute("data-categories").includes("Focus-")) {
|
||||
const categories = course.getAttribute("data-categories").split(",")
|
||||
const focusCategories = categories.filter(category => category.includes('Focus-'));
|
||||
if (focusGroups.includes(focusCategories[0])) {
|
||||
focusCourses.push(course)
|
||||
}
|
||||
}
|
||||
|
||||
if (course.getAttribute("data-categories").includes("Production Applications-")) {
|
||||
const categories = course.getAttribute("data-categories").split(",")
|
||||
const productionApplicationsCategories = categories.filter(category => category.includes('Production Applications-'));
|
||||
if (productionApplicationGroups.includes(productionApplicationsCategories[0])) {
|
||||
productionApplicationsCourses.push(course)
|
||||
}
|
||||
}
|
||||
|
||||
if (course.getAttribute("data-categories").includes("Materials-")) {
|
||||
const categories = course.getAttribute("data-categories").split(",")
|
||||
const materialsCategories = categories.filter(category => category.includes('Materials-'));
|
||||
if (materialsGroups.includes(materialsCategories[0])) {
|
||||
materialsCourses.push(course)
|
||||
}
|
||||
}
|
||||
|
||||
if (course.getAttribute("data-categories").includes("Cleaning Method-")) {
|
||||
const categories = course.getAttribute("data-categories").split(",")
|
||||
const cleaningMethodCategories = categories.filter(category => category.includes('Cleaning Method-'));
|
||||
if (cleaningMethodGroups.includes(cleaningMethodCategories[0])) {
|
||||
cleaningMethodCourses.push(course)
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
console.log("Focus Courses: ", focusCourses)
|
||||
let coursesToAppend = [];
|
||||
|
||||
for (let i = 0; i < 3; i++) {
|
||||
if (productionApplicationsCourses.length > 0) {
|
||||
coursesToAppend.push(productionApplicationsCourses.shift());
|
||||
} else if (materialsCourses.length > 0) {
|
||||
coursesToAppend.push(materialsCourses.shift());
|
||||
} else if (cleaningMethodCourses.length > 0) {
|
||||
coursesToAppend.push(cleaningMethodCourses.shift());
|
||||
} else if (focusCourses.length > 0) {
|
||||
coursesToAppend.push(focusCourses.shift());
|
||||
} else {
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
console.log("Recommended Courses to Append: ", coursesToAppend)
|
||||
if (coursesToAppend.length > 0) {
|
||||
|
||||
for (let i = 0; i < coursesToAppend.length; i++) {
|
||||
console.log(coursesToAppend[i].innerHTML)
|
||||
$("#recommended-courses-row").append(`<div class="col-xs-12 col-sm-6 col-md-4">${
|
||||
coursesToAppend[i].innerHTML
|
||||
}</div>`)
|
||||
}
|
||||
} else {
|
||||
$("#recommended-courses-zero-state").removeClass("np-hidden")
|
||||
}
|
||||
|
||||
})
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
.recommended-courses-row {
|
||||
margin-bottom: 32px;
|
||||
margin-top: 86px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.recommended-courses-flex-wrapper {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
.recommended-courses.link {
|
||||
margin-bottom: 32px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.recommended-courses-flex-wrapper .dashboard-title {
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.recommended-courses-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.view-all-courses {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
margin-left: 100px;
|
||||
}
|
||||
|
||||
.recommended-courses-flex-wrapper strong {
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
@media(min-width:768px) {
|
||||
.recommended-courses-flex-wrapper {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.recommended-courses-row .np-card {
|
||||
padding: 0 0 32px;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,13 +0,0 @@
|
||||
{% comment %} <nav class="np-sub-navigation">
|
||||
<div class="np-sub-navigation-content">
|
||||
{% for link in navigations.sub_navigation %}
|
||||
<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>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</nav> {% endcomment %}
|
||||
@ -1,198 +0,0 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.enrolled %}
|
||||
{% include "sub_navigation" %}
|
||||
<main class="np-main np-courses np-subpage-container np-max-width">
|
||||
<div class="row row-with-thumbnails">
|
||||
<div class="col-xs-12">
|
||||
<div class="filters-container courses-filters">
|
||||
<div class="filters-heading">APPLY FILTERS<i class="fa fa-chevron-down"></i>
|
||||
</div>
|
||||
<div class="filters-content">
|
||||
<div class="filter-column status-column">
|
||||
<div class="filter-column-title">STATUS</div>
|
||||
<div class="filters-list">
|
||||
<div class="filter-item status-filter">
|
||||
<input
|
||||
type="checkbox"
|
||||
name="completed"
|
||||
value="completed">
|
||||
<label for="completed">Completed
|
||||
<span></span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="filter-item status-filter">
|
||||
<input
|
||||
type="checkbox"
|
||||
name="in-progress"
|
||||
value="in-progress">
|
||||
<label for="in-progress">In Progress
|
||||
<span></span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="filter-item status-filter">
|
||||
<input
|
||||
type="checkbox"
|
||||
name="in-progress"
|
||||
value="not-started">
|
||||
<label for="not-started">Not Started
|
||||
<span></span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filter-column categories-column">
|
||||
<div class="filter-column-title">CATEGORY</div>
|
||||
<div class="filters-list">
|
||||
{% for category in categories.enrolled %}
|
||||
<script>
|
||||
console.log("{{category.name}}")
|
||||
</script>
|
||||
<div class="filter-item category-filter">
|
||||
<input
|
||||
type="checkbox"
|
||||
name="{{category.name}}"
|
||||
value="{{category.name}}">
|
||||
<label for="{{category.name}}">{{ category.name }}
|
||||
<span></span>
|
||||
</label>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{% include "courses_index", class: "col-xs-12 col-sm-6 col-md-4 col-lg-3 course-column" %}
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<script>
|
||||
window.onload = () => {
|
||||
let url = new URL(window.location.href);
|
||||
let params = new URLSearchParams(url.search);
|
||||
if (params.has('category')) {
|
||||
let allParams = params.getAll('category')
|
||||
allParams.forEach((param) => {
|
||||
document.querySelector(`.filter-item input[value='${param}']`).click()
|
||||
})
|
||||
}
|
||||
|
||||
addCountToFilters()
|
||||
addActiveNavigationClass()
|
||||
|
||||
}
|
||||
|
||||
$("input[type='checkbox']").change(function(e) {
|
||||
filterCourses()
|
||||
})
|
||||
|
||||
$("document").ready(function() {
|
||||
|
||||
document
|
||||
.querySelector(".filters-heading")
|
||||
.addEventListener("click", function() {
|
||||
this.classList.toggle("active");
|
||||
var panel = this.nextElementSibling;
|
||||
if (panel.style.maxHeight) {
|
||||
panel.style.maxHeight = null;
|
||||
} else {
|
||||
panel.style.maxHeight = panel.scrollHeight + 32 + "px";
|
||||
}
|
||||
})
|
||||
|
||||
document
|
||||
.querySelector(".filters-heading")
|
||||
.click()
|
||||
})
|
||||
|
||||
|
||||
function filterCourses() {
|
||||
|
||||
// hide all courses
|
||||
$(".course-column").hide()
|
||||
|
||||
// get all checked filters
|
||||
let selectedStatusFilters = []
|
||||
let selectedCategoryFilters = []
|
||||
|
||||
$(".status-column input[type='checkbox']:checked").each((index, filter) => {
|
||||
selectedStatusFilters.push(filter.value)
|
||||
})
|
||||
|
||||
$(".categories-column input[type='checkbox']:checked").each((index, filter) => {
|
||||
selectedCategoryFilters.push(filter.value)
|
||||
})
|
||||
|
||||
// loop over courses and get filters
|
||||
$(".course-column").each((index, course) => {
|
||||
const courseStatus = $(course).data("progress")
|
||||
const courseCategory = $(course).data("category")
|
||||
|
||||
if (selectedStatusFilters.length && selectedCategoryFilters.length) {
|
||||
if ($.inArray(courseCategory, selectedCategoryFilters) !== -1 && $.inArray(courseStatus, selectedStatusFilters) !== -1) {
|
||||
$(course).show()
|
||||
}
|
||||
} else if (! selectedStatusFilters.length && selectedCategoryFilters.length) {
|
||||
if ($.inArray(courseCategory, selectedCategoryFilters) !== -1) {
|
||||
$(course).show()
|
||||
}
|
||||
} else if (selectedStatusFilters.length && ! selectedCategoryFilters.length) {
|
||||
if ($.inArray(courseStatus, selectedStatusFilters) !== -1) {
|
||||
$(course).show()
|
||||
}
|
||||
} else {
|
||||
$(course).show()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function addCountToFilters() {
|
||||
const allFiltersFromCourses = []
|
||||
|
||||
$(".course-column").each((index, course) => {
|
||||
if ($(course).attr("data-progress")) {
|
||||
allFiltersFromCourses.push($(course).attr("data-progress"))
|
||||
}
|
||||
|
||||
if ($(course).attr("data-category")) {
|
||||
allFiltersFromCourses.push($(course).attr("data-category"))
|
||||
}
|
||||
})
|
||||
|
||||
$(".filter-item").each((index, filter) => {
|
||||
const filterValue = $(filter).find("input").val()
|
||||
const filterCount = getFilterCount(filterValue, allFiltersFromCourses)
|
||||
|
||||
if ($(filter).hasClass("category-filter")) {
|
||||
if (filterCount == 0) {
|
||||
$(filter).hide()
|
||||
} else {
|
||||
$(filter).find("label > span").text(`(${filterCount})`)
|
||||
}
|
||||
} else {
|
||||
$(filter).find("label > span").text(`(${filterCount})`)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const getFilterCount = (value, array) => {
|
||||
let count = 0;
|
||||
|
||||
array.forEach(filter => {
|
||||
if (filter == value) {
|
||||
count++;
|
||||
}
|
||||
});
|
||||
|
||||
return count
|
||||
}
|
||||
|
||||
function addActiveNavigationClass() {
|
||||
$('a[href="/app/courses"]').addClass("np-sub-navigation-content-item-active").removeClass("np-sub-navigation-content-item-inactive")
|
||||
}
|
||||
</script>
|
||||
@ -1,3 +0,0 @@
|
||||
<script>
|
||||
window.location.replace("/app")
|
||||
</script>
|
||||
@ -1,183 +0,0 @@
|
||||
{% assign enrolled_courses = courses.enrolled %}
|
||||
{% assign enrolled_learning_paths = learning_paths.enrolled %}
|
||||
|
||||
{% include "header" %}
|
||||
{% include "sub_navigation" %}
|
||||
{% include "homepage_section_progress_activity" %}
|
||||
|
||||
<main class="np-main np-dashboard np-subpage-container np-max-width">
|
||||
<div class="row">
|
||||
{% if features.training_events? %}
|
||||
<div class="col-xs-12 col-sm-6 col-md-7">
|
||||
<div class="dashboard-title">UPCOMING EVENTS</div>
|
||||
<div class="np-dashboard-resources row upcoming-events">
|
||||
{% if training_events.available.any? %}
|
||||
{% for training_event in training_events.available limit: 2 %}
|
||||
<div class="col-xs-12 col-md-6">
|
||||
{% include "cards_training_event" with training_event %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% else %}
|
||||
{% include "training_events_zero_state" %}
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="col-xs-12 col-sm-6 col-md-5">
|
||||
{% include "section_previous_events", enrolled_courses: enrolled_courses %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% if features.learning_paths? %}
|
||||
{% include "section_learning_paths" %}
|
||||
{% endif %}
|
||||
<div class="background-logo">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
width="657"
|
||||
height="844"
|
||||
viewBox="0 0 657 844">
|
||||
<defs>
|
||||
<clipPath id="clip-BRT_Background">
|
||||
<rect width="657" height="844" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
<g id="BRT_Background" clip-path="url(#clip-BRT_Background)">
|
||||
<g
|
||||
id="Group_535"
|
||||
data-name="Group 535"
|
||||
transform="translate(-762.559 -1560.226)">
|
||||
<g
|
||||
id="Group_109"
|
||||
data-name="Group 109"
|
||||
transform="translate(762.559 1867.316)"
|
||||
opacity="0.05">
|
||||
<path
|
||||
id="Path_61"
|
||||
data-name="Path 61"
|
||||
d="M1406.748,820.66H1578V667.283H1406.748a153.283,153.283,0,0,1-132.81-76.691,153.354,153.354,0,0,0,132.81,230.068Z"
|
||||
transform="translate(-1253.371 -360.524)"
|
||||
fill="#6fcfeb" />
|
||||
<path
|
||||
id="Path_62"
|
||||
data-name="Path 62"
|
||||
d="M1406.748,703.671H1578V550.288H1406.748a153.353,153.353,0,0,0-132.81,230.068A153.278,153.278,0,0,1,1406.748,703.671Z"
|
||||
transform="translate(-1253.371 -550.288)"
|
||||
fill="#4e738a" />
|
||||
</g>
|
||||
<g
|
||||
id="Group_124"
|
||||
data-name="Group 124"
|
||||
transform="translate(762.559 1944.09)"
|
||||
opacity="0.05">
|
||||
<path
|
||||
id="Path_61-2"
|
||||
data-name="Path 61"
|
||||
d="M1406.748,820.66H1578V667.283H1406.748a153.283,153.283,0,0,1-132.81-76.691,153.354,153.354,0,0,0,132.81,230.068Z"
|
||||
transform="translate(-1253.371 -360.524)"
|
||||
fill="#6fcfeb" />
|
||||
<path
|
||||
id="Path_62-2"
|
||||
data-name="Path 62"
|
||||
d="M1406.748,703.671H1578V550.288H1406.748a153.353,153.353,0,0,0-132.81,230.068A153.278,153.278,0,0,1,1406.748,703.671Z"
|
||||
transform="translate(-1253.371 -550.288)"
|
||||
fill="#4e738a" />
|
||||
</g>
|
||||
<g
|
||||
id="Group_122"
|
||||
data-name="Group 122"
|
||||
transform="translate(1411.828 2020.362) rotate(180)"
|
||||
opacity="0.05">
|
||||
<path
|
||||
id="Path_61-3"
|
||||
data-name="Path 61"
|
||||
d="M153.377,230.068H324.632V76.691H153.377A153.283,153.283,0,0,1,20.567,0a153.354,153.354,0,0,0,132.81,230.068Z"
|
||||
transform="translate(0 230.068)"
|
||||
fill="#6fcfeb" />
|
||||
<path
|
||||
id="Path_62-3"
|
||||
data-name="Path 62"
|
||||
d="M153.377,153.383H324.632V0H153.377A153.354,153.354,0,0,0,20.567,230.068,153.279,153.279,0,0,1,153.377,153.383Z"
|
||||
transform="translate(0 0)"
|
||||
fill="#4e738a" />
|
||||
</g>
|
||||
<g
|
||||
id="Group_123"
|
||||
data-name="Group 123"
|
||||
transform="translate(1411.828 2097.135) rotate(180)"
|
||||
opacity="0.05">
|
||||
<path
|
||||
id="Path_61-4"
|
||||
data-name="Path 61"
|
||||
d="M153.377,230.068H324.632V76.691H153.377A153.283,153.283,0,0,1,20.567,0a153.354,153.354,0,0,0,132.81,230.068Z"
|
||||
transform="translate(0 230.068)"
|
||||
fill="#6fcfeb" />
|
||||
<path
|
||||
id="Path_62-4"
|
||||
data-name="Path 62"
|
||||
d="M153.377,153.383H324.632V0H153.377A153.354,153.354,0,0,0,20.567,230.068,153.279,153.279,0,0,1,153.377,153.383Z"
|
||||
transform="translate(0 0)"
|
||||
fill="#4e738a" />
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
{% include "section_recommended_courses", enrolled_courses: enrolled_courses %}
|
||||
|
||||
{% include "section_recently_added_courses", enrolled_courses: enrolled_courses %}
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.np-dashboard-resources .np-card {
|
||||
padding-left: 0;
|
||||
padding-right: 16px;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.np-dashboard-resources .np-card-content-vertical {
|
||||
justify-content:flex-end;
|
||||
}
|
||||
|
||||
.previous-events,
|
||||
.upcoming-events {
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
.dashboard-subtitle {
|
||||
color: #000;
|
||||
font-size: 20px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.recommended-courses-link,
|
||||
.recent-courses-link {
|
||||
color: #0077B8;
|
||||
font-size: 15px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
text-decoration-line: underline;
|
||||
}
|
||||
|
||||
.recommended-courses-link:hover,
|
||||
.recent-courses-link:hover {
|
||||
color: #185A7D;
|
||||
}
|
||||
|
||||
.background-logo {
|
||||
position: relative;
|
||||
max-height: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.background-logo svg {
|
||||
position: absolute;
|
||||
right: 100px;
|
||||
top: 200px;
|
||||
}
|
||||
</style>
|
||||
@ -1,179 +0,0 @@
|
||||
{% 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="filters-container Lps-filters">
|
||||
<div class="filters-heading">APPLY FILTERS<i class="fa fa-chevron-down"></i></div>
|
||||
<div class="filters-content">
|
||||
<div class="filter-column status-column">
|
||||
<div class="filter-column-title">STATUS</div>
|
||||
<div class="filters-list">
|
||||
<div class="filter-item status-filter">
|
||||
<input type="checkbox" name="completed" value="completed">
|
||||
<label for="completed">Completed <span></span></label>
|
||||
</div>
|
||||
|
||||
<div class="filter-item status-filter">
|
||||
<input type="checkbox" name="in-progress" value="in-progress">
|
||||
<label for="in-progress">In Progress <span></span></label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="filter-column categories-column">
|
||||
<div class="filter-column-title">CATEGORY</div>
|
||||
<div class="filters-list">
|
||||
{% for category in categories.enrolled %}
|
||||
<div class="filter-item category-filter">
|
||||
<input type="checkbox" name="{{category.name}}" value="{{category.name}}">
|
||||
<label for="{{category.name}}">{{category.name}} <span></span></label>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% assign learning_paths_alphabetical = learning_paths.available | sort: "name" %}
|
||||
{% include "learning_paths_index", items: learning_paths_alphabetical %}
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.np-card-content-vertical {
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
@media (min-width:768px) {
|
||||
.learning-path-card .np-card-content-title {
|
||||
font-size: 16px;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
.np-learning-path-image {
|
||||
align-self: unset !important;
|
||||
object-fit: cover !important;
|
||||
width: 100% !important;
|
||||
min-height: unset !important;
|
||||
}
|
||||
|
||||
.learning-path-image-container {
|
||||
max-width: 265px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
window.onload = () => {
|
||||
let url = new URL(window.location.href);
|
||||
let params = new URLSearchParams(url.search);
|
||||
if (params.has('category')) {
|
||||
let allParams = params.getAll('category')
|
||||
allParams.forEach((param) => {
|
||||
document.querySelector(`.filter-item input[value='${param}']`).click()
|
||||
})
|
||||
}
|
||||
|
||||
addCountToFilters()
|
||||
}
|
||||
|
||||
$("input[type='checkbox']").change(function(e) {
|
||||
filterLps()
|
||||
})
|
||||
|
||||
$("document").ready(function() {
|
||||
|
||||
document.querySelector(".filters-heading").addEventListener("click", function() {
|
||||
this.classList.toggle("active");
|
||||
var panel = this.nextElementSibling;
|
||||
if (panel.style.maxHeight) {
|
||||
panel.style.maxHeight = null;
|
||||
} else {
|
||||
panel.style.maxHeight = panel.scrollHeight + 32 + "px";
|
||||
}
|
||||
})
|
||||
|
||||
document.querySelector(".filters-heading").click()
|
||||
})
|
||||
|
||||
function filterLps() {
|
||||
// hide all Lps
|
||||
$(".lp-column").hide()
|
||||
|
||||
// get all checked filters
|
||||
let selectedStatusFilters = []
|
||||
let selectedCategoryFilters = []
|
||||
|
||||
$(".status-column input[type='checkbox']:checked").each((index, filter) => {
|
||||
selectedStatusFilters.push(filter.value)
|
||||
})
|
||||
|
||||
$(".categories-column input[type='checkbox']:checked").each((index, filter) => {
|
||||
selectedCategoryFilters.push(filter.value)
|
||||
})
|
||||
|
||||
//loop over Lps and get filters
|
||||
$(".lp-column").each((index, lp) => {
|
||||
const lpStatus = $(lp).data("progress")
|
||||
const courseCategory = $(lp).data("category")
|
||||
|
||||
if (selectedStatusFilters.length && selectedCategoryFilters.length) {
|
||||
if($.inArray(courseCategory, selectedCategoryFilters) !== -1 && $.inArray(lpStatus, selectedStatusFilters) !== -1) {
|
||||
$(lp).show()
|
||||
}
|
||||
} else if (!selectedStatusFilters.length && selectedCategoryFilters.length) {
|
||||
if($.inArray(courseCategory, selectedCategoryFilters) !== -1) {
|
||||
$(lp).show()
|
||||
}
|
||||
} else if (selectedStatusFilters.length && !selectedCategoryFilters.length) {
|
||||
if($.inArray(lpStatus, selectedStatusFilters) !== -1) {
|
||||
$(lp).show()
|
||||
}
|
||||
} else {
|
||||
$(lp).show()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function addCountToFilters() {
|
||||
const allFiltersFromLps = []
|
||||
|
||||
$(".lp-column").each((index, course) => {
|
||||
if ($(course).attr("data-progress")) {
|
||||
allFiltersFromLps.push($(course).attr("data-progress"))
|
||||
}
|
||||
|
||||
if ($(course).attr("data-category")) {
|
||||
allFiltersFromLps.push($(course).attr("data-category"))
|
||||
}
|
||||
})
|
||||
|
||||
$(".filter-item").each((index, filter) => {
|
||||
const filterValue = $(filter).find("input").val()
|
||||
const filterCount = getFilterCount(filterValue, allFiltersFromLps)
|
||||
|
||||
|
||||
if ($(filter).hasClass("category-filter")) {
|
||||
if (filterCount == 0) {
|
||||
$(filter).hide()
|
||||
} else {
|
||||
$(filter).find("label > span").text(`(${filterCount})`)
|
||||
}
|
||||
} else {
|
||||
$(filter).find("label > span").text(`(${filterCount})`)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const getFilterCount = (value, array) => {
|
||||
let count = 0;
|
||||
|
||||
array.forEach(filter => {
|
||||
if (filter == value) { count++; }
|
||||
});
|
||||
|
||||
return count
|
||||
}
|
||||
</script>
|
||||
@ -1,53 +0,0 @@
|
||||
{% include "header" %}
|
||||
<div class="your-profile-container">
|
||||
<div class="your-profile np-max-width">
|
||||
your profile
|
||||
</div>
|
||||
</div>
|
||||
<main class="np-main np-dashboard np-subpage-container np-max-width">
|
||||
<div width="100%" height="100%" style="margin-bottom: 46px;">
|
||||
<iframe src="https://customer.brighton-science.com/profile-update" frameborder="0" width="100%" height="1400px" id="profile-update-frame"></iframe>
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.your-profile-container {
|
||||
width: 100%;
|
||||
background-color: #F8FBFF;
|
||||
}
|
||||
|
||||
.your-profile {
|
||||
color: #185A7D;
|
||||
font-size: 50px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
text-transform: uppercase;
|
||||
padding: 23px 5% 12px;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
color: #185A7D;
|
||||
font-size: 34px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.embed-wrapper {
|
||||
margin-bottom:48px;
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
document.getElementById("profile-update-frame").name = Date();
|
||||
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
addActiveNavigationClass()
|
||||
})
|
||||
|
||||
function addActiveNavigationClass() {
|
||||
$('.np-header-avatar-button').addClass("np-sub-navigation-content-item-active")
|
||||
}
|
||||
</script>
|
||||
@ -1,434 +0,0 @@
|
||||
/*
|
||||
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: 'Heebo', "Roboto", sans-serif;
|
||||
background-color:#fff;
|
||||
}
|
||||
|
||||
.np-dashboard,
|
||||
.np-learning-paths {
|
||||
background-color:#fff;
|
||||
}
|
||||
|
||||
.np-button {
|
||||
border-radius:0;
|
||||
height:30px;
|
||||
}
|
||||
|
||||
a:visited {
|
||||
color:#0077B8;
|
||||
}
|
||||
|
||||
.np-card-container,
|
||||
.np-card-progress-bar-container,
|
||||
.np-card-progress-bar {
|
||||
border-radius:0;
|
||||
}
|
||||
|
||||
.dashboard-title {
|
||||
font-size: 24px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 16px;
|
||||
color: #185A7D;
|
||||
}
|
||||
|
||||
.learning-path-card .np-card-content {
|
||||
height:100%;
|
||||
justify-content:unset;
|
||||
}
|
||||
|
||||
.np-card-stack-level-1,
|
||||
.np-card-stack-level-2 {
|
||||
border-radius:0;
|
||||
}
|
||||
|
||||
.np-flex {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.np-card-content-progress i {
|
||||
margin-right:6px;
|
||||
}
|
||||
|
||||
.np-card-content-progress i.not-started-circle {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
display: inline-block;
|
||||
border-radius: 50%;
|
||||
border: 2.7px dashed;
|
||||
position: relative;
|
||||
top: 3px;
|
||||
}
|
||||
|
||||
@media (min-width:768px) {
|
||||
.dashboard-title {
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.learning-path-card.np-card {
|
||||
display:flex;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.learning-path-card .np-card-container {
|
||||
width:100%;
|
||||
}
|
||||
|
||||
.learning-path-card .np-learning-path {
|
||||
height:100%;
|
||||
}
|
||||
|
||||
.learning-path-card .np-card-content-title {
|
||||
flex: 1;
|
||||
font-weight: 500;
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.course-card .np-card-container,
|
||||
.previous-event-card .np-card-container {
|
||||
box-shadow:none;
|
||||
}
|
||||
|
||||
.course-card .np-card-content-footer,
|
||||
.previous-event-card .np-card-content-footer {
|
||||
margin-top:0;
|
||||
display:block;
|
||||
}
|
||||
|
||||
.course-card .course-category {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
opacity: 0.9;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-transform:uppercase;
|
||||
color: #fff;
|
||||
padding: 6px 26px;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: 27px;
|
||||
z-index: 2;
|
||||
background-color: {{ color_palette.button_color }};
|
||||
}
|
||||
|
||||
.course-card .np-card-content,
|
||||
.previous-event-card .np-card-content {
|
||||
padding: 20px 0 0;
|
||||
}
|
||||
|
||||
.course-card .np-card-content-progress,
|
||||
.previous-event-card .np-card-content-progress {
|
||||
margin-bottom:12px;
|
||||
font-size:14px;
|
||||
text-transform:lowercase;
|
||||
margin-top:0;
|
||||
}
|
||||
|
||||
.np-card.previous-event-card {
|
||||
padding: 0 0 32px;
|
||||
}
|
||||
|
||||
.previous-event-card .np-card-cotnent-title {
|
||||
font-size:16px;
|
||||
line-height:normal;
|
||||
}
|
||||
|
||||
/* FILTERS */
|
||||
.filters-container {
|
||||
margin-bottom:64px;
|
||||
background-color: #F8FBFF;
|
||||
}
|
||||
|
||||
.filters-heading {
|
||||
background-color: #185A7D;
|
||||
color:#fff;
|
||||
padding: 8px 25px;
|
||||
font-size: 20px;
|
||||
font-weight: 600;
|
||||
line-height: normal;
|
||||
letter-spacing: 1px;
|
||||
text-transform: uppercase;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
cursor:pointer;
|
||||
}
|
||||
|
||||
.filters-heading.active i {
|
||||
transform:rotate(180deg);
|
||||
}
|
||||
|
||||
.filters-content {
|
||||
max-height: 0;
|
||||
overflow: hidden;
|
||||
transition: max-height 0.2s ease-out;
|
||||
}
|
||||
|
||||
.filter-column {
|
||||
padding: 20px 32px;
|
||||
}
|
||||
|
||||
.filter-column.categories-column {
|
||||
flex:1;
|
||||
}
|
||||
|
||||
.filter-column-title {
|
||||
color: #185A7D;
|
||||
font-size: 21px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: normal;
|
||||
letter-spacing: 2.1px;
|
||||
text-transform: uppercase;
|
||||
margin-bottom:16px;
|
||||
}
|
||||
|
||||
.filter-item label {
|
||||
color: #000;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: 40px;
|
||||
text-transform: uppercase;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
@media (min-width:768px) {
|
||||
.filters-content {
|
||||
display:flex;
|
||||
}
|
||||
|
||||
.categories-column .filters-list {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
max-width: 550px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.filter-item {
|
||||
margin-right: 24px;
|
||||
}
|
||||
|
||||
.categories-column .filters-list .filter-item {
|
||||
width:calc(50% - 24px);
|
||||
}
|
||||
}
|
||||
|
||||
.fa-spinner {
|
||||
color: #EAAF1E;
|
||||
font-size: 22px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.fa-check-circle {
|
||||
color: #16C466;
|
||||
font-size: 22px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.learning-path-card .np-card-container {
|
||||
border: 1px solid #185A7D;
|
||||
|
||||
-webkit-box-shadow: 9px 9px 0px -1px rgba(0, 119, 184, 1);
|
||||
-moz-box-shadow: 9px 9px 0px -1px rgba(0, 119, 184, 1);
|
||||
box-shadow: 9px 9px 0px -1px rgba(0, 119, 184, 1);
|
||||
}
|
||||
|
||||
.learning-path-card .np-card-content-title,
|
||||
.course-card .np-card-content-title {
|
||||
color: #0077B8;
|
||||
font-size: 18px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.course-card .np-card-content-title {
|
||||
font-size: 16px;
|
||||
margin-top:0;
|
||||
}
|
||||
|
||||
.learning-path-card .np-card-content-card {
|
||||
color: #0077B8;
|
||||
font-size: 28px;
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.learning-path-card .np-card-content-progress span,
|
||||
.course-card .np-card-content-progress span {
|
||||
color: #000;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.learning-path-card .np-card-progress-bar {
|
||||
background-color: #EAAF1E;
|
||||
}
|
||||
|
||||
.learning-path-card .np-card-progress-bar-container {
|
||||
border: 1px solid #707070;
|
||||
background-color: #FFFFFF;
|
||||
height: 12px;
|
||||
}
|
||||
|
||||
.learning-path-card .np-button {
|
||||
padding: 3px 16px;
|
||||
color: #FFF;
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.learning-path-card .np-learning-path-items-count {
|
||||
color: #185A7D;
|
||||
font-size: 14px;
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
.case-studies {
|
||||
background-color: #256180 !important;
|
||||
}
|
||||
|
||||
.surface-research {
|
||||
background-color: #6ABCD5CC !important;
|
||||
}
|
||||
|
||||
.internal-training {
|
||||
background-color: #10BE60!important;
|
||||
}
|
||||
|
||||
.webinars-and-events {
|
||||
background-color: #EEA153 !important;
|
||||
}
|
||||
|
||||
.course-card .np-card-content-progress {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.course-card .np-card-content-progress i.not-started-circle {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.course-card .np-card-content-footer .np-button {
|
||||
color: #FFF;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
line-height: normal;
|
||||
padding: 6px 18px;
|
||||
background-color: #0077B8;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
input[type=checkbox] {
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
input[type=checkbox]:before {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
top: -4px;
|
||||
left: 0;
|
||||
border: 2px solid #0077B8;
|
||||
border-radius: 3px;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
input[type=checkbox]:checked:after {
|
||||
content: "";
|
||||
display: block;
|
||||
width: 4px;
|
||||
height: 9px;
|
||||
border: solid #0077B8;
|
||||
border-width: 0 2px 2px 0;
|
||||
-webkit-transform: rotate(45deg);
|
||||
-ms-transform: rotate(45deg);
|
||||
transform: rotate(45deg);
|
||||
position: absolute;
|
||||
top: -1px;
|
||||
left: 7px;
|
||||
}
|
||||
|
||||
.np-learning-path:hover .np-card-content-title,
|
||||
.course-card .np-card-container:hover .np-card-content-title {
|
||||
color: #185A7D;
|
||||
}
|
||||
|
||||
.course-card .np-card-container:hover .np-card-content-footer .np-button,
|
||||
.np-learning-path:hover .np-button {
|
||||
background-color: #185A7D;
|
||||
}
|
||||
|
||||
/*.np-learning-path:hover {
|
||||
-webkit-box-shadow: 3px 3px 0px -1px #185A7D;
|
||||
-moz-box-shadow: 3px 3px 0px -1px #185A7D;
|
||||
box-shadow: 3px 3px 0px -1px #185A7D;
|
||||
transition: .5s ease all;
|
||||
}*/
|
||||
|
||||
.learning-path-card:hover .np-card-container {
|
||||
-webkit-box-shadow: 3px 3px 0px -1px #185A7D;
|
||||
-moz-box-shadow: 3px 3px 0px -1px #185A7D;
|
||||
box-shadow: 3px 3px 0px -1px #185A7D;
|
||||
transition: .5s all;
|
||||
}
|
||||
|
||||
.np-learning-path:hover .np-card-image,
|
||||
.course-card .np-card-container:hover .np-card-image {
|
||||
scale: 1.25;
|
||||
transition: .5s ease all;
|
||||
}
|
||||
|
||||
.learning-path-image-container {
|
||||
width: auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.course-image-container {
|
||||
width: auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 768px) {
|
||||
.np-learning-path-image {
|
||||
object-fit: cover;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.learning-path-image-container {
|
||||
max-width: 345px;
|
||||
}
|
||||
}
|
||||
@ -1,54 +0,0 @@
|
||||
<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>
|
||||
@ -1,52 +0,0 @@
|
||||
<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>
|
||||
@ -1,80 +0,0 @@
|
||||
<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>
|
||||
@ -1,11 +0,0 @@
|
||||
{% 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>
|
||||
@ -1,183 +0,0 @@
|
||||
<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" %}
|
||||
|
||||
@ -1,109 +0,0 @@
|
||||
<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>
|
||||
@ -1,91 +0,0 @@
|
||||
<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>
|
||||
@ -1,15 +0,0 @@
|
||||
<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>
|
||||
@ -1,121 +0,0 @@
|
||||
<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>
|
||||
@ -1,45 +0,0 @@
|
||||
<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>
|
||||
@ -1,39 +0,0 @@
|
||||
{% 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>
|
||||
@ -1,45 +0,0 @@
|
||||
{% 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>
|
||||
@ -1,75 +0,0 @@
|
||||
{% 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>
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,31 +0,0 @@
|
||||
{% 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" %}
|
||||
@ -1,117 +0,0 @@
|
||||
{% 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>
|
||||
@ -1,40 +0,0 @@
|
||||
<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="course-description">
|
||||
{{ course.short_description }}
|
||||
</div>
|
||||
<div class="np-card-content-footer">
|
||||
<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 %}
|
||||
<div class="button-wrapper">
|
||||
<a class="np-button np-button-wide" href="{{ course_path }}">
|
||||
{% t shared.view %}
|
||||
</a>
|
||||
<div class="back-button"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,73 +0,0 @@
|
||||
<div class="np-card np-no-horizontal-padding">
|
||||
<div class="np-card-container">
|
||||
<div class="np-learning-path">
|
||||
<img
|
||||
alt="{{ learning_path.name }}"
|
||||
class="np-card-image np-learning-path-image"
|
||||
src="{{ learning_path.image_url }}"
|
||||
/>
|
||||
<div class="np-card-text-wrapper">
|
||||
<div class="np-hidden-desktop np-card-header">
|
||||
<i class="np-card-header-icon far fa-road"></i>
|
||||
<div class="np-card-header-type">{% t shared.learning_path.title %}</div>
|
||||
<div class="np-hidden-desktop np-card-header-items-count">
|
||||
{{ learning_path.items.count }} {% t .items %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-hidden-mobile np-card-header">
|
||||
<div class="np-card-header-type">{% t shared.learning_path.title %}</div>
|
||||
<i class="np-card-header-icon far fa-road"></i>
|
||||
</div>
|
||||
|
||||
<div class="np-card-content np-card-padding np-card-content-vertical">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ learning_path.name }}
|
||||
</h3>
|
||||
|
||||
<div class="np-card-content-subtitle">
|
||||
{{ learning_path.instructor_names }}
|
||||
</div>
|
||||
|
||||
<div class="np-hidden-mobile np-card-content-description">
|
||||
{{ learning_path.description }}
|
||||
</div>
|
||||
|
||||
<div class="np-hidden-mobile np-card-content-progress
|
||||
np-button-color">
|
||||
{% t shared.progress, count: learning_path.progress %}
|
||||
</div>
|
||||
|
||||
<div class="np-hidden-mobile np-card-progress-bar-container">
|
||||
<div
|
||||
style="width: {{ learning_path.progress }}%"
|
||||
class="np-button-background-color np-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="np-card-content-footer">
|
||||
<div class="np-hidden-desktop np-card-content-progress
|
||||
np-button-color">
|
||||
{% t shared.progress, count: learning_path.progress %}
|
||||
</div>
|
||||
<div class="button-wrapper">
|
||||
<a class="np-button" href="{% route learning_path, id: learning_path.id %}">
|
||||
{% t shared.view %}
|
||||
</a>
|
||||
<div class="back-button"></div>
|
||||
</div>
|
||||
<span class="np-hidden-mobile np-learning-path-items">
|
||||
<i class="np-button-color np-learning-path-items-icon far fa-graduation-cap"></i>
|
||||
<span class="np-learning-path-items-count">
|
||||
{{ learning_path.items.count }} {% t .items %}
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</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>
|
||||
@ -1,48 +0,0 @@
|
||||
<div class="np-card">
|
||||
<div class="np-card-container">
|
||||
<div class="np-card-content-training-event">
|
||||
<h3 class="np-card-content-title">
|
||||
{{ training_event.title }}
|
||||
</h3>
|
||||
<div class="np-card-content-subtitle">
|
||||
{% t shared.event_types, key: training_event.event_type %}
|
||||
</div>
|
||||
<div class="np-card-training-session">
|
||||
<span class="np-card-content-label">
|
||||
{% t .next_session %}
|
||||
</span>
|
||||
<div class="np-card-training-session-date">
|
||||
<div class="np-button-background-color np-card-training-session-date-bar"></div>
|
||||
<div class="np-card-training-session-date-day">
|
||||
{{ training_event.sessions.first.day }}
|
||||
</div>
|
||||
<div>
|
||||
<div class="np-card-training-session-date-month">
|
||||
{{ training_event.sessions.first.month }}
|
||||
</div>
|
||||
<div class="np-card-training-session-date-year">
|
||||
{{ training_event.sessions.first.year }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-card-content np-card-content-vertical np-card-padding">
|
||||
<div class="np-card-training-sessions">
|
||||
<i class="np-card-training-sessions-icon far fa-calendar-star"></i>
|
||||
<span class="np-card-training-sessions-label">
|
||||
{% t .sessions, count: training_event.sessions.size %}
|
||||
</span>
|
||||
<div class="button-wrapper">
|
||||
<a
|
||||
class="np-button np-button-wide"
|
||||
href="{% route training_session, id: training_event.sessions.first.id %}"
|
||||
>
|
||||
{% t shared.view %}
|
||||
</a>
|
||||
<div class="back-button"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,34 +0,0 @@
|
||||
<div class="courses-filter">
|
||||
<div class="courses-filter-title">
|
||||
Categories
|
||||
</div>
|
||||
<div class="courses-filter-item courses-filter-item-active" filter-category="ALL" onclick="filterCourses(this);">
|
||||
All
|
||||
</div>
|
||||
{% for category in categories.in_catalog %}
|
||||
<div class="courses-filter-item" filter-category="{{ category.id }}" onclick="filterCourses(this);">
|
||||
{{ category.name }}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function filterCourses(element) {
|
||||
let categoryId = element.getAttribute('filter-category');
|
||||
document.querySelector('.courses-filter-item-active').classList.remove('courses-filter-item-active');
|
||||
element.classList.add('courses-filter-item-active');
|
||||
if (categoryId === 'ALL') {
|
||||
document.querySelectorAll('.filter-hidden').forEach(x => {
|
||||
x.classList.remove('filter-hidden');
|
||||
});
|
||||
} else {
|
||||
document.querySelectorAll('[course-category]').forEach(x => {
|
||||
if (x.getAttribute('course-category').includes(categoryId)) {
|
||||
x.classList.remove('filter-hidden');
|
||||
} else {
|
||||
x.classList.add('filter-hidden');
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,20 +0,0 @@
|
||||
<div class="courses-list np-hidden">
|
||||
<div class="np-resource-title courses-list-title">
|
||||
Library
|
||||
</div>
|
||||
<div class="row courses-wrapper">
|
||||
<div class="courses-filter-wrapper col-12 col-md-3">
|
||||
{% include "courses_filter" %}
|
||||
</div>
|
||||
<div class="courses-wrapper row row-with-thumbnails col-12 col-md-9">
|
||||
{% for course in courses.in_catalog %}
|
||||
<div class="col-xs-12 col-sm-6 col-xl-4 np-stretch-content role-hidden" course-category="{{ course.categories | map: 'id' | join: ' ' }}" course-role="{{ course.properties.role }}">
|
||||
{% include "cards_course" %}
|
||||
</div>
|
||||
{% endfor %}
|
||||
<div class="zero-state np-hidden">
|
||||
{% include "courses_zero_state", message: "No courses matching criteria" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,9 +0,0 @@
|
||||
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
|
||||
|
||||
{% styles default %}
|
||||
{% styles colors %}
|
||||
{% styles custom %}
|
||||
|
||||
|
||||
@ -1,178 +0,0 @@
|
||||
<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"
|
||||
>
|
||||
{{ 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"
|
||||
>
|
||||
{{ 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" %}
|
||||
@ -1,83 +0,0 @@
|
||||
<div class="topics-wrapper col-xs-12">
|
||||
<h3 class="topics-title">
|
||||
Popular Topics
|
||||
</h3>
|
||||
<div class="topics row">
|
||||
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/360002631894-Animal-Oversight">
|
||||
Animal Oversight
|
||||
</a>
|
||||
</div>
|
||||
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/1500001762282-Connect-Conference-Community">
|
||||
Cayuse Community
|
||||
</a>
|
||||
</div>
|
||||
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/9886295600147-Cayuse-Modernization">
|
||||
Cayuse Modernization
|
||||
</a>
|
||||
</div>
|
||||
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/360000137107-Fund-Manager-Effort-and-Grants">
|
||||
Fund Manager, Effort, and Grants
|
||||
</a>
|
||||
</div>
|
||||
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/115001977467-Human-Ethics">
|
||||
Human Ethics
|
||||
</a>
|
||||
</div>
|
||||
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/360003816254-Integrations-and-APIs">
|
||||
Integrations & APIs
|
||||
</a>
|
||||
</div>
|
||||
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/360001518894-Outside-Interests">
|
||||
Outside Interests
|
||||
</a>
|
||||
</div>
|
||||
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/115002015648-Platform-and-Admin">
|
||||
Platform & Admin
|
||||
</a>
|
||||
</div>
|
||||
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/360001581913-Sponsored-Projects-4-0">
|
||||
Sponsored Projects 4.0
|
||||
</a>
|
||||
</div>
|
||||
<div class="topic-wrapper col-12 col-sm-6 col-md-4 col-lg-3">
|
||||
<a class="topic" href="https://support.cayuse.com/hc/en-us/categories/360002101954-Vivarium-Operations-and-Vet-Care">
|
||||
Vivarium Operations & Vet Care
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.topics-title {
|
||||
text-align: center;
|
||||
margin-bottom: 30px;
|
||||
font-weight: 600;
|
||||
}
|
||||
.topic-wrapper {
|
||||
display: flex;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.topic {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
border: 2px solid #253272;
|
||||
padding: 8px 0;
|
||||
color: #253272;
|
||||
border-radius: 6px;
|
||||
font-weight: 600;
|
||||
}
|
||||
.topic:hover {
|
||||
color: white;
|
||||
background: rgba(37,50,114, 0.9);
|
||||
}
|
||||
</style>
|
||||
@ -1,106 +0,0 @@
|
||||
<div class="role-select container">
|
||||
<div class="role-select-title">
|
||||
Library
|
||||
</div>
|
||||
<div class="role-select-list row">
|
||||
<a class="role-select-item col-12 col-md-6 col-xl-3" href="#administrators">
|
||||
<div class="role-select-item-container">
|
||||
<img class="role-select-image" src="https://cdn.northpass.io/Cayuse/admin.jpg">
|
||||
<div class="role-select-item-text">
|
||||
<div class="role-select-item-name">
|
||||
Administrators
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<a class="role-select-item col-12 col-md-6 col-xl-3" href="#researchers">
|
||||
<div class="role-select-item-container">
|
||||
<img class="role-select-image" src="https://cdn.northpass.io/Cayuse/researcher.jpg">
|
||||
<div class="role-select-item-text">
|
||||
<div class="role-select-item-name">
|
||||
Researchers
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<a class="role-select-item col-12 col-md-6 col-xl-3" href="#it-managers">
|
||||
<div class="role-select-item-container">
|
||||
<img class="role-select-image" src="https://cdn.northpass.io/Cayuse/it_manager.jpg">
|
||||
<div class="role-select-item-text">
|
||||
<div class="role-select-item-name">
|
||||
IT Managers
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<a class="role-select-item col-12 col-md-6 col-xl-3" href="#staff">
|
||||
<div class="role-select-item-container">
|
||||
<img class="role-select-image" src="https://cdn.northpass.io/Cayuse/staff.jpg">
|
||||
<div class="role-select-item-text">
|
||||
<div class="role-select-item-name">
|
||||
Staff
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
addEventListener("hashchange", () => {
|
||||
showCourses(location.hash.replace('#', ''));
|
||||
});
|
||||
addEventListener('DOMContentLoaded', () => {
|
||||
showCourses(location.hash.replace('#', ''));
|
||||
})
|
||||
|
||||
const roleDescriptions = {
|
||||
'administrators': {
|
||||
name: 'Courses for Administrators',
|
||||
},
|
||||
'researchers': {
|
||||
name: 'Courses for Researchers',
|
||||
},
|
||||
'it-managers': {
|
||||
name: 'Courses for IT Managers',
|
||||
},
|
||||
'staff': {
|
||||
name: 'Courses for Staff',
|
||||
}
|
||||
}
|
||||
|
||||
function showCourses(name) {
|
||||
let coursesParent = document.querySelector('.courses-wrapper')
|
||||
let roleSelectElement = document.querySelector('.role-select');
|
||||
|
||||
if (!name) {
|
||||
if (roleSelectElement.classList.contains('np-hidden')) {
|
||||
roleSelectElement.classList.remove('np-hidden');
|
||||
document.querySelector('.courses-list').classList.add('np-hidden');
|
||||
}
|
||||
} else if (roleDescriptions[name]) {
|
||||
coursesParent.querySelectorAll('[course-role]').forEach(x => {
|
||||
if (x.getAttribute('course-role') === name) {
|
||||
x.classList.remove('role-hidden');
|
||||
} else {
|
||||
x.classList.add('role-hidden');
|
||||
}
|
||||
});
|
||||
|
||||
document.querySelectorAll('[filter-category]:not([filter-category="ALL"])').forEach( x => {
|
||||
if (coursesParent.querySelector(`[course-category*="${x.getAttribute('filter-category')}"][course-role="${name}"]`)) {
|
||||
x.classList.remove('role-hidden');
|
||||
} else {
|
||||
x.classList.add('role-hidden');
|
||||
}
|
||||
});
|
||||
|
||||
document.querySelector('.courses-list-title').innerText = roleDescriptions[name].name;
|
||||
|
||||
if (!roleSelectElement.classList.contains('np-hidden')) {
|
||||
roleSelectElement.classList.add('np-hidden');
|
||||
document.querySelector('.courses-list').classList.remove('np-hidden');
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -1,25 +0,0 @@
|
||||
<nav class="np-sub-navigation np-hidden-desktop">
|
||||
<div class="np-sub-navigation-content">
|
||||
{% for link in navigations.sub_navigation %}
|
||||
{% unless link.label == 'Catalog' %}
|
||||
{% 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>
|
||||
Library
|
||||
</a>
|
||||
<div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
|
||||
</div>
|
||||
{% else %}
|
||||
<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 %}
|
||||
{% endunless %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</nav>
|
||||
@ -1,59 +0,0 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.enrolled %}
|
||||
{% include "sub_navigation" %}
|
||||
<main class="np-main np-courses np-subpage-container np-max-width">
|
||||
{% include "role_select" %}
|
||||
{% include 'courses_with_filter' %}
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.courses-filter {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.courses-filter-title {
|
||||
font-size: 22px;
|
||||
font-weight: 500;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.courses-filter-item {
|
||||
cursor: pointer;
|
||||
padding: 5px 0;
|
||||
}
|
||||
.courses-filter-item-active {
|
||||
font-weight: 600;
|
||||
cursor: auto;
|
||||
}
|
||||
.role-select-title {
|
||||
font-size: 30px;
|
||||
font-weight: 600;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.role-select-item-container {
|
||||
padding: 20px 30px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
border: 1px solid darkblue;
|
||||
border-radius: 8px;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
}
|
||||
.role-select-item-name {
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.role-select-item {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.role-select-image {
|
||||
width: 100%;
|
||||
}
|
||||
.role-select-item-text {
|
||||
margin-top: 10px;
|
||||
}
|
||||
.role-hidden, .filter-hidden {
|
||||
display: none !important;
|
||||
}
|
||||
</style>
|
||||
@ -1,30 +0,0 @@
|
||||
{% 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 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-6 np-stretch-content" %}
|
||||
</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 %}
|
||||
{% include 'popular_topics' %}
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
@ -1,55 +0,0 @@
|
||||
<script>
|
||||
window.location.href = '/app/courses'
|
||||
</script>
|
||||
{%- comment -%} {% 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">
|
||||
<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 "footer" %} {%- endcomment -%}
|
||||
@ -1,50 +0,0 @@
|
||||
/*
|
||||
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 }}
|
||||
*/
|
||||
|
||||
a, a:hover, a:focus, a:active {
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.course-description {
|
||||
margin-top: 10px;
|
||||
}
|
||||
@media screen and (min-width: 768px) and (max-width: 950px){
|
||||
.np-card-content-footer {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 20px;
|
||||
}
|
||||
}
|
||||
.button-wrapper {
|
||||
position: relative;
|
||||
}
|
||||
.back-button {
|
||||
position: absolute !important;
|
||||
background: #2e3e8f;
|
||||
opacity: 0.8;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 4px;
|
||||
left: 4px;
|
||||
border-radius: 4px;
|
||||
z-index: -1;
|
||||
}
|
||||
.np-button:hover {
|
||||
color: white;
|
||||
}
|
||||
.np-card-content-progress {
|
||||
font-size: 1rem;
|
||||
}
|
||||
.np-header-desktop-nav-list {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
@ -1,6 +0,0 @@
|
||||
{% styles default %}
|
||||
{% styles colors %}
|
||||
{% styles custom %}
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100&display=swap');
|
||||
</style>
|
||||
@ -1,7 +0,0 @@
|
||||
@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;
|
||||
}
|
||||
@ -26,10 +26,10 @@
|
||||
<div class="hero-text lora">Welcome to Cin7 Core Academy</div>
|
||||
{% elsif omni %}
|
||||
<div class="hero-text lora">Welcome to Cin7 Omni Academy</div>
|
||||
{% elsif log_out %}
|
||||
<div class="hero-text lora">Welcome to Cin7 Academy</div>
|
||||
{% elsif multiprod %}
|
||||
{% elsif log_out or multiprod%}
|
||||
<div class="hero-text lora">Welcome to Cin7 Academy</div>
|
||||
{% comment %} {% elsif multiprod %} {% endcomment %}
|
||||
{% comment %} <div class="hero-text lora">Welcome to Cin7 Academy</div> {% endcomment %}
|
||||
{% else %}
|
||||
<div class="hero-text lora">Welcome to Cin7 Academy</div>
|
||||
{% endif %}
|
||||
@ -53,7 +53,7 @@
|
||||
<div class="section-content">
|
||||
{% include "category_carousel"%}
|
||||
</div>
|
||||
{% elsif log_out %}
|
||||
{% elsif log_out or multiprod %}
|
||||
<div class="heading lora">Learn Cin7 Core by your function with Learning Paths</div>
|
||||
<div class="section-content">
|
||||
{% include 'learning_path_carousel_core' %}
|
||||
|
||||
@ -1,73 +0,0 @@
|
||||
{% 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>
|
||||
@ -1,127 +0,0 @@
|
||||
<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>
|
||||
@ -1,38 +0,0 @@
|
||||
{% 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>
|
||||
@ -1,26 +0,0 @@
|
||||
{% 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>
|
||||
@ -1,202 +0,0 @@
|
||||
<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>
|
||||
@ -1,18 +0,0 @@
|
||||
{% 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>
|
||||
@ -1,259 +0,0 @@
|
||||
<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>
|
||||
@ -1,193 +0,0 @@
|
||||
<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>
|
||||
@ -1,92 +0,0 @@
|
||||
{% 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>
|
||||
Binary file not shown.
@ -1,56 +0,0 @@
|
||||
<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>
|
||||
@ -1,61 +0,0 @@
|
||||
<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>
|
||||
@ -1,59 +0,0 @@
|
||||
<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>
|
||||
@ -1,4 +0,0 @@
|
||||
<span class="np-course-outline-content-activity-title">
|
||||
{{ activity.title }}
|
||||
</span>
|
||||
|
||||
@ -1,9 +0,0 @@
|
||||
<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>
|
||||
@ -1,27 +0,0 @@
|
||||
{% 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 %}
|
||||
@ -1,6 +0,0 @@
|
||||
<h3 class="np-card-heading">
|
||||
About This Tutorial
|
||||
</h3>
|
||||
<div class="np-card-text">
|
||||
{{ course.full_description }}
|
||||
</div>
|
||||
@ -1,26 +0,0 @@
|
||||
<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 %}
|
||||
@ -1,6 +0,0 @@
|
||||
<div class="np-top-title">
|
||||
{{ course.name }}
|
||||
</div>
|
||||
<div>
|
||||
{% include "course_cta_button" %}
|
||||
</div>
|
||||
@ -1,26 +0,0 @@
|
||||
<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>
|
||||
@ -1,57 +0,0 @@
|
||||
<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>
|
||||
@ -1,29 +0,0 @@
|
||||
<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
|
||||
@ -1,49 +0,0 @@
|
||||
<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>
|
||||
@ -1,15 +0,0 @@
|
||||
{% 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 %}
|
||||
@ -1,20 +0,0 @@
|
||||
{% 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 %}
|
||||
@ -1,155 +0,0 @@
|
||||
{% 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" %}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user