diff --git a/NP_Custom_Templates/customer_templates/Stripe/_backup_courses_partnertraining_index.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_backup_courses_partnertraining_index.html.liquid new file mode 100644 index 00000000..d55a8c6a --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_backup_courses_partnertraining_index.html.liquid @@ -0,0 +1,86 @@ +{% comment %} Determine if events are enabled and the user is registered for at least one event {% endcomment %} +{% if features.training_events? and training_events.enrolled and training_events.enrolled.any? %} + {% assign show_events_section = true %} +{% endif %} + +{% comment %} Determine whether special classes need to be added to non course sections and the cards within {% endcomment %} +{% if show_learning_paths_section %} + {% assign learning_path_section_classes = "col-md-8 col-lg-6" %} + {% assign learning_path_card_classes = "" %} +{% endif %} + +{%if show_events_section%} + {% assign event_section_classes = "col-md-4 col-lg-6" %} + {% assign event_card_classes = "col-x-sm-6 col-sm-6 col-md-12 col-lg-6" %} +{%endif%} + +{% include "header", current_page_orgin: "/app/partner-training" %} +
+ +
+

Partner Training Dashboard

+
+ +
+ +
+ + {% comment %} Show the first featured course as a banner {% endcomment %} + {% if courses.featured and courses.featured.any? %} +
+ {% include "banner_course", course: courses.featured.first, button_text: "Get Started" %} +
+ {% endif %} + + {% comment %} Show this section if either the event section or learning path section has content {% endcomment %} + {% if show_learning_paths_section or show_events_section %} + +
+ + {% if show_learning_paths_section %} +
+

+ Learning Paths +

+ {% include "learning_paths_index", items: learning_paths.enrolled, card_classes: learning_path_card_classes %} +
+ {% endif %} + + {% if show_events_section %} +
+

+ Upcoming Events +

+ {% include "training_events_dashboard", card_classes: event_card_classes %} +
+ {% endif %} + +
+ + {% endif %} + + {% if courses.enrolled and courses.enrolled.any? %} +
+ {% for course in courses.enrolled %} + {% for category in course.categories %} + {% if category.name == 'Partner Training' %} + {% include "cards_course", course: course, card_classes: card_classes %} + {% endif %} + {% endfor %} + + {% endfor %} +
+ {% else %} + {% capture message %} + {% t shared.zero_state.courses.index, + key: current_school.course_vocabulary + %} + {% endcapture %} + {% assign message = message | replace: "Courses", "tutorials" %} + {% include "courses_zero_state", message: message, filters_applied: false %} + {% endif %} +
+
+ +
+{% include "footer" %} \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/_cards_course.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_cards_course.html.liquid new file mode 100644 index 00000000..f8f699d0 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_cards_course.html.liquid @@ -0,0 +1,46 @@ +
+
+
+ {% if course.ribbon and course.ribbon.size > 0 %} +
+ {{ course.ribbon }} +
+ {% endif %} +
+
+

+ {{ course.name }} +

+ {% if course.instructor_names and course.instructor_names.size > 0 %} +
+ {{ course.instructor_names }} +
+ {% endif %} + {% if course.short_description and course.short_description.size > 0 %} +
+ {{ course.short_description | split: " --- " | last }} +
+ {% endif %} +
+ {% capture course_path %}{% route course, id: course.id %}{% endcapture %} + + {% t shared.view %} + + {% if course.enrolled? %} + {% if course.has_to_restart? %} + {% include "course_version_outdated_popup", path: course_path %} + {% endif %} +
+ {% if course.completed? %} + Complete + {% elsif course.started? == false %} + Enrolled + {% else %} + {{ course.progress }}% Complete + {% endif %} +
+ {% endif %} +
+
+
+
diff --git a/NP_Custom_Templates/customer_templates/Stripe/_cards_learning_path.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_cards_learning_path.html.liquid new file mode 100644 index 00000000..b71287bd --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_cards_learning_path.html.liquid @@ -0,0 +1,61 @@ +
+
+
+
+ + {{ learning_path.items.count }} Tutorial{% if learning_path.items.count > 1%}s{% endif %} +
+
+
+ +
+

+ {{ learning_path.name }} +

+ + {% if learning_path.has_instructors? %} +
+ {{ learning_path.instructor_names }} +
+ {% endif %} + +
+ + {{ learning_path.items.count }} Tutorial{% if learning_path.items.count > 1%}s{% endif %} +
+ + {% comment %} Currently hiding the description {% endcomment %} + {% comment %} + {% if learning_path.description and learning_path.description.size > 0 %} +
+ {{ learning_path.description }} +
+ {% endif %} + {% endcomment %} + +
+ + View + View Path + + {% if learning_path.enrolled? %} +
+ {% if learning_path.completed? %} + Complete + {% elsif learning_path.started? == false %} + Enrolled + {% else %} + {{ learning_path.progress }}% Complete + {% endif %} +
+ {% endif %} +
+
+
+
+
+
+
+
+
diff --git a/NP_Custom_Templates/customer_templates/Stripe/_cards_training_event.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_cards_training_event.html.liquid new file mode 100644 index 00000000..f5e66d08 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_cards_training_event.html.liquid @@ -0,0 +1,59 @@ +
+
+
+

+ {{ training_event.title }} +

+
+ {% case training_event.event_type %} + {% when "online" %} + Online Event + {% when "in_person" %} + In-Person Event + {% endcase %} +
+ {% if training_event.description and training_event.description.size > 0 %} +
+ + {{ training_event.description | strip }} + +
+ {% endif %} +
+ + {% comment %} Fallback to the first session {% endcomment %} + {% assign session_to_display = training_event.sessions | first %} + {% comment %} Check for an enrolled session and preferrably display that {% endcomment %} + {% assign enrolled_sessions = training_event.sessions | where: "registered?", true %} + {% if enrolled_sessions and enrolled_sessions.size > 0 %} + {% assign session_to_display = enrolled_sessions | first %} + {% endif %} + + {% include "training_session_date", training_session: session_to_display %} + {% if training_event.sessions and training_event.sessions.size > 1 %} +
+
+ + + {{ training_event.sessions.size | minus: 1 }} + {% if training_event.sessions.size == 2 %} + Other Session + {% else %} + Other Sessions + {% endif %} + +
+
+ {% endif %} +
+
+ + {% t shared.view %} Event + +
+
+
+
diff --git a/NP_Custom_Templates/customer_templates/Stripe/_course_activity_locked.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_course_activity_locked.html.liquid new file mode 100644 index 00000000..cfda6676 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_course_activity_locked.html.liquid @@ -0,0 +1,4 @@ + + {{ activity.title }} + + diff --git a/NP_Custom_Templates/customer_templates/Stripe/_course_activity_unlocked.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_course_activity_unlocked.html.liquid new file mode 100644 index 00000000..1145ddff --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_course_activity_unlocked.html.liquid @@ -0,0 +1,9 @@ + + {{ activity.title }} + diff --git a/NP_Custom_Templates/customer_templates/Stripe/_course_cta_button.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_course_cta_button.html.liquid new file mode 100644 index 00000000..c15062d4 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_course_cta_button.html.liquid @@ -0,0 +1,27 @@ +{% if course.learner_can_retake? %} +
+ {% form_authenticity_token %} + +
+{% else %} + + {% if course.enrolled? == false %} + Enroll in Course + {% elsif course.started? == false %} + Start Course + {% elsif course.completed? %} + View Course + {% else %} + Continue Course + {% endif %} + +{% endif %} \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/_course_description.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_course_description.html.liquid new file mode 100644 index 00000000..7f166e7b --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_course_description.html.liquid @@ -0,0 +1,6 @@ +

+ About This Tutorial +

+
+ {{ course.full_description }} +
diff --git a/NP_Custom_Templates/customer_templates/Stripe/_course_events.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_course_events.html.liquid new file mode 100644 index 00000000..eabe3960 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_course_events.html.liquid @@ -0,0 +1,26 @@ +

+ {% t .header %} +

+{% for event in course.events %} +
+
+
+ {{ event.sessions.first.abbreviated_month }} +
+
+ {{ event.sessions.first.day }} +
+
+
+
+ {{ event.title }} +
+
+ {% t shared.event_types, key: event.event_type %} +
+
+ {{ event.sessions.first.time_period | replace: "AM", "am" | replace: "PM", "pm" | replace: "-", "–" }} {{ event.sessions.first.time_zone }} +
+
+
+{% endfor %} \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/_course_header.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_course_header.html.liquid new file mode 100644 index 00000000..21bc4502 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_course_header.html.liquid @@ -0,0 +1,6 @@ +
+ {{ course.name }} +
+
+ {% include "course_cta_button" %} +
diff --git a/NP_Custom_Templates/customer_templates/Stripe/_course_instructors.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_course_instructors.html.liquid new file mode 100644 index 00000000..851e2719 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_course_instructors.html.liquid @@ -0,0 +1,26 @@ +

+ Instructors +

+
+ {% for instructor in course.instructors %} +
+ {{ instructor.name }} +
+
+ {{ instructor.name }} +
+ + {% if instructor.title and instructor.title.size > 0 %} +
+ {{ instructor.title }} +
+ {% endif %} + +
+
+ {% endfor %} +
diff --git a/NP_Custom_Templates/customer_templates/Stripe/_course_outline.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_course_outline.html.liquid new file mode 100644 index 00000000..d77c2984 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_course_outline.html.liquid @@ -0,0 +1,57 @@ +
+

+ Outline +

+
+
    + {% for section in course.sections %} +
  1. +
    + {{ section.name }} +
    +
      + {% for activity in section.activities %} + +
    1. + + + {% comment %} If the activity is locked show a locked icon and then a text title {% endcomment %} + {% if activity.locked? %} + + {% include "course_activity_locked" %} + + {% comment %} If the user is not enrolled in the course show a text title {% endcomment %} + {% elsif course.enrolled? == false %} + {% include "course_activity_locked" %} + + {% comment %} Otherwise include a link {% endcomment %} + {% else %} + {% include "course_activity_unlocked", activity_classes: "np-course-outline-content-activity-link-completed" %} + {% endif %} + +
      +
      2. + {% endfor %} +
    +
    2. + {% endfor %} +
+
+
diff --git a/NP_Custom_Templates/customer_templates/Stripe/_course_progress_and_cta.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_course_progress_and_cta.html.liquid new file mode 100644 index 00000000..cf0394d8 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_course_progress_and_cta.html.liquid @@ -0,0 +1,23 @@ +
+
+ {% include "course_cta_button" %} +
+
+
+ Progress +
+
+
+
+
+ +
+ {{ course.progress }}% Complete +
+
+
+
+ {% include "course_cta_button" %} +
\ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/_course_version_outdated_popup.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_course_version_outdated_popup.html.liquid new file mode 100644 index 00000000..6da1a9c2 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_course_version_outdated_popup.html.liquid @@ -0,0 +1,49 @@ +
+
+ + +
+
diff --git a/NP_Custom_Templates/customer_templates/Stripe/_courses_index.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_courses_index.html.liquid new file mode 100644 index 00000000..65779d05 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_courses_index.html.liquid @@ -0,0 +1,15 @@ +{% if courses.enrolled and courses.enrolled.any? %} +
+ {% for course in courses.enrolled %} + {% include "cards_course", course: course, card_classes: card_classes %} + {% endfor %} +
+{% else %} + {% capture message %} + {% t shared.zero_state.courses.index, + key: current_school.course_vocabulary + %} + {% endcapture %} + {% assign message = message | replace: "Courses", "tutorials" %} + {% include "courses_zero_state", message: message, filters_applied: false %} +{% endif %} diff --git a/NP_Custom_Templates/customer_templates/Stripe/_courses_partnercerts_index.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_courses_partnercerts_index.html.liquid new file mode 100644 index 00000000..2742a67b --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_courses_partnercerts_index.html.liquid @@ -0,0 +1,20 @@ +{% if courses.enrolled and courses.enrolled.any? %} +
+ {% for course in courses.enrolled %} + {% for category in course.categories %} + {% if category.name == 'Partner Certification' %} + {% include "cards_course", course: course, card_classes: card_classes %} + {% endif %} + {% endfor %} + + {% endfor %} +
+{% else %} + {% capture message %} + {% t shared.zero_state.courses.index, + key: current_school.course_vocabulary + %} + {% endcapture %} + {% assign message = message | replace: "Courses", "tutorials" %} + {% include "courses_zero_state", message: message, filters_applied: false %} +{% endif %} diff --git a/NP_Custom_Templates/customer_templates/Stripe/_courses_partnertraining_index.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_courses_partnertraining_index.html.liquid new file mode 100644 index 00000000..e61b614b --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_courses_partnertraining_index.html.liquid @@ -0,0 +1,133 @@ +{% comment %} Initialize Variables {% endcomment %} +{% assign show_learning_paths_section = false %} +{% assign show_events_section = false %} +{% assign learning_path_section_classes = "" %} +{% assign event_section_classes = "" %} +{% assign learning_path_card_classes = "col-md-6" %} +{% assign event_card_classes = "col-x-sm-6 col-sm-6 col-md-4 col-lg-3" %} + +{% comment %} Determine if learning paths are enabled and the user is enrolled in at least one learning path {% endcomment %} +{% if features.learning_paths? and learning_paths.enrolled and learning_paths.enrolled.any? %} + {% assign show_learning_paths_section = true %} +{% endif %} + +{% comment %} Determine if events are enabled and the user is registsered for at least one event {% endcomment %} +{% if features.training_events? and training_events.enrolled and training_events.enrolled.any? %} + {% assign show_events_section = true %} +{% endif %} + +{% comment %} Determine whether special classes need to be added to non course sections and the cards within {% endcomment %} +{% if show_learning_paths_section %} + {% assign learning_path_section_classes = "col-md-8 col-lg-6" %} + {% assign learning_path_card_classes = "" %} +{% endif %} + +{%if show_events_section%} + {% assign event_section_classes = "col-md-4 col-lg-6" %} + {% assign event_card_classes = "col-x-sm-6 col-sm-6 col-md-12 col-lg-6" %} +{%endif%} + +
+ +
+ + {% comment %} Show the first featured course as a banner {% endcomment %} + {% if courses.featured and courses.featured.any? %} +
+ {% include "banner_course", course: courses.featured.first, button_text: "Get Started" %} +
+ {% endif %} + + {% comment %} Show this section if either the event section or learning path section has content {% endcomment %} + {% if show_learning_paths_section or show_events_section %} + +
+ + {% if show_learning_paths_section %} +
+

+ Learning Paths +

+ {% include "learning_paths_index", items: learning_paths.enrolled, card_classes: learning_path_card_classes %} +
+ {% endif %} + + {% if show_events_section %} +
+

+ Upcoming Events +

+ {% include "training_events_dashboard", card_classes: event_card_classes %} +
+ {% endif %} + +
+ + {% endif %} + +
+

+ My Courses +

+ {% if courses.enrolled and courses.enrolled.any? %} + + + {% comment %} Sort enrolled courses by progress {% endcomment %} + {% assign enrolled_courses_sorted = courses.enrolled | sort_natural: "short_description" | reverse | sort_natural: "progress" | reverse %} + + {% comment %} Divide courses by progress/completion state {% endcomment %} + {% assign courses_completed = enrolled_courses_sorted | where: "completed?", true %} + {% assign courses_in_progress = enrolled_courses_sorted | where: "completed?", false | where: "started?", true %} + {% assign courses_enrolled = enrolled_courses_sorted | where: "started?", false %} + + {% comment %} In Progress & Enrolled courses {% endcomment %} + {% if courses_in_progress.size > 0 or courses_enrolled.size > 0 %} +

+ Courses In Progress +

+
+ + {% comment %} In Progress courses {% endcomment %} + {% if courses_in_progress.size > 0 %} + {% for course in courses_in_progress %} + {% include "cards_course", course: course, card_classes: "col-x-sm-6 col-sm-6 col-md-4 col-lg-3" %} + {% endfor %} + {% endif %} + + {% comment %} Enrolled courses {% endcomment %} + {% if courses_enrolled.size > 0 %} + {% for course in courses_enrolled %} + {% include "cards_course", course: course, card_classes: "col-x-sm-6 col-sm-6 col-md-4 col-lg-3" %} + {% endfor %} + {% endif %} + +
+ {% endif %} + + {% comment %} Completed courses {% endcomment %} + {% if courses_completed.size > 0 %} +

+ Completed Courses +

+
+ {% for course in courses_completed %} + {% include "cards_course", course: course, card_classes: "col-x-sm-6 col-sm-6 col-md-4 col-lg-3" %} + {% endfor %} +
+ {% endif %} + + {% else %} + {% capture message %} + {% t shared.zero_state.courses.index, + key: current_school.course_vocabulary + %} + {% endcapture %} + {% assign message = message | replace: "Courses", "tutorials" %} + {% include "courses_zero_state", message: message, filters_applied: false %} + {% endif %} +
+
+ +
+{% include "footer" %} +}} \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/_courses_sec3_index.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_courses_sec3_index.html.liquid new file mode 100644 index 00000000..0029d8ca --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_courses_sec3_index.html.liquid @@ -0,0 +1,20 @@ +{% if courses.enrolled and courses.enrolled.any? %} +
+ {% for course in courses.enrolled %} + {% for category in course.categories %} + {% if category.name == 'Section 3' %} + {% include "cards_course", course: course, card_classes: card_classes %} + {% endif %} + {% endfor %} + + {% endfor %} +
+{% else %} + {% capture message %} + {% t shared.zero_state.courses.index, + key: current_school.course_vocabulary + %} + {% endcapture %} + {% assign message = message | replace: "Courses", "tutorials" %} + {% include "courses_zero_state", message: message, filters_applied: false %} +{% endif %} diff --git a/NP_Custom_Templates/customer_templates/Stripe/_courses_zero_state.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_courses_zero_state.html.liquid new file mode 100644 index 00000000..327b6de6 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_courses_zero_state.html.liquid @@ -0,0 +1,9 @@ +
+
+

{{ message }}

+ {% if filters_applied %} + + {% endif %} +
+ {{ message }} +
diff --git a/NP_Custom_Templates/customer_templates/Stripe/_footer.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_footer.html.liquid new file mode 100644 index 00000000..b849e1d1 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_footer.html.liquid @@ -0,0 +1,81 @@ +{% comment %} + +{% endcomment %} diff --git a/NP_Custom_Templates/customer_templates/Stripe/_head.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_head.html.liquid new file mode 100644 index 00000000..daef2dde --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_head.html.liquid @@ -0,0 +1,8 @@ +{% styles default %} +{% styles colors %} +{% styles custom %} + +{% comment %} Install Lato {% endcomment %} + + + diff --git a/NP_Custom_Templates/customer_templates/Stripe/_header.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_header.html.liquid new file mode 100644 index 00000000..7285b768 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_header.html.liquid @@ -0,0 +1,204 @@ +
+
+
+ {% if current_person.signed_in? %} + + + {% endif %} +
+ {% if current_school.logo_url %} +

+ + {{ current_school.name }} + +

+ {% else %} + + {{ current_school.name }} + + {% endif %} + +
+
    + + {% comment %} Dashboard {% endcomment %} + {% assign navigation_my_training = navigations.sub_navigation | where: "label", "Dashboard" | first %} + {% include "header_desktop_menu_item", label: "Dashboard", url: navigation_my_training.url, external: false %} + + {% comment %} All Courses {% endcomment %} + {% include "header_desktop_menu_item", label: 'Courses', url: '/app/courses', external: false %} + + {% comment %} Learning Paths {% endcomment %} + {% assign navigation_guides = navigations.sub_navigation | where: "label", "Learning Paths" | first %} + {% include "header_desktop_menu_item", label: "Learning Paths", url: navigation_guides.url, external: false %} + + {% comment %} Events {% endcomment %} + {% assign navigation_events = navigations.sub_navigation | where: "label", "Events" | first %} + {% include "header_desktop_menu_item", label: navigation_events.label, url: navigation_events.url, external: false %} + + {% for website_navigation in navigations.header_navigations_external %} + {% include "header_desktop_menu_item", label: website_navigation.name, url: website_navigation.path, external: true %} + {% endfor %} +
+
+ + {% if current_person.signed_in? %} +
+
+ + +
+
+
+ + +
+ {% else %} +
+ {% endif %} + +
+ +
+
+ {% t .profile_settings %} + + {% endunless %} + + {% t .sign_out %} + +
+
+
+ +{% include "messages" %} diff --git a/NP_Custom_Templates/customer_templates/Stripe/_header_desktop_menu_item.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_header_desktop_menu_item.html.liquid new file mode 100644 index 00000000..5d39f3fb --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_header_desktop_menu_item.html.liquid @@ -0,0 +1,24 @@ +
  • + + {{ label }} + +
    • + \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/_header_mobile_menu_item.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_header_mobile_menu_item.html.liquid new file mode 100644 index 00000000..f5262cfa --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_header_mobile_menu_item.html.liquid @@ -0,0 +1,8 @@ + + {{ label }} + \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/_learning_path_course.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_learning_path_course.html.liquid new file mode 100644 index 00000000..6c7ff4dc --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_learning_path_course.html.liquid @@ -0,0 +1,63 @@ +{% comment %} Determine if the item should be a link or not {% endcomment %} +{% if learning_path.enrolled? and course.unlocked? %} + {% assign element_type = "a" %} +{% else %} + {% assign element_type = "div" %} +{% endif %} + +
    + <{{ element_type }} + class="np-learning-path-outline-item np-card card--horizontal" + {% if element_type == "a" %} + href="{% route learning_path_course, learning_path_id: learning_path.id, id: course.id %}" + {% endif %} + > +
    +
    + {% if course.optional? %} +
    + Optional +
    + {% endif %} +
    +
    +
    +

    + {{ course.name }} +

    + + {% if course.instructors and course.instructors.size > 0 %} +
    + {{ course.instructors }} +
    + {% endif %} +
    +
    + {% if course.completed? %} + Complete + {% elsif course.progress > 0 %} + {{ course.progress }}% Complete + {% endif %} +
    +
    +
    + + {% comment %} Use a different icon based on the state of the learning path and course {% endcomment %} + {% if course.completed? %} +
    + +
    + {% elsif element_type == "div" %} +
    + +
    + {% else %} +
    + +
    + {% endif %} + +
    + + +
    \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/_learning_path_cta_button.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_learning_path_cta_button.html.liquid new file mode 100644 index 00000000..7869c7b7 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_learning_path_cta_button.html.liquid @@ -0,0 +1,22 @@ + + {% if learning_path.enrolled? == false %} + Enroll in Learning Path + {% elsif learning_path.started? == false %} + Start Learning Path + {% elsif learning_path.completed? %} + View Learning Path + {% else %} + Continue Learning Path + {% endif %} + \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/_learning_path_description.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_learning_path_description.html.liquid new file mode 100644 index 00000000..fad37af1 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_learning_path_description.html.liquid @@ -0,0 +1,6 @@ +

    + About This Guide +

    +
    + {{ learning_path.description }} +
    diff --git a/NP_Custom_Templates/customer_templates/Stripe/_learning_path_instructors.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_learning_path_instructors.html.liquid new file mode 100644 index 00000000..3a6303d0 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_learning_path_instructors.html.liquid @@ -0,0 +1,27 @@ +

    + Instructors +

    +
    + {% for instructor in learning_path.instructors %} +
    + {{ instructor.name }} +
    +
    + {{ instructor.name }} +
    + + {% assign instructor_title_size = instructor.title | size %} + {% if instructor.title and instructor.title.size > 0 %} +
    + {{ instructor.title }} +
    + {% endif %} + +
    +
    + {% endfor %} +
    diff --git a/NP_Custom_Templates/customer_templates/Stripe/_learning_path_outline.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_learning_path_outline.html.liquid new file mode 100644 index 00000000..49cebb48 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_learning_path_outline.html.liquid @@ -0,0 +1,9 @@ +
    + {% for item in learning_path.items %} + {% if item.course? %} + {% include "learning_path_course", course: item %} + {% elsif item.training_event? %} + {% include "learning_path_training_session", training_session: item %} + {% endif %} + {% endfor %} +
    diff --git a/NP_Custom_Templates/customer_templates/Stripe/_learning_path_progress_and_cta.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_learning_path_progress_and_cta.html.liquid new file mode 100644 index 00000000..d48c5204 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_learning_path_progress_and_cta.html.liquid @@ -0,0 +1,23 @@ +
    +
    + {% include "learning_path_cta_button" %} +
    +
    +
    + Progress +
    +
    +
    +
    +
    + +
    + {{ learning_path.progress }}% Complete +
    +
    +
    +
    + {% include "learning_path_cta_button" %} +
    \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/_learning_path_training_session.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_learning_path_training_session.html.liquid new file mode 100644 index 00000000..d0270c50 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_learning_path_training_session.html.liquid @@ -0,0 +1,57 @@ +{% if learning_path.enrolled? and training_session.unlocked? %} + +
    + +
    +
    +
    + {{ training_session.month }} +
    +
    + {{ training_session.day }} +
    +
    +
    +
    {{ training_session.name }}
    +
    {{ training_session.instructors }}
    +
    + {{ training_session.time }} {{ training_session.time_zone }} +
    +
    + + {% if training_session.optional? %} +
    + {% t shared.optional %} +
    + {% endif %} +
    +     +
    +{% else %} +
    +
    +
    +
    +
    + {{ training_session.month }} +
    +
    + {{ training_session.day }} +
    +
    +
    +
    {{ training_session.name }}
    +
    {{ training_session.caption }}
    +
    + {% if training_session.optional? %} +
    + {% t shared.optional %} +
    + {% endif %} +
    +
    +
    +{% endif %} diff --git a/NP_Custom_Templates/customer_templates/Stripe/_learning_paths_index.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_learning_paths_index.html.liquid new file mode 100644 index 00000000..ac64a018 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_learning_paths_index.html.liquid @@ -0,0 +1,17 @@ +{% if items and items.any? %} +
    + {% for learning_path in items %} + {% include "cards_learning_path" with learning_path %} + {% endfor %} +
    +{% else %} +
    +
    + {% capture empty_state_text %} + {% t .empty %} + {% endcapture %} + {{ empty_state_text | replace: "Learning Paths", "guides" }} +
    + {% t .empty %} +
    +{% endif %} diff --git a/NP_Custom_Templates/customer_templates/Stripe/_sub_navigation.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_sub_navigation.html.liquid new file mode 100644 index 00000000..07c9ab5c --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_sub_navigation.html.liquid @@ -0,0 +1,11 @@ + \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/_sub_navigation_item.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_sub_navigation_item.html.liquid new file mode 100644 index 00000000..942f2624 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_sub_navigation_item.html.liquid @@ -0,0 +1,15 @@ +
    + + +
    + {{ label }} +
    +     +
    +
    \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/_training_events_dashboard.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_training_events_dashboard.html.liquid new file mode 100644 index 00000000..7ce1aead --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_training_events_dashboard.html.liquid @@ -0,0 +1,5 @@ +
    + {% for training_event in training_events.enrolled %} + {% include "cards_training_event", training_event: training_event, card_classes: card_classes %} + {% endfor %} +
    \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/_training_events_index.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_training_events_index.html.liquid new file mode 100644 index 00000000..91d9502d --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_training_events_index.html.liquid @@ -0,0 +1,11 @@ +
    + {% if training_events.available and training_events.available.any? %} +
    + {% for training_event in training_events.available %} + {% include "cards_training_event", training_event: training_event, card_classes: "col-x-sm-6 col-sm-6 col-md-4" %} + {% endfor %} +
    + {% else %} + {% include "training_events_zero_state" %} + {% endif %} +
    diff --git a/NP_Custom_Templates/customer_templates/Stripe/_training_session_calendars.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_training_session_calendars.html.liquid new file mode 100644 index 00000000..4d510009 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_training_session_calendars.html.liquid @@ -0,0 +1,43 @@ +
    + + + +
    diff --git a/NP_Custom_Templates/customer_templates/Stripe/_training_session_cta.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_training_session_cta.html.liquid new file mode 100644 index 00000000..7c3529da --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_training_session_cta.html.liquid @@ -0,0 +1,31 @@ +
    +
    +
    + {% form_authenticity_token %} + + {% if training_session.internal? and training_session.approved? %} + {% if features.training_events_google_calendar? %} + {% include "training_session_calendars" %} + + {% else %} + + {% endif %} + + + {% endif %} + + {% if training_session.not_registered? %} + + {% endif %} +
    +
    +
    \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/_training_session_date.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_training_session_date.html.liquid new file mode 100644 index 00000000..c19c6053 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_training_session_date.html.liquid @@ -0,0 +1,12 @@ +
    +
    + {{ training_session.day }} +
    +
    +
    + {{ training_session.month }} +
    +
    + {{ training_session.year }} +
    +
    \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/_training_session_desktop_view.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_training_session_desktop_view.html.liquid new file mode 100644 index 00000000..89701b37 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_training_session_desktop_view.html.liquid @@ -0,0 +1,73 @@ +{% include "header", current_page_orgin: "training_events" %} +
    +
    + +
    +
    +
    +
    +
    + {{ training_event.title }} +
    +
    + + {% case training_event.event_type %} + {% when "online" %} + + Online Event + {% when "in_person" %} + + In-Person Event + {% endcase %} + +
    +
    +
    +
    + + {% if training_event.description and training_event.description.size > 0 %} + {% include "training_session_description" %} + {% endif %} + +
    +
    +
    +
    + +
    + +
    +
    +
    +
    + {% include "training_session_details" %} + {% include "training_session_cta" %} +
    +
    +
    + +
    +
    + {% t shared.more_sessions %} +
    + {% if training_event.sessions and training_event.sessions.size > 1 %} + {% include "training_session_more_sessions" %} + {% else %} +
    + {% t .empty %} +
    + {% t .empty %} +
    +
    + {% endif %} +
    +
    + +
    + +
    +
    +{% include "footer" %} \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/_training_session_details.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/_training_session_details.html.liquid new file mode 100644 index 00000000..5d64b632 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/_training_session_details.html.liquid @@ -0,0 +1,60 @@ +
    + {% include "training_session_date", training_session: training_session %} + + {% if training_session.approved? %} +
    +
    + + You're registered! +
    +
    + {% elsif training_session.pending? %} +
    +
    + Pending – waiting approval +
    +
    + {% elsif training_session.denied? %} +
    +
    + Denied – contact your academy admin +
    +
    + {% elsif training_session.too_late? %} +
    +
    + Too late – meeting started +
    +
    + {% elsif training_session.no_seats? %} +
    +
    + No seats available +
    +
    + {% endif %} +
    + +
    +
    + + {{ training_session.time_period | replace: "AM", "am" | replace: "PM", "pm" | replace: "-", "–" }} {{ training_session.time_zone }} +
    +
    + {% if training_session.location %} + + {{ training_session.location }} + {% elsif training_session.session_url %} + + + {{ training_session.session_url }} + + {% endif %} +
    + {% if training_session.instructor and training_session.instructor.size > 0 %} +
    + + {{ training_session.instructor }} +
    + {% endif %} +
    \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/course.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/course.html.liquid new file mode 100644 index 00000000..51f56668 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/course.html.liquid @@ -0,0 +1,47 @@ +{% include "header", current_page_orgin: "catalog" %} +
    + + {% comment %} Get the full size background image by removing the modifier from the URL {% endcomment %} + {% assign course_image_full_size = course.image_url | replace: '/resize=width:820,height:500,fit:crop/', '/' %} + +
    +
    +
    +
    + {% include "course_header" %} +
    +
    +
    + + {% if course.full_description and course.full_description.size > 0 %} + {% include "course_description" %} + {% endif %} + +
    + {% if course.enrolled? and course.started? %} + {% include "course_progress_and_cta" %} + {% else %} + {% include "course_cta_button" %} + {% endif %} +
    + + {% if course.instructors and course.instructors.any? %} +
    + {% include "course_instructors" %} +
    + {% endif %} + + {% include "course_outline" %} + + {% if course.events and course.events.any? %} +
    + {% include "course_events" %} +
    + {% endif %} + + {% include "course_cta_button" %} +
    +
    +
    +
    +{% include "footer" %} \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/courses.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/courses.html.liquid new file mode 100644 index 00000000..b61376a6 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/courses.html.liquid @@ -0,0 +1,17 @@ +{% include "header", current_page_orgin: "courses" %} +{% include "sub_navigation", current_page: "/app/courses" %} +
    +

    + All Courses +

    +
    + {% capture subtitle_text %} + {%comment%}{% t .headline, key: current_school.course_vocabulary %}{%endcomment%} + These are all courses you are enrolled in + {% endcapture %} + {{ subtitle_text | replace: "Courses", "tutorials" }} +
    +
    + {% include "courses_index", card_classes: "col-xs-12 col-sm-6 col-lg-4 np-stretch-content" %} +
    +{% include "footer" %} \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/dashboard.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/dashboard.html.liquid new file mode 100644 index 00000000..ea8e152c --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/dashboard.html.liquid @@ -0,0 +1,103 @@ +{% comment %} Initialize Variables {% endcomment %} +{% assign show_learning_paths_section = false %} +{% assign show_events_section = false %} +{% assign learning_path_section_classes = "" %} +{% assign event_section_classes = "" %} +{% assign learning_path_card_classes = "col-md-6" %} +{% assign event_card_classes = "col-x-sm-6 col-sm-6 col-md-4 col-lg-3" %} + +{% comment %} Determine if learning paths are enabled and the user is enrolled in at least one learning path {% endcomment %} +{% if features.learning_paths? and learning_paths.enrolled and learning_paths.enrolled.any? %} + {% assign show_learning_paths_section = true %} +{% endif %} + +{% comment %} Determine if events are enabled and the user is registered for at least one event {% endcomment %} +{% if features.training_events? and training_events.enrolled and training_events.enrolled.any? %} + {% assign show_events_section = true %} +{% endif %} + +{% comment %} Determine whether special classes need to be added to non course sections and the cards within {% endcomment %} +{% if show_learning_paths_section %} + {% assign learning_path_section_classes = "col-md-8 col-lg-6" %} + {% assign learning_path_card_classes = "" %} +{% endif %} + +{%if show_events_section%} + {% assign event_section_classes = "col-md-4 col-lg-6" %} + {% assign event_card_classes = "col-x-sm-6 col-sm-6 col-md-12 col-lg-6" %} +{%endif%} + +{% include "header", current_page_orgin: "dashboard" %} +
    + +
    +

    My Dashboard

    +
    + +
    + +
    + + {% comment %} Show the first featured course as a banner {% endcomment %} + {% if courses.featured and courses.featured.any? %} +
    + {% include "banner_course", course: courses.featured.first, button_text: "Get Started" %} +
    + {% endif %} + + {% comment %} Show this section if either the event section or learning path section has content {% endcomment %} + {% if show_learning_paths_section or show_events_section %} + +
    + + {% if show_learning_paths_section %} +
    +

    + Learning Paths +

    + {% include "learning_paths_index", items: learning_paths.enrolled, card_classes: learning_path_card_classes %} +
    + {% endif %} + + {% if show_events_section %} +
    +

    + Upcoming Events +

    + {% include "training_events_dashboard", card_classes: event_card_classes %} +
    + {% endif %} + +
    + + {% endif %} + +
    +

    + My Courses +

    + {% if courses.enrolled and courses.enrolled.any? %} +
    + {% for course in courses.enrolled %} + {% for category in course.categories %} + {% if category.name == 'Partner Training' %} + {% include "cards_course", course: course, card_classes: card_classes %} + {% endif %} + {% endfor %} + + {% endfor %} +
    + {% else %} + {% capture message %} + {% t shared.zero_state.courses.index, + key: current_school.course_vocabulary + %} + {% endcapture %} + {% assign message = message | replace: "Courses", "tutorials" %} + {% include "courses_zero_state", message: message, filters_applied: false %} + {% endif %} +
    +
    +
    +
    +{% include "footer" %} \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/homepage.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/homepage.html.liquid new file mode 100644 index 00000000..f7d973db --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/homepage.html.liquid @@ -0,0 +1,97 @@ +{% include "header", current_page_orgin: "false" %} +
    +
    +
    +
    + {{ homepage.headline }} +
    +
    + Hi {{ current_person.name }}, how is the weather in {{ current_person.properties.location }}? + Here is the training you are eligible for in your role as {{ current_person.properties.role }}. +
    +
    +
    + + + +
    + +
    + {% if courses.featured and courses.featured.any? %} +
    + + {% comment %} Show featured section text if either headline or subheadline are defined {% endcomment %} + {% if homepage.featured_courses_headline and homepage.featured_courses_headline.size > 0 %} + {% assign has_featured_headline = true %} + {% else %} + {% assign has_featured_headline = false %} + {% endif %} + {% if homepage.featured_courses_subheadline and homepage.featured_courses_subheadline.size > 0 %} + {% assign has_featured_subheadline = true %} + {% else %} + {% assign has_featured_subheadline = false %} + {% endif %} + {% if has_featured_headline or has_featured_subheadline %} +
    + {% if homepage.featured_courses_headline and homepage.featured_courses_headline.size > 0 %} +
    + {{ homepage.featured_courses_headline }} +
    + {% endif %} + {% if homepage.featured_courses_subheadline and homepage.featured_courses_subheadline.size > 0 %} +
    + {{ homepage.featured_courses_subheadline }} +
    + {% endif %} +
    + {% endif %} + +
    + {% comment %} Add different classes dependant on the number of featured courses. {% endcomment %} + {% assign card_classes = "card--horizontal np-stretch-content" %} + {% case courses.featured.size %} + {% when 3 %} + {% assign card_classes = card_classes | append: " col-lg-4" %} + {% when 2 %} + {% assign card_classes = card_classes | append: " col-md-6" %} + {% endcase %} + + {% for course in courses.featured %} + {% include "cards_course", course: course, card_classes: card_classes %} + {% endfor %} +
    +
    + {% endif %} + + + + + + +
    +{% include "footer" %} \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/learning_path.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/learning_path.html.liquid new file mode 100644 index 00000000..a6f31f1d --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/learning_path.html.liquid @@ -0,0 +1,58 @@ +{% include "header", current_page_orgin: "learning_paths" %} +
    + + {% comment %} Get the full size background image by removing the modifier from the URL {% endcomment %} + {% assign learning_path_image_full_size = learning_path.image_url | replace: '/resize=width:820,height:500,fit:crop/', '/' %} + +
    + +
    + +
    +
    +
    +
    +
    + {{ learning_path.name }} +
    +
    + {% include "learning_path_cta_button" %} +
    +
    +
    +
    + {% if learning_path.description and learning_path.description.size > 0 %} + {% include "learning_path_description" %} + {% endif %} + +
    + {% include "learning_path_cta_button" %} +
    + + {% if learning_path.instructors and learning_path.instructors.any? %} +
    + {% include "learning_path_instructors" %} +
    + + {% endif %} + +
    +
    +
    +
    + + +
    +
    + {% if learning_path.enrolled? and learning_path.started? %} + {% include "learning_path_progress_and_cta" %} + {% else %} + {% include "learning_path_cta_button" %} + {% endif %} +
    + {% include "learning_path_outline" %} +
    + +
    +
    +{% include "footer" %} diff --git a/NP_Custom_Templates/customer_templates/Stripe/learning_paths.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/learning_paths.html.liquid new file mode 100644 index 00000000..81d6e550 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/learning_paths.html.liquid @@ -0,0 +1,23 @@ +{% include "header", current_page_orgin: "learning_paths" %} +
    +
    + +

    + Browse Learning Paths +

    + + {% comment %} Capture subtitle text so it can be modified {% endcomment %} + {% capture subtitle_text %} + {% t .subtitle %} + {% endcapture %} + + {% if subtitle_text and subtitle_text.size > 0 %} +
    + {{ subtitle_text | replace: "courses", "tutorials" }} +
    + {% endif %} + +
    + {% include "learning_paths_index", items: learning_paths.available, card_classes: "col-md-6" %} +
    +{% include "footer" %} \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/partner-certs.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/partner-certs.html.liquid new file mode 100644 index 00000000..e0b863f7 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/partner-certs.html.liquid @@ -0,0 +1,17 @@ +{% include "header", current_page_orgin: "courses" %} +{% include "sub_navigation", current_page: "/app/partner-certs" %} +
    +

    + Partner Certification Courses +

    +
    + {% capture subtitle_text %} + {%comment%}{% t .headline, key: current_school.course_vocabulary %}{%endcomment%} + Hey there, {{ current_person.name }}! Are you ready to move onto your Partner Challenge Missions? Let's go! + {% endcapture %} + {{ subtitle_text | replace: "Courses", "tutorials" }} +
    +
    + {% include "courses_partnercerts_index", card_classes: "col-xs-12 col-sm-6 col-lg-4 np-stretch-content" %} +
    +{% include "footer" %} \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/partner-training.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/partner-training.html.liquid new file mode 100644 index 00000000..c25dbd79 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/partner-training.html.liquid @@ -0,0 +1,17 @@ +{% include "header", current_page_orgin: "courses" %} +{% include "sub_navigation", current_page: "/app/partner-training" %} +
    +

    + Partner Training Courses +

    +
    + {% capture subtitle_text %} + {%comment%}{% t .headline, key: current_school.course_vocabulary %}{%endcomment%} + Hey there {{ current_person.name }}! Welcome to your partner training center! Complete at least one of the courses to complete your certification. + {% endcapture %} + {{ subtitle_text | replace: "Courses", "tutorials" }} +
    +
    + {% include "courses_partnertraining_index", card_classes: "col-xs-12 col-sm-6 col-lg-4 np-stretch-content" %} +
    +{% include "footer" %} \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/sec3-courses.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/sec3-courses.html.liquid new file mode 100644 index 00000000..1175d616 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/sec3-courses.html.liquid @@ -0,0 +1,17 @@ +{% include "header", current_page_orgin: "courses" %} +{% include "sub_navigation", current_page: "/app/sec3-courses" %} +
    +

    + Section 3 Courses +

    +
    + {% capture subtitle_text %} + {%comment%}{% t .headline, key: current_school.course_vocabulary %}{%endcomment%} + These are all courses filed under Section 1 + {% endcapture %} + {{ subtitle_text | replace: "Courses", "tutorials" }} +
    +
    + {% include "courses_sec3_index", card_classes: "col-xs-12 col-sm-6 col-lg-4 np-stretch-content" %} +
    +{% include "footer" %} \ No newline at end of file diff --git a/NP_Custom_Templates/customer_templates/Stripe/styles.css.liquid b/NP_Custom_Templates/customer_templates/Stripe/styles.css.liquid new file mode 100644 index 00000000..21e93fa4 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/styles.css.liquid @@ -0,0 +1,2382 @@ + /* + 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 }} +*/ + +/* ------------ Northpass Style Overrides ------------ */ + +/* ------ Learner/Admin Mode Button ------ */ +@media screen and ( max-width: 35.5rem ) { + body .Container-sc-1cu1r9y-3 { + position: unset; + } +} + +/* ------ Text ------ */ +body { + font-family: "Lato", Roboto, Helvetica Neue, Helvetica, Arial, sans-serif; + line-height: 1.5; + display: flex; + flex-direction: column; + min-height: 100vh; + color: #5a616b; +} + +main { + flex-grow: 1; +} + +h1, +h2, +h3, +h4, +h5, +h6, +p { + margin: 0; +} + +p + p { + margin-top: 0.5rem; +} + +a { + color: #2574e1; +} +a:hover, +a:focus { + color: #ba37d6; +} +a:active { + color: #9630ab; +} +.np-text-light { + color: #6e7580; +} +.np-text-muted { + +} +.np-text-title { + color: #5a616b; +} +.np-resource-title { + font-size: 1.5rem; + font-weight: 700; + margin-bottom: 0; + text-align: left; +} +.np-resource-subtitle, +.np-training-events .np-resource-subtitle { + text-align: left; + padding: 0; + margin-top: 0.5rem; + margin-bottom: 0; +} + +@media screen and ( min-width: 48rem ) { + .np-resource-title { + font-size: 2rem; + } +} + +/* ------ Common Layout ------ */ + +/* --- Page Content --- */ +.page__primary-content { + margin-top: 2rem; +} +@media screen and ( min-width: 48rem ) { + .page__primary-content { + margin-top: 2.5rem; + } +} + +/* --- Box Container (for signup/password reset etc) --- */ +.np-box-container { + height: auto; + padding: 1rem; + display: flex; + flex-direction: column; + align-items: center; +} + +.np-box { + border-radius: 1rem; + box-shadow: rgba(141, 148, 158, 0.3) 0px 4px 12px; + margin: 0; + width: 100%; + max-width: 550px +} +.np-box-header { + border-top-right-radius: 1rem; + border-top-left-radius: 1rem; + height: auto; + padding: 1.5rem 2rem 1rem; +} +.np-box-header-logo { + height: 50px; +} + +.np-box-content-container { + padding: 2rem 2rem 3rem; +} +.np-box-content-container, +.np-alert + .np-box-content-container { + margin: 0; +} + +@media screen and ( min-width: 48rem ) { + .np-box-container::before, + .np-box-container::after { + content: ""; + display: block; + } + .np-box-container::before { + flex-grow: 1; + } + .np-box-container::after { + flex-grow: 2; + } + .np-box-container { + padding: 2rem; + } + .np-box-header { + padding: 2.5rem 2rem 2rem; + } + .np-box-header-logo { + height: 70px; + } + .np-box-content-container { + padding: 3rem 4rem 4rem; + } + .np-alert + .np-box-content-container { + padding-top: 2rem; + } +} + +/* --- Section Horizontal Padding --- */ +.np-header, +.np-sub-navigation, +.np-page-container, +.np-subpage-container, +.np-homepage-hero-content, +.homepage-navigation__section, +.page-section { + width: 100%; + padding-left: 1.5rem; + padding-right: 1.5rem; +} + +@media screen and ( min-width: 48rem ) { + .np-header, + .np-sub-navigation, + .np-page-container, + .np-subpage-container, + .np-homepage-hero-content, + .homepage-navigation__section, + .page-section { + padding-left: 5rem; + padding-right: 5rem; + } +} + +/* --- Page Header Area --- */ +.page__header-wrapper, +.np-catalog-header-wrapper { + margin-bottom: 2rem; +} + +@media screen and ( min-width: 48rem ) { + .page__header-wrapper, + .np-catalog-header-wrapper { + margin-bottom: 2.5rem; + } +} + +/* --- Blocks Layout --- */ +.blocks-layout { + display: flex; + flex-direction: column; +} +.blocks-layout, +.blocks-layout > .blocks-layout { + width: calc( 100% + 1.5rem); + margin: -0.75rem; +} +.blocks-layout { + flex-wrap: wrap; +} +.blocks-layout > *, +.blocks-layout > .np-card { + padding: 0.75rem; + width: 100%; +} +@media screen and ( min-width: 35.5rem ) { + .blocks-layout, + .blocks-layout > .blocks-layout { + flex-direction: row; + } +} +@media screen and ( min-width: 48rem ) { + .blocks-layout { + flex-direction: row; + } + .blocks-layout, + .blocks-layout > .blocks-layout { + + width: calc( 100% + 2rem ); + margin: -1rem; + } + .blocks-layout > *, + .blocks-layout > .np-card { + padding: 1rem; + } +} + +/* --- Columns --- */ +/* Adding some column options for between the width of small and xs, in order to avoid overriding the other column sizing these only apply to the narrow range */ + +@media only screen and ( min-width: 35.5rem ) and ( max-width: calc(48rem - 1px) ) { + .col-x-sm-6 { + flex-basis: 50%; + max-width: 50% + } +} + +/* ------ Main Navigation ------ */ +.np-header { + height: auto; +} +/* --- Logo --- */ +.np-header-logo { + padding: 0.75rem 0; +} +@media screen and ( min-width: 48rem ) { + .np-header-logo { + padding: 1.25rem 0; + } +} +/* --- Navigation --- */ +.np-header-desktop-nav-list { + justify-content: end; + margin: 1rem; + padding-left: 0; +} +.np-header-desktop-nav-link { + padding: 0.1rem 0.75rem 0.15rem; + border: transparent 2px solid; + border-radius: 3rem; +} +.np-header-desktop-nav-item { + padding: 0; + margin: 2px; +} +.np-header-desktop-nav-link:focus, +.np-header-desktop-nav-link:active { + color: #ffffff; +} +.np-header-desktop-nav-link:focus { + border-color: #304780; + outline: none; +} +.np-header-desktop-nav-link.is-active { + background-color: #304780; +} +.np-header-desktop-nav-link.is-active:focus { + border-color: #275cb8; +} +/* --- Search --- */ +.np-header-search-input { + opacity: unset; + border-radius: 3rem; + background-color: #304780; +} +.np-header-search-icon { + right: unset; + left: 0.75rem; +} +.np-header-search-input:hover + .np-header-search-icon { + color: #bfe4ff; +} +.np-header-search-input:focus { + border-color: #275cb8; + outline: none; + border-radius: 3rem; + padding: 0 1.25rem 0 2.5rem; +} +.np-header-search-input:focus + .np-header-search-icon { + color: #304780; +} + +/* ------ Mobile Menu ------ */ +.np-header-mobile-menu-content-button.np-danger { + border-color: #ff5773; + color: #E52242; +} + +/* ------ Page/Subpage Container ------ */ +body, +.np-page-container, +.np-subpage-container { + background-color: #f5f7fa; + width: 100%; +} + +.np-page-container, +.np-subpage-container { + padding-top: 2rem; + padding-bottom: 2rem; +} + +.np-page-container { + position: relative; +} + +@media screen and ( min-width: 48rem ) { + .np-page-container { + padding-top: 5rem; + padding-bottom: 5rem; + margin-top: 0; + + } + .np-subpage-container { + padding-top: 3rem; + padding-bottom: 3rem; + } +} + +/* --- Background Image --- */ +.page-background-image { + position: absolute; + top: 0; + left: 0; + right: 0; + width: 100%; + height: calc( 500 / 820 * 100vw ); + background-repeat: no-repeat; + background-size: 100%; +} +.page-background-image:after { + content: " "; + width: 100%; + height: 100%; + display: block; +} +/* ------ Footer ------ */ +/* --- Logo --- */ +.np-footer-logo-image { + filter: none; + height: 30px; + opacity: initial; +} + +/* ------ Northpass Powered By Signet ------ */ +div.np-powered-by { + display: none; +} + +/* ------ Sub Navigation ------ */ +/* --- Container --- */ +.np-sub-navigation { + padding-top: 1.25rem; + margin-bottom: 0; +} +.np-sub-navigation-content { + margin-left: -0.75rem; + margin-right: -0.75rem; +} + +/* --- Item --- */ +.np-sub-navigation-content-item { + display: flex; + flex-direction: column; + height: auto; + margin: 0 0.75rem; +} +.np-sub-navigation-content-item-link { + height: auto; + flex-grow: 1; + line-height: 1.15; +} +.np-sub-navigation-content-item-inactive .np-sub-navigation-content-item-link { + margin-bottom: 1rem; +} +.np-sub-navigation-content-item-icon, +.oa-sub-navigation-content-item-label { + flex-grow: 1; +} +/* Inactive Item */ +.np-sub-navigation-content-item-inactive .np-sub-navigation-content-item-icon { + color: #c5cbd1; +} + +/* --- Seperator --- */ +.oa-sub-navigation-seperator { + flex-grow: 1; +} + +/* ------------ Animations ------------ */ +/* --- Transitions --- */ +a, +button, +.np-button, +.np-course-outline-content-activity-link-completed::after, +.outline-card__icon-link, +.filter-list__item { + transition: all 0.3s ease; +} +/* --- Animation Defaults --- */ +.is-animation { + animation-timing-function: cubic-bezier( 0.36, 0.45, 0.63, 0.53); + animation-duration: 20s; + animation-iteration-count: infinite; +} +/* --- Slide --- */ +@keyframes slide-2 { + 0% { + transform: translateX( 0% ); + } + 100% { + transform: translateX( -200% ); + } +} +@keyframes slide-3 { + 0% { + transform: translateX( 0% ); + } + 100% { + transform: translateX( -300% ); + } +} +@keyframes slide-4 { + 0% { + transform: translateX( 0% ); + } + 100% { + transform: translateX( -400% ); + } +} +@keyframes slide-5 { + 0% { + transform: translateX( 0% ); + } + 100% { + transform: translateX( -500% ); + } +} +/* --- Rotate --- */ +@keyframes rotate { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(360deg); + } +} +/* --- Pinwheel --- */ +@keyframes pinwheel { + 0% { + transform: rotate(45deg) translateX(0px); + } + 100% { + transform: rotate(-25deg) translateX(20px); + } +} +/* --- Text Gradient --- */ +@keyframes homepage-gradient { + 0% { + background-position-x: 0; + } + 100% { + background-position-x: 100%; + } +} + +/* ------------ Components ------------ */ + +/* ------ Card ------ */ +.np-card-container { + box-shadow: rgba(141, 148, 158, 0.3) 0px 4px 12px; + border-radius: 1rem; + justify-content: start; + align-items: stretch; + width: 100%; + height: 100%; + display: flex; + flex-direction: row; +} +.np-card { + min-height: unset; + min-width: unset; + margin-bottom: 0; + width: 100%; + display: flex; + flex-direction: column; +} +.np-card .np-card-text-wrapper { + flex-grow: 1; + width: auto; +} + +@media screen and ( min-width: 48rem ) { + .np-card-padding-dynamic { + padding: 3rem; + } +} +/* Vertical Cards */ +@media screen and ( min-width: 35.5rem ) { + .np-card:not(.card--horizontal) .np-card-container { + flex-direction: column; + } + .np-card:not(.card--horizontal) .np-card-text-wrapper { + width: 100%; + } +} +/* --- Ribbon --- */ +.np-card-ribbon { + position: relative; + right: unset; + top: unset; + margin-left: 0.75rem; + background-color: #795ae8; + padding: 0.25rem 1rem; + border-radius: 1.5rem; + line-height: 1.1; + text-transform: none; + font-size: 0.75rem; + text-align: center; + align-self: start; +} + +.np-card-ribbon i { + margin-right: 3px; +} +.card__image .np-card-ribbon { + position: absolute; + right: 0.75rem; + top: 0.75rem; +} + +/* --- Image --- */ +.card__image { + position: relative; + background-size: cover; + background-position: center; + width: 50%; + border-color: #e0f3ff; + border-style: solid; + border-radius: 1rem 0 0 1rem; + border-width: 0 1px 0 0; + flex-shrink: 1; +} +/* Vertical Card */ +@media screen and ( min-width: 35.5rem ) { + .card__image { + width: calc(100% / 3); + flex-shrink: 0; + } + .np-card:not(.card--horizontal) .card__image { + width: 100%; + padding-top: calc(500 / 820 * 100% /2); + padding-bottom: calc(500 / 820 * 100% /2); + border-radius: 1rem 1rem 0 0; + border-width: 0 0 1px 0; + } +} + +/* --- Card Counter --- */ +.np-learning-path-outline { + counter-reset: tutorial; +} +.card__step-counter { + font-size: 0.875rem; + font-weight: 900; + color: #6e7580; + margin-bottom: 0; + counter-increment: tutorial; +} +.card__step-counter::after { + content: "Tutorial " counter(tutorial); +} + +/* --- Heading --- */ +.np-card-heading { + font-weight: 900; + font-size: 1.25rem; + line-height: 1.3; + color: #24272e; + margin-top: 0; + margin-bottom: 1rem; +} +@media screen and ( min-width: 48rem ) { + .np-card-heading { + margin-bottom: 1.25rem; + } +} +/* --- Text --- */ +.np-card-text { + margin-bottom: 1.5rem; + font-size: 1rem; + line-height: 1.5; +} +.np-card-text:last-child { + margin-bottom: 0; +} +@media screen and ( min-width: 48rem ) { + .np-card-text { + font-size: 1.125rem; + margin-bottom: 2rem; + } +} +/* --- Content Area --- */ +.np-card-content, +.np-learning-paths .np-card-content { + padding: 1.25rem; + height: 100%; +} +.np-card-content > * { + margin: 0; +} +.np-card-content > *:not(:last-child) { + margin-bottom: 0.5rem; +} +.np-card-content-title { + line-height: 1.3; +} +.np-card-content .np-card-content-title { + margin-top: 0; +} +.np-card-content-subtitle { + font-size: 0.875rem; + font-weight: 700; + color: #795ae8; +} +/* Description */ +.np-card-content-description { + flex-grow: 1; + display: block; +} +.np-card-content-description p { + margin: 0; +} +@media screen and ( min-width: 48rem ) { + .np-card-content-description { + font-size: 1rem; + } +} +/* Footer */ +.np-card-content-footer { + padding-top: 0.5rem; + align-items: baseline; +} +.np-card-content-footer > *:first-child { + margin-left: 0; +} + +.np-card-content-progress { + margin-top: 0; + margin-left: 0.5rem; + font-size: 1rem; + text-transform: none; + color: #795ae8; +} + +/* Content Divider */ +.np-card-content-divider { + margin-top: 1.5rem; + margin-bottom: 1.5rem; + border-color: #94dbff; +} +.np-card-content-divider:last-child { + margin-bottom: 0; +} +@media screen and ( min-width: 48rem ) { + .np-card-content-divider { + margin-top: 2rem; + margin-bottom: 2rem; + padding-top: 2rem; + } +} +@media screen and ( min-width: 48rem ) { + .np-card-content-description { + font-size: 1rem; + } +} +/* --- Card Stack --- */ +.np-card-stack-level-1, +.np-card-stack-level-2 { + box-shadow: rgba(141, 148, 158, 0.3) 0px 4px 12px; + border-radius: 1rem; + height: 2rem; + margin-top: -1.4rem; +} + +/* --- Course / Learning Path / Event Details Card --- */ +/* Header Area */ +.details-card__header { + padding-bottom: 1rem; + margin-bottom: 0; +} +.np-top-title { + font-weight: 700; + font-size: 1.5rem; + line-height: 1.3; + color: #24272e; + margin-bottom: 0.75rem; +} +@media screen and ( min-width: 48rem ) { + .details-card__header { + padding-bottom: 1.5rem; + } + .np-resource-header { + flex-direction: row; + align-items: center; + padding-top: 2rem; + } + .np-top-title { + font-size: 2rem; + margin-bottom: 0; + } +} +/* Content Area */ +.details-card__card-container { + justify-content: top; + flex-direction: column; +} +.details-card__card-content { + padding-top: 1.5rem; + padding-bottom: 2rem; +} +@media screen and ( min-width: 48rem ) { + .details-card__card-content { + padding-top: 2rem; + padding-bottom: 3rem; + } +} +/* Heading Styles for User Generated Content */ +.details-card__card-content h4 { + margin-top: 1.5rem; + margin-bottom: 1rem; + color: #24272e; + font-weight: 700; +} +@media screen and ( min-width: 48rem ) { + .details-card__card-content h4 { + margin-top: 2rem; + } +} + +/* --- Training Session Card --- */ + +/* Date Bar */ +.np-card-training-session-date { + position: relative; +} +.np-card-training-session-date:not(:first-child) { + margin-top: 0.5rem; +} +.np-card-training-session-date-bar { + background-color: #795ae8; + left: -1.25rem; + height: 100%; + width: 0.5rem; + border-top-right-radius: 0.25rem; + border-bottom-right-radius: 0.25rem; + +} +.np-card-training-session-date-day { + color: #24272e; + font-weight: 900; +} +.card__month-year-container { + flex-grow: 1; +} +.np-card-training-session-date-month, +.np-card-training-session-date-year { + line-height: 1.1; +} +.np-card-training-session-date-month { + color: #795ae8; + text-transform: none; +} +.np-card-training-session-date-year { + color: #6e7580; +} +.session-date__other-info-container, +.session-date__other-info-container.np-training-session-cta-note { + height: 100%; + display: flex; + align-items: center; + justify-content: center; + margin-left: 1rem; + margin-right: -1.25rem; + min-height: 60px; + border-top-left-radius: 0.25rem; + border-bottom-left-radius: 0.25rem; +} +.session-date__other-info-container { + padding: 0.25rem 0.5rem 0.25rem 0.5rem; + background-color: #795ae8; + color: white; +} +.np-training-session-cta-note { + padding: 0.5rem 1.25rem 0.5rem 0.75rem; + margin-bottom: 0; + position: unset; +} +.session-date__other-info-wrapper { + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: flex-end; + align-content: center; +} +.session-date__other-info-wrapper > * { + margin: 0 auto; + padding: 0.25rem; +} +.session-date__other-info-container::before, +.session-date__other-info-container::after { + display: block; + content: ""; +} +.session-date__other-info-container::before { + flex-basis: .5rem; + flex-shrink: 1; + padding: 0; +} +.session-date__other-info-container::after { + flex-basis: .75rem; + flex-shrink: 3; + padding: 0; +} +.np-card-training-sessions-icon { + color: #ffffff; + text-align: center; +} +.np-training-session-cta-note, +.np-card-training-sessions-label { + line-height: 1.1; + font-weight: 700; + text-align: center; +} +.np-card-training-sessions-label { + font-size: 0.875rem; + overflow: unset; +} +.np-card-training-sessions-label, +.session-date__other-info-wrapper > span { + white-space: unset; +} + +/* ------ Divider ------ */ + +/* --- Padding--- */ +.np-divider { + margin: 0 1.25rem; + border-color: #94dbff; +} +@media screen and ( min-width: 48rem ) { + .np-divider { + margin: 0 3rem; + } +} + +/* ------ Course Banner ------ */ +.banner-course { + box-shadow: rgba(141, 148, 158, 0.3) 0px 4px 12px; + background-color: #ffffff; + border-radius: 1rem; + display: flex; + flex-direction: row; + align-items: stretch; + width: 100%; + overflow: hidden; +} +/* Course Content */ +.banner-course__content { + padding: 1rem 0.75rem; + flex-grow: 1; + display: flex; + flex-direction: column; + align-items: start; +} +.banner-course__content > * { + margin: 0.25rem 0.5rem; +} +.banner-course__title { + color: #1b3e4f; + font-size: 1rem; + font-weight: 700; + line-height: 1.3; +} +.banner-course__description { + flex-grow: 1; +} +@media screen and ( min-width: 48rem ) { + .banner-course__title { + font-size: 1.25rem; + } +} +@media screen and ( min-width: 64rem ) { + .banner-course { + border-radius: 2.5rem; + } + .banner-course__content { + flex-direction: row; + align-items: center; + } + .banner-course__description { + font-size: 1.25rem; + } +} +/* Course Image */ +.banner-course__image { + position: relative; + background-size: cover; + background-position: center; + width: 25%; + max-width: 14rem; + border-color: #e0f3ff; + border-style: solid; + border-radius: 1rem 0 0 1rem; + border-width: 0 1px 0 0; + flex-shrink: 0; +} + +/* ------ Call to Action ------ */ +.cta__container { + margin: 1.5rem 0; +} +.cta__container:first-child { + margin-top: 0; +} +.cta__container:last-child { + margin-bottom: 0; +} +.np-top-cta { + border-radius: 3rem; + background-color: #e0f3ff; + padding: 0.5rem 1.5rem; + margin-bottom: 1.5rem; + position: relative; +} + +.np-top-cta .np-progress-bar-container { + background-color: #ffffff; +} + +@media screen and ( min-width: 48rem ) { + .cta__container { + margin: 2rem 0; + } + .np-top-cta { + padding: 1rem; + margin-bottom: 0; + } + .np-top-cta .np-top-cta-progress-content { + margin-left: 1.25rem; + } +} + +/* ------ Progress Bar ------ */ +.np-progress-bar-container { + background-color: #dce1e5; + +} + +.np-top-cta-progress-content { + display: flex; + align-items: center; + min-height: 1.5rem; +} +@media screen and ( min-width: 48rem ) { + .np-top-cta-progress-content { + min-height: 1.5rem; + margin-right: 0.5rem; + } +} +/* Progress Bar Text and Bar */ +.np-top-cta-progress-content > * { + margin: 0; +} +.np-top-cta-progress-content > * + * { + margin-left: 1rem; +} +/* Progress Bar Text */ +.np-top-cta-progress-text, +.np-top-cta-progress-title { + font-size: 0.875rem; + text-transform: none; + line-height: 1.1; +} +.np-top-cta-progress-text { + flex-shrink: 0; + font-weight: 700; + line-height: 1.1; +} + +/* Card Progress bar */ +.np-card .np-progress-bar-container { + margin-left: 0.5rem; + margin-top: 0; +} +.np-card-progress-bar { + background-color: {{ color_palette.learning_progress_bar_color }}; +} + +/* ------ Buttons ------ */ +.np-button { + height: unset; + min-height: unset; + padding: 0.5rem 1.25rem; + border-radius: 1.5rem; + font-size: 1rem; + line-height: 1.5; +} +.np-button:hover, +.np-button:focus, +.np-button:active { + color: #fff; +} + +.np-button:focus { + background-color: {{ color_palette.button_hover_color }}; + outline: 2px solid #e79ff7; +} +.np-button:active { + background-color: #50185b; +} + +/* --- Wide Buttons --- */ +.np-button-wide { + padding-left: 1.75rem; + padding-right: 1.75rem; +} + +/* --- Secondary Buttons --- */ +.np-button-secondary { + color: #fff; + background-color: #6e7580 !important; +} +.np-button-secondary:hover, +.np-button-secondary:focus { + background-color: {{ color_palette.button_hover_color }} !important; +} +.np-button-secondary:active { + background-color: #50185b !important; +} + +/* ------ Dropdowns ------ */ +.dropdown-calendar-menu { + padding: 0.5rem 0; + border-radius: 1rem; + box-shadow: rgba(141, 148, 158, 0.3) 0px 4px 12px; +} +.dropdown-calendar-menu.is-open { + overflow: hidden; +} +.dropdown-calendar-item-element { + padding: .5rem 1.25rem; + color: #5a616b; +} +.dropdown-calendar-item-element:hover, +.dropdown-calendar-item-element:focus, +.dropdown-calendar-item-element:active { + color: #50185b; +} +.dropdown-calendar-item-element:hover, +.dropdown-calendar-item-element:focus { + background-color: #fae3ff; +} +.dropdown-calendar-item-element:active { + background-color: #fdf3ff; +} +/* ------ Form & Inputs ------ */ +.np-form-field { + margin-bottom: 1rem; +} +.np-input-label { + font-size: 1rem; + margin-bottom: 0.5rem; + color: #5a616b; +} +.np-input { + border-radius: 1.25rem; + height: 2.5rem; + padding: 0.5rem 1.25rem; + line-height: 1.5; + background-color: #f0feff; + border-color: #bfe4ff; + border-width: 2px; +} +.np-input:focus { + border-color: #4cc3ff; +} +.np-form-action { + margin-top: 0.5rem; +} +.np-form-link { + font-size: 0.875rem; + margin-top: 1.25rem; +} + +/* ------ Alerts ------ */ +.np-alert-wrapper { + padding: 1rem 2rem; + width: 100% +} +.np-alert { + min-height: unset; + font-size: 0.875rem; +} +.np-alert-error { + background-color: #ffe1e8; + color: #b11932; +} +.np-alert-success { + background-color: #e8ffe1; + color: #1d6e2c; +} + +@media screen and ( min-width: 48rem ) { + .np-alert-wrapper { + padding: 1rem 4rem; + } +} + +/* ------ Filter List ------ */ +.filter-list__container { + background-color: white; + border-radius: 1rem; + box-shadow: rgba(141, 148, 158, 0.3) 0px 4px 12px; +} +/* --- Header --- */ +.filter-list__header-container { + padding: 0.75rem 1.5rem 0.5rem; +} +.filter-list__header { + font-size: 1.125rem; + font-weight: 300; +} +@media screen and ( min-width: 48rem ) { + .filter-list__header { + font-size: 1.25rem; + } +} +/* --- Sections --- */ +.filter-list__section { + border-top: 1px solid #e0f3ff; +} +/* Header */ +.filter-list__section-header-container { + padding: 0.5rem 1.5rem; + display: flex; + align-items: center; + justify-content: space-between; + cursor: pointer; +} +.filter-list__section-header-container:focus { + outline: 2px solid #e79ff7; + outline-offset: -2px; +} +.filter-list__section-header { + font-size: 1rem; + color: #1b3e4f; +} +@media screen and ( min-width: 48rem ) { + .filter-list__section-header { + font-size: 1.125rem; + } +} +/* Icons */ +.filter-list__section-header-icon { + font-size: 1.5rem; + color: {{ color_palette.button_color }}; +} +.filter-list__section-header-container:hover .filter-list__section-header-icon, +.filter-list__section-header-container:hover .filter-list__section-header-icon { + color: #ba37d6; +} +/* Body */ +.filter-list__section-body { + padding: 0.75rem 0.75rem 0.75rem 1.5rem; + border-top: 1px solid #e0f3ff; +} +/* --- Interactivity --- */ +/* Icons */ +.filter-list__section.is-open .filter-list__open-icon, +.filter-list__section.is-collapsed .filter-list__collapse-icon { + display: none; +} +/* Body */ +.filter-list__section-body-container { + transition: max-height 0.3s ease, visibility 0.3s ease; + max-height: 45rem; + overflow: hidden; +} +.filter-list__section.is-collapsed .filter-list__section-body-container { + max-height: 0; + visibility: hidden; /* Prevents tabbing through hidden items */ +} +/* --- Subsections --- */ +.filter-list__subsection-header { + margin-bottom: 0.5rem; +} +.filter-list__subsection-header:not(:first-child) { + margin-top: 0.75rem; +} +/* --- List --- */ +.filter-list { + margin: 0; + padding: 0; +} +/* --- Item --- */ +.filter-list__item { + list-style-type: none; + display: flex; + align-items: center; + justify-content: space-between; + line-height: 1.1; + margin-bottom: 3px; + margin-left: -0.75rem; + padding: 0.2rem 0.75rem; + border-radius: 0.75rem; + color: {{ color_palette.button_color }}; +} + +.filter-list__item:hover, +.filter-list__item:focus { + background-color: #fdf3ff; + color: #9630ab; + cursor: pointer; +} +.filter-list__item:focus { + outline: 2px solid #e79ff7; +} +.filter-list__item.is-active { + background-color: {{ color_palette.button_color }}; + color: #ffffff; +} + +.filter-list__item.is-active:hover, +.filter-list__item.is-active:focus { + background-color: #ba37d6; +} +.filter-list__item-remove { + margin-left: 0.4rem; +} +.filter-list__item:not(.is-active) .filter-list__item-remove { + display: none; +} + +/* ------ Clear Filters ------ */ +.clear-filters__container { + display: flex; + flex-wrap: wrap; + margin: -0.25rem -0.25rem 0.75rem; +} +.clear-filters__container > * { + margin: 0.25rem; +} +.clear-filters__button { + display: flex; + align-items: center; + justify-content: space-between; + box-shadow: rgba(141, 148, 158, 0.3) 0px 4px 12px; + line-height: 1.1; + padding: 0.3rem 0.85rem; + border-radius: 0.85rem; + background-color: {{ color_palette.button_color }}; + color: #ffffff; +} +.clear-filters__button-clear-all { + background-color: #ffffff; + color: {{ color_palette.button_color }}; +} +.clear-filters__button:hover, +.clear-filters__button:focus { + background-color: #ba37d6; + color: #ffffff; + cursor: pointer; +} +.clear-filters__button:focus { + outline: 2px solid #e79ff7; +} +.clear-filters__button.is-active { + background-color: {{ color_palette.button_color }}; + color: #ffffff; +} +.clear-filters__icon { + margin-left: 0.4rem; +} + +/* ------ Outdated Popup ------ */ +.np-course-version-outdated-popup { + align-self: center; + margin-left: auto; + margin-right: 0.5rem +} + +/* --- Trigger --- */ +.np-course-version-outdated-popup-trigger { + color: #f8654c; + border-radius: 50%; +} +.np-course-version-outdated-popup-trigger:hover, +.np-course-version-outdated-popup-trigger:focus { + color: #d54224; +} +.np-course-version-outdated-popup-trigger:focus { + outline: 2px solid #ffa593; +} + +.np-course-version-outdated-popup { + margin-left: 0.5rem; + margin-right: auto; +} + +/* --- Popup --- */ +.np-popup-tooltip--visible { + border: 2px solid #ffe5e1; +} +.np-popup-tail { + border-top: 4px solid #ffc9c0; +} +.np-popup-header { + background-color: #ffe5e1; + padding-left: 1.25rem; + padding-right: 1.25rem; +} +.np-popup-header-icon { + color: #f8654c; +} +.np-popup-body { + padding-left: 1.25rem; +} +.np-popup-body-button { + border-radius: 1.5rem; + background-color: {{ color_palette.button_color }}; +} +.np-popup-body-button:hover, +.np-popup-body-button:focus { + background-color: {{ color_palette.button_hover_color }}; + color: #fff; +} +.np-popup-body-button:focus { + outline: 2px solid #e79ff7;; +} + + +/* ------------ Pages ------------ */ + +/* ------ Hompeage ------ */ +.np-homepage { + background-color: #bfe4ff; + margin-bottom: 0; +} + +/* --- Hero --- */ +.np-homepage-hero { + padding-bottom: calc(100vw / 2000 * 150); + background-color: #f5f7fa; +} +.np-homepage-hero-content { + position: unset; + padding-top: 3rem; + padding-bottom: 2.5rem; +} +.np-homepage-headline, +.np-homepage-subheadline { + line-height: 1.1; +} +.np-homepage-hero .np-homepage-headline { + font-size: 1.75rem; + color: #2574e1; + -webkit-background-clip: text; + -moz-background-clip: text; + -webkit-text-fill-color: transparent; + -moz-text-fill-color: transparent; + background-image: linear-gradient(45deg, #2574e1, #795ae8, #ba37d6, #795ae8, #2574e1, #795ae8); + background-size: 500%; + animation-name: homepage-gradient; +} +.np-homepage-hero .np-homepage-subheadline { + font-size: 1.25rem; + color: #1b2759; + opacity: 100%; +} +@media screen and ( min-width: 48rem ) { + .np-homepage-hero-content { + padding-top: 5rem; + padding-bottom: 10rem; + } + .np-homepage-hero .np-homepage-headline { + font-size: 2.5rem; + } + .np-homepage-hero .np-homepage-subheadline { + font-size: 2rem; + } +} +/* --- Featured Section --- */ +.np-homepage-featured { + margin-top: 2rem; + margin-bottom: 2rem; +} +.np-homepage-featured-text { + margin-top: 2rem; +} +.np-homepage-featured .np-homepage-headline { + color: #6b3fd1; + font-size: 1.5rem; +} +.np-homepage-featured .np-homepage-subheadline { + color: #361657; + margin-top: 0.5rem; +} +@media screen and ( min-width: 48rem ) { + .np-homepage-featured { + margin-top: 4rem; + } + .np-homepage-featured-text { + padding-bottom: 1.35rem; + } + .np-homepage-featured .np-homepage-headline { + font-size: 2rem; + } +} +/* --- Homepage Waves --- */ +.homepage-waves__wave-1-container, +.homepage-waves__wave-2-container, +.homepage-waves__wave-3-container { + position: relative; + width: 100%; + display: block; +} +.homepage-waves__wave-1-container { + margin-top: calc((-100vw / 2000 * 150) + 2px); +} +.homepage-waves__wave-3-container { + background-color: #94dbff; + margin-top: calc(-100vw / 2000 * 150 * 0.15); +} +.homepage-waves__wave-1 { + fill: #bfe4ff; + animation-name: slide-2; + animation-duration: 180s; +} +.homepage-waves__wave-2, +.homepage-waves__wave-3 { + animation-name: slide-3; +} +.homepage-waves__wave-2 { + fill: #94dbff; + animation-duration: 120s; + animation-direction: reverse; +} +.homepage-waves__wave-3 { + fill: #4cc3ff; + animation-duration: 60s; +} + +/* --- Navigation --- */ +.homepage-navigation__section { + margin-top: 1rem; + position: relative; +} +.homepage-navigation__wrapper { + flex-direction: column; + justify-content: center; + flex-wrap: unset; +} +.homepage-navigation__item-container { + width: 100%; +} +.homepage-navigation__item { + height: 100%; + width: 100%; + flex-grow: 1; + display: flex; + flex-direction: row-reverse; + background-color: white; + border-radius: 1rem; + padding: 0; + text-decoration: none; + overflow: hidden; + box-shadow: rgba(141, 148, 158, 0.3) 0px 4px 12px; +} +.homepage-navigation__item:focus { + outline: 2px solid #e79ff7; +} +.homepage-navigation__title { + line-height: 1.1; + text-align: center; + font-size: 1rem; + font-weight: 700; + margin: 0.75rem; + flex-grow: 1; + display: flex; + justify-content: center; + align-items: center; +} +/* Animation */ +.homepage-navigation__animation { + display: block; + width: 50%; + height: auto; + border-style: solid; + border-color: #e0f3ff; + border-width: 0 1px 0 0 ; + flex-shrink: 0; +} +.homepage-navigation__item .is-animation, +.homepage-navigation__button.is-animation { + animation-play-state: paused; +} +.homepage-navigation__item:hover .is-animation, +.homepage-navigation__button.is-animation:hover { + animation-play-state: running; + +} +@media screen and ( min-width: 35.5rem ) { + .homepage-navigation__animation { + border-width: 1px 0 0 0; + } +} +/* Homepage Button */ +.homepage-navigation__button-container { + width: 100%; +} +.homepage-navigation__button { + width: 100%; + height: 100%; + border-radius: 2rem; + display: flex; + justify-content: center; + align-items: center; + padding: 1.25rem 1rem; + background-image: linear-gradient(45deg, #2574e1, #795ae8, #ba37d6, #795ae8, #2574e1, #795ae8); + background-size: 500%; + color: #fff; + white-space: initial; + text-align: center; + font-size: 1rem; + font-weight: 700; + line-height: 1.3; + text-decoration: none; + animation-name: homepage-gradient; + animation-duration: 3s; +} +.homepage-navigation__button:hover, +.homepage-navigation__button:focus, +.homepage-navigation__button:active { + color: #fff; +} +.homepage-navigation__button:focus { + outline: 2px solid #e79ff7; +} +.homepage-navigation__button br { + display: none; +} +/* Reactive */ +@media screen and ( min-width: 35.5rem ) { + .homepage-navigation__wrapper { + flex-direction: row; + flex-wrap: wrap; + } + .homepage-navigation__item-container { + width: calc( 100% / 3 ); + } + .homepage-navigation__item { + flex-direction: column; + } + .homepage-navigation__animation { + width: 100%; + } +} +@media screen and ( min-width: 48rem ) { + .homepage-navigation__section { + margin-top: calc((-100vw / 2000 * 150) - 7rem); + width: 100%; + } + .homepage-navigation__title { + font-size: 1.15rem; + margin: 1.25rem 1rem; + } +} +@media screen and ( min-width: 75rem ) { + .homepage-navigation__item-container { + width: calc( 100% / 7 * 2 ); + } + .homepage-navigation__button-container { + width: calc( 100% / 7 ); + } + .homepage-navigation__button { + border-radius: 1rem; + background-size: 1000% 100%; + } + .homepage-navigation__button br { + display: initial; + } +} + + +/* --- Homepage Animations --- */ +/* Setup Animation */ +.animation-setup .wave-background { + fill: #e0f3ff; +} + +.animation-setup .wave-1 { + fill: #4cc3ff; + animation-name: slide-3; +} + +.animation-setup .wave-2 { + fill: #2574e1; + animation-name: slide-4; + animation-direction: reverse; +} + +.animation-setup .wave-3 { + fill: #1b2759; + animation-name: slide-5; +} + +/* Patient Engagement Animation */ +.animation-pe .burst-background { + fill: #361657; +} +.animation-pe .burst-1, +.animation-pe .burst-2, +.animation-pe .burst-3, +.animation-pe .burst-4, +.animation-pe .burst-5 { + stroke: #fff; + stroke-miterlimit: 10; + stroke-width: 16px; + transform-origin: 50% 50%; + animation-name: rotate; +} +.animation-pe .burst-3, +.animation-pe .burst-4 { + animation-direction: reverse; +} +.animation-pe .burst-1 { + fill: #6b3fd1; + } +.animation-pe .burst-2 { + fill: #2598f7; + animation-duration: 30s; +} + +.animation-pe .burst-3 { + fill: #887dff; + animation-duration: 40s; +} +.animation-pe .burst-4 { + fill: #2574e1; + animation-duration: 60s; +} +.animation-pe .burst-5 { + fill: #4cc3ff; +} +/* Ocean Provider Network Animation */ +.animation-network .wave-1, +.animation-network .wave-2, +.animation-network .wave-3, +.animation-network .wave-4, +.animation-network .wave-5, +.animation-network .wave-6 { + fill: none; + stroke-miterlimit: 10; + stroke-width: 16px; + animation-name: pinwheel; + transform-origin: -150px 800px; + animation-duration: 6s; + animation-timing-function: cubic-bezier(.25,0,.91,.85); +} +.animation-network .wave-1 { + stroke: #6aead8; +} +.animation-network .wave-2 { + animation-delay: -1s; + stroke: #00a59b; +} +.animation-network .wave-3 { + animation-delay: -2s; + stroke: #4cc3ff; +} +.animation-network .wave-4 { + animation-delay: -3s; + stroke: #b6f2e7; +} +.animation-network .wave-5 { + animation-delay: -4s; + stroke: #1dd7b4; +} +.animation-network .wave-6 { + animation-delay: -5s; + stroke: #2598f7; +} + +/* ------ Dashboard Page ----- */ +/* Title */ +.np-dashboard-resources-title { + font-size: 1.25rem; + line-height: 1.3; + font-weight: 700; + text-transform: none; + color: #5a616b; + margin-top: 0; +} +@media screen and ( min-width: 48rem ) { + .np-dashboard-resources-title { + font-size: 1.5rem; + } +} +/* Subtitle */ +.dashboard-layout__subtitle { + font-size: 1rem; + font-weight: 900; + line-height:; 1.3; + margin-top: 1.5rem; + margin-bottom: 1rem; +} +.np-dashboard-resources-title + .dashboard-layout__subtitle { + margin-top: -0.5rem; +} +@media screen and ( min-width: 48rem ) { + .dashboard-layout__subtitle { + font-size: 1.25rem; + margin-top: 2rem; + } +} + +/* ------ Catalog Page ------ */ +/* --- Header --- */ +.np-catalog-header-wrapper { + display: block; +} +.np-catalog-header { + align-items: start; + margin: 0; +} + +/* --- Content Layout --- */ +.catalog-layout__wrapper { + flex-direction: column-reverse; + flex-wrap: nowrap; +} +.catalog-layout__filters { + width: 100%; +} +.catalog-layout__results { + align-content: start; + flex-grow: 1; +} +@media screen and ( min-width: 48rem ) { + .catalog-layout__results { + width: 75%; + } +} +@media screen and ( min-width: 35.5rem ) { + .catalog-layout__wrapper { + flex-direction: row; + } +} + +/* ------ Course Overview Page ------ */ +.page--course-overview .np-card-container { + max-width: 800px; + margin: auto; + flex-direction: column; +} +/* Course Image */ +.np-top-image-spacing { + margin-top: 2.5rem; + margin-bottom: 0; +} + +/* --- Background Image --- */ +.page--course-overview .page-background-image { + height: calc( 500 / 820 * 100vw * 0.6 ); +} +.page--course-overview .page-background-image::after { + background: linear-gradient(to top, rgb(245, 247, 250) 0%, rgba(245,247,250,0) 40%); +} +/* --- Course Outline --- */ +.np-course-outline { + margin-top: 1.5rem; + margin-bottom: 1.5rem; +} +@media screen and ( min-width: 48rem ) { + .np-course-outline { + margin-top: 2rem; + margin-bottom: 2rem; + } +} +/* --- Course Instructors --- */ +/* Container */ +.instructors-list__container { + display: flex; + flex-direction: column; + margin: -0.5rem; +} +.instructors-list__container > * { + padding: 0.5rem; + margin: 0; +} +@media screen and ( min-width: 48rem ) { + .instructors-list__container { + flex-direction: row; + align-items: start; + flex-wrap: wrap; + } + .instructors-list__container > * { + width: 50%; + } +} +/* Item */ +.np-content-instructors-content-item { + align-items: center; +} +.np-content-instructors-content-image { + width: 2rem; + height: 2rem; + border-radius: 50%; + border: 1px solid #aeb5bd; +} +.np-content-instructors-content-description { + margin-left: 0.75rem; +} +.np-content-instructors-content-name { + color: #6e7580; + font-weight: 700; + line-height: 1.3; +} +.np-content-instructors-content-info { + font-size: 1rem; + line-height: 1.3; + color: #24272e; +} +@media screen and ( min-width: 48rem ) { + .np-content-instructors-content-name { + font-size: 1.125rem; + } + .np-content-instructors-content-info { + font-size: 0.875rem; + } +} +/* --- Table of Contents --- */ +.np-course-outline-content-section-list { + margin-bottom: 1rem; +} + +/* Section Title */ +.np-course-outline-content-section-name { + color: #353a42; + font-size: 1rem; + line-height: 1.3; + border-bottom-width: 0; + padding-bottom: 0.3rem; +} +@media screen and ( min-width: 48rem ) { + .np-course-outline-content-section-name { + font-size: 1.125rem; + } +} +/* List Item */ +.np-course-outline-content-activity-list { + display: flex; + align-items: center; + border-bottom-width: 0; + padding: 0.3rem 0; +} +/* Icon */ +.np-course-outline-content-activity-icon { + padding: 0 0.75rem 0 0; + color: #e9ecf0; +} +/* Connecting Bar */ +.np-course-outline-content-activity-list-bar { + background-color: #e9ecf0; + height: calc(50% - 9px); + top: calc(50% + 9px); + bottom: 0; + left: 9px; +} +.np-course-outline-content-activity-list-bar:before { + background-color: #e9ecf0; + content: ""; + display: block; + position: absolute; + height: 100%; + top: calc(-100% - 18px); + width: 2px; + z-index: 1; +} +.np-course-outline-content-activity-list:first-child .np-course-outline-content-activity-list-bar:before { + display: none; +} +.np-course-outline-content-activity-list-bar.np-progress-background-color:before { + background-color: {{ color_palette.learning_progress_bar_color }}; +} +/* Hide the last end bar without hiding the connecting element */ +.np-course-outline-content-activity-list:last-child .np-course-outline-content-activity-list-bar { + display: block; + background-color: transparent; +} +/* Chapter Headings */ +.np-course-outline-content-activity-icon-locked, +.np-course-outline-content-activity-link-completed { + color: #6e7580; +} +.np-course-outline-content-activity-link-completed:hover, +.np-course-outline-content-activity-link-completed:focus { + color: #131519; +} +/* Link Hover Effect */ +.np-course-outline-content-activity-link-completed { + position: relative; +} +.np-course-outline-content-activity-link-completed::after { + content: ""; + display: block; + position: absolute; + width: 0%; + background-color: #4cc3ff; + height: 0; + border-radius: 1px; +} +.np-course-outline-content-activity-link-completed:hover::after, +.np-course-outline-content-activity-link-completed:focus::after { + width: 100%; + height: 2px; +} +.np-course-outline-content-activity-link-completed:active::after { + background-color: #ba37d6; +} +/* Locked Icon */ +.np-course-outline-content-activity-icon-locked { + color: #aeb5bd; + font-weight: 700; +} +/* --- Course Events --- */ +.np-course-events-content-item { + margin-top: 1rem; +} +.np-course-events-content-date { + flex-shrink: 0; + border-radius: 50%; + text-transform: none; + background-color: #795ae8; + +} +.np-course-events-content-month, +.np-course-events-content-day { + line-height: 1; +} +.np-course-events-content-name, +.np-course-events-content-type, +.np-course-events-content-time { + line-height: 1.3; +} +.np-course-events-content-name { + color: #353a42; + font-size: 1rem; + font-weight: 700; +} +.np-course-events-content-type, +.np-course-events-content-time { + font-size: 0.875rem; +} +.np-course-events-content-type { + margin-bottom: 0; +} +.np-course-events-content-time { + color: #6b3fd1; +} + +/* --- Outline Bar Divider --- */ +.np-learning-path-outline-bar { + position: relative; +} + +/* ------ Learning Path Overview ------ */ +/* --- Background Image --- */ +.page--learning-path-overview div.page-background-image { + width: 100%; + background-size: 100%; + mix-blend-mode: darken; +} +.page--learning-path-overview .page-background-image:after { + background: linear-gradient(140deg, rgba(255,255,255,0) 40%, rgb(255,255,255) 40%); +} + +/* --- Top Vocabulary (Online or In Person Event) --- */ +.np-training-session .np-top-vocabulary { + font-weight: 700; + line-height: 1.3; + white-space: nowrap; + margin-bottom: 0; +} +@media screen and ( min-width: 48rem ) { + .np-training-session .np-top-vocabulary { + margin-left: 1rem; + } +} +.np-training-session .np-top-vocabulary .np-training-session-icon { + margin-left: 0; + margin-right: .5rem; + color: #795ae8; +} + +/* --- CTA for Outline --- */ +.cta--outline { + position: relative; + text-align: center; + +} +.cta--outline .np-button { + width: 100%; +} +.cta--outline .np-top-cta { + box-shadow: rgba(141, 148, 158, 0.3) 0px 4px 12px; +} + +/* --- Outline Divider --- */ +.np-learning-path-outline-bar { + position: relative; +} + +/* --- Outline Cards --- */ +.np-learning-path-outline-item { + margin: 0; + border-radius: 1rem; +} +@media screen and ( min-width: 48rem ) { + .np-learning-path-outline-item .np-card-container { + min-height: 135px; + } +} +.np-learning-path-outline-item:focus { + outline: 2px solid #e79ff7; +} +.np-learning-path-outline-item .np-card-content-title { + flex-grow: 1; +} +.np-learning-path-outline-content { + margin-left: 0; +} +.outline-card__icon-container { + padding: 0.5rem; + border-radius: 50%; + height: 2.25rem; + width: 2.25rem; + align-self: center; + display: flex; + align-items: center; + justify-content: center; + margin-right: 1rem; + flex-shrink: 0; +} +.np-learning-path-outline-icon { + margin-left: unset; + font-size: 1rem; +} +/* Locked */ +.outline-card__icon-locked { + background-color: #e9ecf0; +} +.outline-card__icon-locked .np-learning-path-outline-icon { + color: #5a616b; +} +/* Complete */ +.outline-card__icon-complete { + background-color: #d7f7f1; +} +.outline-card__icon-complete .np-learning-path-outline-icon { + color: #008382; +} +/* Use an arrow icon on hvoer */ +a:hover .outline-card__icon-complete .np-learning-path-outline-icon::before, +a:focus .outline-card__icon-complete .np-learning-path-outline-icon::before, +a:active .outline-card__icon-complete .np-learning-path-outline-icon::before { + content: "\f054"; +} +/* Link */ +.outline-card__icon-link { + background-color: #e0f3ff; +} +.outline-card__icon-link .np-learning-path-outline-icon { + color: #2574e1; +} +a:hover .outline-card__icon-container, +a:focus .outline-card__icon-container { + background-color: #f9e1ff; +} +a:focus .outline-card__icon-container { + outline: 2px solid #e79ff7; +} +a:hover .np-learning-path-outline-icon, +a:focus .np-learning-path-outline-icon { + color: #ba37d6; +} +a:active .np-learning-path-outline-icon { + color: #712b80; +} + +/* ------ Events Overview ------ */ + +/* --- Date Bar --- */ +.np-training-session .np-card-training-session-date { + margin-top: 0; +} +.np-training-session .np-card-training-session-date-bar { + border-top-right-radius: 0.25rem; + border-bottom-right-radius: 0.25rem; + width: 0.5rem; +} +/* --- Session Details --- */ +.training-session__details { + margin-top: 0.5rem; + margin-bottom: 1rem !important; +} +.training-session__details .np-training-session-icon { + color: #795ae8; + width: 1.5rem; + text-align: center; + margin-right: 0.25rem; +} +.np-training-session .np-training-session-time, +.np-training-session-location { + margin-top: 0; +} +/* --- CTA --- */ +.np-training-session-cta { + padding-right: 0; + display: block; + width: 100%; +} +.np-training-session-cta-buttons form { + display: flex; + flex-wrap: wrap; + width: calc(100% + .5rem); + margin: -0.25rem; +} +.np-training-session-cta-buttons form > * { + margin: 0.25rem !important; +} +/* --- Additional Training Sessions --- */ +.np-training-session-tile { + background-color: #ffffff; + border-radius: 1rem; + box-shadow: rgba(141, 148, 158, 0.3) 0px 4px 12px; + color: #5a616b; +} +.np-training-session-tile:hover { + background-color: #ffffff; +} +.np-training-session-tile:focus { + outline: 2px solid #e79ff7; +} +/* Icon */ +.np-training-session-tile-icon { + color: #795ae8; +} +/* Details */ +.training-session-tile__details { + flex-grow: 1; +} +.np-training-session-tile-date { + color: #24272e; +} +.np-training-session-tile-time { + color: #5a616b; + font-size: 0.875rem; +} +/* Arrow */ +.training-session-tile__icon-container { + padding: 0.5rem; + border-radius: 50%; + height: 2.25rem; + width: 2.25rem; + align-self: center; + display: flex; + align-items: center; + justify-content: center; + margin-right: 1rem; + flex-shrink: 0; + background-color: #e0f3ff; + margin-left: 1rem; + margin-right: 0; +} +.training-session-tile__icon { + margin-left: unset; + font-size: 1rem; + color: #2574e1; +} +a:hover .training-session-tile__icon-container, +a:focus .training-session-tile__icon-container { + background-color: #f9e1ff; +} +a:focus .training-session-tile__icon-container { + outline: 2px solid #e79ff7; +} +a:hover .training-session-tile__icon, +a:focus .training-session-tile__icon { + color: #ba37d6; +} +a:active .training-session-tile__icon { + color: #712b80; +} + +/* ------ Empty States ------ */ + +.np-dashboard-resources-container, +.np-learning-paths-resources-container, +.np-training-session-zero-state { + width: 100%; + border-radius: 1rem; + border: 3px solid #dce1e5; +} +.np-training-session-zero-state { + display: flex; + padding: 2.5rem 2rem; + align-items: center; +} +.np-training-session-zero-state img { + height: 68px; + margin-right: 1rem; +} +.np-zero-state-text { + color: #6e7580; + font-size: 1.125rem; + font-weight: 700; +} +.np-zero-state-text button { + margin-top: 1rem; +} +.np-training-session-zero-state-text { + font-size: 1; + line-height: 1.3; +} + +/* ------ Search Results ------ */ + +/* --- Header / Summary --- */ +.search-summary__emphasis {f + color: #6b3fd1; + font-weight: 700; +} + +/* --- Search Result --- */ +.np-search-result { + height: unset !important; +} +.np-search-result a { + text-decoration: none; +} +.np-search-result .np-card-content { + flex-direction: row; +} +.np-search-result-snippet { + overflow: hidden; + font-size: 1rem; + line-height: 1.5rem; +} + +/* ------ Custom Pages ------ */ +.custom-page__content { + margin-top: 0.75rem; +} +@media screen and ( min-width: 48rem ) { + .custom-page__content { + margin-top: 1rem; + } +} + +/* ------ Account Page ------ */ +.np-account-form .np-card-container { + flex-direction: column; +} +@media screen and ( max-width: 48rem ) { + .np-account-avatar .np-card-container { + flex-direction: row !important; + } +} + +/* ------------ Custom Freeform Content ------------ */ +/* This content is shared between the main academy and the LX experience */ + +/* --- Button --- */ +a.tutorial-button { + display: inline-block; + padding: 0.5rem 1.25rem; + border-radius: 1.5rem; + background-color: #2574e1; + color: #fff !important; +} +.tutorial-button:focus, +.tutorial-button:hover { + background-color: #712b80; +} +.tutorial-button:focus { + outline: 2px solid #e79ff7; +} +.tutorial-button:active { + background-color: #50185b; +} + + +/* --- Time Estimate --- */ +/* Includes a clock icon and light purple background with dark purple text */ +.tutorial-time-estimate { + position: relative; + border-radius: 1.25rem; + background-color: #e9e9ff; + padding: 0.5rem 1rem 0.5rem calc(3rem + 16px); + display: block; + overflow: hidden; + font-size: 1rem; + color: #6b3fd1; + margin: 1.5rem 0 !important; +} +.tutorial-time-estimate::before { + position: absolute; + display: flex; + align-items: center; + left: 0; + top: 0; + bottom: 0; + background-color: #6b3fd1; + color: #fff; + padding: 0.5rem 0.9rem 0.5rem 1rem; + content: "\f017"; + font-family: 'Font Awesome 5 Pro'; + font-size: 18px; + line-height: 1.5rem; +} + +/* ------------ Colors ------------ */ +.np-color-danger { + color: #E52242; +} +.np-color-success { + color: #368645; +} +.np-progress-color { + color: #4cc3ff; + +} +.np-progress-background-color { + background-color: #4cc3ff; +} diff --git a/NP_Custom_Templates/customer_templates/Stripe/training_events.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/training_events.html.liquid new file mode 100644 index 00000000..9e4a107e --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/training_events.html.liquid @@ -0,0 +1,13 @@ +{% include "header", current_page_orgin: "training_events" %} +
    +
    +

    + {% t .title %} +

    +
    + {% t .subtitle %} +
    +
    + {% include "training_events_index" %} +
    +{% include "footer" %} diff --git a/NP_Custom_Templates/customer_templates/Stripe/training_session.html.liquid b/NP_Custom_Templates/customer_templates/Stripe/training_session.html.liquid new file mode 100644 index 00000000..2d9ef1d6 --- /dev/null +++ b/NP_Custom_Templates/customer_templates/Stripe/training_session.html.liquid @@ -0,0 +1 @@ +{% include "training_session_desktop_view" %} \ No newline at end of file