Shiloh/brotherton-erpnext
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor: styling cards and article

Browse Source
This commit is contained in:
Shivam Mishra 2019-06-06 16:02:38 +05:30
parent 6132c8527b
commit 2a0483dee3
6 changed files with 66 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
erpnext/www/lms/content.html
View File

@ -3,6 +3,26 @@
{% block head_include %}
<style>
.lms-content {
line-height: 1.8em;
}
.lms-content h1 {
margin-top: 1em;
}
.lms-content h2 {
margin-top: 1em;
}
.lms-content h3 {
margin-top: 0.8em;
}
.lms-content h4 {
margin-top: 0.6em;
}
section {
padding: 5rem 0 5rem 0;
}
@ -79,7 +99,7 @@
</div>
</div>
<div id="player" data-plyr-provider="{{ content.provider|lower }}" data-plyr-embed-id="{{ content.url }}"></div>
<div class="my-5" style="line-height: 1.8em;">
<div class="my-5 lms-content">
{{ content.description }}
</div>
{% endmacro %}
@ -99,7 +119,7 @@
{% endif %}
</div>
</div>
<div style="line-height: 1.8em;">
<div class="lms-content">
{{ content.content }}
</div>
{% endmacro %}

12
erpnext/www/lms/course.html
View File

@ -1,6 +1,7 @@
{% extends "templates/base.html" %}
{% block title %}{{ course.course_name }}{% endblock %}
{% from "www/lms/macros/hero.html" import hero %}
{% from "www/lms/macros/card.html" import null_card %}
{% block head_include %}
<style>
@ -35,8 +36,8 @@
{% endblock %}
{% macro card(topic, index, length) %}
<div class="col-sm-{{ 12 if length%3 == 1 and index == 1 else 6 if length%3 == 2 and index in [1,2] else 4}} mb-4 text-left">
{% macro card(topic) %}
<div class="col-sm-4 mb-4 text-left">
<div class="card h-100">
{% if has_access %}
<a href="/lms/topic?program={{ program }}&course={{ course.name }}&topic={{ topic.name }}" class="no-decoration no-underline">
@ -92,8 +93,13 @@
<div class='container'>
<div class="row mt-5">
{% for topic in topics %}
{{ card(topic, loop.index, topics|length) }}
{{ card(topic) }}
{% endfor %}
{% if topics %}
{% for n in range(3 - ((topics|length)%3)) %}
{{ null_card() }}
{% endfor %}
{% endif %}
</div>
</div>
</section>

10
erpnext/www/lms/index.html
View File

@ -1,6 +1,7 @@
{% extends "templates/base.html" %}
{% block title %}{{ education_settings.portal_title }}{% endblock %}
{% from "www/lms/macros/card.html" import program_card %}
{% from "www/lms/macros/card.html" import null_card %}
{% block head_include %}
<meta name="description" content="{{ education_settings.description }}" />
@ -43,7 +44,9 @@
<h1>{{ education_settings.portal_title }}</h1>
<p class='lead'>{{ education_settings.description }}</p>
<p class="mt-4">
<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>
{% if frappe.session.user == 'Guest' %}
<a class="btn btn-primary btn-lg" href="'/login#signup'}}">Start Learning</a>
{% endif %}
</p>
</div>
<div class='container'>
@ -51,6 +54,11 @@
{% for program in featured_programs %}
{{ program_card(program.program, program.has_access) }}
{% endfor %}
{% if featured_programs %}
{% for n in range(3 - ((featured_programs|length)%3)) %}
{{ null_card() }}
{% endfor %}
{% endif %}
</div>
</div>
</section>

12
erpnext/www/lms/macros/card.html
View File

@ -1,5 +1,5 @@
{% macro program_card(program, has_access) %}
<div class="col-sm mb-4 text-left">
<div class="col-sm-4 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 %}
@ -11,7 +11,7 @@
{% endif %}
<div class='card-body'>
<h5 class='card-title'>{{ program.program_name }}</h5>
<div class="text-muted">{{ program.description or '' }}</div>
<div class="text-muted">{{ program.description[:110] + '...' if program.description else '' }}</div>
</div>
{% if has_access or program.intro_video%}
<div class='card-footer'>
@ -23,4 +23,12 @@
</div>
</a>
</div>
{% endmacro %}
{% macro null_card() %}
<div class="col-sm-4 mb-4 text-left">
<div class="h-100" style="border: 1px solid rgba(209,216,221,0.5);border-radius: 0.25rem;background-color: rgb(250, 251, 252);">
</div>
</div>
{% endmacro %}

14
erpnext/www/lms/program.html
View File

@ -1,6 +1,7 @@
{% extends "templates/base.html" %}
{% block title %}{{ program.program_name }}{% endblock %}
{% from "www/lms/macros/hero.html" import hero %}
{% from "www/lms/macros/card.html" import null_card %}
{% block head_include %}
<style>
@ -36,8 +37,8 @@
{% endblock %}
{% macro card(course, index, length) %}
<div class="col-sm-{{ 12 if length%3 == 1 and index == 1 else 6 if length%3 == 2 and index in [1,2] else 4}} mb-4 text-left">
{% macro card(course) %}
<div class="col-sm-4 mb-4 text-left">
<a href="/lms/course?name={{ course.name }}&program={{ program.name }}" class="no-decoration no-underline">
<div class="card h-100">
{% if course.hero_image %}
@ -49,7 +50,7 @@
{% endif %}
<div class='card-body'>
<h5 class='card-title'>{{ course.course_name }}</h5>
<div class="text-muted">{{ course.description or '' }}</div>
<div class="text-muted">{{ course.description[:110] + '...' if course.description else '' }}</div>
</div>
{% if has_access and progress[course.name] %}
<div class='card-footer'>
@ -73,8 +74,13 @@
<div class='container'>
<div class="row mt-5">
{% for course in courses %}
{{ card(course, loop.index, courses|length) }}
{{ card(course) }}
{% endfor %}
{% if courses %}
{% for n in range(3 - ((courses|length)%3)) %}
{{ null_card() }}
{% endfor %}
{% endif %}
</div>
</div>
</section>

6
erpnext/www/lms/topic.html
View File

@ -1,6 +1,7 @@
{% extends "templates/base.html" %}
{% block title %}Topic Title{% endblock %}
{% from "www/lms/macros/hero.html" import hero %}
{% from "www/lms/macros/card.html" import null_card %}
{% block head_include %}
<style>
@ -46,6 +47,11 @@
{% for content in contents %}
{{ card(content, loop.index, topic.contents|length) }}
{% endfor %}
{% if contents %}
{% for n in range(3 - ((contents|length)%3)) %}
{{ null_card() }}
{% endfor %}
{% endif %}
</div>
</div>
</section>