Tons of Solutions Engineering work done today for the rest of the CS team! Headway, Howard Hanna, Engels, Brighton, etc. Also completed Datasnippers auth flow and worked on Anthology's script. Cloned Anthology's courses (900..) and will clone Full Story on Monday.

2024-01-05 17:07:59 -05:00
parent ce261975ca
commit a5fe4bd2c8
3157 changed files with 554269 additions and 16 deletions
--- a/Custom_Templates/customer_templates/Headway/_widget_achievements.html.liquid
+++ b/Custom_Templates/customer_templates/Headway/_widget_achievements.html.liquid
@ -0,0 +1,128 @@
+{% comment %} 
+  For this widget to work you must import Slick CSS and JS  
+{% endcomment %}
+
+{% assign courseCompletedCouter = 0 %}
+{% for course in courses.enrolled %}
+  {% if course.progress == 100 %}
+    {% assign courseCompletedCouter = courseCompletedCouter | plus: 1 %}
+  {% endif %}
+{% endfor %}
+<div class="achievements-box" style="{% if courseCompletedCouter > 0%}display: block !important;{% endif %}">
+  <div class="np-dashboard-resources-title">Recent achievements</div>
+  <div class="np-dashboard-resources">
+    <div class="np-card">
+      <div class="np-card-container np-dashboard-border">
+        {% if courses.enrolled.any? %}
+          <div class="np-card-content-achievements">
+            <div class="achievements-carousel">
+              {% for course in courses.enrolled %}
+                {% if course.progress == 100 %}
+                  <div>
+                    <div class="np-card-content-title col-12">
+                      {{ course.name }}
+                    </div>
+                    <div class="col-12 ">
+                        <img class="np-achievement-icon" src="{{ course.properties.badge }}" />
+                    </div>             
+                  </div>
+                {% endif %}
+              {% endfor %}
+            </div>
+          </div>
+        {% else %}
+          {% capture message %}
+            {% t shared.zero_state.courses.index,
+              key: current_school.course_vocabulary
+            %}
+          {% endcapture %}
+          {% include "courses_zero_state", message: message %}
+        {% endif %}
+      </div>
+    </div>
+  </div>
+</div>
+
+<script type="text/javascript">
+    document.addEventListener("DOMContentLoaded", function() {
+        $('.achievements-carousel').slick({
+            slidesToShow: 1,
+            slidesToScroll: 1,
+            dots: false,
+            infinite: true,
+            autoplay: false,
+            autoplaySpeed: 5000,
+            cssEase: 'linear',
+            prevArrow: '<i class="fal fa-chevron-left"></i>',
+            nextArrow: '<i class="fal fa-chevron-right"></i>',
+            responsive: [{
+                breakpoint: 991,
+                settings: {
+
+                    dots: false
+                }
+            }]
+        })
+    });
+</script>
+
+<style>
+  .achievements-carousel{
+    text-align: center;
+  }
+
+  .np-card-content-achievements .np-card-content-title {
+    font-size: 0.937rem;
+    text-align:center;
+    font-weight:500;
+  }
+
+  .np-achievement-icon {
+    color: #bec2c6;
+    margin:14px auto 26px;
+    width:130px;
+  }
+
+  .np-card-content-achievements .slick-slider {
+    width:100%;
+    max-width: 375px;
+    margin: auto;
+  }
+
+  .np-view-all-achievements {
+    color:#2BB24C;
+    font-size:0.75rem;
+    text-transform:uppercase;
+    text-align:center;
+    text-decoration:none;
+    margin-bottom:1.5rem;
+  }
+
+  .np-card-content-achievements {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    padding: 2rem 2rem .5rem;
+  }
+
+  .slick-arrow {
+    opacity: 0.5;
+    font-size: 1.5rem;
+    position: absolute;
+    height: 100%;
+    top: 50%;
+    cursor:pointer;
+    z-index: 10;
+  }
+
+  .slick-arrow.fa-chevron-left { left:0 }
+  .slick-arrow.fa-chevron-right { right:0; }
+
+  @media (min-width:1024px) {
+    .np-card-content-achievements .slick-slider {
+      max-width: none;
+      margin: 0;
+    }
+  }
+
+</style>