Merge branch 'master' of github.com:coding-blocks/motley

examples/views/img-review-card.hbs

@@ -0,0 +1,22 @@
+<div class="row no-gutters">
+  <div class="col-4">
+    <div class="border-card img-review-card p-md-5 p-4">
+      <div class="author">
+        <div class="img-ring s-100x100">
+          <img class="round img"
+            src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTmL43mSCo0MAu3fCgV8t6QRsNzyiatE_Har4TjE8M6NZ-i0tKDzA">
+        </div>
+      </div>
+      <div class="icon">
+        <i class="fas fa-quote-left fa-3x orange"></i>
+      </div>
+
+      <h5 class="bold t-align-c mb-4">Yashvardhan, Jss</h5>
+      <div class="review-body">
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore
+        magna aliqua. Quis ipsum suspendisse ultrices gravida. Risus commodo viverra maecenas accumsan lacus vel
+        facilisis.
+      </div>
+    </div>
+  </div>
+</div>

examples/views/index.hbs

@@ -89,10 +89,15 @@
 <div class="row p-3"><a target="preview" href="applicant-profile-editor.html">applicant-profile-editor</a></div>
 <div class="row p-3"><a target="preview" href="applicant-profile.html">applicant-profile</a></div>
 <div class="row p-3"><a target="preview" href="horizontal-border-list.html">horizontal-border-list</a></div>
+<div class="row p-3"><a target="preview" href="img-review-card.html">img-review-card</a></div>
 <div class="row p-3"><a target="preview" href="img-ring.html">img-ring</a></div>
 <div class="row p-3"><a target="preview" href="index.html">index</a></div>
 <div class="row p-3"><a target="preview" href="default.html">default</a></div>
 <div class="row p-3"><a target="preview" href="list.html">list</a></div>
+<div class="row p-3"><a target="preview" href="live-classes-course-page.html">live-classes-course-page</a></div>
+<div class="row p-3"><a target="preview" href="live-classes-original.html">live-classes-original</a></div>
+<div class="row p-3"><a target="preview" href="live-classes.html">live-classes</a></div>
+<div class="row p-3"><a target="preview" href="live-course-popup-card.html">live-course-popup-card</a></div>
 <div class="row p-3"><a target="preview" href="loader.html">loader</a></div>
 <div class="row p-3"><a target="preview" href="about-accordion.html">about-accordion</a></div>
 <div class="row p-3"><a target="preview" href="about-course.html">about-course</a></div>
@@ -107,6 +112,7 @@
 <div class="row p-3"><a target="preview" href="content-csv.html">content-csv</a></div>
 <div class="row p-3"><a target="preview" href="content-icon.html">content-icon</a></div>
 <div class="row p-3"><a target="preview" href="course-card-buycourse.html">course-card-buycourse</a></div>
+<div class="row p-3"><a target="preview" href="course-card-mini.html">course-card-mini</a></div>
 <div class="row p-3"><a target="preview" href="course-content-card.html">course-content-card</a></div>
 <div class="row p-3"><a target="preview" href="course-dashboard-progress-card.html">course-dashboard-progress-card</a></div>
 <div class="row p-3"><a target="preview" href="course-review.html">course-review</a></div>
@@ -172,6 +178,7 @@
 <div class="row p-3"><a target="preview" href="tab-nav.html">tab-nav</a></div>
 <div class="row p-3"><a target="preview" href="test-cases-card.html">test-cases-card</a></div>
 <div class="row p-3"><a target="preview" href="timer-clock.html">timer-clock</a></div>
+<div class="row p-3"><a target="preview" href="unordered-list.html">unordered-list</a></div>
 <div class="row p-3"><a target="preview" href="up-competition-card.html">up-competition-card</a></div>
     </div>
     <div class="col-sm-9">

examples/views/live-classes-course-page.hbs

@@ -0,0 +1,229 @@
+<div class="p-md-5 p-4">
+  <div class="row no-gutters justify-content-between align-items-center pb-5 border-bottom mb-5">
+    <div class="col-md-8 col-12 mb-md-0 mb-4">
+      <div class="row no-gutters align-items-center d-sm-flex d-none">
+        <div class="round border p-5 all-center" style="height: 150px; width: 150px;">
+          <img src="https://image.flaticon.com/icons/svg/61/61120.svg">
+        </div>
+        <div class="flex-1 pl-5">
+          <h1>Android Development</h1>
+          <h2 class="gradient-text-orange">&#8377; 15999</h2>
+        </div>
+      </div>
+      <div class="row no-gutters align-items-center d-sm-none d-flex">
+        <div class="round border p-4 all-center" style="height: 100px; width: 100px;">
+          <img src="https://image.flaticon.com/icons/svg/61/61120.svg">
+        </div>
+        <div class="flex-1 pl-4">
+          <h2>Android Development</h2>
+          <h4 class="gradient-text-orange">&#8377; 15999</h4>
+        </div>
+      </div>
+    </div>
+    <div class="row no-gutters justify-content-center flex-1">
+      <div class="button-solid button-orange mr-4">Register Now</div>
+      <div class="button-dashed button-orange">Take Demo</div>
+    </div>
+  </div>
+
+  <div class="row">
+    <div class="col-sm-6 mb-5">
+      <div class="border-card p-md-5 p-4 h-100">
+        <div class="flex-col justify-content-between h-100">
+          <div class="row no-gutters align-items-center justify-content-between mb-4 w-100">
+            <h5 class="bold flex-1">Fundamentals</h5>
+            <i class="fas fa-play-circle fa-2x"></i>
+          </div>
+
+          <ul class="list-style-gradient-bullet w-100">
+            <li>Something random in this placeholder!</li>
+            <li>Something random in this placeholder!</li>
+            <li>Something random in this placeholder!</li>
+            <li>Something random in this placeholder!</li>
+          </ul>
+        </div>
+      </div>
+    </div>
+    <div class="col-sm-6 mb-5">
+      <div class="border-card p-md-5 p-4 h-100">
+        <div class="flex-col justify-content-between h-100">
+          <div class="row no-gutters align-items-center justify-content-between mb-4 w-100">
+            <h5 class="bold flex-1">Problem Solving</h5>
+            <i class="fas fa-play-circle fa-2x"></i>
+          </div>
+
+          <div class="card-md">
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
+            dolore
+            magna aliqua. Quis ipsum suspendisse ultrices gravida. Risus commodo viverra maecenas accumsan lacus vel
+            facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
+            labore
+            et dolore magna aliqua. Quis ipsum suspendisse ultrices gravida. Risus commodo viverra maecenas accumsan
+            lacus
+            vel facilisis. et dolore magna aliqua. Quis ipsum suspendisse ultrices gravida. Risus commodo viverra
+            maecenas accumsan
+            lacus vel facilisis.
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="col-sm-6 mb-5">
+      <div class="border-card p-md-5 p-4 h-100">
+        <div class="flex-col justify-content-between h-100">
+          <div class="row no-gutters align-items-center justify-content-between mb-4 w-100">
+            <h5 class="bold flex-1">Fundamentals</h5>
+            <i class="fas fa-play-circle fa-2x"></i>
+          </div>
+
+          <div class="card-md">
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
+            dolore
+            magna aliqua. Quis ipsum suspendisse ultrices gravida. Risus commodo viverra maecenas accumsan lacus vel
+            facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
+            labore
+            et dolore magna aliqua. Quis ipsum suspendisse ultrices gravida. Risus commodo viverra maecenas accumsan
+            lacus
+            vel facilisis.
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="col-sm-6 mb-5">
+      <div class="border-card p-md-5 p-4 h-100">
+        <div class="flex-col justify-content-between h-100">
+          <div class="row no-gutters align-items-center justify-content-between mb-4 w-100">
+            <h5 class="bold flex-1">Problem Solving</h5>
+            <i class="fas fa-play-circle fa-2x"></i>
+          </div>
+
+          <div class="card-md">
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
+            dolore
+            magna aliqua. Quis ipsum suspendisse ultrices gravida. Risus commodo viverra maecenas accumsan lacus vel
+            facilisis. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut
+            labore
+            et dolore magna aliqua. Quis ipsum suspendisse ultrices gravida. Risus commodo viverra maecenas accumsan
+            lacus
+            vel facilisis. et dolore magna aliqua. Quis ipsum suspendisse ultrices gravida. Risus commodo viverra
+            maecenas accumsan
+            lacus vel facilisis.
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="row no-gutters align-items-center justify-content-between mb-5">
+    <div class="flex-1 pr-4">
+      <h2 class="bold">Lectures Schedule</h2>
+      <h4 class="gradient-text-orange mt-2">Mon Tue Wed Fri | 7PM - 10PM</h4>
+    </div>
+    <a href="#" class="bg-gradient-orange white br-10 p-3 t-align-c">
+      <i class="far fa-file-pdf fa-lg"></i>
+      <div class="card-md mt-2">Syllabus</div>
+    </a>
+  </div>
+
+  <div class="row">
+    <div class="col-md-6 border-right">
+      <div class="row align-items-center mb-2">
+        <div class="col-4">
+          <div class="font-mds gradient-text-orange text-ellipses">Lecture 1</div>
+        </div>
+        <div class="col-8">
+          <div class="font-mds bold text-ellipses">Lecture 1</div>
+        </div>
+      </div>
+      <div class="row align-items-center mb-2">
+        <div class="col-4">
+          <div class="font-mds gradient-text-orange text-ellipses">Lecture 1</div>
+        </div>
+        <div class="col-8">
+          <div class="font-mds bold text-ellipses">Lecture 1</div>
+        </div>
+      </div>
+      <div class="row align-items-center mb-2">
+        <div class="col-4">
+          <div class="font-mds gradient-text-orange text-ellipses">Lecture 1</div>
+        </div>
+        <div class="col-8">
+          <div class="font-mds bold text-ellipses">Lecture 1</div>
+        </div>
+      </div>
+      <div class="row align-items-center mb-2">
+        <div class="col-4">
+          <div class="font-mds gradient-text-orange text-ellipses">Lecture 1</div>
+        </div>
+        <div class="col-8">
+          <div class="font-mds bold text-ellipses">Lecture 1</div>
+        </div>
+      </div>
+      <div class="row align-items-center mb-2">
+        <div class="col-4">
+          <div class="font-mds gradient-text-orange text-ellipses">Lecture 1</div>
+        </div>
+        <div class="col-8">
+          <div class="font-mds bold text-ellipses">Lecture 1</div>
+        </div>
+      </div>
+      <div class="row align-items-center mb-2">
+        <div class="col-4">
+          <div class="font-mds gradient-text-orange text-ellipses">Lecture 1</div>
+        </div>
+        <div class="col-8">
+          <div class="font-mds bold text-ellipses">Lecture 1</div>
+        </div>
+      </div>
+    </div>
+    <div class="col-md-6">
+      <div class="row align-items-center mb-2">
+        <div class="col-4">
+          <div class="font-mds gradient-text-orange text-ellipses">Lecture 1</div>
+        </div>
+        <div class="col-8">
+          <div class="font-mds bold text-ellipses">Lecture 1</div>
+        </div>
+      </div>
+      <div class="row align-items-center mb-2">
+        <div class="col-4">
+          <div class="font-mds gradient-text-orange text-ellipses">Lecture 1</div>
+        </div>
+        <div class="col-8">
+          <div class="font-mds bold text-ellipses">Lecture 1</div>
+        </div>
+      </div>
+      <div class="row align-items-center mb-2">
+        <div class="col-4">
+          <div class="font-mds gradient-text-orange text-ellipses">Lecture 1</div>
+        </div>
+        <div class="col-8">
+          <div class="font-mds bold text-ellipses">Lecture 1</div>
+        </div>
+      </div>
+      <div class="row align-items-center mb-2">
+        <div class="col-4">
+          <div class="font-mds gradient-text-orange text-ellipses">Lecture 1</div>
+        </div>
+        <div class="col-8">
+          <div class="font-mds bold text-ellipses">Lecture 1</div>
+        </div>
+      </div>
+      <div class="row align-items-center mb-2">
+        <div class="col-4">
+          <div class="font-mds gradient-text-orange text-ellipses">Lecture 1</div>
+        </div>
+        <div class="col-8">
+          <div class="font-mds bold text-ellipses">Lecture 1</div>
+        </div>
+      </div>
+      <div class="row align-items-center mb-2">
+        <div class="col-4">
+          <div class="font-mds gradient-text-orange text-ellipses">Lecture 1</div>
+        </div>
+        <div class="col-8">
+          <div class="font-mds bold text-ellipses">Lecture 1</div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>