refactor: added program card macro

This commit is contained in:
Shivam Mishra 2019-05-30 16:34:53 +05:30
parent f927502cc5
commit f22793f91b
3 changed files with 28 additions and 51 deletions

View File

@ -1,5 +1,6 @@
{% extends "templates/base.html" %}
{% block title %}All Programs{% endblock %}
{% from "www/lms/macros/card.html" import program_card %}
{% block head_include %}
<style>
@ -30,42 +31,18 @@
</style>
{% endblock %}
{% macro card(program, is_enrolled) %}
<div class="col-sm-6 mb-4 text-left">
<a href="/lms/program?name={{ program.name }}" class="no-decoration no-underline">
<div class="card h-100">
{% if program.hero_image %}
<div class="card-hero-img" style="background-image: url({{ program.hero_image }})"></div>
{% else %}
<div class="card-image-wrapper text-center">
<div class="image-body">{{ program.program_name }}</div>
</div>
{% endif %}
<div class='card-body'>
<h5 class='card-title'>{{ program.program_name }}</h5>
<div>{{ program.description }}</div>
</div>
<div class='card-footer'>
<span class='small'>Watch Intro</span>
</div>
</div>
</a>
</div>
{% endmacro %}
{% block content %}
<section class="top-section ">
<div class='container pb-5'>
<h1>All Programs</h1>
<p class="mt-4">
<a class="btn btn-primary btn-lg" style="width: 170px;" href="/pricing">Start Learning</a>
<a class="btn btn-primary btn-lg" href="{{ '/login#signup' if frappe.session.user == 'Guest' else '/lms/all-programs' }}">{{ 'Start Learning' if frappe.session.user == 'Guest' else 'Explore Programs'}}</a>
</p>
</div>
<div class='container'>
<div class="row mt-5">
{% for program in all_programs %}
{{ card(program.program, program.is_enrolled) }}
{{ program_card(program) }}
{% endfor %}
</div>
</div>

View File

@ -1,5 +1,6 @@
{% extends "templates/base.html" %}
{% block title %}{{ education_settings.portal_title }}{% endblock %}
{% from "www/lms/macros/card.html" import program_card %}
{% block head_include %}
<meta name="description" content="{{ education_settings.description }}" />
@ -32,43 +33,20 @@
</style>
{% endblock %}
{% macro card(program) %}
<div class="col-sm mb-4 text-left">
<a href="/lms/program?name={{ program.name }}" class="no-decoration no-underline">
<div class="card h-100">
{% if program.hero_image %}
<div class="card-hero-img" style="background-image: url({{ program.hero_image }})"></div>
{% else %}
<div class="card-image-wrapper text-center">
<div class="image-body">{{ program.program_name }}</div>
</div>
{% endif %}
<div class='card-body'>
<h5 class='card-title'>{{ program.program_name }}</h5>
<div>{{ program.description }}</div>
</div>
<div class='card-footer'>
<span class='small'>Watch Intro</span>
</div>
</div>
</a>
</div>
{% endmacro %}
{% block content %}
<section class="top-section ">
<div class='container pb-5'>
<h1>{{ education_settings.portal_title }}</h1>
<p class='lead'>{{ education_settings.description }}</p>
<p class="mt-4">
<a class="btn btn-primary btn-lg" style="width: 170px;" href="{{ '/login#signup' if frappe.session.user == 'Guest' else '/lms/all-programs' }}">Start Learning</a>
<a class="btn btn-primary btn-lg" href="{{ '/login#signup' if frappe.session.user == 'Guest' else '/lms/all-programs' }}">{{ 'Start Learning' if frappe.session.user == 'Guest' else 'Explore Programs'}}</a>
</p>
<a href="https://erpnext.com" target="blank" class="mt-0 small text-muted">Go to erpnext.com</a>
</div>
<div class='container'>
<div class="row mt-5">
{% for program in featured_programs %}
{{ card(program.program) }}
{{ program_card(program) }}
{% endfor %}
</div>
<p class='mt-4'>

View File

@ -0,0 +1,22 @@
{% macro program_card(program) %}
<div class="col-sm mb-4 text-left">
<a href="/lms/program?program={{ program.name }}" class="no-decoration no-underline">
<div class="card h-100">
{% if program.hero_image %}
<div class="card-hero-img" style="background-image: url({{ program.hero_image }})"></div>
{% else %}
<div class="card-image-wrapper text-center">
<div class="image-body"><i class="fa fa-picture-o" aria-hidden="true"></i></div>
</div>
{% endif %}
<div class='card-body'>
<h5 class='card-title'>{{ program.program_name }}</h5>
<div>{{ program.description }}</div>
</div>
<div class='card-footer'>
<span class='small'>Watch Intro</span>
</div>
</div>
</a>
</div>
{% endmacro %}