Walmart script in production! And more notes.
BIN
Custom_Templates/customer_templates/.DS_Store
vendored
@ -0,0 +1,46 @@
|
||||
<form class="np-form" action="{{ form.options.action }}" method="post" id="desktop_edit_learner" novalidate>
|
||||
<input type="hidden" name="_method" value="{{ form.options.http_method }}">
|
||||
{% form_authenticity_token %}
|
||||
<div class="np-card">
|
||||
<div class="np-card-container np-card-padding">
|
||||
<div class="row">
|
||||
<div class="col-sm-7 np-account-form">
|
||||
{% render "account_form", form: form, version: "desktop" %}
|
||||
<button type="submit" class="green-gradient-button np-button-large-font np-form-action">
|
||||
{% t shared.account.save %}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-sm-5 np-account-avatar">
|
||||
{% include "account_avatar", version: "desktop" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
<style>
|
||||
.np-card-container {
|
||||
background: none;
|
||||
}
|
||||
.np-input-label {
|
||||
color: #fff;
|
||||
font-size: 1rem;
|
||||
}
|
||||
.np-resource-title {
|
||||
color: #fff;
|
||||
}
|
||||
@media screen and (min-width: 768px) {
|
||||
.np-account-avatar p {
|
||||
color: #fff;
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
.np-card-container, .np-card-container-training-session {
|
||||
box-shadow: none;
|
||||
}
|
||||
.np-account-avatar-choice .np-form-field .np-input-label {
|
||||
font-size:1rem;
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,17 @@
|
||||
<form class="np-form" action="{{ form.options.action }}" method="post" id="mobile_edit_learner" novalidate>
|
||||
<input type="hidden" name="_method" value="{{ form.options.http_method }}">
|
||||
{% form_authenticity_token %}
|
||||
<div class="np-card np-account-form">
|
||||
<div class="np-card-container np-card-padding">
|
||||
{% render "account_form", form: form, version: "mobile" %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-card np-account-avatar">
|
||||
<div class="np-card-container np-card-padding">
|
||||
{% include "account_avatar", version: "mobile" %}
|
||||
</div>
|
||||
</div>
|
||||
<button type="submit" class="green-gradient-button np-button-large-font np-form-action">
|
||||
{% t shared.account.save %}
|
||||
</button>
|
||||
</form>
|
||||
@ -0,0 +1,51 @@
|
||||
<div class="np-card-container">
|
||||
<div class="np-resource-header np-course-header np-card-padding-large">
|
||||
{% include "course_header" %}
|
||||
</div>
|
||||
<div class="np-divider"></div>
|
||||
<div class="row np-course-content np-card-padding-dynamic">
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
<img
|
||||
src="{{ course.image_url }}"
|
||||
class="np-top-image np-top-image-spacing"
|
||||
alt="{{ course.name }}"
|
||||
/>
|
||||
{% include "course_description" %}
|
||||
|
||||
{% if course.categories.any? %}
|
||||
<div class="np-card-content-divider">
|
||||
{% include "course_categories" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if course.instructors.any? %}
|
||||
<div class="np-card-content-divider">
|
||||
{% include "course_instructors" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if course.events.any? %}
|
||||
<div class="np-card-content-divider">
|
||||
{% include "course_events" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="np-grid-spacing col-xs-12 col-sm-6">
|
||||
<div class="np-top-cta">
|
||||
{% include "course_progress_and_cta" %}
|
||||
</div>
|
||||
{% include "course_outline" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.np-card-container {
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
}
|
||||
.np-top-cta {
|
||||
background: none;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,25 @@
|
||||
<div class="np-top-vocabulary np-text-title np-text-muted">
|
||||
{{ current_school.course_vocabulary }}
|
||||
<i class="far fa-graduation-cap np-button-color np-learning-path-icon np-hidden-mobile">
|
||||
</i>
|
||||
</div>
|
||||
<div class="np-top-title">
|
||||
<a href="{% route home %}" class="np-back-button" aria-label="{% t shared.go_back %}">
|
||||
<i class="far fa-arrow-left np-hidden-mobile np-icon-back"></i>
|
||||
</a>
|
||||
{{ course.name }}
|
||||
</div>
|
||||
<img
|
||||
src="{{ course.image_url }}"
|
||||
class="np-top-image np-hidden-desktop"
|
||||
alt="{{ course.name }}"
|
||||
/>
|
||||
<style>
|
||||
.np-top-title {
|
||||
color: #fff;
|
||||
}
|
||||
.np-text-title {
|
||||
color: #fff;
|
||||
opacity: 1;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,50 @@
|
||||
<div class="np-course-outline">
|
||||
<div class="np-text-title np-course-outline-title">
|
||||
{% t .header, key: current_school.course_vocabulary %}
|
||||
</div>
|
||||
<div class="np-course-outline-content">
|
||||
<ol class="np-course-outline-content-section">
|
||||
{% for section in course.sections %}
|
||||
<li class="np-course-outline-content-section-list">
|
||||
<div class="np-course-outline-content-section-name np-text-title-bold np-text-title-bold">
|
||||
{{ section.name }}
|
||||
</div>
|
||||
<ol class="np-course-outline-content-activity">
|
||||
{% for activity in section.activities %}
|
||||
|
||||
<li class="np-course-outline-content-activity-list">
|
||||
{% if activity.completed? %}
|
||||
<i class="fas fa-circle np-course-outline-content-activity-icon np-button-color"></i>
|
||||
{% if activity.locked? %}
|
||||
{% include "course_activity_locked" %}
|
||||
{% else %}
|
||||
{% include "course_activity_unlocked", class: "np-course-outline-content-activity-link-completed" %}
|
||||
{% endif %}
|
||||
<div class="np-button-background-color np-course-outline-content-activity-list-bar"></div>
|
||||
{% else %}
|
||||
<i class="far fa-circle np-course-outline-content-activity-icon"></i>
|
||||
{% if activity.locked? %}
|
||||
{% include "course_activity_locked" %}
|
||||
{% else %}
|
||||
{% include "course_activity_unlocked", class: "np-course-outline-content-activity-link" %}
|
||||
{% endif %}
|
||||
<div class="np-course-outline-content-activity-list-bar"></div>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.np-course-outline-content-activity-link-completed {
|
||||
color: #fff;
|
||||
}
|
||||
.np-course-outline-content-activity-link {
|
||||
color: #fff;
|
||||
opacity: 0.7;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,57 @@
|
||||
<div class="np-top-cta-progress-content">
|
||||
<div class="np-top-cta-progress-title np-text-title">
|
||||
{% t .header %}
|
||||
</div>
|
||||
<div class="np-progress-bar-container">
|
||||
<div
|
||||
style="width: {{ course.progress }}%"
|
||||
class="np-button-background-color np-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="np-top-cta-progress-text
|
||||
{% if course.completed? %} np-color-success {% else %} np-button-color {% endif %}
|
||||
">
|
||||
{% t shared.progress, count: course.progress %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% 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="green-gradient-button" style="min-width: 130px;"
|
||||
{% 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-cta-progress-content {
|
||||
background: none;
|
||||
}
|
||||
@media only screen and (max-width: 770px) {
|
||||
.np-top-cta-progress-content {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,110 @@
|
||||
<footer class="np-footer">
|
||||
<div class="footer">
|
||||
<div class="footer-column">
|
||||
<img class="footer-column1-logo" src="{{current_school.logo_url}}">
|
||||
<div class="footer-column1-text">
|
||||
© 2021 Isoplexis | All Rights Reserved For Research Use Only. Not for Use in Diagnostic Procedures.
|
||||
</div>
|
||||
<div class="footer-column1-link">
|
||||
<a href="https://isoplexis.com/privacy-policy/">Privacy Policy</a> | <a href="https://isoplexis.com/terms-and-conditions/">Terms and Conditions</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-column" id="hide">
|
||||
<div class="footer-column2-upper">
|
||||
Research Areas
|
||||
</div>
|
||||
<a href="https://isoplexis.com/research-areas/checkpoint-combination-immunotherapies/" class="footer-column2-main">Cancer Immunology</a>
|
||||
<a href="https://isoplexis.com/research-areas/vaccines-and-immunology-research/" class="footer-column2-main">Infectious Disease & Vaccines</a>
|
||||
<a href="https://isoplexis.com/research-areas/cell-therapy/" class="footer-column2-main">Cellular & Regenerative Medicine</a>
|
||||
<a href="https://isoplexis.com/research-areas/inflammatory-auto-immune-disease/" class="footer-column2-main">Inflammation & Neurology</a>
|
||||
<a href="https://isoplexis.com/research-areas/solid-tumor-oncology/" class="footer-column2-main">Oncology</a>
|
||||
</div>
|
||||
<div class="footer-column" id="hide">
|
||||
<div class="footer-column2-upper">
|
||||
Company
|
||||
</div>
|
||||
<a href="https://isoplexis.com/company/about-us/" class="footer-column2-main">About Us</a>
|
||||
<a href="https://isoplexis.com/office-locations/" class="footer-column2-main">Locations</a>
|
||||
<a href="https://isoplexis.com/company/locations-distributors/distributors/" class="footer-column2-main">Distributors</a>
|
||||
<a href="https://isoplexis.com/company/isoplexis-news/" class="footer-column2-main">News</a>
|
||||
<a href="https://isoplexis.com/company/isoplexis-events/" class="footer-column2-main">Events</a>
|
||||
<a href="https://isoplexis.com/company/careers/" class="footer-column2-main">Careers</a>
|
||||
</div>
|
||||
<div class="footer-column" id="hide2">
|
||||
<div class="footer-column2-upper">
|
||||
Contact
|
||||
</div>
|
||||
<span class="footer-column1-text">IsoPlexis Office 35 NE Industrial Rd, Branford, CT 06405</span>
|
||||
<a href="https://isoplexis.com/contact/" class="footer-column1-link">Contact IsoPlexis</a>
|
||||
<a href="https://isoplexis.com/speak-to-an-expert/" class="footer-column1-link">Speak to an Expert</a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<style>
|
||||
.np-footer{
|
||||
background: none;
|
||||
margin: 60px auto 0;
|
||||
padding: unset;
|
||||
}
|
||||
.footer {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
max-width: 1300px;
|
||||
}
|
||||
.footer-column {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
max-width: 20%;
|
||||
padding: 0 20px
|
||||
}
|
||||
.footer-column1-logo {
|
||||
margin-bottom: 20px;
|
||||
width: 220px;
|
||||
}
|
||||
.footer-column1-text {
|
||||
color: #9baebf;
|
||||
line-height: 1.3;
|
||||
}
|
||||
.footer-column1-link{
|
||||
color: #fff;
|
||||
line-height: 1.3;
|
||||
}
|
||||
.footer-column2-upper {
|
||||
margin-bottom: 20px;
|
||||
font-size: 1.6rem;
|
||||
position: relative;
|
||||
top: 15px;
|
||||
min-height: 56px;
|
||||
display: flex;
|
||||
}
|
||||
.footer-column2-main {
|
||||
color: #9baebf;
|
||||
padding-bottom: 8px;
|
||||
white-space: nowrap
|
||||
}
|
||||
@media only screen and (max-width: 1200px) {
|
||||
.footer {
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 900px) {
|
||||
#hide {
|
||||
display: none;
|
||||
}
|
||||
.footer-column {
|
||||
max-width: 30%;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 500px) {
|
||||
#hide2 {
|
||||
display: none;
|
||||
}
|
||||
.footer-column {
|
||||
max-width: 80%;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,224 @@
|
||||
<header class="np-header">
|
||||
<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"
|
||||
/>
|
||||
<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 %}
|
||||
{% 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 {
|
||||
background: none;
|
||||
max-width: 1300px;
|
||||
margin: auto;
|
||||
}
|
||||
.np-header-mobile-menu-content {
|
||||
background: linear-gradient(0deg, #080b20 0%, #0f152c 100%);
|
||||
}
|
||||
.np-header-mobile-menu-content-button {
|
||||
background: #000;
|
||||
color: #fff;
|
||||
font-size: 1rem;
|
||||
}
|
||||
.np-header-search-input {
|
||||
border: none;
|
||||
background: none;
|
||||
color: #fff;
|
||||
}
|
||||
.np-header-mobile-menu-content-name {
|
||||
color: #fff;
|
||||
font-size: 24px;
|
||||
}
|
||||
.np-header-search-icon {
|
||||
color: #fff;
|
||||
}
|
||||
.np-header-mobile-menu-content-button.np-danger {
|
||||
color:crimson;
|
||||
margin:2.25rem 0;
|
||||
font-weight: 800;
|
||||
font-size: 1.1rem;
|
||||
border: none;
|
||||
}
|
||||
::placeholder {
|
||||
opacity: 0.8 !important;
|
||||
color: #fff !important;
|
||||
font-style: italic;
|
||||
font-size: 1.1rem !important;
|
||||
}
|
||||
@media only screen and (max-width: 767px) {
|
||||
.np-header-search-input {
|
||||
background: #000;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,37 @@
|
||||
<div class="np-card np-search-result">
|
||||
<div class="np-card-container">
|
||||
<div class="np-card-content">
|
||||
<img
|
||||
class="np-search-result-image"
|
||||
alt="{{ result.name }}"
|
||||
src="{{ result.image_url }}"
|
||||
/>
|
||||
<div class="np-search-result-content">
|
||||
<div>
|
||||
<a class="np-search-result-title" href="{{ result.path }}">
|
||||
{{ result.name }}
|
||||
</a>
|
||||
</div>
|
||||
<div class="np-search-result-snippet">{{ result.sanitized_description }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<style>
|
||||
.np-resource-title {
|
||||
color: #fff;
|
||||
}
|
||||
.np-resource-subtitle {
|
||||
color: rgba(255, 2555, 255, 0.7);
|
||||
}
|
||||
.np-search .np-resource-subtitle-number {
|
||||
color: #fff;
|
||||
}
|
||||
.np-card-container, .np-card-container-training-session {
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.np-search-result-title {
|
||||
color: #fff;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,40 @@
|
||||
<div class="np-card np-search-zero-state">
|
||||
<div class="np-card-container">
|
||||
<div class="np-card-content np-card-content-vertical np-search-zero-state-card">
|
||||
<h3 class="np-search-zero-state-title">
|
||||
{% t .nothing_found %}
|
||||
</h3>
|
||||
<div class="np-search-zero-state-subtitle">
|
||||
{% t .empty %}
|
||||
</div>
|
||||
<div class="np-search-zero-state-image"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.np-card-container {
|
||||
background: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
.np-search-zero-state-title {
|
||||
/* color: #35404e; */
|
||||
color: #fff;
|
||||
}
|
||||
.np-search .np-resource-subtitle-number {
|
||||
/* color: #35404e; */
|
||||
color: #fff;
|
||||
}
|
||||
.np-search-zero-state-subtitle {
|
||||
/* color: #59697b; */
|
||||
color: rgba(255, 2555, 255, 0.7);
|
||||
}
|
||||
.np-resource-title {
|
||||
/* color: #35404e; */
|
||||
color: #fff;
|
||||
}
|
||||
.np-resource-subtitle {
|
||||
/* color: #59697b; */
|
||||
color: rgba(255, 2555, 255, 0.7);
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,487 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.featured %}
|
||||
<main class="np-main np-homepage">
|
||||
<div class="homepage-title" >
|
||||
<div class="homepage-title-text">
|
||||
<div class="homepage-title-text-headline">
|
||||
<span class="isogreen" style="font-size: 1.4rem; white-space: nowrap;">EDUCATION & TRAINING CENTER</span>
|
||||
IsoPlexis <span class="isogreen">UNIVERSITY</span>
|
||||
</div>
|
||||
<div class="homepage-title-text-subline">
|
||||
Transform your immunotherapy programs with the latest data & insights from our <span class="isogreen">cutting edge work </span>in single-cell proteomics.
|
||||
</div>
|
||||
</div>
|
||||
<img class="homepage-title-image" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/isou-home-hero-logo%402x.png">
|
||||
</div>
|
||||
<img class="homepage-main-image" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/isou-hero-home-wide%402x(1).jpg"></img>
|
||||
|
||||
<div class="homepage-advantage">
|
||||
<div class="homepage-advantage-slide">
|
||||
<img class="homepage-advantage-slide-left" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/index1.png">
|
||||
<div class=homepage-advantage-slide-right>
|
||||
<div class="homepage-advantage-slide-right-top">HD Video Protocols</div>
|
||||
<div class="homepage-advantage-slide-right-bottom">Watch short step-by-step protocol videos to simplify your workflow</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="homepage-advantage-slide" style="padding: 15px 30px;">
|
||||
<img class="homepage-advantage-slide-left" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/index.png">
|
||||
<div class=homepage-advantage-slide-right>
|
||||
<div class="homepage-advantage-slide-right-top">Support Resources</div>
|
||||
<div class="homepage-advantage-slide-right-bottom">Download detailed guides, tech notes & reference new publications</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="homepage-advantage-slide">
|
||||
<img class="homepage-advantage-slide-left" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/index2.png">
|
||||
<div class=homepage-advantage-slide-right>
|
||||
<div class="homepage-advantage-slide-right-top">Expert Webinars</div>
|
||||
<div class="homepage-advantage-slide-right-bottom">Hear from thought leaders in single-cell biology & functional proteomics</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% assign LP = learning_paths.available | where: "name", "Experiment Run" %} {% assign LP = LP.first %}
|
||||
<div class="homepage-content" style="padding-top: 70px;">
|
||||
<div class="homepage-training">
|
||||
<div class="homepage-training-headline">
|
||||
<div class="homepage-training-headline-textes">
|
||||
<span class="isogreen" style="font-weight: 800; font-size: 1.3rem;">GET STARTED</span>
|
||||
<span style="font-size: 2.4rem;">{{LP.name}}</span>
|
||||
<span style="font-size: 20px; color: #a7aed1">{{LP.description}}</span>
|
||||
</div>
|
||||
<div class="homepage-training-headline-right">
|
||||
<span class="isogreen" style="font-weight: 800; font-size: 1.3rem; padding-bottom: 10px;">MASTER THE ISOU</span>
|
||||
<button class="homepage-training-headline-right-button green-gradient-button"> <img src="https://s3.amazonaws.com/static.northpass.com/Isoplex/isou-icon-certification-badge-lg-flat-dark%402x.png" height="30px">
|
||||
<span style="align-self: center;padding-left: 10px;">Get Certified</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% assign descriptions = ". Accelerate yours sample prep with how-to videos&protocols. Learn how to run your samples on the automated IsoLight system. Generate meaningful data in seconds, not days. Accelerate your sample prep with how-to videos & protocols" | split: ". " %}
|
||||
<div class="homepage-content-modules">
|
||||
{% for LPC in LP.items %}
|
||||
<div style="display: none;">{% increment my_counter1 %}</div>
|
||||
{% if my_counter1 == 1 or my_counter1 == 3 %} <div class="homepage-content-modules-group"> {%endif%}
|
||||
<a class="homepage-content-modules-module module-1" href="/../../app/courses/{{LPC.id}}">
|
||||
<div class="homepage-content-modules-module-number">
|
||||
MODULE {{my_counter1}}
|
||||
</div>
|
||||
<div class=homepage-content-modules-module-circle>
|
||||
<img class="homepage-content-modules-module-circle-image" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/isoplex-modules1-{{my_counter1}}.png">
|
||||
</div>
|
||||
<div class="homepage-content-modules-module-title">
|
||||
{{LPC.name}}
|
||||
</div>
|
||||
<div class="homepage-content-modules-module-description">
|
||||
{{descriptions[my_counter1]}}
|
||||
</div>
|
||||
</a>
|
||||
{% if my_counter1 == 2 or my_counter1 == 4 %} </div> {%endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
{% assign LP = learning_paths.available | where: "name", "How the IsoLight Works" %} {% assign LP = LP.first %}
|
||||
<div class="homepage-content" style="padding-top: 70px;">
|
||||
<div class="homepage-training">
|
||||
<div class="homepage-training-headline">
|
||||
<div class="homepage-training-headline-textes">
|
||||
<span style="font-size: 2.4rem;">{{LP.name}}</span>
|
||||
<span style="font-size: 20px; color: #a7aed1">{{LP.description}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% assign descriptions = ". Learn how CO2 supports incubation and fluidics on the IsoLight System. Fluidics are at the core of the IsoLight platform. Disposal of used reagents is critical. How IsoPlexis' unique single-cell and CodePlex chips works" | split: ". " %}
|
||||
<div class="homepage-content-modules">
|
||||
{% for LPC in LP.items %}
|
||||
<div style="display: none;">{% increment my_counter2 %}</div>
|
||||
{% if my_counter2 == 1 or my_counter2 == 3 %} <div class="homepage-content-modules-group"> {%endif%}
|
||||
<a class="homepage-content-modules-module module-2" href="/../../app/courses/{{LPC.id}}">
|
||||
<div class="homepage-content-modules-module-number">
|
||||
MODULE {{my_counter2}}
|
||||
</div>
|
||||
<div class=homepage-content-modules-module-circle>
|
||||
<img class="homepage-content-modules-module-circle-image" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/isoplex-modules2-{{my_counter2}}.png">
|
||||
</div>
|
||||
<div class="homepage-content-modules-module-title">
|
||||
{{LPC.name}}
|
||||
</div>
|
||||
<div class="homepage-content-modules-module-description">
|
||||
{{descriptions[my_counter2]}}
|
||||
</div>
|
||||
</a>
|
||||
{% if my_counter2 == 2 or my_counter2 == 4 %} </div> {%endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% assign LP = learning_paths.available | where: "name", "System Troubleshooting" %} {% assign LP = LP.first %}
|
||||
<div class="homepage-content" style="padding-top: 70px;">
|
||||
<div class="homepage-training">
|
||||
<div class="homepage-training-headline">
|
||||
<div class="homepage-training-headline-textes">
|
||||
<span style="font-size: 2.4rem;">{{LP.name}}</span>
|
||||
<span style="font-size: 20px; color: #a7aed1">{{LP.description}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% assign descriptions = ". The barcode scanner reads QR labels on each individual chip. Fluidics maintenance and upkeep. Proper lase function is essential for imaging. Airflow and appropriate waste disposal procedures" | split: ". " %}
|
||||
<div class="homepage-content-modules">
|
||||
{% for LPC in LP.items %}
|
||||
<div style="display: none;">{% increment my_counter3 %}</div>
|
||||
{% if my_counter3 == 1 or my_counter3 == 3 %} <div class="homepage-content-modules-group"> {%endif%}
|
||||
<a class="homepage-content-modules-module module-3" href="/../../app/courses/{{LPC.id}}">
|
||||
<div class="homepage-content-modules-module-number">
|
||||
MODULE {{my_counter3}}
|
||||
</div>
|
||||
<div class=homepage-content-modules-module-circle>
|
||||
<img class="homepage-content-modules-module-circle-image" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/isoplex-modules3-{{my_counter3}}.png">
|
||||
</div>
|
||||
<div class="homepage-content-modules-module-title">
|
||||
{{LPC.name}}
|
||||
</div>
|
||||
<div class="homepage-content-modules-module-description">
|
||||
{{descriptions[my_counter3]}}
|
||||
</div>
|
||||
</a>
|
||||
{% if my_counter3 == 2 or my_counter3 == 4 %} </div> {%endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% assign LP = learning_paths.available | where: "name", "Network Troubleshooting" %} {% assign LP = LP.first %}
|
||||
<div class="homepage-content" style="padding-top: 70px;">
|
||||
<div class="homepage-training">
|
||||
<div class="homepage-training-headline">
|
||||
<div class="homepage-training-headline-textes">
|
||||
<span style="font-size: 2.4rem;">{{LP.name}}</span>
|
||||
<span style="font-size: 20px; color: #a7aed1">{{LP.description}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% assign descriptions = ". What a correctly configured home screen should look like. Networking FAQs and answers to common questions. Steps to take when encountering network issues. Data managment is a critical component of instrument maintenance" | split: ". " %}
|
||||
<div class="homepage-content-modules">
|
||||
{% for LPC in LP.items %}
|
||||
<div style="display: none;">{% increment my_counter4 %}</div>
|
||||
{% if my_counter4 == 1 or my_counter4 == 3 %} <div class="homepage-content-modules-group"> {%endif%}
|
||||
<a class="homepage-content-modules-module module-4" href="/../../app/courses/{{LPC.id}}">
|
||||
<div class="homepage-content-modules-module-number">
|
||||
MODULE {{my_counter4}}
|
||||
</div>
|
||||
<div class=homepage-content-modules-module-circle>
|
||||
<img class="homepage-content-modules-module-circle-image" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/isoplex-modules4-{{my_counter4}}.png">
|
||||
</div>
|
||||
<div class="homepage-content-modules-module-title">
|
||||
{{LPC.name}}
|
||||
</div>
|
||||
<div class="homepage-content-modules-module-description">
|
||||
{{descriptions[my_counter4]}}
|
||||
</div>
|
||||
</a>
|
||||
{% if my_counter4 == 2 or my_counter4 == 4 %} </div> {%endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.np-homepage {
|
||||
background: none;
|
||||
max-width: 1300px;
|
||||
margin: auto;
|
||||
}
|
||||
.homepage-title {
|
||||
height: auto;
|
||||
height: auto;
|
||||
padding-bottom: 70px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.homepage-main-image {
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
width: 1490px;
|
||||
top: 0;
|
||||
background-repeat: no-repeat;
|
||||
opacity: 0.7;
|
||||
top: 100px;
|
||||
height: 570px;
|
||||
mix-blend-mode: lighten;
|
||||
right: calc(calc(100vw - 1300px)/2);
|
||||
}
|
||||
.homepage-title-text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-left: 4%;
|
||||
}
|
||||
.homepage-title-text-headline{
|
||||
font-size: calc(6vw + 30px);
|
||||
max-width: 200px;
|
||||
line-height: 1;
|
||||
}
|
||||
.homepage-title-text-subline {
|
||||
padding-top: 20px;
|
||||
max-width: 730px;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
.homepage-title-image {
|
||||
height: 400px;
|
||||
margin-top: 20px;
|
||||
margin-right: 5%;
|
||||
}
|
||||
.homepage-advantage{
|
||||
margin: auto;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
padding: 20px 10px;
|
||||
}
|
||||
.homepage-advantage-slide{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding: 15px 0;
|
||||
}
|
||||
.homepage-advantage-slide-left {
|
||||
height: 72px;
|
||||
width: 72px;
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.homepage-advantage-slide-right {
|
||||
align-self: center;
|
||||
max-width: 300px;
|
||||
}
|
||||
.homepage-advantage-slide-right-top {
|
||||
font-weight: 600;
|
||||
color: #fff;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
.homepage-advantage-slide-right-bottom {
|
||||
color: #a7aed1;
|
||||
line-height: 1.3;
|
||||
}
|
||||
.homepage-training-headline {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
padding: 0 20px;
|
||||
}
|
||||
.homepage-training-headline-textes {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
max-width: 50%;
|
||||
}
|
||||
.homepage-training-headline-right {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-self: center;
|
||||
}
|
||||
.homepage-training-headline-right-button {
|
||||
display: flex;
|
||||
align-content: center;
|
||||
}
|
||||
.homepage-content-modules {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
margin-top: 50px;
|
||||
align-items: center;
|
||||
}
|
||||
.homepage-content-modules-group {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.homepage-content-modules-module-number {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 15px;
|
||||
font-size: 25px;
|
||||
font-weight: 900;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.homepage-content-modules-module {
|
||||
background-position-x: 0%;
|
||||
background-position-y: 0%;
|
||||
background-size: auto;
|
||||
background-size: auto 200% !important;
|
||||
background-position: center top !important;
|
||||
transition: all .6s ease !important;
|
||||
transition-duration: .2s;
|
||||
transition-timing-function: linear;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin: 0 15px;
|
||||
flex-direction: column;
|
||||
width: 300px;
|
||||
}
|
||||
.module-1 {
|
||||
background: linear-gradient(180deg,#0DD1DB 0%,#2AAFDD 10%,#528DE2 20%,#264CAC 45%,#25359E 65%,#6533A4 90%);
|
||||
}
|
||||
.module-2 {
|
||||
background: linear-gradient(180deg,#4053EE 0%, #5942CA 50%, #762EA3 100%);
|
||||
}
|
||||
.module-3 {
|
||||
background: linear-gradient(180deg,#1AF1A1 0%, #08D5AC 50%, #228193 100%);
|
||||
}
|
||||
.module-4 {
|
||||
background: linear-gradient(180deg,#FCBC02 0%, #FDA14C 50%, #FF4B01 100%);
|
||||
}
|
||||
.homepage-content-modules-module-circle-image{
|
||||
height: 100px;
|
||||
width: auto;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin: auto;
|
||||
}
|
||||
.homepage-content-modules-module-circle {
|
||||
background-color: #000;
|
||||
border-radius: 50%;
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.homepage-content-modules-module-title {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
font-size: 28px;
|
||||
font-weight: 500;
|
||||
min-height: 95px;
|
||||
width: 90%;
|
||||
margin: auto;
|
||||
}
|
||||
.homepage-content-modules-module-description {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
padding-bottom: 20px;
|
||||
width: 75%;
|
||||
margin: auto;
|
||||
font-size: 20px;
|
||||
min-height: 89px;
|
||||
}
|
||||
.homepage-content-modules-module:hover {
|
||||
background-position: 100% 50% !important;
|
||||
}
|
||||
@media only screen and (min-width: 1400px) {
|
||||
.homepage-title-text-headline {
|
||||
font-size: 114px;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 1320px) {
|
||||
.homepage-content-modules-module {
|
||||
width: 250px;
|
||||
}
|
||||
.homepage-content-modules-module-title {
|
||||
font-size: 20px;
|
||||
min-height: 76px;
|
||||
}
|
||||
.homepage-content-modules-module-description {
|
||||
font-size: 16px;
|
||||
min-height: 76px;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 1300px) {
|
||||
.homepage-main-image {
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 1100px) {
|
||||
.homepage-content-modules {
|
||||
flex-direction: column;
|
||||
}
|
||||
.homepage-content-modules-group {
|
||||
padding-top: 30px;
|
||||
}
|
||||
.homepage-content-modules-module {
|
||||
width: 300px;
|
||||
}
|
||||
.homepage-content-modules-module-title {
|
||||
font-size: 28px;
|
||||
min-height: 95px;
|
||||
}
|
||||
.homepage-content-modules-module-description {
|
||||
font-size: 20px;
|
||||
min-height: 89px;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 850px) {
|
||||
.homepage-title-image {
|
||||
display: none;
|
||||
}
|
||||
.homepage-main-image {
|
||||
display: none;
|
||||
}
|
||||
.homepage-title-text-subline {
|
||||
max-width: 60%;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 700px) {
|
||||
.homepage-content-modules-module {
|
||||
width: 250px;
|
||||
}
|
||||
.homepage-content-modules-module-title {
|
||||
font-size: 20px;
|
||||
min-height: 76px;
|
||||
}
|
||||
.homepage-content-modules-module-description {
|
||||
font-size: 16px;
|
||||
min-height: 76px;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 650px) {
|
||||
.homepage-advantage-slide {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 550px) {
|
||||
.homepage-title-text-subline {
|
||||
max-width: 80%;
|
||||
}
|
||||
.homepage-content-modules-module {
|
||||
margin: 5px;
|
||||
width: 50%;
|
||||
}
|
||||
.homepage-content-modules-module-description {
|
||||
display: none;
|
||||
}
|
||||
.homepage-training-headline {
|
||||
flex-direction: column;
|
||||
}
|
||||
.homepage-training-headline-textes {
|
||||
max-width: 100%;
|
||||
}
|
||||
.homepage-training-headline-right {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.homepage-content-modules-group {
|
||||
width: 95%;
|
||||
justify-content: center;
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
.homepage-title-image {
|
||||
animation-duration: 3s;
|
||||
animation-name: levitation;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
@keyframes levitation {
|
||||
from {
|
||||
margin-top: 20px;
|
||||
}
|
||||
50% {
|
||||
margin-top: 0;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
to {
|
||||
margin-top: 20;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,69 @@
|
||||
<main class="np-main np-box-container">
|
||||
<div class="np-box">
|
||||
{% include "header_minimal" %}
|
||||
<div class="np-box-content-container">
|
||||
<form class="np-form np-box-content" action="{% route login %}" method="post" novalidate>
|
||||
{% form_authenticity_token %}
|
||||
<div class="np-form-field">
|
||||
<label class="np-input-label" for="learner_email">
|
||||
{% t shared.email_address %}
|
||||
</label>
|
||||
<input
|
||||
class="np-input"
|
||||
autofocus="autofocus"
|
||||
type="email"
|
||||
name="learner[email]"
|
||||
id="learner_email"
|
||||
>
|
||||
</div>
|
||||
<div class="np-form-field">
|
||||
<label class="np-input-label" for="learner_password">
|
||||
{% t shared.password %}
|
||||
</label>
|
||||
<input
|
||||
class="np-input"
|
||||
type="password"
|
||||
name="learner[password]"
|
||||
id="learner_password"
|
||||
>
|
||||
</div>
|
||||
<button type="submit" class="green-gradient-button np-button-large-font np-form-action">
|
||||
{% t shared.sign_in %}
|
||||
</button>
|
||||
<a class="np-form-link np-button-color" href="{% route forgot_password_new %}">
|
||||
{% t .forgot_password %}
|
||||
</a>
|
||||
{% if features.account_creation? %}
|
||||
<a class="np-form-link np-button-color" href="{% route sign_up %}">
|
||||
{% t shared.sign_up %}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if features.request_access? %}
|
||||
<a
|
||||
class="np-form-link np-button-color"
|
||||
target="_blank"
|
||||
href="{{ current_school.request_access_link }}"
|
||||
>
|
||||
{{ current_school.request_access_label }}
|
||||
</a>
|
||||
{% endif %}
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<style>
|
||||
|
||||
.np-box {
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.np-input-label {
|
||||
color: #fff;
|
||||
font-size: 1rem;
|
||||
}
|
||||
.np-header-color {
|
||||
background: none;
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,42 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,300;0,400;0,600;1,300;1,400&display=swap');
|
||||
|
||||
.isogreen {
|
||||
color: #12cd9a;
|
||||
}
|
||||
|
||||
.green-gradient-button {
|
||||
background-image: linear-gradient(45deg, rgb(17, 201, 162) 0%, rgb(4, 170, 205) 40%, rgb(16, 69, 218) 65%, rgb(94, 59, 157) 100%);
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
padding: 15px;
|
||||
font-size: 1.2rem;
|
||||
font-weight: 600;
|
||||
text-transform: none;
|
||||
transition-delay: 0s;
|
||||
transition-duration: 0.8s;
|
||||
transition-property: all;
|
||||
transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1) !important;
|
||||
background-size: 300% auto !important;
|
||||
background-position: 0 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.green-gradient-button:hover {
|
||||
background-position: 100% 50%;
|
||||
}
|
||||
|
||||
body {
|
||||
background: linear-gradient(0deg, #080b20 0%, #0f152c 100%);
|
||||
font-family: 'Source Sans Pro', sans-serif;
|
||||
font-weight: 400;
|
||||
color: #fff;
|
||||
margin: 0;
|
||||
background-repeat: no-repeat;
|
||||
background-attachment: fixed;
|
||||
}
|
||||
a {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
@ -0,0 +1,46 @@
|
||||
<form class="np-form" action="{{ form.options.action }}" method="post" id="desktop_edit_learner" novalidate>
|
||||
<input type="hidden" name="_method" value="{{ form.options.http_method }}">
|
||||
{% form_authenticity_token %}
|
||||
<div class="np-card">
|
||||
<div class="np-card-container np-card-padding">
|
||||
<div class="row">
|
||||
<div class="col-sm-7 np-account-form">
|
||||
{% render "account_form", form: form, version: "desktop" %}
|
||||
<button type="submit" class="green-gradient-button np-button-large-font np-form-action">
|
||||
{% t shared.account.save %}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-sm-5 np-account-avatar">
|
||||
{% include "account_avatar", version: "desktop" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
<style>
|
||||
.np-card-container {
|
||||
background: none;
|
||||
}
|
||||
.np-input-label {
|
||||
color: #fff;
|
||||
font-size: 1rem;
|
||||
}
|
||||
.np-resource-title {
|
||||
color: #fff;
|
||||
}
|
||||
@media screen and (min-width: 768px) {
|
||||
.np-account-avatar p {
|
||||
color: #fff;
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
.np-card-container, .np-card-container-training-session {
|
||||
box-shadow: none;
|
||||
}
|
||||
.np-account-avatar-choice .np-form-field .np-input-label {
|
||||
font-size:1rem;
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,17 @@
|
||||
<form class="np-form" action="{{ form.options.action }}" method="post" id="mobile_edit_learner" novalidate>
|
||||
<input type="hidden" name="_method" value="{{ form.options.http_method }}">
|
||||
{% form_authenticity_token %}
|
||||
<div class="np-card np-account-form">
|
||||
<div class="np-card-container np-card-padding">
|
||||
{% render "account_form", form: form, version: "mobile" %}
|
||||
</div>
|
||||
</div>
|
||||
<div class="np-card np-account-avatar">
|
||||
<div class="np-card-container np-card-padding">
|
||||
{% include "account_avatar", version: "mobile" %}
|
||||
</div>
|
||||
</div>
|
||||
<button type="submit" class="green-gradient-button np-button-large-font np-form-action">
|
||||
{% t shared.account.save %}
|
||||
</button>
|
||||
</form>
|
||||
@ -0,0 +1,51 @@
|
||||
<div class="np-card-container">
|
||||
<div class="np-resource-header np-course-header np-card-padding-large">
|
||||
{% include "course_header" %}
|
||||
</div>
|
||||
<div class="np-divider"></div>
|
||||
<div class="row np-course-content np-card-padding-dynamic">
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
<img
|
||||
src="{{ course.image_url }}"
|
||||
class="np-top-image np-top-image-spacing"
|
||||
alt="{{ course.name }}"
|
||||
/>
|
||||
{% include "course_description" %}
|
||||
|
||||
{% if course.categories.any? %}
|
||||
<div class="np-card-content-divider">
|
||||
{% include "course_categories" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if course.instructors.any? %}
|
||||
<div class="np-card-content-divider">
|
||||
{% include "course_instructors" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if course.events.any? %}
|
||||
<div class="np-card-content-divider">
|
||||
{% include "course_events" %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
<div class="np-grid-spacing col-xs-12 col-sm-6">
|
||||
<div class="np-top-cta">
|
||||
{% include "course_progress_and_cta" %}
|
||||
</div>
|
||||
{% include "course_outline" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.np-card-container {
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
}
|
||||
.np-top-cta {
|
||||
background: none;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,25 @@
|
||||
<div class="np-top-vocabulary np-text-title np-text-muted">
|
||||
{{ current_school.course_vocabulary }}
|
||||
<i class="far fa-graduation-cap np-button-color np-learning-path-icon np-hidden-mobile">
|
||||
</i>
|
||||
</div>
|
||||
<div class="np-top-title">
|
||||
<a href="{% route home %}" class="np-back-button" aria-label="{% t shared.go_back %}">
|
||||
<i class="far fa-arrow-left np-hidden-mobile np-icon-back"></i>
|
||||
</a>
|
||||
{{ course.name }}
|
||||
</div>
|
||||
<img
|
||||
src="{{ course.image_url }}"
|
||||
class="np-top-image np-hidden-desktop"
|
||||
alt="{{ course.name }}"
|
||||
/>
|
||||
<style>
|
||||
.np-top-title {
|
||||
color: #fff;
|
||||
}
|
||||
.np-text-title {
|
||||
color: #fff;
|
||||
opacity: 1;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,50 @@
|
||||
<div class="np-course-outline">
|
||||
<div class="np-text-title np-course-outline-title">
|
||||
{% t .header, key: current_school.course_vocabulary %}
|
||||
</div>
|
||||
<div class="np-course-outline-content">
|
||||
<ol class="np-course-outline-content-section">
|
||||
{% for section in course.sections %}
|
||||
<li class="np-course-outline-content-section-list">
|
||||
<div class="np-course-outline-content-section-name np-text-title-bold np-text-title-bold">
|
||||
{{ section.name }}
|
||||
</div>
|
||||
<ol class="np-course-outline-content-activity">
|
||||
{% for activity in section.activities %}
|
||||
|
||||
<li class="np-course-outline-content-activity-list">
|
||||
{% if activity.completed? %}
|
||||
<i class="fas fa-circle np-course-outline-content-activity-icon np-button-color"></i>
|
||||
{% if activity.locked? %}
|
||||
{% include "course_activity_locked" %}
|
||||
{% else %}
|
||||
{% include "course_activity_unlocked", class: "np-course-outline-content-activity-link-completed" %}
|
||||
{% endif %}
|
||||
<div class="np-button-background-color np-course-outline-content-activity-list-bar"></div>
|
||||
{% else %}
|
||||
<i class="far fa-circle np-course-outline-content-activity-icon"></i>
|
||||
{% if activity.locked? %}
|
||||
{% include "course_activity_locked" %}
|
||||
{% else %}
|
||||
{% include "course_activity_unlocked", class: "np-course-outline-content-activity-link" %}
|
||||
{% endif %}
|
||||
<div class="np-course-outline-content-activity-list-bar"></div>
|
||||
{% endif %}
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.np-course-outline-content-activity-link-completed {
|
||||
color: #fff;
|
||||
}
|
||||
.np-course-outline-content-activity-link {
|
||||
color: #fff;
|
||||
opacity: 0.7;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,57 @@
|
||||
<div class="np-top-cta-progress-content">
|
||||
<div class="np-top-cta-progress-title np-text-title">
|
||||
{% t .header %}
|
||||
</div>
|
||||
<div class="np-progress-bar-container">
|
||||
<div
|
||||
style="width: {{ course.progress }}%"
|
||||
class="np-button-background-color np-card-progress-bar">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="np-top-cta-progress-text
|
||||
{% if course.completed? %} np-color-success {% else %} np-button-color {% endif %}
|
||||
">
|
||||
{% t shared.progress, count: course.progress %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% 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="green-gradient-button" style="min-width: 130px;"
|
||||
{% 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-cta-progress-content {
|
||||
background: none;
|
||||
}
|
||||
@media only screen and (max-width: 770px) {
|
||||
.np-top-cta-progress-content {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,110 @@
|
||||
<footer class="np-footer">
|
||||
<div class="footer">
|
||||
<div class="footer-column">
|
||||
<img class="footer-column1-logo" src="{{current_school.logo_url}}">
|
||||
<div class="footer-column1-text">
|
||||
© 2021 Isoplexis | All Rights Reserved For Research Use Only. Not for Use in Diagnostic Procedures.
|
||||
</div>
|
||||
<div class="footer-column1-link">
|
||||
<a href="https://isoplexis.com/privacy-policy/">Privacy Policy</a> | <a href="https://isoplexis.com/terms-and-conditions/">Terms and Conditions</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-column" id="hide">
|
||||
<div class="footer-column2-upper">
|
||||
Research Areas
|
||||
</div>
|
||||
<a href="https://isoplexis.com/research-areas/checkpoint-combination-immunotherapies/" class="footer-column2-main">Cancer Immunology</a>
|
||||
<a href="https://isoplexis.com/research-areas/vaccines-and-immunology-research/" class="footer-column2-main">Infectious Disease & Vaccines</a>
|
||||
<a href="https://isoplexis.com/research-areas/cell-therapy/" class="footer-column2-main">Cellular & Regenerative Medicine</a>
|
||||
<a href="https://isoplexis.com/research-areas/inflammatory-auto-immune-disease/" class="footer-column2-main">Inflammation & Neurology</a>
|
||||
<a href="https://isoplexis.com/research-areas/solid-tumor-oncology/" class="footer-column2-main">Oncology</a>
|
||||
</div>
|
||||
<div class="footer-column" id="hide">
|
||||
<div class="footer-column2-upper">
|
||||
Company
|
||||
</div>
|
||||
<a href="https://isoplexis.com/company/about-us/" class="footer-column2-main">About Us</a>
|
||||
<a href="https://isoplexis.com/office-locations/" class="footer-column2-main">Locations</a>
|
||||
<a href="https://isoplexis.com/company/locations-distributors/distributors/" class="footer-column2-main">Distributors</a>
|
||||
<a href="https://isoplexis.com/company/isoplexis-news/" class="footer-column2-main">News</a>
|
||||
<a href="https://isoplexis.com/company/isoplexis-events/" class="footer-column2-main">Events</a>
|
||||
<a href="https://isoplexis.com/company/careers/" class="footer-column2-main">Careers</a>
|
||||
</div>
|
||||
<div class="footer-column" id="hide2">
|
||||
<div class="footer-column2-upper">
|
||||
Contact
|
||||
</div>
|
||||
<span class="footer-column1-text">IsoPlexis Office 35 NE Industrial Rd, Branford, CT 06405</span>
|
||||
<a href="https://isoplexis.com/contact/" class="footer-column1-link">Contact IsoPlexis</a>
|
||||
<a href="https://isoplexis.com/speak-to-an-expert/" class="footer-column1-link">Speak to an Expert</a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<style>
|
||||
.np-footer{
|
||||
background: none;
|
||||
margin: 60px auto 0;
|
||||
padding: unset;
|
||||
}
|
||||
.footer {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
max-width: 1300px;
|
||||
}
|
||||
.footer-column {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
max-width: 20%;
|
||||
padding: 0 20px
|
||||
}
|
||||
.footer-column1-logo {
|
||||
margin-bottom: 20px;
|
||||
width: 220px;
|
||||
}
|
||||
.footer-column1-text {
|
||||
color: #9baebf;
|
||||
line-height: 1.3;
|
||||
}
|
||||
.footer-column1-link{
|
||||
color: #fff;
|
||||
line-height: 1.3;
|
||||
}
|
||||
.footer-column2-upper {
|
||||
margin-bottom: 20px;
|
||||
font-size: 1.6rem;
|
||||
position: relative;
|
||||
top: 15px;
|
||||
min-height: 56px;
|
||||
display: flex;
|
||||
}
|
||||
.footer-column2-main {
|
||||
color: #9baebf;
|
||||
padding-bottom: 8px;
|
||||
white-space: nowrap
|
||||
}
|
||||
@media only screen and (max-width: 1200px) {
|
||||
.footer {
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 900px) {
|
||||
#hide {
|
||||
display: none;
|
||||
}
|
||||
.footer-column {
|
||||
max-width: 30%;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 500px) {
|
||||
#hide2 {
|
||||
display: none;
|
||||
}
|
||||
.footer-column {
|
||||
max-width: 80%;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,224 @@
|
||||
<header class="np-header">
|
||||
<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"
|
||||
/>
|
||||
<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 %}
|
||||
{% 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 {
|
||||
background: none;
|
||||
max-width: 1300px;
|
||||
margin: auto;
|
||||
}
|
||||
.np-header-mobile-menu-content {
|
||||
background: linear-gradient(0deg, #080b20 0%, #0f152c 100%);
|
||||
}
|
||||
.np-header-mobile-menu-content-button {
|
||||
background: #000;
|
||||
color: #fff;
|
||||
font-size: 1rem;
|
||||
}
|
||||
.np-header-search-input {
|
||||
border: none;
|
||||
background: none;
|
||||
color: #fff;
|
||||
}
|
||||
.np-header-mobile-menu-content-name {
|
||||
color: #fff;
|
||||
font-size: 24px;
|
||||
}
|
||||
.np-header-search-icon {
|
||||
color: #fff;
|
||||
}
|
||||
.np-header-mobile-menu-content-button.np-danger {
|
||||
color:crimson;
|
||||
margin:2.25rem 0;
|
||||
font-weight: 800;
|
||||
font-size: 1.1rem;
|
||||
border: none;
|
||||
}
|
||||
::placeholder {
|
||||
opacity: 0.8 !important;
|
||||
color: #fff !important;
|
||||
font-style: italic;
|
||||
font-size: 1.1rem !important;
|
||||
}
|
||||
@media only screen and (max-width: 767px) {
|
||||
.np-header-search-input {
|
||||
background: #000;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,37 @@
|
||||
<div class="np-card np-search-result">
|
||||
<div class="np-card-container">
|
||||
<div class="np-card-content">
|
||||
<img
|
||||
class="np-search-result-image"
|
||||
alt="{{ result.name }}"
|
||||
src="{{ result.image_url }}"
|
||||
/>
|
||||
<div class="np-search-result-content">
|
||||
<div>
|
||||
<a class="np-search-result-title" href="{{ result.path }}">
|
||||
{{ result.name }}
|
||||
</a>
|
||||
</div>
|
||||
<div class="np-search-result-snippet">{{ result.sanitized_description }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<style>
|
||||
.np-resource-title {
|
||||
color: #fff;
|
||||
}
|
||||
.np-resource-subtitle {
|
||||
color: rgba(255, 2555, 255, 0.7);
|
||||
}
|
||||
.np-search .np-resource-subtitle-number {
|
||||
color: #fff;
|
||||
}
|
||||
.np-card-container, .np-card-container-training-session {
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.np-search-result-title {
|
||||
color: #fff;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,40 @@
|
||||
<div class="np-card np-search-zero-state">
|
||||
<div class="np-card-container">
|
||||
<div class="np-card-content np-card-content-vertical np-search-zero-state-card">
|
||||
<h3 class="np-search-zero-state-title">
|
||||
{% t .nothing_found %}
|
||||
</h3>
|
||||
<div class="np-search-zero-state-subtitle">
|
||||
{% t .empty %}
|
||||
</div>
|
||||
<div class="np-search-zero-state-image"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.np-card-container {
|
||||
background: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
.np-search-zero-state-title {
|
||||
/* color: #35404e; */
|
||||
color: #fff;
|
||||
}
|
||||
.np-search .np-resource-subtitle-number {
|
||||
/* color: #35404e; */
|
||||
color: #fff;
|
||||
}
|
||||
.np-search-zero-state-subtitle {
|
||||
/* color: #59697b; */
|
||||
color: rgba(255, 2555, 255, 0.7);
|
||||
}
|
||||
.np-resource-title {
|
||||
/* color: #35404e; */
|
||||
color: #fff;
|
||||
}
|
||||
.np-resource-subtitle {
|
||||
/* color: #59697b; */
|
||||
color: rgba(255, 2555, 255, 0.7);
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,487 @@
|
||||
{% include "header" %}
|
||||
{% include "course_version_outdated_alert", courses: courses.featured %}
|
||||
<main class="np-main np-homepage">
|
||||
<div class="homepage-title" >
|
||||
<div class="homepage-title-text">
|
||||
<div class="homepage-title-text-headline">
|
||||
<span class="isogreen" style="font-size: 1.4rem; white-space: nowrap;">EDUCATION & TRAINING CENTER</span>
|
||||
IsoPlexis <span class="isogreen">UNIVERSITY</span>
|
||||
</div>
|
||||
<div class="homepage-title-text-subline">
|
||||
Transform your immunotherapy programs with the latest data & insights from our <span class="isogreen">cutting edge work </span>in single-cell proteomics.
|
||||
</div>
|
||||
</div>
|
||||
<img class="homepage-title-image" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/isou-home-hero-logo%402x.png">
|
||||
</div>
|
||||
<img class="homepage-main-image" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/isou-hero-home-wide%402x(1).jpg"></img>
|
||||
|
||||
<div class="homepage-advantage">
|
||||
<div class="homepage-advantage-slide">
|
||||
<img class="homepage-advantage-slide-left" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/index1.png">
|
||||
<div class=homepage-advantage-slide-right>
|
||||
<div class="homepage-advantage-slide-right-top">HD Video Protocols</div>
|
||||
<div class="homepage-advantage-slide-right-bottom">Watch short step-by-step protocol videos to simplify your workflow</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="homepage-advantage-slide" style="padding: 15px 30px;">
|
||||
<img class="homepage-advantage-slide-left" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/index.png">
|
||||
<div class=homepage-advantage-slide-right>
|
||||
<div class="homepage-advantage-slide-right-top">Support Resources</div>
|
||||
<div class="homepage-advantage-slide-right-bottom">Download detailed guides, tech notes & reference new publications</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="homepage-advantage-slide">
|
||||
<img class="homepage-advantage-slide-left" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/index2.png">
|
||||
<div class=homepage-advantage-slide-right>
|
||||
<div class="homepage-advantage-slide-right-top">Expert Webinars</div>
|
||||
<div class="homepage-advantage-slide-right-bottom">Hear from thought leaders in single-cell biology & functional proteomics</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% assign LP = learning_paths.available | where: "name", "How the IsoLight Works" %} {% assign LP = LP.first %}
|
||||
<div class="homepage-content" style="padding-top: 70px;">
|
||||
<div class="homepage-training">
|
||||
<div class="homepage-training-headline">
|
||||
<div class="homepage-training-headline-textes">
|
||||
<span class="isogreen" style="font-weight: 800; font-size: 1.3rem;">GET STARTED</span>
|
||||
<span style="font-size: 2.4rem;">{{LP.name}}</span>
|
||||
<span style="font-size: 20px; color: #a7aed1">{{LP.description}}</span>
|
||||
</div>
|
||||
<div class="homepage-training-headline-right">
|
||||
<span class="isogreen" style="font-weight: 800; font-size: 1.3rem; padding-bottom: 10px;">MASTER THE ISOU</span>
|
||||
<button class="homepage-training-headline-right-button green-gradient-button"> <img src="https://s3.amazonaws.com/static.northpass.com/Isoplex/isou-icon-certification-badge-lg-flat-dark%402x.png" height="30px">
|
||||
<span style="align-self: center;padding-left: 10px;">Get Certified</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% assign descriptions = ". Accelerate yours sample prep with how-to videos&protocols. Learn how to run your samples on the automated IsoLight system. Generate meaningful data in seconds, not days. Accelerate your sample prep with how-to videos & protocols" | split: ". " %}
|
||||
<div class="homepage-content-modules">
|
||||
{% for LPC in LP.items %}
|
||||
<div style="display: none;">{% increment my_counter1 %}</div>
|
||||
{% if my_counter1 == 1 or my_counter1 == 3 %} <div class="homepage-content-modules-group"> {%endif%}
|
||||
<a class="homepage-content-modules-module module-1" href="/../../app/courses/{{LPC.id}}">
|
||||
<div class="homepage-content-modules-module-number">
|
||||
MODULE {{my_counter1}}
|
||||
</div>
|
||||
<div class=homepage-content-modules-module-circle>
|
||||
<img class="homepage-content-modules-module-circle-image" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/isoplex-modules1-{{my_counter1}}.png">
|
||||
</div>
|
||||
<div class="homepage-content-modules-module-title">
|
||||
{{LPC.name}}
|
||||
</div>
|
||||
<div class="homepage-content-modules-module-description">
|
||||
{{descriptions[my_counter1]}}
|
||||
</div>
|
||||
</a>
|
||||
{% if my_counter1 == 2 or my_counter1 == 4 %} </div> {%endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
{% assign LP = learning_paths.available | where: "name", "How the IsoLight Works" %} {% assign LP = LP.first %}
|
||||
<div class="homepage-content" style="padding-top: 70px;">
|
||||
<div class="homepage-training">
|
||||
<div class="homepage-training-headline">
|
||||
<div class="homepage-training-headline-textes">
|
||||
<span style="font-size: 2.4rem;">{{LP.name}}</span>
|
||||
<span style="font-size: 20px; color: #a7aed1">{{LP.description}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% assign descriptions = ". Learn how CO2 supports incubation and fluidics on the IsoLight System. Fluidics are at the core of the IsoLight platform. Disposal of used reagents is critical. How IsoPlexis' unique single-cell and CodePlex chips works" | split: ". " %}
|
||||
<div class="homepage-content-modules">
|
||||
{% for LPC in LP.items %}
|
||||
<div style="display: none;">{% increment my_counter2 %}</div>
|
||||
{% if my_counter2 == 1 or my_counter2 == 3 %} <div class="homepage-content-modules-group"> {%endif%}
|
||||
<a class="homepage-content-modules-module module-2" href="/../../app/courses/{{LPC.id}}">
|
||||
<div class="homepage-content-modules-module-number">
|
||||
MODULE {{my_counter2}}
|
||||
</div>
|
||||
<div class=homepage-content-modules-module-circle>
|
||||
<img class="homepage-content-modules-module-circle-image" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/isoplex-modules2-{{my_counter2}}.png">
|
||||
</div>
|
||||
<div class="homepage-content-modules-module-title">
|
||||
{{LPC.name}}
|
||||
</div>
|
||||
<div class="homepage-content-modules-module-description">
|
||||
{{descriptions[my_counter2]}}
|
||||
</div>
|
||||
</a>
|
||||
{% if my_counter2 == 2 or my_counter2 == 4 %} </div> {%endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% assign LP = learning_paths.available | where: "name", "System Troubleshooting" %} {% assign LP = LP.first %}
|
||||
<div class="homepage-content" style="padding-top: 70px;">
|
||||
<div class="homepage-training">
|
||||
<div class="homepage-training-headline">
|
||||
<div class="homepage-training-headline-textes">
|
||||
<span style="font-size: 2.4rem;">{{LP.name}}</span>
|
||||
<span style="font-size: 20px; color: #a7aed1">{{LP.description}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% assign descriptions = ". The barcode scanner reads QR labels on each individual chip. Fluidics maintenance and upkeep. Proper lase function is essential for imaging. Airflow and appropriate waste disposal procedures" | split: ". " %}
|
||||
<div class="homepage-content-modules">
|
||||
{% for LPC in LP.items %}
|
||||
<div style="display: none;">{% increment my_counter3 %}</div>
|
||||
{% if my_counter3 == 1 or my_counter3 == 3 %} <div class="homepage-content-modules-group"> {%endif%}
|
||||
<a class="homepage-content-modules-module module-3" href="/../../app/courses/{{LPC.id}}">
|
||||
<div class="homepage-content-modules-module-number">
|
||||
MODULE {{my_counter3}}
|
||||
</div>
|
||||
<div class=homepage-content-modules-module-circle>
|
||||
<img class="homepage-content-modules-module-circle-image" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/isoplex-modules3-{{my_counter3}}.png">
|
||||
</div>
|
||||
<div class="homepage-content-modules-module-title">
|
||||
{{LPC.name}}
|
||||
</div>
|
||||
<div class="homepage-content-modules-module-description">
|
||||
{{descriptions[my_counter3]}}
|
||||
</div>
|
||||
</a>
|
||||
{% if my_counter3 == 2 or my_counter3 == 4 %} </div> {%endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% assign LP = learning_paths.available | where: "name", "Network Troubleshooting" %} {% assign LP = LP.first %}
|
||||
<div class="homepage-content" style="padding-top: 70px;">
|
||||
<div class="homepage-training">
|
||||
<div class="homepage-training-headline">
|
||||
<div class="homepage-training-headline-textes">
|
||||
<span style="font-size: 2.4rem;">{{LP.name}}</span>
|
||||
<span style="font-size: 20px; color: #a7aed1">{{LP.description}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% assign descriptions = ". What a correctly configured home screen should look like. Networking FAQs and answers to common questions. Steps to take when encountering network issues. Data managment is a critical component of instrument maintenance" | split: ". " %}
|
||||
<div class="homepage-content-modules">
|
||||
{% for LPC in LP.items %}
|
||||
<div style="display: none;">{% increment my_counter4 %}</div>
|
||||
{% if my_counter4 == 1 or my_counter4 == 3 %} <div class="homepage-content-modules-group"> {%endif%}
|
||||
<a class="homepage-content-modules-module module-4" href="/../../app/courses/{{LPC.id}}">
|
||||
<div class="homepage-content-modules-module-number">
|
||||
MODULE {{my_counter4}}
|
||||
</div>
|
||||
<div class=homepage-content-modules-module-circle>
|
||||
<img class="homepage-content-modules-module-circle-image" src="https://s3.amazonaws.com/static.northpass.com/Isoplex/isoplex-modules4-{{my_counter4}}.png">
|
||||
</div>
|
||||
<div class="homepage-content-modules-module-title">
|
||||
{{LPC.name}}
|
||||
</div>
|
||||
<div class="homepage-content-modules-module-description">
|
||||
{{descriptions[my_counter4]}}
|
||||
</div>
|
||||
</a>
|
||||
{% if my_counter4 == 2 or my_counter4 == 4 %} </div> {%endif %}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
{% include "footer" %}
|
||||
|
||||
<style>
|
||||
.np-homepage {
|
||||
background: none;
|
||||
max-width: 1300px;
|
||||
margin: auto;
|
||||
}
|
||||
.homepage-title {
|
||||
height: auto;
|
||||
height: auto;
|
||||
padding-bottom: 70px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.homepage-main-image {
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
width: 1490px;
|
||||
top: 0;
|
||||
background-repeat: no-repeat;
|
||||
opacity: 0.7;
|
||||
top: 100px;
|
||||
height: 570px;
|
||||
mix-blend-mode: lighten;
|
||||
right: calc(calc(100vw - 1300px)/2);
|
||||
}
|
||||
.homepage-title-text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-left: 4%;
|
||||
}
|
||||
.homepage-title-text-headline{
|
||||
font-size: calc(6vw + 30px);
|
||||
max-width: 200px;
|
||||
line-height: 1;
|
||||
}
|
||||
.homepage-title-text-subline {
|
||||
padding-top: 20px;
|
||||
max-width: 730px;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
.homepage-title-image {
|
||||
height: 400px;
|
||||
margin-top: 20px;
|
||||
margin-right: 5%;
|
||||
}
|
||||
.homepage-advantage{
|
||||
margin: auto;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
padding: 20px 10px;
|
||||
}
|
||||
.homepage-advantage-slide{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding: 15px 0;
|
||||
}
|
||||
.homepage-advantage-slide-left {
|
||||
height: 72px;
|
||||
width: 72px;
|
||||
margin-right: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.homepage-advantage-slide-right {
|
||||
align-self: center;
|
||||
max-width: 300px;
|
||||
}
|
||||
.homepage-advantage-slide-right-top {
|
||||
font-weight: 600;
|
||||
color: #fff;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
.homepage-advantage-slide-right-bottom {
|
||||
color: #a7aed1;
|
||||
line-height: 1.3;
|
||||
}
|
||||
.homepage-training-headline {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
padding: 0 20px;
|
||||
}
|
||||
.homepage-training-headline-textes {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
max-width: 50%;
|
||||
}
|
||||
.homepage-training-headline-right {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-self: center;
|
||||
}
|
||||
.homepage-training-headline-right-button {
|
||||
display: flex;
|
||||
align-content: center;
|
||||
}
|
||||
.homepage-content-modules {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
margin-top: 50px;
|
||||
align-items: center;
|
||||
}
|
||||
.homepage-content-modules-group {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
.homepage-content-modules-module-number {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding-top: 10px;
|
||||
padding-bottom: 15px;
|
||||
font-size: 25px;
|
||||
font-weight: 900;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.homepage-content-modules-module {
|
||||
background-position-x: 0%;
|
||||
background-position-y: 0%;
|
||||
background-size: auto;
|
||||
background-size: auto 200% !important;
|
||||
background-position: center top !important;
|
||||
transition: all .6s ease !important;
|
||||
transition-duration: .2s;
|
||||
transition-timing-function: linear;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin: 0 15px;
|
||||
flex-direction: column;
|
||||
width: 300px;
|
||||
}
|
||||
.module-1 {
|
||||
background: linear-gradient(180deg,#0DD1DB 0%,#2AAFDD 10%,#528DE2 20%,#264CAC 45%,#25359E 65%,#6533A4 90%);
|
||||
}
|
||||
.module-2 {
|
||||
background: linear-gradient(180deg,#4053EE 0%, #5942CA 50%, #762EA3 100%);
|
||||
}
|
||||
.module-3 {
|
||||
background: linear-gradient(180deg,#1AF1A1 0%, #08D5AC 50%, #228193 100%);
|
||||
}
|
||||
.module-4 {
|
||||
background: linear-gradient(180deg,#FCBC02 0%, #FDA14C 50%, #FF4B01 100%);
|
||||
}
|
||||
.homepage-content-modules-module-circle-image{
|
||||
height: 100px;
|
||||
width: auto;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin: auto;
|
||||
}
|
||||
.homepage-content-modules-module-circle {
|
||||
background-color: #000;
|
||||
border-radius: 50%;
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.homepage-content-modules-module-title {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
padding-top: 15px;
|
||||
padding-bottom: 15px;
|
||||
font-size: 28px;
|
||||
font-weight: 500;
|
||||
min-height: 95px;
|
||||
width: 90%;
|
||||
margin: auto;
|
||||
}
|
||||
.homepage-content-modules-module-description {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
padding-bottom: 20px;
|
||||
width: 75%;
|
||||
margin: auto;
|
||||
font-size: 20px;
|
||||
min-height: 89px;
|
||||
}
|
||||
.homepage-content-modules-module:hover {
|
||||
background-position: 100% 50% !important;
|
||||
}
|
||||
@media only screen and (min-width: 1400px) {
|
||||
.homepage-title-text-headline {
|
||||
font-size: 114px;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 1320px) {
|
||||
.homepage-content-modules-module {
|
||||
width: 250px;
|
||||
}
|
||||
.homepage-content-modules-module-title {
|
||||
font-size: 20px;
|
||||
min-height: 76px;
|
||||
}
|
||||
.homepage-content-modules-module-description {
|
||||
font-size: 16px;
|
||||
min-height: 76px;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 1300px) {
|
||||
.homepage-main-image {
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 1100px) {
|
||||
.homepage-content-modules {
|
||||
flex-direction: column;
|
||||
}
|
||||
.homepage-content-modules-group {
|
||||
padding-top: 30px;
|
||||
}
|
||||
.homepage-content-modules-module {
|
||||
width: 300px;
|
||||
}
|
||||
.homepage-content-modules-module-title {
|
||||
font-size: 28px;
|
||||
min-height: 95px;
|
||||
}
|
||||
.homepage-content-modules-module-description {
|
||||
font-size: 20px;
|
||||
min-height: 89px;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 850px) {
|
||||
.homepage-title-image {
|
||||
display: none;
|
||||
}
|
||||
.homepage-main-image {
|
||||
display: none;
|
||||
}
|
||||
.homepage-title-text-subline {
|
||||
max-width: 60%;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 700px) {
|
||||
.homepage-content-modules-module {
|
||||
width: 250px;
|
||||
}
|
||||
.homepage-content-modules-module-title {
|
||||
font-size: 20px;
|
||||
min-height: 76px;
|
||||
}
|
||||
.homepage-content-modules-module-description {
|
||||
font-size: 16px;
|
||||
min-height: 76px;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 650px) {
|
||||
.homepage-advantage-slide {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
@media only screen and (max-width: 550px) {
|
||||
.homepage-title-text-subline {
|
||||
max-width: 80%;
|
||||
}
|
||||
.homepage-content-modules-module {
|
||||
margin: 5px;
|
||||
width: 50%;
|
||||
}
|
||||
.homepage-content-modules-module-description {
|
||||
display: none;
|
||||
}
|
||||
.homepage-training-headline {
|
||||
flex-direction: column;
|
||||
}
|
||||
.homepage-training-headline-textes {
|
||||
max-width: 100%;
|
||||
}
|
||||
.homepage-training-headline-right {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.homepage-content-modules-group {
|
||||
width: 95%;
|
||||
justify-content: center;
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
.homepage-title-image {
|
||||
animation-duration: 3s;
|
||||
animation-name: levitation;
|
||||
animation-iteration-count: infinite;
|
||||
}
|
||||
@keyframes levitation {
|
||||
from {
|
||||
margin-top: 20px;
|
||||
}
|
||||
50% {
|
||||
margin-top: 0;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
to {
|
||||
margin-top: 20;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,69 @@
|
||||
<main class="np-main np-box-container">
|
||||
<div class="np-box">
|
||||
{% include "header_minimal" %}
|
||||
<div class="np-box-content-container">
|
||||
<form class="np-form np-box-content" action="{% route login %}" method="post" novalidate>
|
||||
{% form_authenticity_token %}
|
||||
<div class="np-form-field">
|
||||
<label class="np-input-label" for="learner_email">
|
||||
{% t shared.email_address %}
|
||||
</label>
|
||||
<input
|
||||
class="np-input"
|
||||
autofocus="autofocus"
|
||||
type="email"
|
||||
name="learner[email]"
|
||||
id="learner_email"
|
||||
>
|
||||
</div>
|
||||
<div class="np-form-field">
|
||||
<label class="np-input-label" for="learner_password">
|
||||
{% t shared.password %}
|
||||
</label>
|
||||
<input
|
||||
class="np-input"
|
||||
type="password"
|
||||
name="learner[password]"
|
||||
id="learner_password"
|
||||
>
|
||||
</div>
|
||||
<button type="submit" class="green-gradient-button np-button-large-font np-form-action">
|
||||
{% t shared.sign_in %}
|
||||
</button>
|
||||
<a class="np-form-link np-button-color" href="{% route forgot_password_new %}">
|
||||
{% t .forgot_password %}
|
||||
</a>
|
||||
{% if features.account_creation? %}
|
||||
<a class="np-form-link np-button-color" href="{% route sign_up %}">
|
||||
{% t shared.sign_up %}
|
||||
</a>
|
||||
{% endif %}
|
||||
{% if features.request_access? %}
|
||||
<a
|
||||
class="np-form-link np-button-color"
|
||||
target="_blank"
|
||||
href="{{ current_school.request_access_link }}"
|
||||
>
|
||||
{{ current_school.request_access_label }}
|
||||
</a>
|
||||
{% endif %}
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<style>
|
||||
|
||||
.np-box {
|
||||
background: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.np-input-label {
|
||||
color: #fff;
|
||||
font-size: 1rem;
|
||||
}
|
||||
.np-header-color {
|
||||
background: none;
|
||||
}
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,42 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,300;0,400;0,600;1,300;1,400&display=swap');
|
||||
|
||||
.isogreen {
|
||||
color: #12cd9a;
|
||||
}
|
||||
|
||||
.green-gradient-button {
|
||||
background-image: linear-gradient(45deg, rgb(17, 201, 162) 0%, rgb(4, 170, 205) 40%, rgb(16, 69, 218) 65%, rgb(94, 59, 157) 100%);
|
||||
color: #fff;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
padding: 15px;
|
||||
font-size: 1.2rem;
|
||||
font-weight: 600;
|
||||
text-transform: none;
|
||||
transition-delay: 0s;
|
||||
transition-duration: 0.8s;
|
||||
transition-property: all;
|
||||
transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1) !important;
|
||||
background-size: 300% auto !important;
|
||||
background-position: 0 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.green-gradient-button:hover {
|
||||
background-position: 100% 50%;
|
||||
}
|
||||
|
||||
body {
|
||||
background: linear-gradient(0deg, #080b20 0%, #0f152c 100%);
|
||||
font-family: 'Source Sans Pro', sans-serif;
|
||||
font-weight: 400;
|
||||
color: #fff;
|
||||
margin: 0;
|
||||
background-repeat: no-repeat;
|
||||
background-attachment: fixed;
|
||||
}
|
||||
a {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
@ -41,3 +41,13 @@ Each product has various
|
||||
This will be a one-stop shop for all knowledge and data.
|
||||
|
||||
Seven tags per object, course, person, etc.
|
||||
|
||||
Companies are groups
|
||||
|
||||
* Inside each company are people, LPs, and Courses
|
||||
|
||||
Norm to ask KC:
|
||||
|
||||
* What is a constituent, learner, and global?
|
||||
* What is the main group & course structure? Company is the most common.
|
||||
* What data needs to be tagged to each object in Northpass? You mentioned 7 tags per object.
|
||||
|
||||
@ -102,3 +102,11 @@ Froala doesn't by default allow to hide borders on tables. Can Northpass add it?
|
||||
## 01/04/2023
|
||||
|
||||
FEAT: Add email filter for SCA report.
|
||||
|
||||
## 02/02/2023
|
||||
|
||||
Zoom integration issue. It is unusable and affecting business.
|
||||
Driving down registrations.
|
||||
Kayla has made all the events discoverable and accessible, but it is restricting the full functionality of Northpass.
|
||||
|
||||
Kayla thought it could be the webinar template in Zoom.
|
||||
|
||||
@ -344,3 +344,29 @@ DONE: Get Krystal an Iorad trial
|
||||
|
||||
Decision on Sentence Case vs Title Case
|
||||
Came up earlier today: Spanish Translations of courses.
|
||||
|
||||
## 02/01/2023
|
||||
|
||||
### Tech Meeting
|
||||
|
||||
Walmart devs nit picking everything but not being fair. Rob pushed back with great clarifying questions and asking for demos or functionality preview. They were not able to provide any of that and made excuses.
|
||||
|
||||
Travis got very upset with his devs as they said they don't do any testing on Android. Engineering said they don't do the testing, production does.
|
||||
|
||||
Notable moments:
|
||||
|
||||
* Travis, to Sandipan: "I'm not sure if you're being intentionally dense, but..."
|
||||
* Travis saying "No wonder our app sucks" while obviously putting his face in his hands.
|
||||
* Then, he said he had to drop and before he finished saying that he left the meeting.
|
||||
* Travis and Krystal slacking Rob and Charlie saying thank you.
|
||||
|
||||
### Design & Meeting Lauren Doll
|
||||
|
||||
Lauren Doll is Krystal's boss.
|
||||
Krystal going on maternity leave on March 3rd. Lauren to be taking over. TBD for new flow with Lauren.
|
||||
|
||||
TODO: Add first sentence from each description to the "additional information" for each course activity.
|
||||
|
||||
Joanna - add arrow on each activity to show the driver that it is clickable.
|
||||
Northpass to wait until we have the official go ahead to make any changes.
|
||||
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
/* Custom Variables | Color Scheme */
|
||||
|
||||
:root {
|
||||
--primary: #fff;
|
||||
--text-light: #0390fc;
|
||||
--background: #191E29;
|
||||
--background-light: #202633;
|
||||
--primary: #fff;
|
||||
--text-light: #E5E9F0;
|
||||
--background: #3B4252;
|
||||
--background-light: #4C566A;
|
||||
}
|
||||
|
||||
*,
|
||||
@ -18,31 +18,31 @@
|
||||
body {
|
||||
margin-bottom: 0;
|
||||
flex-grow: 1;
|
||||
background: linear-gradient(145deg, #179160, #096F8E, #F7BB17, #D64A28, #00283C);
|
||||
background-size: 700% 550%;
|
||||
animation: gradient 7s ease-in-out infinite;
|
||||
height: 125vh;
|
||||
margin-top: -100px;
|
||||
padding-top: 100px;
|
||||
background: linear-gradient(
|
||||
145deg, #81A1C1, #88C0D0, #8FBCBB, #A3BE8C, #EBCB8B, #D08770
|
||||
);
|
||||
background-size: 700% 550%;
|
||||
animation: gradient 7s ease-in-out infinite;
|
||||
height: 125vh;
|
||||
margin-top: -100px;
|
||||
padding-top: 100px;
|
||||
color: var(--text-light);
|
||||
font-family: 'Inter', sans-serif;
|
||||
|
||||
padding: 2rem 4rem;
|
||||
|
||||
background-color: var(--background);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
@keyframes gradient {
|
||||
0% {
|
||||
background-position: 0% 79%;
|
||||
}
|
||||
50% {
|
||||
background-position: 100% 22%;
|
||||
}
|
||||
100% {
|
||||
background-position: 0% 79%;
|
||||
}
|
||||
0% {
|
||||
background-position: 0% 79%;
|
||||
}
|
||||
50% {
|
||||
background-position: 100% 22%;
|
||||
}
|
||||
100% {
|
||||
background-position: 0% 79%;
|
||||
}
|
||||
}
|
||||
|
||||
h1 {
|
||||
@ -107,7 +107,7 @@ main {
|
||||
|
||||
background-color: var(--background-light);
|
||||
border-radius: 15px;
|
||||
border: 1px solid rgba(255,255,255,.05);
|
||||
border: 1px solid #B48EAD;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
@ -139,24 +139,18 @@ main {
|
||||
|
||||
.card__icon {
|
||||
font-size: 2rem;
|
||||
|
||||
padding: 1rem;
|
||||
|
||||
background-color: rgba(255, 255, 255, 0.05);
|
||||
background-color: #81A1C1;
|
||||
border-radius: 50%;
|
||||
|
||||
display: grid;
|
||||
place-items: center;
|
||||
}
|
||||
|
||||
.card__name {
|
||||
font-weight: 400;
|
||||
|
||||
transform: translate(-50%, -50%);
|
||||
|
||||
position: absolute;
|
||||
bottom: -25%;
|
||||
left: 50%;
|
||||
|
||||
transition: 0.1s;
|
||||
}
|
||||
|
||||
@ -6,43 +6,49 @@ import sys
|
||||
|
||||
peopleCsv = "/Users/normrasmussen/Downloads/TalkspaceAllLearners.csv"
|
||||
|
||||
|
||||
def readCsv(peopleCsv):
|
||||
people = []
|
||||
readExport = pd.read_csv(
|
||||
peopleCsv,
|
||||
usecols=['Learner Full Name', 'Email'],
|
||||
skipinitialspace=True,
|
||||
#index_col=True,
|
||||
)
|
||||
people.extend(readExport['Email'].tolist())
|
||||
peopleCsv,
|
||||
usecols=["Learner Full Name", "Email"],
|
||||
skipinitialspace=True,
|
||||
# index_col=True,
|
||||
)
|
||||
people.extend(readExport["Email"].tolist())
|
||||
startCompare(peopleCsv, people, readExport)
|
||||
|
||||
|
||||
# itertools combinations
|
||||
def startCompare(peopleCsv, people, readExport):
|
||||
email1 = []
|
||||
email2 = []
|
||||
for name1, name2, in itertools.combinations(people, 2):
|
||||
#print(name1, name2) - prints all pairs, working so far.
|
||||
for (
|
||||
name1,
|
||||
name2,
|
||||
) in itertools.combinations(people, 2):
|
||||
# print(name1, name2) - prints all pairs, working so far.
|
||||
distance = lev(name1, name2)
|
||||
#print(distance) - successfully returns numbers
|
||||
# print(distance) - successfully returns numbers
|
||||
if distance > 0 and distance < 2:
|
||||
email1.append(name1)
|
||||
email2.append(name2)
|
||||
writenewColumn(email1, email2, peopleCsv, readExport)
|
||||
|
||||
|
||||
def writenewColumn(email1, email2, peopleCsv, readExport):
|
||||
df = pd.DataFrame(readExport)
|
||||
print(df)
|
||||
df['Email1'] = pd.Series(email1)
|
||||
df['Email2'] = pd.Series(email2)
|
||||
df.drop_duplicates('Email1', inplace=True)
|
||||
df.drop_duplicates('Email2', inplace=True)
|
||||
df.drop_duplicates(
|
||||
subset=['Email1', 'Email2'])
|
||||
#keep = 'last').reset_index(drop=True)
|
||||
df["Email1"] = pd.Series(email1)
|
||||
df["Email2"] = pd.Series(email2)
|
||||
df.drop_duplicates("Email1", inplace=True)
|
||||
df.drop_duplicates("Email2", inplace=True)
|
||||
df.drop_duplicates(subset=["Email1", "Email2"])
|
||||
# keep = 'last').reset_index(drop=True)
|
||||
writeLst = df.to_csv(
|
||||
'/Users/normrasmussen/Downloads/TalkspaceDupes_singlechange.csv',
|
||||
)
|
||||
"/Users/normrasmussen/Downloads/TalkspaceDupes_singlechange.csv",
|
||||
)
|
||||
|
||||
|
||||
if __name__ == "__main__":
|
||||
readCsv(peopleCsv)
|
||||
|
||||
@ -1,13 +1,13 @@
|
||||
import os
|
||||
import sys
|
||||
from datetime import date
|
||||
import glob
|
||||
import shutil
|
||||
import csv
|
||||
import pandas as pd
|
||||
|
||||
rootdir = "/Users/normrasmussen/Documents/Resources/Walmart/"
|
||||
downloadir = "/Users/normrasmussen/Google Drive/My Drive/Shared with Clients/Walmart_Looker/"
|
||||
downloadir = (
|
||||
"/Users/normrasmussen/Google Drive/My Drive/Shared with Clients/Walmart_Looker/"
|
||||
)
|
||||
basefile = "Walmart_Weekly_Base.xlsx"
|
||||
|
||||
|
||||
@ -41,9 +41,9 @@ def copytoDash(latestdownload, currentDash):
|
||||
# dtype={"Progress": float},
|
||||
)
|
||||
print(readExport)
|
||||
readExport['Progress'] = readExport['Progress'].str[:-1].apply(pd.to_numeric)
|
||||
readExport["Progress"] = readExport["Progress"].str[:-1].apply(pd.to_numeric)
|
||||
# readExport['Progress'].apply(pd.to_numeric, errors='ignore')
|
||||
print(readExport['Progress'])
|
||||
print(readExport["Progress"])
|
||||
readExport.drop(readExport.filter(regex="Unname"), axis=1, inplace=True)
|
||||
copiedData = readExport.copy()
|
||||
bringtoExcel(latestdownload, currentDash, copiedData)
|
||||
|
||||
BIN
Scripts/Walmart_Screenshots/.DS_Store
vendored
|
Before Width: | Height: | Size: 130 KiB |
|
Before Width: | Height: | Size: 56 KiB |
|
Before Width: | Height: | Size: 37 KiB |
|
Before Width: | Height: | Size: 163 KiB |
|
Before Width: | Height: | Size: 26 KiB |
|
Before Width: | Height: | Size: 42 KiB |
|
Before Width: | Height: | Size: 36 KiB |
|
Before Width: | Height: | Size: 32 KiB |
|
Before Width: | Height: | Size: 31 KiB |
|
After Width: | Height: | Size: 113 KiB |
|
After Width: | Height: | Size: 61 KiB |
|
After Width: | Height: | Size: 99 KiB |
|
After Width: | Height: | Size: 101 KiB |
BIN
Scripts/Walmart_Screenshots/PDFs/.DS_Store
vendored
Normal file
|
After Width: | Height: | Size: 121 KiB |
|
After Width: | Height: | Size: 88 KiB |
|
After Width: | Height: | Size: 88 KiB |
|
After Width: | Height: | Size: 99 KiB |
|
After Width: | Height: | Size: 35 KiB |
|
After Width: | Height: | Size: 63 KiB |
|
After Width: | Height: | Size: 45 KiB |
|
After Width: | Height: | Size: 102 KiB |
|
After Width: | Height: | Size: 279 KiB |
|
After Width: | Height: | Size: 110 KiB |
|
After Width: | Height: | Size: 399 KiB |
|
After Width: | Height: | Size: 439 KiB |
|
After Width: | Height: | Size: 104 KiB |
|
After Width: | Height: | Size: 46 KiB |
|
After Width: | Height: | Size: 104 KiB |
|
After Width: | Height: | Size: 146 KiB |
|
After Width: | Height: | Size: 101 KiB |
|
After Width: | Height: | Size: 49 KiB |
BIN
Scripts/Walmart_Screenshots/Questions About Earnings?_1.png
Normal file
|
After Width: | Height: | Size: 108 KiB |
BIN
Scripts/Walmart_Screenshots/Questions About Earnings?_2.png
Normal file
|
After Width: | Height: | Size: 79 KiB |
|
After Width: | Height: | Size: 124 KiB |
|
After Width: | Height: | Size: 45 KiB |
|
After Width: | Height: | Size: 104 KiB |
|
After Width: | Height: | Size: 58 KiB |
|
After Width: | Height: | Size: 60 KiB |
|
After Width: | Height: | Size: 70 KiB |
|
After Width: | Height: | Size: 120 KiB |
|
After Width: | Height: | Size: 78 KiB |
BIN
Scripts/Walmart_Screenshots/Tips for Receiving Offers_1.png
Normal file
|
After Width: | Height: | Size: 109 KiB |
BIN
Scripts/Walmart_Screenshots/Tips for Receiving Offers_2.png
Normal file
|
After Width: | Height: | Size: 57 KiB |
BIN
Scripts/Walmart_Screenshots/Tips for Receiving Offers_3.png
Normal file
|
After Width: | Height: | Size: 36 KiB |
BIN
Scripts/Walmart_Screenshots/Tips for Receiving Offers_4.png
Normal file
|
After Width: | Height: | Size: 49 KiB |
BIN
Scripts/Walmart_Screenshots/Tips for Receiving Offers_5.png
Normal file
|
After Width: | Height: | Size: 80 KiB |
|
After Width: | Height: | Size: 116 KiB |
|
After Width: | Height: | Size: 46 KiB |
|
After Width: | Height: | Size: 69 KiB |
83
Scripts/Walmart_Screenshots/combine_to_pdf.py
Normal file
@ -0,0 +1,83 @@
|
||||
from PIL import Image
|
||||
import glob
|
||||
import os
|
||||
from datetime import date
|
||||
|
||||
|
||||
def find_pictures():
|
||||
files = []
|
||||
currentdir = "/Users/normrasmussen/Documents/Northpass/Scripts/Walmart_Screenshots/"
|
||||
listfiles = glob.glob(currentdir + "*.png")
|
||||
for file in listfiles:
|
||||
files.append(os.path.basename(file))
|
||||
# Now file will only show the file name, not the entire path
|
||||
split_resources(files)
|
||||
|
||||
|
||||
def split_resources(files):
|
||||
print(files)
|
||||
try:
|
||||
resource_title = files[0]
|
||||
resource_title = resource_title[:-6]
|
||||
files.sort()
|
||||
new_list = []
|
||||
for file in files:
|
||||
if resource_title in file:
|
||||
new_list.append(file)
|
||||
for item in new_list:
|
||||
files.remove(item)
|
||||
split_resources(files)
|
||||
print(new_list)
|
||||
process_pictures(new_list, resource_title)
|
||||
except IndexError as e:
|
||||
pass
|
||||
finally:
|
||||
pass
|
||||
|
||||
|
||||
def process_pictures(new_list, resource_title):
|
||||
today = date.today()
|
||||
today = today.strftime("%m.%d.%Y")
|
||||
image_list = []
|
||||
print(new_list)
|
||||
print(resource_title)
|
||||
resource = Image.open(new_list[0])
|
||||
resource = resource.convert("RGB")
|
||||
for picture in new_list[1:]:
|
||||
image = Image.open(picture)
|
||||
converted = image.convert("RGB")
|
||||
image_list.append(converted)
|
||||
# image_list.append(image)
|
||||
resource.save(
|
||||
rf"/Users/normrasmussen/Documents/Northpass/Scripts/Walmart_Screenshots/PDFs/{resource_title}_{today}.pdf",
|
||||
save_all=True,
|
||||
append_images=image_list,
|
||||
)
|
||||
|
||||
|
||||
def notusable():
|
||||
image1 = Image.open(
|
||||
r"/Users/normrasmussen/Documents/Northpass/Scripts/Walmart_Screenshots/Branch Wallet FAQs_1.png"
|
||||
)
|
||||
image2 = Image.open(
|
||||
r"/Users/normrasmussen/Documents/Northpass/Scripts/Walmart_Screenshots/Branch Wallet FAQs_2.png"
|
||||
)
|
||||
image3 = Image.open(
|
||||
r"/Users/normrasmussen/Documents/Northpass/Scripts/Walmart_Screenshots/Branch Wallet FAQs_3.png"
|
||||
)
|
||||
|
||||
im1 = image1.convert("RGB")
|
||||
im2 = image2.convert("RGB")
|
||||
im3 = image3.convert("RGB")
|
||||
|
||||
imagelist = [im1, im2, im3]
|
||||
|
||||
im1.save(
|
||||
r"/Users/normrasmussen/Documents/Northpass/Scripts/Walmart_Screenshots/mergedImages.pdf",
|
||||
save_all=True,
|
||||
append_images=imagelist,
|
||||
)
|
||||
|
||||
|
||||
if __name__ == "__main__":
|
||||
find_pictures()
|
||||