From 041157a85f3961cf82027b70212d35cdadc7e420 Mon Sep 17 00:00:00 2001
From: Jannat Patel <pateljannat2308@gmail.com>
Date: Tue, 28 Jun 2022 18:00:53 +0530
Subject: [PATCH 1/2] fix: subtitle field for testimonial and course cards

---
 .../course_cards/course_cards.html            |  3 +++
 .../course_cards/course_cards.json            | 14 +++++++----
 .../multiple_testimonials.html                | 24 ++++++++++++-------
 .../multiple_testimonials.json                |  8 ++++++-
 4 files changed, 35 insertions(+), 14 deletions(-)

diff --git a/lms/lms/web_template/course_cards/course_cards.html b/lms/lms/web_template/course_cards/course_cards.html
index cb532555..73749156 100644
--- a/lms/lms/web_template/course_cards/course_cards.html
+++ b/lms/lms/web_template/course_cards/course_cards.html
@@ -1,6 +1,9 @@
 <div>
     {% include "public/icons/symbol-defs.svg" %}
     <h2 class="section-title">{{ _(title) }}</h2>
+    {% if subtitle %}
+    <p> {{ _(subtitle) }} </p>
+    {% endif %}
     <div class="cards-parent mt-10">
         {% for course_row in courses %}
         {% set course = frappe.db.get_value("LMS Course", course_row.course,
diff --git a/lms/lms/web_template/course_cards/course_cards.json b/lms/lms/web_template/course_cards/course_cards.json
index 8d58dcd9..fd9c696e 100644
--- a/lms/lms/web_template/course_cards/course_cards.json
+++ b/lms/lms/web_template/course_cards/course_cards.json
@@ -5,21 +5,25 @@
  "doctype": "Web Template",
  "fields": [
   {
-   "__unsaved": 1,
    "fieldname": "title",
    "fieldtype": "Data",
    "label": "Title",
-   "reqd": 0
+   "reqd": 1
   },
   {
    "__unsaved": 1,
+   "fieldname": "subtitle",
+   "fieldtype": "Small Text",
+   "label": "Subtitle",
+   "reqd": 0
+  },
+  {
    "fieldname": "courses",
    "fieldtype": "Table Break",
    "label": "Courses",
    "reqd": 0
   },
   {
-   "__unsaved": 1,
    "fieldname": "course",
    "fieldtype": "Link",
    "label": "Course",
@@ -27,8 +31,8 @@
    "reqd": 0
   }
  ],
- "idx": 0,
- "modified": "2021-08-26 10:35:35.903834",
+ "idx": 2,
+ "modified": "2022-06-28 17:15:55.981008",
  "modified_by": "Administrator",
  "module": "LMS",
  "name": "Course Cards",
diff --git a/lms/lms/web_template/multiple_testimonials/multiple_testimonials.html b/lms/lms/web_template/multiple_testimonials/multiple_testimonials.html
index b316f910..db408d92 100644
--- a/lms/lms/web_template/multiple_testimonials/multiple_testimonials.html
+++ b/lms/lms/web_template/multiple_testimonials/multiple_testimonials.html
@@ -1,17 +1,25 @@
-<h3 class="section-title text-center mb-10">{{ _(title) }}</h3>
-<div id="carouselExampleControls" class="carousel slide" data-ride="carousel" data-interval="5000">
+<div class="text-center mb-10">
+    <h3 class="section-title">{{ _(title) }}</h3>
+    {% if subtitle %}
+    <p class="section-subtitle"> {{ _(subtitle) }} </p>
+    {% endif %}
+</div>
+<!-- data-ride="carousel" data-interval="5000" -->
+<div id="carouselExampleControls" class="carousel slide">
     <div class="carousel-inner">
 
         {% for testimonial_row in testimonials_table %}
         {% set review = frappe.db.get_value("LMS Course Review", testimonial_row.testimonials, ["owner", "review"], as_dict=True) %}
         {% set member = frappe.db.get_value("User", review.owner, ["name", "username", "full_name", "user_image", "headline"], as_dict=True) %}
         <div class="testimonial carousel-item {% if loop.index == 1 %} active {% endif %} ">
-            {{ widgets.Avatar(member=member, avatar_class="avatar-large") }}
-            <div class="testimonial-content">
-                “{{ review.review }}”
-            </div>
-            <div class="testimonial-by">
-                {{ member.full_name }}
+            <div class="common-card-style p-10" style="width: 70%; margin: 0 auto;">
+                {{ widgets.Avatar(member=member, avatar_class="avatar-large") }}
+                <div class="ml-10">
+                    <div class="">“{{ review.review }}”</div>
+                    <div class="mt-2">
+                        - {{ member.full_name }}
+                    </div>
+                </div>
             </div>
         </div>
         {% endfor %}
diff --git a/lms/lms/web_template/multiple_testimonials/multiple_testimonials.json b/lms/lms/web_template/multiple_testimonials/multiple_testimonials.json
index a0ef204b..6d989328 100644
--- a/lms/lms/web_template/multiple_testimonials/multiple_testimonials.json
+++ b/lms/lms/web_template/multiple_testimonials/multiple_testimonials.json
@@ -8,6 +8,12 @@
    "fieldname": "title",
    "fieldtype": "Data",
    "label": "Title",
+   "reqd": 1
+  },
+  {
+   "fieldname": "subtitle",
+   "fieldtype": "Small Text",
+   "label": "Subtitle",
    "reqd": 0
   },
   {
@@ -25,7 +31,7 @@
   }
  ],
  "idx": 1,
- "modified": "2022-03-21 11:52:27.728610",
+ "modified": "2022-06-28 17:16:39.614879",
  "modified_by": "Administrator",
  "module": "LMS",
  "name": "Multiple Testimonials",

From c9a6c2948e417aa159eaf4298692e26865255140 Mon Sep 17 00:00:00 2001
From: Jannat Patel <pateljannat2308@gmail.com>
Date: Wed, 29 Jun 2022 16:05:18 +0530
Subject: [PATCH 2/2] fix: new design for testimonial cards

---
 .../course_cards/course_cards.html            |  2 +-
 .../multiple_testimonials.html                | 49 ++++++++++++-------
 lms/public/css/style.css                      | 13 +++--
 lms/public/icons/symbol-defs.svg              |  4 ++
 4 files changed, 47 insertions(+), 21 deletions(-)

diff --git a/lms/lms/web_template/course_cards/course_cards.html b/lms/lms/web_template/course_cards/course_cards.html
index 73749156..776da9ea 100644
--- a/lms/lms/web_template/course_cards/course_cards.html
+++ b/lms/lms/web_template/course_cards/course_cards.html
@@ -1,6 +1,6 @@
 <div>
     {% include "public/icons/symbol-defs.svg" %}
-    <h2 class="section-title">{{ _(title) }}</h2>
+    <h3 class="section-title">{{ _(title) }}</h3>
     {% if subtitle %}
     <p> {{ _(subtitle) }} </p>
     {% endif %}
diff --git a/lms/lms/web_template/multiple_testimonials/multiple_testimonials.html b/lms/lms/web_template/multiple_testimonials/multiple_testimonials.html
index db408d92..da6d6faa 100644
--- a/lms/lms/web_template/multiple_testimonials/multiple_testimonials.html
+++ b/lms/lms/web_template/multiple_testimonials/multiple_testimonials.html
@@ -11,25 +11,40 @@
         {% for testimonial_row in testimonials_table %}
         {% set review = frappe.db.get_value("LMS Course Review", testimonial_row.testimonials, ["owner", "review"], as_dict=True) %}
         {% set member = frappe.db.get_value("User", review.owner, ["name", "username", "full_name", "user_image", "headline"], as_dict=True) %}
-        <div class="testimonial carousel-item {% if loop.index == 1 %} active {% endif %} ">
-            <div class="common-card-style p-10" style="width: 70%; margin: 0 auto;">
-                {{ widgets.Avatar(member=member, avatar_class="avatar-large") }}
-                <div class="ml-10">
-                    <div class="">“{{ review.review }}”</div>
-                    <div class="mt-2">
-                        - {{ member.full_name }}
-                    </div>
-                </div>
+        {% if loop.index % 3 == 1 %}
+        <div class="carousel-item {% if loop.index == 1 %} active {% endif %}"> <div class="cards-parent">
+        {% endif %}
+        <div class="common-card-style testimonial-card">
+            <svg class="icon icon-xl">
+                <use href="#icon-quote"></use>
+            </svg>
+            <div class="testimonial-review">
+                {{ review.review }}
             </div>
+            <div class="testimonial-footer">
+                <div>
+                  {{ widgets.Avatar(member=member, avatar_class="avatar-medium") }}
+                </div>
+                <div class="ml-3">
+                  <div class="testimonial-author-name" >{{ member.full_name }}</div>
+                  {% if member.headline %}<div class="testimonial-profession">{{ member.headline }}</div> {% endif %}
+                </div>
+              </div>
         </div>
+        {% if loop.index % 3 == 0 or loop.index == testimonials_table | length %} </div> </div> {% endif %}
         {% endfor %}
+        </div>
+
+        {% if testimonials_table | length > 3 %}
+            <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
+                <span class="carousel-control-prev-icon" aria-hidden="true"></span>
+                <span class="sr-only">Previous</span>
+              </a>
+              <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
+                <span class="carousel-control-next-icon" aria-hidden="true"></span>
+                <span class="sr-only">Next</span>
+              </a>
+        {% endif %}
     </div>
-    <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
-      <span class="carousel-control-prev-icon" aria-hidden="true"></span>
-      <span class="sr-only">Previous</span>
-    </a>
-    <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
-      <span class="carousel-control-next-icon" aria-hidden="true"></span>
-      <span class="sr-only">Next</span>
-    </a>
+
 </div>
diff --git a/lms/public/css/style.css b/lms/public/css/style.css
index d376a2ad..63bfd1f5 100644
--- a/lms/public/css/style.css
+++ b/lms/public/css/style.css
@@ -945,8 +945,7 @@ pre {
 
 .testimonial-card {
   flex-direction: column;
-  justify-content: space-between;
-  padding: 1rem;
+  padding: 2rem;
   height: 100%;
 }
 
@@ -961,6 +960,14 @@ pre {
   margin-bottom: 2rem;
 }
 
+.testimonial-footer {
+    display: flex;
+    align-items: center;
+    border-top: 1px solid var(--gray-200);
+    padding-top: 2rem;
+    margin-top: auto;
+}
+
 .testimonial-profession {
   font-size: 0.625rem;
 }
@@ -986,7 +993,7 @@ pre {
 
 .carousel-control-prev, .carousel-control-next {
   width: auto;
-  top: 30%;
+  top: 40%;
   height: fit-content;
   background: white;
   border-radius: 50%;
diff --git a/lms/public/icons/symbol-defs.svg b/lms/public/icons/symbol-defs.svg
index 25b54d1e..17af9ab2 100644
--- a/lms/public/icons/symbol-defs.svg
+++ b/lms/public/icons/symbol-defs.svg
@@ -60,4 +60,8 @@
         <circle cx="12" cy="8" r="7"></circle>
         <polyline points="8.21 13.89 7 23 12 20 17 23 15.79 13.88"></polyline>
     </svg>
+    <svg width="40" height="40" id="icon-quote" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <path d="M27.8837 15.1677V15.6677H28.3837H34.6997V29.4519H22.3877V13.7919C22.3877 7.77141 27.1738 2.82244 33.1317 2.55889V8.06527C30.1784 8.31947 27.8837 10.8044 27.8837 13.7919V15.1677Z" stroke="#1F272E"/>
+        <path d="M10.7958 15.1677V15.6677H11.2958H17.6118V29.4517L5.2998 29.4518V13.7919C5.2998 7.77141 10.0859 2.82244 16.0438 2.55889V8.06527C13.0905 8.31947 10.7958 10.8044 10.7958 13.7919V15.1677Z" stroke="#1F272E"/>
+    </svg>
 </svg>