diff --git a/Custom_Templates/customer_templates/.DS_Store b/Custom_Templates/customer_templates/.DS_Store index 3e5d497b..b2db0324 100644 Binary files a/Custom_Templates/customer_templates/.DS_Store and b/Custom_Templates/customer_templates/.DS_Store differ diff --git a/Custom_Templates/customer_templates/Artera_sandbox/.DS_Store b/Custom_Templates/customer_templates/Artera_sandbox/.DS_Store new file mode 100644 index 00000000..5008ddfc Binary files /dev/null and b/Custom_Templates/customer_templates/Artera_sandbox/.DS_Store differ diff --git a/Custom_Templates/customer_templates/Artera_sandbox/_my_courses_filter.html.liquid b/Custom_Templates/customer_templates/Artera_sandbox/_my_courses_filter.html.liquid index 63c14480..6d3ba4bd 100644 --- a/Custom_Templates/customer_templates/Artera_sandbox/_my_courses_filter.html.liquid +++ b/Custom_Templates/customer_templates/Artera_sandbox/_my_courses_filter.html.liquid @@ -1,10 +1,14 @@ {% include "in_progress_learning_paths_index", items: learning_paths.enrolled %} - +
Enrolled Learning Paths @@ -87,4 +88,4 @@ margin: 20px 0 20px; } } - + \ No newline at end of file diff --git a/Custom_Templates/customer_templates/Artera_sandbox/homepage.html.liquid b/Custom_Templates/customer_templates/Artera_sandbox/homepage.html.liquid index 82305e11..dfaced88 100644 --- a/Custom_Templates/customer_templates/Artera_sandbox/homepage.html.liquid +++ b/Custom_Templates/customer_templates/Artera_sandbox/homepage.html.liquid @@ -52,6 +52,7 @@ {% include "footer" %} diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_cards_featured_course.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_cards_featured_course.html.liquid new file mode 100644 index 00000000..70cba72e --- /dev/null +++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_cards_featured_course.html.liquid @@ -0,0 +1,44 @@ + diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_course_details.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_course_details.html.liquid new file mode 100644 index 00000000..e69de29b diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_footer.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_footer.html.liquid new file mode 100644 index 00000000..79a0481d --- /dev/null +++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_footer.html.liquid @@ -0,0 +1,80 @@ +
+ + + +
diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_head.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_head.html.liquid new file mode 100644 index 00000000..bde9ff3c --- /dev/null +++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_head.html.liquid @@ -0,0 +1,11 @@ +{% styles default %} +{% styles colors %} +{% styles custom %} + + + + + + + + diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_header.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_header.html.liquid new file mode 100644 index 00000000..56b76c56 --- /dev/null +++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_header.html.liquid @@ -0,0 +1,183 @@ +
+
+
+ {% if current_person.signed_in? %} + + + {% endif %} +
+ {% if current_school.logo_url %} +

+ + {{ current_school.name }} + +

+ {% else %} + + {{ current_school.name }} + + {% endif %} + +
+ +
+ + {% if current_person.signed_in? %} + +
+ + +
+ {% else %} +
+ + +
+
+ +{% include "messages" %} + diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_section_faqs.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_section_faqs.html.liquid new file mode 100644 index 00000000..7e6d46fc --- /dev/null +++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_section_faqs.html.liquid @@ -0,0 +1,109 @@ + +/ + + + \ No newline at end of file diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_section_instructors.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_section_instructors.html.liquid new file mode 100644 index 00000000..c196253d --- /dev/null +++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_section_instructors.html.liquid @@ -0,0 +1,91 @@ + + + + + \ No newline at end of file diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_section_popular_topics.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_section_popular_topics.html.liquid new file mode 100644 index 00000000..faf6a7ef --- /dev/null +++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_section_popular_topics.html.liquid @@ -0,0 +1,15 @@ + \ No newline at end of file diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_section_professionals.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_section_professionals.html.liquid new file mode 100644 index 00000000..ae4e5a73 --- /dev/null +++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_section_professionals.html.liquid @@ -0,0 +1,118 @@ + + + + + \ No newline at end of file diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/_sub_navigation.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/_sub_navigation.html.liquid new file mode 100644 index 00000000..a1ac085b --- /dev/null +++ b/Custom_Templates/customer_templates/Norm_sandbox_2/_sub_navigation.html.liquid @@ -0,0 +1,44 @@ +
+
+
+ + + + + + +
+
+ + + + \ No newline at end of file diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/catalog.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/catalog.html.liquid new file mode 100644 index 00000000..8ce1105b --- /dev/null +++ b/Custom_Templates/customer_templates/Norm_sandbox_2/catalog.html.liquid @@ -0,0 +1,39 @@ +{% include "header" %} +{% include "course_version_outdated_alert", courses: courses.in_catalog %} +
+
+
+
+
+ Menlo Security Resrouces +
+
+ Resources to help you make the most of your Security Training +
+
+
+{% include "sub_navigation" %} + {% include "courses_catalog" %} +
+{% include "footer" %} + + + + + \ No newline at end of file diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/community.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/community.html.liquid new file mode 100644 index 00000000..7140d448 --- /dev/null +++ b/Custom_Templates/customer_templates/Norm_sandbox_2/community.html.liquid @@ -0,0 +1,32 @@ +{% include 'header' %} +
+
+

Explore

+
+ {% include 'sub_navigation' %} +
+ +
+
+{% include 'footer' %} + + \ No newline at end of file diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/styles.css.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/styles.css.liquid new file mode 100644 index 00000000..5397df18 --- /dev/null +++ b/Custom_Templates/customer_templates/Norm_sandbox_2/styles.css.liquid @@ -0,0 +1,1781 @@ +/* + Put your custom overlay styles in here + You can use your northpass color palette in this file + +{{ color_palette.button_font_color }} +{{ color_palette.button_color }} +{{ color_palette.button_hover_color }} +{{ color_palette.header_font_color }} +{{ color_palette.header_font_hover_color }} +{{ color_palette.header_color }} +*/ + +/**** TABLE OF CONTENTS ======== + +1.0 - GLOBAL STYLING +2.0 - PAGE SPECIFIC STYLING + 2.1 - HOMEPAGE + 2.2 - DASHBOARD + 2.3 - CATALOG + 2.4 - COURSE COVER PAGE + 2.5 - TRAINING SESSION + 2.6 - LOGIN PAGE + 2.7 - LEARNING PATH COVER PAGE +3.0 - COMPONENT SPECIFIC STYLING + 3.1 - HEADER + 3.2 - SUB NAV + 3.3 - FOOTER + 3.4 - BUTTONS + 3.5 - HEADINGS, SUBHEADS & GENERAL TEXT + 3.6 - COURSE CARD + 3.7 - LEARNING PATH CARD + 3.8 - TRAINING EVENT CARD + 3.9 - COURSE BANNER + 3.10 - COURSE DETAILS + 3.11 - COURSE OUTLINE + 3.12 - FILTER DROPDOWN + 3.13 - CAROUSEL - GLOBAL STYLES + 3.14 - CAROUSEL - EVENTS + 3.15 - CAROUSEL - COURSES + 3.16 - CAROUSEL - INSTRUCTORS + 3.17 - HOMEPAGE SECTION - FEATURED PHOTOGRAPHY + 3.18 - HOMEPAGE SECTION - TIPS & TRICKS + 3.19 - HOMEPAGE SECTION - FAQS + 3.20 - HOMEPAGE SECTION - FEATURED COURSES +*/ + +/* + 1.0 GLOBAL SYLING +*/ +body { + background: #1d1f21; + font-family: "Helvetica Neue", "Arial", sans-serif; +} + +div { + color: #fff; +} +.np-color-white { + color: #fff; +} +.np-main { + background: #1d1f21; +} + +.np-main .np-resource-title, +.np-main .np-resource-subtitle, +.np-top-title, +.np-training-session-sessions-title, +.np-content-instructors-content-name, +.np-content-instructors-content-info { + color: #fff; +} + +.np-main .np-resource-subtitle, +.np-training-session-sessions-title, +.np-content-instructors-content-info { + opacity: 0.5; +} + +.np-resource-title { + font-weight: bold; +} +.np-card-image { + border-top-left-radius: 0; + border-top-right-radius: 0; + justify-content: center; + position: relative;blank +} + +.np-resource-header-card { + background: transparent; + box-shadow: none; + color: #fff; +} + +.np-dashboard-border { + background: transparent; + border: 1px solid rgba(255, 255, 255, 0.15); +} + +.np-dashboard-border .np-card-content, +.np-dashboard-border.np-card-container { + background: transparent; + border: 1px solid rgba(255, 255, 255, 0.15); +} +.np-dashboard-resources .np-card:last-of-type { + padding-bottom: 1rem; +} + +.np-card-content-divider { + border-top: 1px solid rgba(255, 255, 255, 0.15); + margin-top: 3rem; + padding-top: 3rem; +} + +.np-top-cta { + background: #1d1f21; + border-radius: 0; +} +.np-text-light { + color: rgba(255, 255, 255, 0.5); +} +.np-flex-wrapper { + display: flex; +} + +.choices__list--dropdown .choices__item { + color: #002532; +} +.dropdown [type="checkbox"]:checked + label:before { + background-color: #298e4e; +} + +.dropdown-button-apply { + background: #0297FA !important; + color: #fff; +} + +.np-zero-state-text { + color: #fff; + opacity: 0.5; +} +.np-dashboard-resources-container, +.np-learning-paths-resources-container { + border: 1px solid rgba(255, 255, 255, 0.5); + border-radius: 0; +} + +.np-course-version-outdated-popup-trigger, +.np-popup-header-icon { + color: #2bb24c; +} +.np-popup-tooltip { + background-color: black; + color: #fff; + border: 2px solid rgba(255, 255, 255, 0.5); + border-radius: 0; + bottom: 30px; + box-shadow: 0 2px 8px 0 rgb(53 64 78 / 25%); +} +.np-popup-header { + background-color: black; + border-radius: 0; + color: #fff; +} +.np-popup-body, +.np-popup-header-title { + color: #fff; +} +.np-popup-body-button { + background: #0297FA; + border-radius: 0; + text-transform: uppercase; +} + +.np-alert.np-alert-info { + background: #0297FA; +} + +@media (min-width: 768px) { + .np-md-flex-wrapper { + display: flex; + } +} + +/* + 2.0 - PAGE SPECIFIC STYLING +*/ + +/* + 2.1 - HOMEPAGE +*/ +.np-homepage-hero-image { + height: 250px; +} + +.np-homepage-hero-content { + padding: 2.25rem 2.5rem; + bottom: 0; +} +.np-homepage-featured-text { + padding: 0 2rem 2rem; +} +.np-homepage-featured { + margin-top: 4rem; +} +.np-homepage-featured .np-homepage-headline, +.np-homepage-featured .np-homepage-subheadline { + color: #fff; +} + +.np-homepage-hero .np-homepage-headline { + font-size: 32px; + line-height: 48px; + font-family: "Helvetica Neue", "Arial", sans-serif; +} +.np-homepage-featured .np-homepage-subheadline { + opacity: 0.5; +} + +.np-homepage-hero-cta, +.np-button.np-homepage-hero-cta { + margin-top: 1.5rem; + background: #1d1f21; + text-transform: uppercase; + height: 40px; +} + +.np-topics-list { + margin: 0 4%; +} +.np-topics-list .np-stretch-content { + flex-flow: row wrap; +} +.np-topics-list .np-button-secondary { + margin: 6px 0; + flex: 0 1 1; +} + +.np-topics-list .np-button.np-top-button { + text-transform: none; + padding: 0 1rem; + white-space: normal; + text-align: center; +} + +@media screen and (min-width: 768px) { + .np-homepage-featured-text { + padding: 0 4rem 2rem; + } + .np-homepage-hero-image { + height: auto; + min-height: 250px; + } + .np-homepage-hero-content { + padding: 5rem 4rem 2.25rem; + bottom: 0; + } + + .np-homepage-hero-cta, + .np-button.np-homepage-hero-cta { + margin-top: 2.25rem; + height: 50px; + } + + .np-homepage-hero .np-homepage-headline { + font-size: 36px; + line-height: 45px; + } + .np-homepage-hero .np-homepage-subheadline { + font-size: 18px; + line-height: 24px; + } + .np-button { + font-size: 0.875rem; + height: 40px; + color: #1d1f21; + } + + .np-topics-list { + margin: 0 4.5%; + } + .np-topics-list .np-button-secondary { + margin: 6px; + flex: 0 1 calc(33.33% - 12px); + height: 52px; + } +} + +@media screen and (min-width: 992px) { + .np-homepage-hero-image { + min-height: 250px; + } + .np-homepage-hero-content { + bottom: auto; + } + + .np-homepage-hero .np-homepage-headline { + font-size: 58px; + line-height: 72px; + } + .np-homepage-hero .np-homepage-subheadline { + font-size: 24px; + line-height: 32px; + } + .np-topics-list .np-button-secondary { + flex: 0 1 calc(25% - 12px); + } + .np-homepage-featured { + margin-top: 6.25rem; + } +} + +@media screen and (min-width: 1200px) { + .np-topics-list .np-button-secondary { + flex: 0 1 calc(20% - 12px); + } + .np-homepage-hero .np-homepage-headline { + font-size: 66px; + line-height: 82px; + } +} + +/* + 2.2 - DASHBOARD PAGE +*/ + +.np-dashboard { + background: #1D1F21; +} + +.np-dashboard-resources-title { + color: #fff; + opacity: 0.5; + margin-bottom: 19px; +} + +.np-dashboard .np-dashboard-resources-title, +.np-dashboard .np-md-flex-wrapper { + margin-bottom: 19px; +} +.np-dashboard .dashboard-section-courses .np-dashboard-resources-title { + margin-bottom: 0; +} +.np-dashboard .np-learning-paths-resources .np-card { + padding-bottom: 2.187rem; +} + +.np-dashboard-resources-category { + font-size: 20px; + line-height: 25px; + display: block; + font-weight: 500; + margin-top: 4px; +} + +@media (min-width: 768px) { + .np-dashboard .np-md-flex-wrapper .np-dashboard-resources-title { + margin-bottom: 0; + } + .np-dashboard-resources-title { + font-size: 0.937rem; + } + .np-dashboard .np-md-flex-wrapper { + justify-content: space-between; + align-items: flex-end; + } +} + +/* + 2.3 - CATALOG +*/ + +.np-catalog .np-progress-filter-wrapper, +.np-catalog .np-filter { + margin-bottom: 24px; +} +.catalog-filters { + display: flex; + justify-content: flex-end; + align-items: center; +} + +@media (min-width: 768px) { + .np-catalog-header { + align-items: start; + } + .np-catalog .np-progress-filter-wrapper, + .np-catalog .np-filter { + margin: 0; + } +} + +/* + 2.4 - COURSE COVER PAGE +*/ +#course-desktop .np-course-content { + background: #1d1f21; + padding: 0; +} +#course-mobile .np-card-container { + background: #1d1f21; + margin-top: 0; + border: 1px solid rgba(255, 255, 255, 0.15); +} +.np-content-instructors-content-name { + font-size: 1.062rem; + margin-bottom: 3px; +} +.np-content-instructors-content-info { + font-size: 0.937rem; +} + +.np-content-categories-content-item { + background: #1d1f21; + color: #fff; +} + +/* + 2.5 TRAINING SESSION +*/ + +.np-training-session-tile, +.np-training-session-tile:hover { + background-color: black; + border-radius: 0; + color: #fff; +} + +.np-training-session-tile-icon, +.np-training-session .np-top-vocabulary .np-training-session-icon, +.np-button-color.np-training-session-icon { + color: #2bb24c; +} +.np-training-session-tile-chevron { + color: #fff; +} + +.np-training-session .np-card-training-session-date-bar { + left: 0; + right: auto; + transform: rotate(180deg); +} + +.np-training-session-zero-state { + border: 1px solid rgba(255, 255, 255, 0.5); + border-radius: 0px; +} + +/* + 2.6 LOGIN PAGE +*/ + +.np-account .np-form-action { + background: #0297FA; + text-transform: uppercase; +} +.np-input-label { + color: #fff; + font-size: 0.85rem; + margin-bottom: 0.35rem; + opacity: 0.75; +} + +.np-account-avatar p { + color: #fff; +} +.terms-of-service a { + color: #2bb24c; +} +.np-account-avatar-choice .np-button-secondary { + background: transparent !important; + border: 1px solid rgba(255, 255, 255, 0.5); + color: #fff; + height: 40px !important; +} + +.np-open-access .np-box, +.np-open-access .np-box .np-header-color { + border-radius: 0; + background: #1d1f21; + box-shadow: none; +} +.np-open-access .np-alert.np-alert-error, +.np-open-access .np-box .np-box-content-container .np-form-action { + background: #0297FA; +} + +.np-open-access .np-box .np-box-content-container .np-form-headline { + color: #fff; + margin-bottom: 1.5rem; +} + +.np-open-access .np-box .np-box-content-container .np-form-subheadline { + color: #fff; + opacity: 0.75; +} + +.np-open-access .np-box .np-box-content-container .np-form-action { + background: #0297FA; + text-transform: uppercase; +} + +/* + 2.7 - LEARNING PATH COVER PAGE +*/ + +.np-learning-path-outline-inactive-item { + border: 1px solid rgba(255, 255, 255, 0.5); +} + +.np-learning-path-outline-bar { + background: rgba(255, 255, 255, 0.5); + border-radius: 0; + width: 3px; +} + +.np-top-image, +.np-learning-path-outline-course-image { + border-radius: 0; +} + +/* + 3.0 - COMPONENT SPECIFIC STYLING +*/ + +/* + 3.1 - HEADER +*/ +.np-header { + background: #fff; +} + +.np-header.np-header-absolute { + position: absolute; + background: transparent; + border-bottom: none; +} + +@media (min-width: 768px) { + .np-dashboard-header .np-resource-subtitle { + margin-bottom: 2.5rem; + } + .np-header-desktop-nav { + display: none; + } +} + +@media (min-width: 1024px) { + .np-header-desktop-nav { + display: flex; + } +} + +/* + 3.2 - SUB NAV +*/ + +.np-sub-navigation { + background: #1d1f21; + margin-bottom: 1rem; + padding: 0 1rem 0; +} + +.np-sub-navigation-content-item-link { + font-size: 22px; + justify-content: flex-end; + height: 30px; + color: #fff; + opacity: 0.5; +} + +.np-sub-navigation-content-item-active .np-sub-navigation-content-item-link { + color: #fff; + opacity: 0.7; + font-weight: 500; + justify-content: flex-end; +} + +.np-sub-navigation-content-item-active .np-sub-navigation-content-item-link, +.np-sub-navigation-content-item-active .np-sub-navigation-content-item-bar { + opacity: 1; +} + +.np-sub-navigation-content-item-bar { + background-color: #fff; + margin: 0 auto; + width: 100%; + opacity: 0; + display: block; + height: 0.2rem; +} + +/* + 3.3 - FOOTER +*/ +.np-footer + .np-powered-by { + background: #1d1f21; +} +.np-powered-by.show { + background: #1d1f21; +} +.np-footer-navigation-link, +.np-footer-social-links-icon.np-button-color, +.np-footer-support-link.np-button-color { + color: #1d1f21; +} +.np-footer-support-item { + color: #1d1f21; +} + +/* + 3.4 - BUTTONS +*/ + +.np-button { + border-radius: 0; +} + +.np-top-button.np-button.np-button-secondary, +.np-button.dropdown-button { + background-color: transparent !important; + background-image: none; + border: 1px solid rgba(255, 255, 255, 0.5); + color: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important + font-weight: 600; +} + +.np-button.np-background-color, +.np-button.np-top-button, +.np-card-content-footer .np-button { + background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important + text-transform: uppercase; +} + +button.enwYlE, +button.enwYlE:hover { + background-color: transparent; + border: 1px solid rgba(255, 255, 255, 0.5); + border-radius: 0; + padding: 8px 12px; + color: #fff !important; +} + +button.jryxug { + color: #fff; +} +.bpSgf, +.fsgQJU { + color: rgba(255, 255, 255, 0.75) !important; +} + +.mjmTc { + border-radius: 0 !important; +} + +/* 3.5 - HEADINGS, SUBHEADS & GENERAL TEXT */ +.np-card-heading { + font-size: 1.25rem; +} +.np-text-title { + color: #fff; + font-size: 0.937rem; +} + +@media (min-width: 768px) { + .np-card-heading { + font-size: 1.5rem; + line-height: 1.875rem; + } + .np-card-text { + line-height: 1.75rem; + } +} + +/* + 3.6 - COURSE CARD +*/ +.np-card-container { + height: auto; + position: relative; + color: #fff; +} + +.np-button.np-background-color, .np-button.np-top-button, .np-card-content-footer .np-button { + background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important +} + +.np-card-container, +.np-card-container-training-session { + background: #1d1f21; + border-radius: 0; + box-shadow: none; +} + +.np-card-content np-card-content-vertical np-card-padding { + background: #1d1f21; +} + +.np-card-padding, +.np-card-padding-dynamic { + padding: 1.5rem; +} + +.np-card-image-overlay { + position: absolute; + width: 100%; + height: 100%; + opacity: 0.9; +} + +.np-card-image-content-top, +.np-card-image-content-bottom { + position: absolute; + left: 1.5rem; + z-index: 1; +} + +.np-card-image-content-top { + top: 1.5rem; +} +.np-card-image-content-bottom { + bottom: 1.5rem; + display: flex; + justify-content: space-between; + align-items: center; +} +.np-card-image-content-bottom .np-card-content-progress { + color: #fff; + margin-top: 0; +} +.np-card-content { + background: black; +} +.np-card-content-footer { + margin-top: 1.2rem; +} +.np-card-content-footer .np-button { + width: 100%; + background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important; +} + +@media screen and (min-width: 768px) { + .np-card-content-title { + font-size: 1.1rem; + flex: 1; + } + + .np-card-image-content-top, + .np-card-image-content-bottom { + left: 1.5rem; + right: 1.5rem; + } + + .np-card-image-content-top { + top: 1.5rem; + } + .np-card-image-content-bottom { + bottom: 1.5rem; + } + .np-card-padding, + .np-card-padding-dynamic { + padding: 1.5rem; + } +} + +@media screen and (min-width: 1024px) { + .np-card-content-title { + font-size: 1.5rem; + } + + .np-card-image-content-top, + .np-card-image-content-bottom { + left: 2rem; + right: 2rem; + } + + .np-card-image-content-top { + top: 2rem; + } + .np-card-image-content-bottom { + bottom: 2rem; + } + .np-card-padding, + .np-card-padding-dynamic { + padding: 2rem; + } +} + +/* + 3.7 - LEARNING PATH CARD +*/ + +.np-learning-path .np-card-text-wrapper { + position: relative; + z-index: 2; +} + +.np-learning-paths .np-card-content-description { + color: #fff; +} +.np-learning-path .np-card-content-title { + color: #fff; + flex: 2; +} +.np-learning-paths .np-learning-path .np-card-content-title { + flex: none; +} +.np-learning-path .np-card-content-progress { + color: #2bb24c; +} +.np-learning-path .np-card-content-footer .np-button { + width: auto; +} + +@media (min-width: 768px) { + .np-learning-path-image { + width: 37%; + } + .np-card-content-title { + flex: 0; + } + + .np-main:not(.np-training-events) .np-dashboard-resources .np-card { + padding-right: 0; + padding-left: 0; + } + + .np-learning-paths .np-card-content { + padding: 2rem; + height: 100%; + } + + .np-learning-path .np-card-content { + height: 100%; + display: flex; + } + + .np-learning-path { + display: flex; + } +} + +@media (min-width: 1024px) { + .np-learning-path { + display: flex; + min-height: 260px; + } +} + +/* + 3.8 - TRAINING EVENTS CARD +*/ + +.np-event-card .np-card-container { + border: 2px solid rgba(255, 255, 255, 0.15); +} + +.np-event-card .np-card-content { + padding: 1.062rem 1rem 1.062rem 1.25rem; + border-top: 2px solid rgba(255, 255, 255, 0.15); + flex: 0; +} + +.np-card-content-training-event { + padding: 1rem 1rem 0.5rem; +} +.np-button.dropdown-calendar-button { + background: #0297FA; +} +.np-card-content-training-event .np-card-content-title, +.np-card-content-training-event .np-card-content-subtitle { + color: #fff; +} +.np-card-content-training-event .np-card-content-subtitle { + opacity: 0.5; + flex: 1; +} + +.np-card-training-session { + margin-top: 0.9rem; + border-radius: 0; + background: transparent; + display: flex; + justify-content: space-between; + align-items: center; + margin-right: -10px; +} + +.np-card-training-session .np-card-content-label { + background: rgba(255, 255, 255, 0.15); + border-radius: 0; + color: #fff; + padding: 3px 6px; + margin-bottom: 0; +} + +.np-card-training-session-date-year, +.np-card-training-session-date-month { + text-align: right; + color: #fff; +} + +.np-training-session .np-card-training-session-date-year, +.np-training-session .np-card-training-session-date-month { + text-align: left; +} + +.np-card-training-session-date-day { + margin-right: 0; + margin-left: 5px; + color: #fff; +} + +.np-card-training-session-date-year { + opacity: 0.5; +} + +.np-card-training-session-date-bar { + border-bottom-right-radius: 0; + border-top-right-radius: 0; + right: 0; + left: auto; + width: 0; + height: 0; + border-top: 16px solid transparent; + border-bottom: 18px solid transparent; + border-right: 16px solid #2bb24c; + background: none; +} + +.np-card-training-sessions-label { + color: #fff; +} +.np-event-card .np-card-container { + height: 100%; +} +.np-card-training-sessions { + background: transparent; + padding: 0; +} +.np-training-events .np-card-container { + background: transparent; + border-radius: 18px; + border: black 8px solid; +} + +.np-training-events .np-card-container .np-card-content { + background: transparent; +} + +.np-training-events .np-card-training-sessions .np-button { + background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important +} + +.np-card-training-sessions .np-button .np-button-wide { + background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important + font-weight: 800; + text-transform: uppercase; + font-size: 0.875rem; + height: 40px; +} + +.np-card-content np-card-content-vertical np-card-padding { + background: transparent; +} + +@media (min-width: 768px) { + .np-card-content-training-event { + flex: 1; + display: flex; + flex-direction: column; + } + + .np-card-content-training-event { + padding: 2rem 2rem 0.5rem; + } +} + +/* + 3.9 - COURSE BANNER +*/ +.np-course-banner { + position: relative; + margin-bottom: 2.5rem; + padding: 0; +} + +.np-course-banner-image { + display: block; + width: 100%; +} + +.np-course-info.np-course-banner-info { + position: absolute; + bottom: 1.5rem; + left: 1.5rem; + width: 80%; +} + +.np-course-banner .np-course-title { + font-size: 1.5rem; + margin-bottom: 2rem; + font-weight: bold; +} + +@media (min-width: 768px) { + .np-course-banner-image { + margin: 0 0 0 auto; + width: 50%; + } + + .np-course-banner-overlay { + background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%); + linear-gradient(90deg, #035262 0%, #035161 49.48%, rgba(3, 82, 98, 0) 73.44%); + position: absolute; + width: 100%; + height: 100%; + left: 0; + top: 0; + } + + .np-course-info.np-course-banner-info { + bottom: 2rem; + left: 2rem; + width: 75%; + } + + .np-course-banner .np-course-title { + font-size: 3rem; + margin-bottom: 2.5rem; + } +} + +@media (min-width: 1170px) { + .np-course-info.np-course-banner-info { + bottom: 5.25rem; + left: 6.25rem; + width: 60%; + } + + .np-course-banner .np-course-title { + font-size: 4.125rem; + margin-bottom: 3.125rem; + } +} + +/* + 3.10 - COURSE DETAILS +*/ +.np-course-details { + display: flex; +} + +.np-course-detail { + font-size: 1.125rem; + color: #fff; + flex: 0 1 calc(33.33%); +} + +.np-details-label { + text-transform: uppercase; + opacity: 0.5; + font-size: 0.75rem; + display: block; + font-weight: bold; + margin-top: 2px; +} + +.np-divider { + border-top: none; +} + +@media screen and (min-width: 768px) { + .np-course-detail { + font-size: 1.5rem; + } + .np-course-banner-info .np-course-details { + max-width: 430px; + } +} + +@media (min-width: 1170px) { + .np-course-banner-info .np-course-detail { + font-size: 2rem; + } + .np-course-banner-info .np-details-label { + font-size: 1.062rem; + margin-top: 3px; + } +} + +/* + 3.11 - COURSE PROGRESS & CTA +*/ +.np-card-progress-bar-container, +.np-progress-bar-container { + background: #263e47; + border-radius: 0; +} + +.np-card-progress-bar { + border-radius: 0; + background-color: #2bb24c; +} + +.np-top-cta-progress-title { + color: #fff; + text-transform: none; + margin-top: 0.7rem; + margin-bottom: 0.7rem; +} +.np-top-cta-progress-text { + color: #2bb24c; +} + +.np-top-cta .np-top-button .np-button .np-button-big { + background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important +} + +/* + 3.12 - COURSE OUTLINE +*/ + +.np-course-outline-content { + margin-top: 20px; +} +.np-course-outline-content-section-name { + border-bottom: 1px solid rgba(255, 255, 255, 0.15); +} + +.np-course-outline-content-activity-list { + border-bottom: 1px solid rgba(255, 255, 255, 0.15); + padding: 1rem 0; +} + +.np-course-outline-content-activity-link { + color: #809299; + font-size: 0.937rem; +} + +.np-course-outline-content-activity-link-completed { + color: #fff; + font-size: 0.937rem; + font-weight: 400; +} + +.np-course-outline-content-activity-icon, +.np-course-outline-content-activity-title { + color: rgba(255, 255, 255, 0.5); + font-size: 0.937rem; + padding: 0.15rem 1.25rem 0 0.75rem; +} + +.np-course-outline-content-activity-icon.fa-check { + color: #2bb24c; +} + +.np-course-outline-content-activity-icon.icon-course-not-started { + position: relative; + width: 20px; + height: 17px; + margin-left: 11px; + margin-right: 5px; +} + +.np-course-outline-content-activity-icon.icon-course-not-started::before, +.np-course-outline-content-activity-icon.icon-course-not-started::after { + content: ""; + position: absolute; + width: 16px; + height: 2px; + background-color: rgba(255, 255, 255, 0.25); + left: 0; + top: 5px; +} + +.np-course-outline-content-activity-icon.icon-course-not-started::before { + width: 9px; + top: 10px; +} + +/* + 3.12 - FILTER DROPDOWN +*/ + +.np-button.dropdown-button { + border: 2px solid rgba(255, 255, 255, 0.25); + padding: 9px 60px 9px 20px; + height: auto; + position: relative; + color: #fff; +} + +.np-button.dropdown-button:before { + content: ""; + position: absolute; + width: 20px; + height: 100%; + border-left: 2px solid rgba(255, 255, 255, 0.25); + right: 20px; + top: 0; +} + +.np-button.dropdown-button:after { + content: "\f078"; + font-family: "Font Awesome 5 Pro"; + position: absolute; + width: 20px; + height: 100%; + color: rgba(255, 255, 255, 0.5); + right: 10px; + top: 0; + display: flex; + justify-content: center; + align-items: center; + font-size: 1rem; +} + +.dropdown-menu { + border-radius: 0; + border: 1px solid rgba(255, 255, 255, 0.25); + color: #fff; + background-color: #1d1f21; + box-shadow: none; + top: 95%; +} + +/* + 3.13 - CAROUSEL - GLOBAL STYLES +*/ + +.np-carousel { + margin-bottom: 3rem; +} +.np-carousel-bg-blue { + background: black; +} +.np-carousel .slick-track { + display: flex; +} +.np-carousel .slick-slide { + height: auto; +} +.np-carousel .np-card { + height: 100%; +} + +.np-carousel .slick-arrow { + color: #1d1f21; + font-size: 2.5rem; + opacity: 1; + transition: opacity 0.2s; + display: flex; + align-items: center; + top: 0; +} + +.np-carousel .slick-arrow:before { + position: absolute; + width: 80px; + z-index: 500; + display: flex; + height: 100%; + align-items: center; + top: 0; +} + +.np-carousel .slick-arrow.fa-chevron-left { + left: -8px; +} + +.np-carousel .slick-arrow.fa-chevron-right { + right: -8px; + justify-content: flex-end; +} + +.np-carousel .slick-arrow.fa-chevron-left:before { + background: linear-gradient(90deg, #242221 10%, rgba(0, 37, 50, 0) 100%); + cursor: pointer; +} + +.np-carousel .slick-arrow.fa-chevron-right:before { + background: linear-gradient(90deg, #242221 10%, rgba(0, 37, 50, 0) 100%); + justify-content: flex-end; + cursor: pointer; +} + +.np-carousel .slick-arrow.slick-disabled { + opacity: 0; + cursor: text; +} +.np-carousel-card .np-card { + padding-bottom: 0; +} + +.np-carousel .slick-dots { + display: flex; + justify-content: space-between; + padding: 0; + margin: 0 auto; + max-width: 200px; +} +.np-carousel .slick-dots li button { + display: none; +} + +.np-carousel .slick-dots li::marker { + color: #f47c5a; + font-size: 1.7rem; +} + +@media (min-width: 768px) { + .np-carousel .slick-track { + margin-left: 0; + } + + .np-carousel .slick-arrow.fa-chevron-right:before { + background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important; + } + + .np-carousel .slick-arrow.fa-chevron-left:before { + background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important; + } +} + +@media (min-width: 1024px) { + .np-carousel .slick-arrow:before { + width: 100px; + } +} + +/* + 3.14 - CAROUSEL - EVENTS +*/ +.events-carousel { + background: black; + padding: 1.5rem 0; + margin: 0 1.1rem 3rem; +} +.events-carousel .slick-track { + padding: 0 8px; +} +.events-carousel .np-card { + padding: 0 0.8rem; +} +.events-carousel .slick-arrow.fa-chevron-right { + right: -26px; +} +.events-carousel .slick-arrow.fa-chevron-left { + left: -26px; +} + +@media (min-width: 768px) { + .events-carousel .np-card { + padding: 0 1rem; + } + .events-carousel { + padding: 2rem 0; + margin: 0 0 3rem; + } + .events-carousel .slick-arrow.fa-chevron-right { + right: -8px; + } + .events-carousel .slick-arrow.fa-chevron-left { + left: -8px; + } +} + +@media (min-width: 1170px) { + .events-carousel .np-card { + padding: 0 1rem; + } +} + +/* + 3.15 - CAROUSEL - COURSES +*/ + +@media (min-width: 768px) { + .courses-carousel { + margin-left: -1rem; + margin-right: -1rem; + } + + .courses-carousel .np-carousel-card .np-card { + padding-right: 1rem; + padding-left: 1rem; + } +} + +@media (min-width: 1024px) { + .courses-carousel { + margin-left: -2rem; + margin-right: -2rem; + } + .courses-carousel .np-carousel-card .np-card { + padding-right: 2rem; + padding-left: 2rem; + } +} + +/* + 3.16 - CAROUSEL - INSTRUCTORS +*/ +.instructors-carousel .instructor-slide { + display: flex !important; + align-items: center; +} +.instructors-carousel .instructor-image { + border-radius: 50%; + width: 100px; + height: 100px; + min-width: 100px; + background: black; + display: flex; + justify-content: center; + align-items: center; + margin-right: 16px; +} + +.instructors-carousel .instructor-image img { + border-radius: 50%; + width: 80px; + height: 80px; +} + +.instructors-carousel .instructor-name { + font-size: 18px; + line-height: 22px; + font-weight: bold; +} + +.instructors-carousel .instructor-email { + font-size: 14px; + line-height: 18px; + font-weight: 500; + color: #2bb24c; + text-decoration: none; +} + +.instructors-carousel .instructor-joined { + font-size: 14px; + line-height: 20px; + font-weight: 500; + opacity: 0.5; + margin-top: 16px; +} + +@media (min-width: 1024px) { + .instructors-carousel { + margin-top: 32px; + } + + .instructors-carousel .instructor-image { + width: 160px; + height: 160px; + min-width: 160px; + margin-right: 22px; + } + + .instructors-carousel .instructor-image img { + width: 120px; + height: 120px; + } + .instructors-carousel .instructor-name { + font-size: 20px; + line-height: 25px; + } + .instructors-carousel .instructor-email { + font-size: 16px; + line-height: 20px; + } + .instructors-carousel .instructor-joined { + font-size: 16px; + margin-top: 20px; + } +} + +/* + 3.17 - HOMEPAGE SECTION - FEATURED PHOTOGRAPHY +*/ + +.featured-photography-carousel { + margin: 0 22px 3rem; + padding: 2rem 0; +} +.featured-photography-carousel .slick-track { + padding: 0 2rem; +} +.featured-photography-carousel .slick-arrow { + margin: 0 -10px; +} + +.featured-photography-carousel .slide-label { + font-size: 0.9375rem; + margin-top: 8px; + font-weight: 600; +} + +@media (min-width: 768px) { + .featured-photography-carousel { + margin: 0 2rem 3rem; + } + .featured-photography-carousel .slick-arrow { + margin: 0; + } +} + +@media (min-width: 1024px) { + .featured-photography-carousel { + margin: 0 4.0625rem 3rem; + } +} + +/* + 3.18 - HOMEPAGE SECTION - TIPS & TRICKS +*/ + +.tips-tricks-carousel { + margin: 0 4% 3rem; +} + +.tips-tricks-carousel .quote-block { + padding: 1.5rem; + font-size: 16px; + line-height: 20px; + font-weight: 500; + position: relative; + max-width: 752px; + margin: 0 2.5rem; +} + +.tips-tricks-carousel.np-carousel .slick-arrow.fa-chevron-left:before, +.tips-tricks-carousel.np-carousel .slick-arrow.fa-chevron-right:before { + background: none; +} + +.tips-tricks-carousel .fa-quote-left { + font-size: 32px; + position: absolute; + top: 0px; + left: -20px; + background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} + +.tips-tricks-carousel .quote-author-info { + font-size: 17px; + padding-right: 1.5rem; + text-align: right; + margin: 1rem 2.5rem 0; +} + +.tips-tricks-carousel .quote-author-info span { + font-size: 15px; + font-weight: 500; + opacity: 0.5; +} + +@media (min-width: 1024px) { + .tips-tricks-carousel { + margin: 0 4.0625rem 3rem; + } + + .tips-tricks-carousel .np-carousel-card { + display: flex !important; + align-items: center; + margin: 0 120px 0 180px; + } + + .tips-tricks-carousel .quote-block { + padding: 3.75rem; + font-size: 24px; + line-height: 30px; + margin: 0; + } + + .tips-tricks-carousel .fa-quote-left { + font-size: 50px; + top: 15px; + left: -30px; + } + + .tips-tricks-carousel .quote-author-info { + font-size: 20px; + margin: 0; + margin-left: 48px; + padding: 0; + text-align: left; + } + + .tips-tricks-carousel .quote-author-info span { + font-size: 16px; + } +} + +@media (min-width: 1024px) and (max-width: 1440px) { + .tips-tricks-carousel { + margin: 0 4.514vw 3rem; + } + + .tips-tricks-carousel .np-carousel-card { + margin: 0 8.333vw 0 12.5vw; + } + + .tips-tricks-carousel .quote-block { + padding: 3.472vw; + font-size: 1.667vw; + line-height: 2.083vw; + max-width: 52.222vw; + } + + .tips-tricks-carousel .fa-quote-left { + font-size: 3.472vw; + top: 1.042vw; + left: -2.083vw; + } + + .tips-tricks-carousel .quote-author-info { + font-size: 1.389vw; + margin-left: 3.333vw; + } + .tips-tricks-carousel .quote-author-info span { + font-size: 1.111vw; + } +} + +/* + 3.19 - HOMEPAGE SECTION - FAQ +*/ + +.np-faq { + margin-bottom: 3rem; +} +.np-accordion { + margin: 0 22px 32px; +} + +.accordion-btn { + background-color: black; + color: #fff; + cursor: pointer; + width: 100%; + min-height: 76px; + padding: 0 18px 0 92px; + text-align: left; + border: none; + outline: none; + transition: 0.4s; + position: relative; + display: flex; + align-items: center; +} + +.fa-plus { + background: linear-gradient(-134deg, #5ad2f4 -10%, #2f6df9 100%) !important; +} +.fa-minus { + background: linear-gradient(-134deg, #faccbe -10%, #f47c5a 100%) !important; +} + +.fa-plus, +.fa-minus { + font-size: 2.5rem; + color: #fff; + position: absolute; + left: 0; + top: 0; + width: 76px; + height: 76px; + display: flex; + align-items: center; + justify-content: center; + transition: 0.4s; +} + +.accordion-title, +.accordion-panel-content { + line-height: 1.375rem; + position: relative; +} +.accordion-panel-content { + padding: 18px; +} +.accordion-panel-content p { + margin-top: 0; +} + +.accordion-panel-content:before { + content: ""; + width: 75px; + height: 1px; + background: #2bb24c; + position: absolute; + top: 0; + left: 18px; +} + +.accordion-panel { + background-color: black; + max-height: 0; + overflow: hidden; + transition: max-height 0.4s ease-out; + margin-left: 76px; +} + +@media (min-width: 768px) { + .np-faqs { + margin: 0 4.0625rem; + } + .np-accordion { + margin: 0 8px 32px; + } +} + +/* + 3.20 - HOMEPAGE SECTION - FEATURED COURSES +*/ + +.np-homepage-featured-courses .np-card-container { + margin-bottom: 32px; + border: white 2px solid; +} +.np-homepage-featured-courses .col-xs-12:last-child .np-card-container { + margin-bottom: 0; +} +.np-featured-course { + display: block; +} +.np-featured-course.np-learning-path .np-card-content-progress { + color: #fff; +} +.np-featured-course .np-card-content-title { + flex: 0; + margin: 0 0 2px; + overflow: none; +} +.np-featured-course .np-card-content-subtitle { + opacity: 0.5; +} +.np-featured-course .np-card-content-description { + color: #fff; + display: block; + line-height: 20px; + font-size: 1rem; +} +.np-featured-course .np-card-image-content-top { + width: 90%; +} +.np-featured-course-img-container { + position: relative; +} +.np-featured-course .np-card-text-wrapper { + flex: 2; +} +.np-featured-course-img-container .featured-video{ + height: 275px; + display: block; +} + +@media (min-width: 992px) { + .np-featured-course { + display: flex; + } + .np-featured-course-img-container img { + position: absolute; + width: auto; + height: 100%; + } + .np-featured-course-img-container { + width: 40%; + } +} + +@media (min-width: 1200px) { + .np-featured-course-img-container { + width: 33.33%; + } +} diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/training_events.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/training_events.html.liquid new file mode 100644 index 00000000..08b79045 --- /dev/null +++ b/Custom_Templates/customer_templates/Norm_sandbox_2/training_events.html.liquid @@ -0,0 +1,39 @@ +{% include "header" %} +
+
+
+
+
+ Menlo Learning Program +
+
+ Resources to help you make the most of your Security Training +
+
+
+{% include "sub_navigation" %} +
+
+
+ +
+
+{% include "footer" %} + + diff --git a/Custom_Templates/customer_templates/Norm_sandbox_2/videos.html.liquid b/Custom_Templates/customer_templates/Norm_sandbox_2/videos.html.liquid new file mode 100644 index 00000000..4a385f1f --- /dev/null +++ b/Custom_Templates/customer_templates/Norm_sandbox_2/videos.html.liquid @@ -0,0 +1,117 @@ +{% include "header" %} +{% include "course_version_outdated_alert", courses: courses.in_catalog %} +
+
+
+
+
+ Video Tutorials +
+
+ Beginner to advanced level training for the die-hard climber +
+
+
+{% include "sub_navigation" %} + + + +{% include "footer" %} + + + \ No newline at end of file