Added mockups

This commit is contained in:
Anand Chitipothu
2021-04-27 19:16:46 +05:30
parent ffdc554106
commit 46e7a5c0d1
5 changed files with 458 additions and 0 deletions

114
mockups/course.html Normal file
View File

@@ -0,0 +1,114 @@
{% extends "base.html" %}
{% block content %}
<div class="container">
<div class="course-header">
<div class="course-type">course</div>
<h1>{{title}}</h1>
</div>
<div class="row">
<div class="col-lg-9 col-md-12">
<div class="course-details">
<h2>Course Description</h2>
<div class="course-description">
{{ description }}
</div>
<div class="preview-video">
<iframe
width="560"
height="315"
src="{{youtube_embed_url}}"
title="YouTube video player"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen></iframe>
</div>
<h2>Upcoming Batches</h2>
<div class="row">
{% for batch in batches %}
<div class="col-lg-4 col-md-6">
<div class="batch">
<div class="batch-details">
<div>Session every {{batch.weekdays}}</div>
<div>{{batch.timeslot}}</div>
<div>Starting from {{batch.start_date}}</div>
<div class="course-type" style="color: #888; padding: 10px 0px;">mentors</div>
{% for m in batch.mentors %}
<div>
<img class="profile-photo" src="{{m.photo_url}}">
<span class="instructor-title">{{m.name}}</span>
</div>
{% endfor %}
</div>
<div class="cta">
<div class="">
<button type="button">Join this Batch</button>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
<h2>Course Outline</h2>
{% for chapter in chapters %}
<div class="chapter-plan">
<h3><span class="chapter-number">{{loop.index}}</span> {{chapter.title}}</h3>
<div class="chapter-description">
{{chapter.description}}
</div>
<div class="lessons">
{% for lesson in chapter.lessons %}
<div class="lesson">
<span class="lesson-type"><i class="{{lesson.icon}}"></i></span>
<span class="lesson-title">{{lesson.title}}</span>
</div>
{% endfor %}
</div>
</div>
{% endfor %}
</div>
</div>
<div class="col-lg-3 col-md-12">
<div class="sidebar">
<h3>Instructor</h3>
<div class="instructor">
<div class="instructor-title">{{instructor.name}}</div>
<div class="instructor-subtitle">Created {{instructor.num_courses}} courses</div>
</div>
</div>
<div class="sidebar">
<h3>Mentors</h3>
{% for m in mentors %}
<div class="instructor">
<div class="instructor-title">{{m.name}}</div>
<div class="instructor-subtitle">Mentored {{m.num_courses}} batches</div>
</div>
{% endfor %}
<div class="notice">
Interested to become a mentor?
<div><a href="#">Apply Now!</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
{% endblock %}