Hackerrank new templates in sandbox. updated a bunch of williams-sonoma stuff. GSU backup.

Custom_Templates/customer_templates/Gainsight University/_catalog_filter_sidebar.html.liquid

@@ -145,6 +145,10 @@
     document.querySelector(".close-filter").addEventListener("click", function() {
       document.querySelector(".catalog-filter-sidebar").classList.remove("open")
     })
+
+    setTimeout(function() {
+      document.querySelector("#learning-path").click();
+    }, 200)
   })
 </script>
 

Custom_Templates/customer_templates/Gainsight University/_header.html.liquid

@@ -101,7 +101,7 @@
                   </li>
                   <li>
                     <div class="cs-nav-section">
-                      <a href="/app/quick-tips-videos">
+                      <a href="/app/quick-tip-videos">
                         Quick Tip Videos
                       </a>
                     </div>
@@ -329,7 +329,7 @@
                 </li>
                 <li>
                   <div class="cs-nav-section np-header-mobile-menu-content-button">
-                    <a href="/app/quick-tips-videos">
+                    <a href="/app/quick-tip-videos">
                       Quick Tip Videos
                     </a>
                   </div>
@@ -432,7 +432,8 @@
   .np-learning-paths,
   .np-training-events,
   .np-commerce-order-history-page,
-  .faq {
+  .faq,
+  .np-search {
     margin-top: 70px;
   }
 
@@ -627,7 +628,8 @@
     .np-catalog,
     .np-learning-paths,
     .np-training-events,
-    .faq {
+    .faq,
+    .np-search {
       margin-top: 64px;
     }
 
@@ -710,7 +712,8 @@
     .np-catalog,
     .np-learning-paths,
     .np-training-events,
-    .faq {
+    .faq,
+    .np-search {
       margin-top: 100px;
     }
 

Custom_Templates/customer_templates/Gainsight University/_messages.html.liquid

@@ -17,3 +17,27 @@
     </div>
   </div>
 {% endif %}
+
+<style>
+  .np-alert {
+    margin-top: 70px;
+  }
+
+  @media (min-width: 768px) {
+    .np-alert {
+      margin-top: 64px;
+    }
+  }
+
+  @media (min-width: 1024px) {
+    .np-alert {
+      margin-top: 90px;
+    }
+  }
+
+  @media (min-width: 1366px) {
+    .np-alert {
+      margin-top: 100px;
+    }
+  }
+</style>

Custom_Templates/customer_templates/Gainsight University/faq.html.liquid

@@ -17,11 +17,6 @@
               question: "Can I get a test environment/training org for hands-on practice with the Gainsight CS product?",
               answer: "Yes, you can request a training org by filling out this <a href='https://docs.google.com/forms/d/1Iqj0YqYybLN6XcgU2f561KjJ-XMhtUxzpZZCWuhA7aM/edit'>form</a> or emailing us at <a href='mailto:training@gainsight.com'>training@gainsight.com</a>."
             %}
-            {%
-              include 'faq_item',
-              question: "Currently I don’t have a company email address, but I would like to go through the courses on Gainsight University. Can I get access?",
-              answer: "Yes, you can reach out to us at <a href='mailto:training@gainsight.com'>training@gainsight.com</a> and we can give you access from the back-end."
-            %}
             {%
               include 'faq_item',
               question: "Where do I start my CS training journey? Which courses do I need to take first?",
@@ -67,6 +62,11 @@
               question: "How long is my Gainsight CS certificate valid for?",
               answer: "All Gainsight product certifications are valid for 2 years. To renew your certifications, we offer Continuing Education Exams that address recent product updates."
             %}
+            {%
+              include 'faq_item',
+              question: "How many hours of preparation are needed for each of the certifications?",
+              answer: "<li>Level 1: 8 hrs for self-paced elearning</li><li>Level 2: 6 hrs for instructor-led hands-on courses and/or more for self-paced practice in a Gainsight org</li><li>Level 3: We will soon be offering free prep courses that total about 3 hours</li>"
+            %}
             {%
               include 'faq_item',
               question: "When should I take the Gainsight NXT Level 3 Admin certification?",
@@ -147,6 +147,11 @@
               question: "How do I register for a VILT session?",
               answer: "You can register for a VILT session by visiting our calendar on Gainsight University, selecting your preferred course, and following the registration process."
             %}
+            {%
+              include 'faq_item',
+              question: "Can I purchase a session on behalf of another student?",
+              answer: "The ability to purchase on behalf of someone else is not currently supported but is a planned enhancement."
+            %}
             {%
               include 'faq_item',
               question: "What are the technical requirements for attending a VILT?",

Custom_Templates/customer_templates/Gainsight University/gainsight-nxt-admin-certificate.html.liquid

@@ -16,8 +16,8 @@
 <p><span style='font-weight: 400; color: #000000;'>Candidates are encouraged to complete all of the Gainsight Administrator courses for NXT, and have a minimum of 6 months of hands-on experience as a Gainsight Administrator prior to attempting the exam. Please note, only one attempt and one retake are allowed per 6 month period.</span></p>
 <p style='font-weight: bold'>Preparation</p>
 <ul>
-  <li>Complete all NXT Admin Web-Based Trainings on <a href='https://education.gainsight.com/page/getting-started-with-gainsight' target='_blank' rel='noopener'>Gainsight University</a></li>
+  <li>Complete all NXT Admin Web-Based Trainings on <a href='https://education.gainsight.com/app/customer-success' target='_blank' rel='noopener'>Gainsight University</a></li>
-  <li>Complete all <a href='https://education.gainsight.com/page/instructor-led-learning' target='_blank' rel='noopener'>Gainsight Admin Instructor-Led Courses</a> (strongly recommended)</li>
+  <li>Complete all <a href='https://education.gainsight.com/app/catalog' target='_blank' rel='noopener'>Gainsight Admin Instructor-Led Courses</a> (strongly recommended)</li>
   <li>Review the topics and documentation in our <a href='https://docs.google.com/document/d/16bTwCLWiH0RGOt3qaIJ0wr6tT8Ljf8VSpXS0Wmrybzo/edit#' target='_blank' rel='noopener'>Study Guide</a></li>
   <li>We recommend at least 6 months of hands-on Gainsight administration experience prior to taking the exam</li>
   <li>(Optional) take the free unproctored <a href='https://www.webassessor.com/gainsight' target='_blank' rel='noopener'>Level 3 PRACTICE exam</a> to familiarize yourself with the item format and the level of difficulty</li>

Custom_Templates/customer_templates/Gainsight University/not_found.html.liquid

@@ -1,10 +1,41 @@
-<main class="np-main np-max-width np-subpage-container">
+<main class="np-main np-max-width np-subpage-container page-not-found">
   <div class="np-homepage-featured-text">
     <div class="np-homepage-headline">
       {% t .header %}
     </div>
+    <div class="np-homepage-subheadline">
+      The resource you're looking for has moved. Please try using the search option in the upper right corner.
+    </div>
   </div>
   <div class="np-homepage-featured-empty">
     <img src="/images/404.svg">
   </div>
 </main>
+
+<style>
+  .page-not-found {
+    margin-top: 70px;
+  }
+
+  @media (min-width: 768px) {
+    .page-not-found {
+      margin-top: 64px;
+    }
+  }
+
+  @media (min-width: 1024px) {
+    .page-not-found {
+      margin-top: 90px;
+    }
+  }
+
+  @media (min-width: 1366px) {
+    .page-not-found {
+      margin-top: 100px;
+    }
+  }
+
+  .sk-branding-banner {
+    display: none !important;
+  }
+</style>

Custom_Templates/customer_templates/Gainsight University/search.html.liquid

@@ -25,3 +25,9 @@
   {% endif %}
 </main>
 {% include "footer" %}
+
+<style>
+  .np-search .np-card-content {
+    padding: 0 !important;
+  }
+</style>

Custom_Templates/customer_templates/Gainsight University/topic-specific-certificates.html.liquid

@@ -2,11 +2,11 @@
 
 {% assign full_desc = "
 <h3>Gainsight Certified Administrator: Level 2</h3>
-<p>We currently offer level 2 certification for two areas: Horizon Reports &amp; Dashboards, and Journey Orchestrator and Surveys. Both are practical exams that require you to login to a Gainsight instance and complete a variety of configurations. See below for more information about how to prepare for each topic.</p>
+<p>We currently offer level 2 certification for two areas: Horizon Reports & Dashboards, and Journey Orchestrator and Surveys. Both are practical exams that require you to login to a Gainsight instance and complete a variety of configurations. See below for more information about how to prepare for each topic.</p>
 <p style='font-weight: bold'>General Qualifications</p>
 <p>Candidates should successfully complete the Gainsight Administrative courses for NXT, or possess the equivalent experience and knowledge prior to taking the exam. We recommend candidates have a minimum of 1 - 2 months of hands-on experience as a Gainsight Administrator prior to attempting the exam. Please note only one attempt and one retake are allowed per 2 month period.</p>
 <p style='font-weight: bold'>How to Take the Exam</p>
-<p>Gainsight has teamed with Kryterion to provide remote online testing.</p>
+<p>Click the 'Create New Account' link in the upper right corner of the form and follow the instructions.</p>
 <ul>
   <li>Click the orange 'Get Certified' button to be redirected to Webassessor, where you’ll create a secure test-taking account.</li>
   <li>Click the 'Create New Account' link in the upper right corner of the form and follow the instructions.</li>
@@ -18,12 +18,12 @@
   <li>2nd attempt allowed after: 1 month</li>
 </ul>
 <p style='font-weight: bold'>Reports &amp; Dashboards</p>
-<p>Do you support your organization by building and managing Reports &amp; Dashboards in Gainsight NXT? Are you interested in validating your skills as you progress toward the Level 3 certification? Then this certification is for you!</p>
+<p>Do you support your organization by building and managing Reports & Dashboards in Gainsight NXT? Are you interested in validating your skills as you progress toward the Level 3 certification? Then this certification is for you!</p>
 <p style='font-weight: bold'>Preparation</p>
 <ul>
-  <li>Complete our <a href='https://education.gainsight.com/admin-reports-and-dashboards-horizon-analytics-nxt'>Admin Reports &amp; Dashboards (Horizon Analytics)</a> Web-Based Training on Gainsight University</li>
+  <li>Complete our <a href='https://education.gainsight.com/app/courses/073b9c57-0a40-4278-bf5e-c375b647e13d'>Admin Reports & Dashboards (Horizon Analytics)</a> Web-Based Training on Gainsight University</li>
-  <li>Hands-on practice with report building and dashboard configuration (see exercises <a href='https://education.gainsight.com/admin-reports-and-dashboards-horizon-analytics-nxt/913869'>here</a> and request a training environment from <a href='mailto:training@gainsight.com'>training@gainsight.com</a> if you don’t have Gainsight access)</li>
+  <li>Hands-on practice with report building and dashboard configuration (see exercises <a href='https://education.gainsight.com/app/courses/073b9c57-0a40-4278-bf5e-c375b647e13d'>here</a> and request a training environment from <a href='mailto:training@gainsight.com'>training@gainsight.com</a> if you don’t have Gainsight access)</li>
-  <li>Take our instructor-led training on Reports &amp; Dashboards [announcing new courses for 2024 soon!]</li>
+  <li>Take our instructor-led training on Reports & Dashboards [announcing new courses for 2024 soon!]</li>
   <li>We recommend at least 1 - 2 months of Gainsight experience prior to taking the exam.</li>
 </ul>
 <p>We strongly recommend completing the following courses before taking the exam. We also recommend hands-on practice with Gainsight. If you don't have access to an instance of Gainsight, and you're serious about learning Gainsight Certified Administration, you may request access to a training environment <a href='https://forms.gle/7EoNrC14UXsn3DQZ9' target='_blank' rel='noopener'>here.</a></p>
@@ -40,23 +40,23 @@
   <li>Online only and must be scheduled with assistance from the Gainsight Education team. Test is not proctored.</li>
   <li>The exam is currently available in English only</li>
 </ul>
-  <li>Certificate Validity Period: this certificate is valid for 2 years. To renew your certificate, you can log in into your webassessor account and register <a href='https://www.webassessor.com/wa.do?page=enterCatalog&amp;tabs=7' target='_blank' rel='noopener'>here</a>.&nbsp;Please review the <a href='https://docs.google.com/document/d/1VVMhYtchWj6QVhJQGUjv11F14gq-fxk_zRjqnufih3s/edit?usp=sharing' target='_blank' rel='noopener'>Study Guide</a> to prepare.</li>
+  <li>Certificate Validity Period: this certificate is valid for 2 years. To renew your certificate, you can log in into your webassessor account and register <a href='https://www.webassessor.com/gainsight' target='_blank' rel='noopener'>here</a>.&nbsp;Please review the <a href='https://docs.google.com/document/d/1VVMhYtchWj6QVhJQGUjv11F14gq-fxk_zRjqnufih3s/edit?usp=sharing' target='_blank' rel='noopener'>Study Guide</a> to prepare.</li>
 </ul>
 <p style='font-weight: bold'><strong>Journey Orchestrator &amp; Surveys</strong></p>
-<p>Do you support your organization by building and managing JO Programs &amp; Surveys in Gainsight NXT? Are you interested in validating your skills as you progress toward the Level 3 certification? Then this certification is for you!</p>
+<p>Do you support your organization by building and managing JO Programs & Surveys in Gainsight NXT? Are you interested in validating your skills as you progress toward the Level 3 certification? Then this certification is for you!</p>
 <p style='font-weight: bold'>Preparation</p>
 <ul>
-  <li><strong>Important Note: </strong>All Admin certification levels and exams are being updated to reflect the new Dynamic Programs functionality by March 1, 2024.&nbsp;</li>
+  <li><strong>Important Note: </strong>All Admin certification levels and exams are being updated to reflect the new Dynamic Programs functionality by March 1, 2024.</li>
-  <li>Complete our <a href='https://education.gainsight.com/admin-journey-orchestrator-nxt'>Admin - Journey Orchestrator</a>, <a href='https://education.gainsight.com/admin-jo-advanced-programs-nxt-1' target='_blank' rel='noopener'>Advanced Programs</a> &amp; <a href='https://education.gainsight.com/admin-surveys-nxt'>Admin - Surveys</a> Web-Based Training on Gainsight University</li>
+  <li>Complete our <a href='https://education.gainsight.com/app/courses/3a4a9eea-9e5c-41ba-b128-f1459a1f1e22'>Admin - Journey Orchestrator</a>, <a href='https://education.gainsight.com/app/courses/215ed6fe-502c-4c28-a32c-dba04b7e14cc' target='_blank' rel='noopener'>Advanced Programs</a> &amp; <a href='https://education.gainsight.com/app/courses/14ec808d-3c8c-426f-998b-c1dbb73f523b'>Admin - Surveys</a> Web-Based Training on Gainsight University</li>
   <li>Hands-on practice with program and survey configuration and email template set up. (see exercises in courses above and request a training environment from <a href='mailto:training@gainsight.com'>training@gainsight.com</a> if you don’t have Gainsight access)</li>
-  <li>Take our instructor-led hands-on Admin training on <a href='https://education.gainsight.com/series/admin-journey-orchestrator-nxt-live'>Journey Orchestrator</a> (strongly recommended)</li>
+  <li>Take our instructor-led hands-on Admin training on <a href='https://education.gainsight.com/app/catalog/bundles/7b63149c-7202-41b3-903b-0236e3a2932d'>Journey Orchestrator</a> (strongly recommended)</li>
   <li>Take our instructor-led training on Surveys [announcing new courses for 2024 soon!]</li>
   <li>We recommend at least 1 - 2 months of Gainsight experience prior to taking the exam.</li>
 </ul>
 <p>We strongly recommend completing the following courses before taking the exam. We also recommend hands-on practice with Gainsight. If you don't have access to an instance of Gainsight, and you're serious about learning Gainsight Certified Administration, you may request access to a training environment <a href='https://forms.gle/7EoNrC14UXsn3DQZ9' target='_blank' rel='noopener'>here.</a></p>
 <p style='font-weight: bold'>Exam Format</p>
 <ul>
-  <li>Content: Practical exam tests your knowledge and familiarity with Gainsight NXT Journey Orchestrator &amp; Surveys functionality. You will be asked to create a Program, Survey, and Email Templates, and configure a variety of options such as tokenized fields, translation options, wait timers, display logic, etc.</li>
+  <li>Content: Practical exam tests your knowledge and familiarity with Gainsight NXT Journey Orchestrator & Surveys functionality. You will be asked to create a Program, Survey, and Email Templates, and configure a variety of options such as tokenized fields, translation options, wait timers, display logic, etc.</li>
   <li>Time allotted to complete the exam: 8 hours</li>
   <li>References: documentation and training materials may be utilized</li>
   <li>Passing score: 85%</li>

Custom_Templates/customer_templates/HackerRank Sandbox/_account_tabs.html.liquid

@@ -1,23 +0,0 @@
-{% capture settings_path %}{% route account %}{% endcapture %}
-{% capture transcript_path %}{% route transcript %}{% endcapture %}
-
-{% if current_person.signed_in? %}
-{% unless current_school.sso_active? %}
-  <nav class="np-tabs np-account-tabs">
-    <div class="np-tabs-content">
-      <div class="np-tab{% if page.path == settings_path %} np-tab-active{% endif %}">
-        <a class="np-tab-link" href="{{ settings_path}}">
-          {% t .profile_settings %}
-        </a>
-        <div class="np-tab-indicator np-button-background-color"></div>
-      </div>
-      <div class="np-tab{% if page.path == transcript_path %} np-tab-active{% endif %}">
-        <a class="np-tab-link" href="{{ transcript_path }}">
-          {% t .transcript %}
-        </a>
-        <div class="np-tab-indicator np-button-background-color"></div>
-      </div>
-    </div>
-  </nav>
-{% endunless %}
-{% endif %}

Custom_Templates/customer_templates/HackerRank Sandbox/_cards_learning_path.html.liquid

@@ -1,3 +1,18 @@
+{% comment %}This section of code will iterate over all courses in a learning path and average out the completion per course compared to the total of the LP {% endcomment %}
+{% assign total_progress = 0 %}
+{% assign completed_progress = 0 %}
+
+{% for item in learning_path.items %}
+  {% if item.course? %}
+    {% assign total_progress = total_progress | plus: 100 %}
+
+    {% assign completed_progress = completed_progress | plus: item.progress %}
+  {% endif %}
+{% endfor %}
+
+{% assign total_progress = total_progress | times: 0.01 %}
+{% assign calculated_progress = completed_progress | divided_by: total_progress %}
+
 <div class="np-card np-no-horizontal-padding">
   <div class="np-card-container">
     <div class="np-learning-path">
@@ -34,12 +49,17 @@
 
           <div class="np-hidden-mobile np-card-content-progress
           np-button-color">
-            {% t shared.progress, count: learning_path.progress %}
+            {% comment %}{% t shared.progress, count: learning_path.progress %}{% endcomment %}
+            {% if calculated_progress < 1 %}
+              Not Started
+            {% else %}
+              {{calculated_progress | ceil }}% Completed
+            {% endif %}
           </div>
 
           <div class="np-hidden-mobile np-card-progress-bar-container">
             <div
-              style="width: {{ learning_path.progress }}%"
+              style="width: {{ calculated_progress }}%"
               class="np-button-background-color np-card-progress-bar">
             </div>
           </div>
@@ -68,3 +88,15 @@
     <div class="np-card-stack-level-2"></div>
   </div>
 </div>
+
+<style>
+  @media screen and (min-width: 768px) {
+.np-learning-paths .np-learning-path-image {
+  min-height: unset;
+  margin: auto;
+}
+.np-learning-path-image {
+  min-width: 33%;
+}
+}
+</style>

Custom_Templates/customer_templates/HackerRank Sandbox/_cards_training_event.html.liquid

@@ -1,46 +1,38 @@
-<div class="np-card np-card-training-event">
+<div class="np-card">
   <div class="np-card-container">
     <div class="np-card-content-training-event">
       <h3 class="np-card-content-title">
         {{ training_event.title }}
       </h3>
       <div class="np-card-content-subtitle">
-        <i class="far {{ training_event.event_type_icon }} np-training-session-icon"></i>
         {% t shared.event_types, key: training_event.event_type %}
-        <span class="np-card-training-sessions-separator">•</span>
-        <i class="np-card-training-sessions-icon far fa-calendar-star"></i>
-        <span class="np-card-training-sessions-label">
-          {% t .sessions, count: training_event.sessions.size %}
-        </span>
       </div>
       <div class="np-card-training-session">
         <span class="np-card-content-label">
-          {% t .next_session %} -
+          {% t .next_session %}
-          <span class="{{ training_event.sessions.first.status.type}}">
-            {{ training_event.sessions.first.status.label}}
-          </span>
         </span>
         <div class="np-card-training-session-date">
           <div class="np-button-background-color np-card-training-session-date-bar"></div>
-          <div class="np-card-training-session-date-label">
+          <div class="np-card-training-session-date-day">
-            <div class="np-card-training-session-date-day">
+            {{ training_event.sessions.first.day }}
-              {{ training_event.sessions.first.day }}
+          </div>
+          <div>
+            <div class="np-card-training-session-date-month">
+              {{ training_event.sessions.first.month }}
             </div>
-            <div>
+            <div class="np-card-training-session-date-year">
-              <div class="np-card-training-session-date-month">
+              {{ training_event.sessions.first.year }}
-                {{ training_event.sessions.first.month }}
-              </div>
-              <div class="np-card-training-session-date-year">
-                {{ training_event.sessions.first.year }}
-              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-    <div class="np-card-content np-card-content-vertical np-card-content-training-event">
+    <div class="np-card-content np-card-content-vertical np-card-padding">
       <div class="np-card-training-sessions">
-
+        <i class="np-card-training-sessions-icon far fa-calendar-star"></i>
+        <span class="np-card-training-sessions-label">
+          {% t .sessions, count: training_event.sessions.size %}
+        </span>
         <a
           class="np-button np-button-wide"
           href="{% route training_session, id: training_event.sessions.first.id %}"

Custom_Templates/customer_templates/HackerRank Sandbox/_header.html.liquid

@@ -26,7 +26,7 @@
       <h1 class="np-header-logo">
         <a href="{% route home %}">
           <img
-            alt="This is the school name"
+            alt="{{ current_school.name }}"
             class="np-header-logo-image"
             src="{{ current_school.logo_url }}"
           />
@@ -92,22 +92,14 @@
             </div>
           </div>
           <nav class="np-header-avatar-tooltip-navigation">
-            {% unless current_school.sso_active? %}
+          {% unless current_school.sso_active? %}
-              <a
+            <a
-                class="np-header-avatar-tooltip-navigation-link"
+              class="np-header-avatar-tooltip-navigation-link"
-                href="{% route account %}"
+              href="{% route account %}"
-              >
+            >
-                {% t .profile_settings %}
+              {% t .profile_settings %}
-              </a>
+            </a>
-            {% endunless %}
+          {% endunless %}
-            {% if current_person.signed_in? %}
-              <a
-                class="np-header-avatar-tooltip-navigation-link"
-                href="{% route transcript %}"
-              >
-                {% t .transcript %}
-              </a>
-            {% endif %}
             <a
               class="np-header-avatar-tooltip-navigation-link np-danger"
               href="{% route logout %}"
@@ -167,22 +159,14 @@
         </a>
       {% endfor %}
       <div class="np-header-mobile-menu-content-line"></div>
-        {% unless current_school.sso_active? %}
+      {% unless current_school.sso_active? %}
-          <a
-            class="np-header-mobile-menu-content-button"
-            href="{% route account %}"
-          >
-            {% t .profile_settings %}
-          </a>
-        {% endunless %}
-        {% if current_person.signed_in? %}
         <a
           class="np-header-mobile-menu-content-button"
-          href="{% route transcript %}"
+          href="{% route account %}"
         >
-          {% t .transcript %}
+          {% t .profile_settings %}
         </a>
-      {% endif %}
+      {% endunless %}
       <a
         class="np-header-mobile-menu-content-button np-danger"
         href="{% route logout %}"

Custom_Templates/customer_templates/HackerRank Sandbox/_learning_path_course.html.liquid

@@ -26,11 +26,13 @@
         </div>
       </div>
       <i class="fas fa-chevron-right np-learning-path-outline-icon"></i>
+      {% comment %}
       {% if course.optional? %}
         <div class="np-optional-ribbon">
           {% t shared.optional %}
         </div>
       {% endif %}
+      {% endcomment %}
     </div>
   </a>
 {% else %}
@@ -46,11 +48,13 @@
           {{ course.name }}
         </div>
       </div>
-      {% if course.optional? %}
+      {% comment %}
-        <div class="np-optional-ribbon">
+        {% if course.optional? %}
-          {% t shared.optional %}
+          <div class="np-optional-ribbon">
-        </div>
+            {% t shared.optional %}
-      {% endif %}
+          </div>
+        {% endif %}
+      {% endcomment %}
     </div>
   </div>
 {% endif %}

Custom_Templates/customer_templates/HackerRank Sandbox/_learning_path_training_session.html.liquid

@@ -21,11 +21,13 @@
         </div>
       </div>
       <i class="fas fa-chevron-right np-learning-path-outline-icon"></i>
+      {% comment %}
       {% if training_session.optional? %}
         <div class="np-optional-ribbon">
           {% t shared.optional %}
         </div>
       {% endif %}
+      {% endcomment %}
     </div>
   </a>
 {% else %}
@@ -43,11 +45,13 @@
         <div class="np-learning-path-outline-name np-top-title">{{ training_session.name }}</div>
         <div class="np-learning-path-outline-caption">{{ training_session.caption }}</div>
       </div>
+      {% comment %}
       {% if training_session.optional? %}
         <div class="np-optional-ribbon">
           {% t shared.optional %}
         </div>
       {% endif %}
+      {% endcomment %}
     </div>
   </div>
 {% endif %}

Custom_Templates/customer_templates/HackerRank Sandbox/_sub_navigation.html.liquid

@@ -4,10 +4,76 @@
       <div class="np-sub-navigation-content-item {{ link.active_class }}">
         <a class="np-sub-navigation-content-item-link" href="{{ link.url }}">
           <i class="{{ link.icon }} np-button-color np-sub-navigation-content-item-icon"></i>
-          {{ link.label }}
+          {% if link.label == 'Dashboard' %}
+            My Dashboard
+          {% elsif link.label == 'Catalog' %}
+            Courses Library
+          {% elsif link.label == 'Events' %}
+            Live Training Webinars
+          {% else %}
+            {{ link.label }}
+          {% endif %}
         </a>
         <div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
       </div>
     {% endfor %}
+      <div class="np-sub-navigation-content-item-inactive knowledge-base-link">
+        <a class="np-sub-navigation-content-item-link" href="https://support.hackerrank.com">
+          <i class="fal fa-book-reader np-button-color np-sub-navigation-content-item-icon"></i>
+          Knowledge Base
+        </a>
+        <div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
+	  </div>
+
+      <div class="np-sub-navigation-content-item new-products-link">
+		<a class="np-sub-navigation-content-item-link"
+		   href="https://hackerrank.northpass.com/app/new-product-releases">
+          <i class="fal fa-rocket-launch np-sub-navigation-content-item-icon"></i>
+          New Product Releases
+        </a>
+        <div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
+	  </div>
+
+      <div class="np-sub-navigation-content-item case-studies-link">
+
+		<a style="text-decoration: none;" href="https://hackerrank.northpass.com/app/case-studies">
+		<div class="np-sub-navigation-content-item-link" >
+		  <img class="fal np-button-color np-sub-navigation-content-item-icon custom-icon" src="https://s3.amazonaws.com/static.northpass.com/HackerRank/Lightbulb_Book-Icon.jpg">
+          Case Studies
+		</div>
+		</a>
+        <div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
+	</div>
   </div>
 </nav>
+
+<style>
+/* .custom-icon {
+	content: url('https://s3.amazonaws.com/static.northpass.com/HackerRank/Lightbulb_Book-Icon.jpg');
+    height: 100%;
+	overflow: auto;
+} */
+.custom-icon {
+	width: 32px;
+    position: relative;
+    top: 50%;
+    left: 50%;
+    padding: 0;
+    transform: translate(-135%, calc(-50% - 10px));
+}
+  .np-sub-navigation-content-item-active .np-sub-navigation-content-item-link {
+    color:#1ba94c;
+  }
+</style>
+<script>
+  if (window.location.pathname == "/app/case-studies") {
+    document.querySelector(".case-studies-link").classList.add("np-sub-navigation-content-item-active")
+  } else {
+    document.querySelector(".case-studies-link").classList.add("np-sub-navigation-content-item-inactive")
+  }
+  if (window.location.pathname == "/app/new-product-releases") {
+    document.querySelector(".new-products-link").classList.add("np-sub-navigation-content-item-active")
+  } else {
+    document.querySelector(".new-products-link").classList.add("np-sub-navigation-content-item-inactive")
+  }
+</script>

Custom_Templates/customer_templates/HackerRank Sandbox/_training_session_cta.html.liquid

@@ -1,33 +1,51 @@
+{% if training_session.approved? %}
+  <div class="np-training-session-cta-note">
+    <i class="far fa-check np-training-session-icon"></i>
+    {% t .registered %}
+  </div>
+{% elsif training_session.pending? %}
+  <div class="np-training-session-cta-note np-training-session-cta-note-error">
+    {% t .pending %}
+  </div>
+{% elsif training_session.denied? %}
+  <div class="np-training-session-cta-note np-training-session-cta-note-error">
+    {% t .denied %}
+  </div>
+{% elsif training_session.too_late? %}
+  <div class="np-training-session-cta-note np-training-session-cta-note-error">
+    {% t .too_late %}
+  </div>
+{% elsif training_session.no_seats? %}
+  <div class="np-training-session-cta-note np-training-session-cta-note-error">
+    {% t .no_seats %}
+  </div>
+{% endif %}
 <div class="np-training-session-cta">
   <div class="np-training-session-cta-buttons">
     <form
-      action="{{ training_session.cta.url }}"
+      action="{% route training_session_registration, id: training_session.id %}"
       method="post"
     >
       {% form_authenticity_token %}
 
-      {% if training_session.show_calendar_links? %}
+      {% if training_session.internal? and training_session.approved? %}
-        {% include "training_session_calendars" %}
+        {% if features.training_events_google_calendar? %}
-      {% endif %}
+          {% include "training_session_calendars" %}
+          <button type="submit" class="np-top-button np-button np-button-big np-button-secondary">
+            {% t .unregister %}
+          </button>
+        {% else %}
+          <button type="submit" class="np-top-button np-button-font-color np-button np-button-big">
+            {% t .unregister %}
+          </button>
+        {% endif %}
 
-      {% if training_session.cta.undo? %}
         <input type="hidden" name="_method" value="delete" />
       {% endif %}
 
-      {% if training_session.cta.label %}
+      {% if training_session.not_registered? %}
-        <button
+        <button type="submit" class="np-top-button np-button np-button-big">
-          type="submit"
+          {% t .register %}
-          class="
-            np-top-button
-            np-button
-            np-button-big
-
-            {% if training_session.show_calendar_links? %}
-              np-button-secondary
-            {% endif %}
-          "
-        >
-          {{ training_session.cta.label }}
         </button>
       {% endif %}
     </form>

Custom_Templates/customer_templates/HackerRank Sandbox/_training_session_date.html.liquid

@@ -1,16 +1,14 @@
 <div class="np-card-training-session-date">
   <div class="np-button-background-color np-card-training-session-date-bar"></div>
-  <div class="np-card-training-session-date-label">
+  <div class="np-card-training-session-date-day">
-    <div class="np-card-training-session-date-day">
+    {{ training_session.day }}
-      {{ training_session.day }}
+  </div>
+  <div>
+    <div class="np-card-training-session-date-month">
+      {{ training_session.month }}
     </div>
-    <div>
+    <div class="np-card-training-session-date-year">
-      <div class="np-card-training-session-date-month">
+      {{ training_session.year }}
-        {{ training_session.month }}
-      </div>
-      <div class="np-card-training-session-date-year">
-        {{ training_session.year }}
-      </div>
     </div>
   </div>
 </div>

Custom_Templates/customer_templates/HackerRank Sandbox/_training_session_desktop_view.html.liquid

@@ -1,43 +1,40 @@
 <div class="np-resource-header np-resource-header-card np-card-padding-large">
   {% include "training_session_header" %}
 </div>
-<div class="row np-training-session-row">
+<div class="row">
-  <div class="col-xs-12 col-sm-8">
+  <div class="col-xs-12 col-sm-7">
     <div class="np-card-container">
-      <div class="np-card-padding-large">
+      <div class="row">
-        <div>
+        <div class="col-xs-12 col-sm-5">
-          {% include "training_session_status" %}
-          {% include "training_session_date" %}
-        </div>
-        <div class="np-training-session-details">
           {% include "training_session_details" %}
+        </div>
+        <div class="col-xs-12 col-sm-7">
           {% include "training_session_cta" %}
         </div>
       </div>
-      <div class="np-card-content-divider"></div>
       <div class="np-card-padding-large">
-        {% include "training_session_description" %}
+        <div class="np-card-content-divider">
+          {% include "training_session_description" %}
+        </div>
       </div>
     </div>
   </div>
-  <div class="col-xs-12 col-sm-4 np-grid-spacing">
+  <div class="col-xs-12 col-sm-5 np-grid-spacing">
-    <div class="np-training-session-container">
+    <div class="np-training-session-sessions-title">
-        <div class="np-training-session-sessions-title">
+      {% t shared.more_sessions %}
-          {% t shared.more_sessions %}
-        </div>
-        {% if training_event.sessions.size > 1 %}
-          {% include "training_session_more_sessions" %}
-        {% else %}
-          <div class="np-training-session-zero-state">
-            <img
-              alt="{% t .empty %}"
-              class="np-zero-state-training-sessions"
-            />
-            <div class="np-training-session-zero-state-text">
-              {% t .empty %}
-            </div>
-          </div>
-        {% endif %}
     </div>
+    {% if training_event.sessions.size > 1 %}
+      {% include "training_session_more_sessions" %}
+    {% else %}
+      <div class="np-training-session-zero-state">
+        <img
+          alt="{% t .empty %}"
+          class="np-zero-state-training-sessions"
+        />
+        <div class="np-training-session-zero-state-text">
+          {% t .empty %}
+        </div>
+      </div>
+    {% endif %}
   </div>
 </div>

Custom_Templates/customer_templates/HackerRank Sandbox/_training_session_details.html.liquid

@@ -1,22 +1,23 @@
-<div class="np-training-session-info">
+<div class="np-card-spacing-large">
+  {% include "training_session_date" %}
 
   <div class="np-training-session-time">
     <i class="fal fa-clock np-button-color np-training-session-icon"></i>
-    <time>{{ training_session.time_period }} {{ training_session.time_zone }}</time>
+    {{ training_session.time_period }} {{ training_session.time_zone }}
   </div>
 
-  {% if training_session.approved? and training_session.location %}
+  {% if training_session.location %}
     <div class="np-training-session-location">
       <i class="fal fa-map-marker-alt np-button-color np-training-session-icon"></i>
-      {{ training_session.location }}
+      {% comment %} {{ training_session.location }} {% endcomment %}
     </div>
   {% endif %}
 
-  {% if training_session.approved? and training_session.session_url %}
+  {% if training_session.session_url %}
     <div class="np-training-session-location">
-      <i class="fal fa-map-marker-alt np-button-color np-training-session-icon"></i>
+     {% comment %} <i class="fal fa-map-marker-alt np-button-color np-training-session-icon"></i>
       <a href="{{ training_session.session_url }}" class="np-button-color" target="_blank" >
-        {{ training_session.session_url }}
+         {{ training_session.session_url }} {% endcomment %}
       </a>
     </div>
   {% endif %}

Custom_Templates/customer_templates/HackerRank Sandbox/_training_session_header.html.liquid

@@ -1,6 +1,6 @@
 <div class="np-top-vocabulary np-text-title">
   {% t shared.event_types, key: training_event.event_type %}
-  <i class="fal {{ training_event.event_type_icon }} np-button-color np-training-session-icon"></i>
+  <i class="fal fa-users-class np-button-color np-training-session-icon"></i>
 </div>
 <div class="np-top-title">
   <a href="{% route home %}" class="np-back-button" aria-label="{% t shared.go_back %}">

Custom_Templates/customer_templates/HackerRank Sandbox/_training_session_mobile_view.html.liquid

@@ -1,27 +1,22 @@
-<div class="np-training-session-view">
+<div class="np-card-container-training-session">
-  <div class="np-training-session-view-header">
+  <div class="np-card-spacing-large">
     {% include "training_session_header" %}
   </div>
-
+  {% include "training_session_details" %}
-  <div class="np-card-container np-training-session-view-details np-card-padding np-card-spacing">
+  <div class="np-card-padding-large">
-    {% include "training_session_status" %}
+    {% include "training_session_cta" %}
-    {% include "training_session_date" %}
-    {% include "training_session_details" %}
-    <div class="np-card-padding-large">
-      {% include "training_session_cta" %}
-    </div>
-    {% include "training_session_description" %}
   </div>
-
-  {% if training_event.sessions.size > 1 %}
-    <div class="np-card-spacing">
-      <div class="np-training-session-container">
-        <div class="np-training-session-sessions-title">
-          {% t shared.more_sessions %}
-        </div>
-        {% include "training_session_more_sessions" %}
-      </div>
-    </div>
-  {% endif %}
-
 </div>
+
+<div class="np-card-container np-card-padding np-card-spacing">
+  {% include "training_session_description" %}
+</div>
+
+{% if training_event.sessions.size > 1 %}
+  <div class="np-card-spacing">
+    <div class="np-training-session-sessions-title">
+      {% t shared.more_sessions %}
+    </div>
+    {% include "training_session_more_sessions" %}
+  </div>
+{% endif %}

Custom_Templates/customer_templates/HackerRank Sandbox/_training_session_status.html.liquid

@@ -1,6 +0,0 @@
-<div class="np-training-session-cta-note np-training-session-tile-badge np-training-session-tile-badge-{{ training_session.status.type }}">
-    {% if training_session.approved? %}
-        <i class="far fa-check np-training-session-icon"></i>
-    {% endif %}
-    {{ training_session.status.label }}
-</div>

Custom_Templates/customer_templates/HackerRank Sandbox/_training_session_tile.html.liquid

@@ -3,22 +3,15 @@
     class="np-training-session-tile"
     href="{% route training_session, id: session.id %}"
   >
-    <div class="np-training-session-tile-header">
+    <i class="far fa-calendar-star np-training-session-tile-icon"></i>
-        <i class="far fa-calendar-star np-training-session-tile-icon"></i>
+    <div>
-        <div class="np-training-session-tile-badge np-training-session-tile-badge-{{ session.status.type }}">
+      <div class="np-training-session-tile-date">
-            {{ session.status.label }}
+        {{ session.month }} {{ session.day }}, {{ session.year }}
-        </div>
+      </div>
-    </div>
+      <div class="np-training-session-tile-time">
-    <div class="np-training-session-tile-content">
+        {{ session.time_period }} {{ session.time_zone }}
-      <div>
-          <div class="np-training-session-tile-date">
-              {{ session.month }} {{ session.day }}, {{ session.year }}
-          </div>
-          <div class="np-training-session-tile-time">
-              {{ session.time_period }} {{ session.time_zone }}
-          </div>
       </div>
-      <i class="fas fa-arrow-right np-training-session-tile-chevron"></i>
     </div>
+    <i class="fas fa-chevron-right np-training-session-tile-chevron"></i>
   </a>
 {% endif %}

Custom_Templates/customer_templates/HackerRank Sandbox/account.html.liquid

@@ -1,5 +1,4 @@
 {% include "header" %}
-{% include "account_tabs" %}
 
 <main class="np-main np-subpage-container np-account">
   <div class="np-hidden-desktop">

Custom_Templates/customer_templates/HackerRank Sandbox/auth_url_email.html.liquid

@@ -8,7 +8,8 @@
           {% t shared.welcome_to_school, school_name: current_school.name %}
         </div>
         <div class="np-form-subheadline">
-          {% t .headline, key: current_school.course_vocabulary %}
+          {% comment %} {% t .headline, key: current_school.course_vocabulary %} {% endcomment %}
+          To access the HackerRank Academy, simply enter your first name, last name, and work email address below.
         </div>
         <div class="np-form-field">
           <label class="np-input-label" for="learner_first_name">
@@ -37,7 +38,7 @@
         </div>
         <div class="np-form-field">
           <label class="np-input-label" for="learner_email">
-            {% t shared.email_address %}
+            Work {% t shared.email_address %}
           </label>
           <input
             class="np-input"
@@ -57,3 +58,9 @@
     </div>
   </div>
 </main>
+
+<script>
+  if (document.querySelector('.np-alert-wrapper > div').textContent.includes('You need to log in or sign up before continuing.')) {
+    document.querySelector('.np-alert').style.display = 'none';
+  }
+</script>

Custom_Templates/customer_templates/HackerRank Sandbox/case-studies.html.liquid

@@ -0,0 +1,193 @@
+{% include "header" %}
+{% include "course_version_outdated_alert", courses: courses.featured %}
+<main class="np-main np-homepage">
+  {% include "sub_navigation" %}
+  <div class="np-homepage-featured np-max-width custom-page-main-content">
+    <div class="custom-page-filter-bars">
+      <div>
+		<h1>{{ custom_page.headline }}</h1>
+        <div class="custom-page-label">
+		  {{ custom_page.subheadline }}
+        </div>
+      </div>
+    </div>
+
+    {% if courses.in_catalog.any? %}
+      <div class="catalog-courses">
+		{% for course in courses.in_catalog %}
+		  {% for category in course.categories %}
+            {% if category.name == 'Case Studies' %}
+			  <div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
+                {% include "cards_course" with course %}
+              </div>
+            {% endif %}
+          {% endfor %}
+		{% endfor %}
+      </div>
+	{% else %}
+      <div class="np-homepage-featured-empty">
+        <div class="np-zero-state-text">
+          {% t .empty, key: current_school.course_vocabulary %}
+        </div>
+        <img
+          class="np-zero-state-courses"
+          alt="{% t .empty, key: current_school.course_vocabulary %}"
+        />
+      </div>
+  {% endif %}
+  </div>
+</main>
+{% include "footer" %}
+
+<style>
+  .custom-page-top-info-bar{
+    align-items: center;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    padding: 0 5%;
+  }
+
+  .custom-page-nametag h4{
+    color: #016aab;
+  }
+
+  .custom-page-profile-button{
+    border: 1px solid #016aab;
+    border-radius: 8px;
+    color: #016aab;
+    padding: 10px 25px;
+    text-decoration: none;
+  }
+
+  .custom-page-main-content{
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    padding: 0 5%;
+    width: 100%;
+  }
+
+  .custom-page-label{
+    font-size: 18px;
+    margin-bottom: 40px;
+  }
+
+  .custom-page-filter-bars{
+    display: flex;
+    flex-direction: column;
+    margin-bottom: 50px;
+  }
+
+  .custom-page-content-search{
+    max-width: unset;
+  }
+
+  .np-filter{
+    margin: 0;
+  }
+
+  .custom-page-content-filter .np-input{
+    margin-top: 20px;
+    padding: 10px 12px;
+  }
+
+  .custom-page-content-filter .dropdown{
+    width: 100%;
+  }
+
+  .custom-page-courses{
+    display: flex;
+    flex-direction: column;
+    padding: 0 5%;
+    width: 100%;
+  }
+
+  .custom-page-courses .np-card{
+    padding: 0;
+  }
+
+  .custom-page-courses .np-card-container{
+    display: flex;
+    flex-direction: row;
+  }
+
+  .custom-page-courses .np-card-image{
+    border-radius: 0;
+    border-top-left-radius: 4px;
+    border-bottom-left-radius: 4px;
+    max-width: 20%;
+  }
+
+  .custom-page-courses .np-card-content{
+    display: flex;
+    flex-direction: column;
+    padding: 5px;
+  }
+
+  .custom-page-courses .np-card-info{
+    display: flex;
+    flex-direction: column;
+  }
+
+  .custom-page-courses .np-card-content-progress-and-cta{
+    display: flex;
+    width: 100%;
+    height: 100%;
+    align-items: center;
+    flex-direction: row;
+    justify-content: flex-end;
+  }
+
+  .custom-page-courses .np-card-content-progress{
+    display: flex;
+    flex-direction: column;
+  }
+
+  @media screen and (min-width: 768px){
+    .custom-page-main-content{
+      margin-top: 0;
+    }
+
+    .custom-page-filter-bars{
+      align-items: center;
+      flex-direction: row;
+      justify-content: space-between;
+    }
+
+    .custom-page-courses .np-card-content{
+      align-items: center;
+      flex-direction: row;
+      padding: 10px 35px;
+    }
+
+    .custom-page-courses .np-card-info{
+      max-width: 80%;
+    }
+
+    .custom-page-courses .np-card-content-title{
+      margin: 0;
+      margin-bottom: 8px;
+    }
+
+    .custom-page-courses .np-card-content-progress-and-cta{
+      align-items: center;
+      flex-direction: row;
+      height: 100%;
+      width: 100%;
+    }
+
+    .custom-page-courses .np-card-content-progress{
+      align-items: flex-start;
+      height: 100%;
+      justify-content: center;
+      padding-right: 25px;
+      width: 60%;
+    }
+
+    .custom-page-courses .np-card-content-progress-and-cta .np-button{
+      width: 40%;
+    }
+  }
+</style>
+

Custom_Templates/customer_templates/HackerRank Sandbox/catalog.html.liquid

@@ -21,3 +21,43 @@
   {% include "courses_catalog" %}
 </main>
 {% include "footer" %}
+
+<script>
+  function clickDropdownMenu() {
+    const dropdownMenu = document.getElementsByClassName('dropdown-menu')[0]
+
+    const event = new MouseEvent('click', {
+      view: window,
+      bubbles: true,
+      cancelable: true
+    });
+
+    dropdownMenu.dispatchEvent(event);
+    console.log('clicked')
+  }
+
+
+
+
+  window.addEventListener('DOMContentLoaded', () => {
+    const choices = document.querySelectorAll('.choices__item.choices__item--choice.choices__item--selectable')
+
+    const targetNode = document.getElementsByClassName('choices__list')[2];
+    const config = { attributes: true, childList: true, subtree: true };
+    const callback = (mutationList, observer) => {
+      var updated_choices = document.querySelectorAll('.choices__item.choices__item--choice.choices__item--selectable')
+      for (const mutation of mutationList) {
+        Array.from(updated_choices).forEach((choice) => {
+          choice.addEventListener("mousedown", clickDropdownMenu);
+        })
+      }
+    };
+    const observer = new MutationObserver(callback);
+
+    Array.from(choices).forEach((choice) => {
+      choice.addEventListener("mousedown", clickDropdownMenu);
+    })
+    observer.observe(targetNode, config);
+  });
+
+</script>

Custom_Templates/customer_templates/HackerRank Sandbox/course.html.liquid

@@ -1,4 +1,18 @@
-{% include "header" %}
+
+ {% if course.enrolled? %}
+    <script>
+      window.location.replace('{% route course_viewer, course_id: course.id, learning_path_id: params.learning_path_id %}')
+    </script>
+      
+  {% else %}
+    <script>
+
+      window.location.replace('{% route course_enrollment, code: course.enrollment_code %}')
+    </script>
+
+  {% endif %}
+
+{% comment %} {% include "header" %}
 <main class="np-main np-max-width np-page-container">
   <div class="np-hidden-mobile" id="course-desktop">
     {% include "course_desktop_view" %}
@@ -7,4 +21,4 @@
     {% include "course_mobile_view" %}
   </div>
 </main>
-{% include "footer" %}
+{% include "footer" %} {% endcomment %}

Custom_Templates/customer_templates/HackerRank Sandbox/homepage.html.liquid

@@ -28,25 +28,20 @@
         {{ homepage.featured_courses_subheadline }}
       </div>
     </div>
-    {% if courses.featured.any? %}
+    
-      <div class="np-homepage-featured-courses row">
+    {% if learning_paths.available.any? %}
-        {% for course in courses.featured %}
+    <div class="np-learning-paths-resources">
-          <div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
+        {% for learning_path in learning_paths.available %}
-            {% include "cards_course" with course %}
+          {% if learning_path.name == 'HackerRank Screen (Self-Guided Learning Path)' or learning_path.name == 'HackerRank Interview (Self-Guided Learning Path)' %}
-          </div>
+            {% include "cards_learning_path" with learning_path %}
+          {% endif %}
+          {% if learning_path.name == 'HackerRank Company Admin' %}
+            {% include "cards_learning_path" with learning_path %}
+          {% endif %}
         {% endfor %}
       </div>
-    {% else %}
-      <div class="np-homepage-featured-empty">
-        <div class="np-zero-state-text">
-					Hi there, James! No courses for you.
-        </div>
-        <img
-          class="np-zero-state-courses"
-          alt="{% t .empty, key: current_school.course_vocabulary %}"
-        />
-      </div>
     {% endif %}
+
   </div>
 </main>
 {% include "footer" %}

Custom_Templates/customer_templates/HackerRank Sandbox/new-product-releases.html.liquid

@@ -0,0 +1,193 @@
+{% include "header" %}
+{% include "course_version_outdated_alert", courses: courses.featured %}
+<main class="np-main np-homepage">
+  {% include "sub_navigation" %}
+  <div class="np-homepage-featured np-max-width custom-page-main-content">
+    <div class="custom-page-filter-bars">
+      <div>
+		<h1>{{ custom_page.headline }}</h1>
+        <div class="custom-page-label">
+		  {{ custom_page.subheadline }}
+        </div>
+      </div>
+    </div>
+
+    {% if courses.in_catalog.any? %}
+      <div class="catalog-courses">
+		{% for course in courses.in_catalog %}
+		  {% for category in course.categories %}
+            {% if category.id == '37ebf83e-69fb-4b12-ae98-e1be1ecd3342' %}
+			  <div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
+                {% include "cards_course" with course %}
+              </div>
+            {% endif %}
+          {% endfor %}
+		{% endfor %}
+      </div>
+	{% else %}
+      <div class="np-homepage-featured-empty">
+        <div class="np-zero-state-text">
+          {% t .empty, key: current_school.course_vocabulary %}
+        </div>
+        <img
+          class="np-zero-state-courses"
+          alt="{% t .empty, key: current_school.course_vocabulary %}"
+        />
+      </div>
+  {% endif %}
+  </div>
+</main>
+{% include "footer" %}
+
+<style>
+  .custom-page-top-info-bar{
+    align-items: center;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    padding: 0 5%;
+  }
+
+  .custom-page-nametag h4{
+    color: #016aab;
+  }
+
+  .custom-page-profile-button{
+    border: 1px solid #016aab;
+    border-radius: 8px;
+    color: #016aab;
+    padding: 10px 25px;
+    text-decoration: none;
+  }
+
+  .custom-page-main-content{
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    padding: 0 5%;
+    width: 100%;
+  }
+
+  .custom-page-label{
+    font-size: 18px;
+    margin-bottom: 40px;
+  }
+
+  .custom-page-filter-bars{
+    display: flex;
+    flex-direction: column;
+    margin-bottom: 50px;
+  }
+
+  .custom-page-content-search{
+    max-width: unset;
+  }
+
+  .np-filter{
+    margin: 0;
+  }
+
+  .custom-page-content-filter .np-input{
+    margin-top: 20px;
+    padding: 10px 12px;
+  }
+
+  .custom-page-content-filter .dropdown{
+    width: 100%;
+  }
+
+  .custom-page-courses{
+    display: flex;
+    flex-direction: column;
+    padding: 0 5%;
+    width: 100%;
+  }
+
+  .custom-page-courses .np-card{
+    padding: 0;
+  }
+
+  .custom-page-courses .np-card-container{
+    display: flex;
+    flex-direction: row;
+  }
+
+  .custom-page-courses .np-card-image{
+    border-radius: 0;
+    border-top-left-radius: 4px;
+    border-bottom-left-radius: 4px;
+    max-width: 20%;
+  }
+
+  .custom-page-courses .np-card-content{
+    display: flex;
+    flex-direction: column;
+    padding: 5px;
+  }
+
+  .custom-page-courses .np-card-info{
+    display: flex;
+    flex-direction: column;
+  }
+
+  .custom-page-courses .np-card-content-progress-and-cta{
+    display: flex;
+    width: 100%;
+    height: 100%;
+    align-items: center;
+    flex-direction: row;
+    justify-content: flex-end;
+  }
+
+  .custom-page-courses .np-card-content-progress{
+    display: flex;
+    flex-direction: column;
+  }
+
+  @media screen and (min-width: 768px){
+    .custom-page-main-content{
+      margin-top: 0;
+    }
+
+    .custom-page-filter-bars{
+      align-items: center;
+      flex-direction: row;
+      justify-content: space-between;
+    }
+
+    .custom-page-courses .np-card-content{
+      align-items: center;
+      flex-direction: row;
+      padding: 10px 35px;
+    }
+
+    .custom-page-courses .np-card-info{
+      max-width: 80%;
+    }
+
+    .custom-page-courses .np-card-content-title{
+      margin: 0;
+      margin-bottom: 8px;
+    }
+
+    .custom-page-courses .np-card-content-progress-and-cta{
+      align-items: center;
+      flex-direction: row;
+      height: 100%;
+      width: 100%;
+    }
+
+    .custom-page-courses .np-card-content-progress{
+      align-items: flex-start;
+      height: 100%;
+      justify-content: center;
+      padding-right: 25px;
+      width: 60%;
+    }
+
+    .custom-page-courses .np-card-content-progress-and-cta .np-button{
+      width: 40%;
+    }
+  }
+</style>
+

Custom_Templates/customer_templates/HackerRank Sandbox/training_events.html.liquid

@@ -4,10 +4,10 @@
   <div class="row">
     <div class="col-xs-12 col-sm-10">
       <div class="np-resource-title">
-        {% t .title %}
+	Live Training Webinars
       </div>
       <div class="np-resource-subtitle">
-        {% t .subtitle %}
+	View and register for upcoming online webinars
       </div>
     </div>
     <div class="col-xs-12 col-sm-2">

Custom_Templates/customer_templates/HackerRank Sandbox/training_session_attendance.html.liquid

@@ -2,7 +2,7 @@
 <main class="np-main np-cta-page np-max-width np-subpage-container">
   <div class="np-card-container np-card-padding-xlarge">
     {% if token %}
-      <i class="np-cta-page-icon fal {{ training_event.event_type_icon }}"></i>
+      <i class="np-cta-page-icon fal fa-users-class"></i>
       <div class="np-form-headline">
         {{ training_session.title }}
       </div>

Custom_Templates/customer_templates/HackerRank Sandbox/transcript.html.liquid

@@ -1,8 +0,0 @@
-{% include "header" %}
-{% include "account_tabs" %}
-
-<main class="np-main np-subpage-container np-transcript">
-  {% transcript %}
-</main>
-
-{% include "footer" %}

Custom_Templates/customer_templates/WSGC - Post-New Hire/_cards_course.html.liquid

@@ -32,4 +32,4 @@
       </div>
     </div>
   </div>
-</div>
+</div>

Custom_Templates/customer_templates/WSGC - Post-New Hire/_courses_index.html.liquid

@@ -1,17 +1,19 @@
 {% if courses.enrolled.any? %}
   <div class="row row-with-thumbnails">
     {% for course in courses.enrolled %}
+			{% comment %}
       {% assign category_ids = '' %}
       {% for category in course.categories %}
         {% assign category_ids = category_ids | append: category.id | append: '~' %}
       {% endfor %}
+			{% endcomment %}
       {% assign progress_label = 'not-started' %}
       {% if course.progress > 0 and course.progress < 100 %}
         {% assign progress_label = 'in-progress' %}
       {% elsif course.progress == 100 %}
         {% assign progress_label = 'completed' %}
       {% endif %}
-      <div class="{{ class }} filterable-course" data-filter="{{category_ids}}{{progress_label}}">
+      <div class="{{ class }} filterable-course" data-filter="{{progress_label}}">
         {% include "cards_course" with course %}
       </div>
     {% endfor %}
@@ -24,4 +26,4 @@
   {% endcapture %}
   {% include "courses_zero_state"
     , message: message %}
-{% endif %}
+{% endif %}

Custom_Templates/customer_templates/WSGC - Post-New Hire/_courses_zero_state.html.liquid

@@ -1,6 +1,6 @@
 <div class="np-dashboard-resources-container">
   <div class="np-zero-state-text">
-    {{ message }}
+    You don't have any Courses assigned to you.
   </div>
   <img class="np-zero-state-courses" alt="{{ message }}" />
 </div>

Custom_Templates/customer_templates/WSGC - Post-New Hire/_dashboard_filters.html.liquid

@@ -4,9 +4,11 @@
       <div class="dashboard-filter-button active" data-category="all">ALL COURSES</div>
       <div class="dashboard-filter-button" data-category="in-progress">IN PROGRESS</div>
       <div class="dashboard-filter-button" data-category="completed">COMPLETED</div>
+			{% comment %}
       {% for category in categories.enrolled %}
         <div class="dashboard-filter-button" data-category="{{ category.id }}">{{ category.name | upcase }}</div>
-      {% endfor %}
+			{% endfor %}
+			{% endcomment %}
     </div>
   </div>
 </div>
@@ -32,4 +34,4 @@
     background-color: #a0874e;
     color: #fff;
   }
-</style>
+</style>

Custom_Templates/customer_templates/WSGC - Post-New Hire/_featured_courses.html.liquid

@@ -1,5 +1,4 @@
-{% for course in courses.in_catalog %}
+{% for course in courses.enrolled %}
-	{% comment %} Change to courses.enrolled {%endcomment%}
 	{% for category in course.categories %}
 		{% if category.name contains "Featured Courses" %}
 			<div class="np-card" style="width:100%">

Custom_Templates/customer_templates/WSGC - Post-New Hire/_footer.html.liquid

@@ -4,7 +4,7 @@
       <div class="np-footer-navigation">
         <ul class="np-footer-navigation-list">
           {% for website_navigation in navigations.footer_navigations %}
-            {% unless website_navigation.name == "Dashboard" %}
+            {% unless website_navigation.name == "Dashboard" or website_navigation.name == "Learning Paths" %}
               <li class="np-footer-navigation-item">
                 <a
                   class="np-footer-navigation-link np-button-color"
@@ -73,4 +73,4 @@
       </div>
     {% endif %}
   </div>
-</footer>
+</footer>

Custom_Templates/customer_templates/WSGC - Post-New Hire/_learning_paths_index.html.liquid

@@ -6,7 +6,7 @@
   {% else %}
     <div class="np-learning-paths-resources-container">
       <div class="np-zero-state-text">
-        {% t .empty %}
+        You're not assigned any Learning Paths.
       </div>
       <img class="np-zero-state-learning-paths" alt="{% t .empty %}" />
     </div>

Custom_Templates/customer_templates/WSGC - Post-New Hire/_sub_navigation.html.liquid

@@ -1,14 +1,23 @@
 <nav class="np-sub-navigation">
   <div class="np-sub-navigation-content">
     {% for link in navigations.sub_navigation %}
-      {% unless link.label == "Dashboard" %}
+			{% unless link.label == "Dashboard" %}
+			{% if link.label == "Catalog" %}
+        <div class="np-sub-navigation-content-item {{ link.active_class }}">
+          <a class="np-sub-navigation-content-item-link" href="{{ link.url }}">
+            WSIU
+          </a>
+          <div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
+				</div>
+			{% else %}
         <div class="np-sub-navigation-content-item {{ link.active_class }}">
           <a class="np-sub-navigation-content-item-link" href="{{ link.url }}">
             {{ link.label }}
           </a>
           <div class="np-sub-navigation-content-item-bar np-button-background-color"></div>
         </div>
-      {% endunless %}
+			{% endif %}
+				{% endunless %}
     {% endfor %}
   </div>
 </nav>
@@ -27,4 +36,4 @@
   .np-sub-navigation-content-item-link.active {
     font-weight: 500;
   }
-</style>
+</style>

Todos.md

@@ -428,11 +428,12 @@ Nextweek deadline
 Run lighthouse on anthology templates and find list of things that need to be improved
 
 ## 10-08-2024
-- [ ] WSGC - Add logic for [IC] in group name
+- [X] WSGC - Add logic for [IC] in group name
-- [ ] WSGC - Change holiday course from catalog to enrolled
+- [X] WSGC - Change holiday course from catalog to enrolled
 - [ ] WSGC - Test iFrame (check Gong recordings)
 - [X] Luminate - Search results in Canada not working
 - [X] Spark - Enable search functionality
 - [X] DataSnipper - Figure out logic for filters function
 
+- [X] WSGC - Remove Learning Paths from Footer in post-new hire
 - [ ] Cin7 - Change the employee catalog filters to allow for other categories in a section called "Other"