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

refactor: styling changes

Browse Source
This commit is contained in:
Shivam Mishra 2019-06-06 14:03:01 +05:30
parent 09cd46fa0b
commit b31276572b
9 changed files with 90 additions and 89 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
erpnext/www/lms/all-programs.html
View File

@ -28,6 +28,10 @@
line-height: 1;
padding: 20px;
}
section {
padding: 5rem 0 5rem 0;
}
</style>
{% endblock %}

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

@ -3,58 +3,67 @@
{% block head_include %}
<style>
div.card-hero-img {
height: 220px;
background-size: cover;
background-repeat: no-repeat;
background-position: center;
background-color: rgb(250, 251, 252);
section {
padding: 5rem 0 5rem 0;
}
.plyr--video .plyr__control.plyr__tab-focus,
.plyr--video .plyr__control:hover,
.plyr--video .plyr__control[aria-expanded='true'] {
background: #5e64ff !important;
}
.card-image-wrapper {
display: flex;
overflow: hidden;
height: 220px;
background-color: rgb(250, 251, 252);
justify-content: center;
.plyr__control--overlaid:focus,
.plyr__control--overlaid:hover {
background: #5e64ff !important;
}
.image-body {
align-self: center;
color: #d1d8dd;
font-size: 24px;
font-weight: 600;
line-height: 1;
padding: 20px;
.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]::before {
background: #5e64ff !important;
}
.plyr__menu__container
.plyr__control[role='menuitemradio'][aria-checked='true']::before {
background: #5e64ff;
}
.plyr--full-ui input[type='range'] {
color: #5e64ff !important;
}
.plyr__control--overlaid {
background: rgba(94, 100, 255, 0.8) !important;
}
</style>
<link rel="stylesheet" href="https://cdn.plyr.io/3.5.3/plyr.css" />
{% endblock %}
{% macro navigation() %}
<div class="row">
<div class="col-md-7">
<h1>{{ content.name }} <span class="small text-muted">({{ position + 1 }}/{{length}})</span></h1>
</div>
<div id="nav-buttons" class="col-md-5 text-right" {{ 'hidden' if content_type=='Quiz' }}>
{% if previous %}
<a href="/lms/content?program={{ program }}&course={{ course }}&topic={{ topic }}&type={{ previous.content_type }}&content={{ previous.content }}" class='btn text-muted' style="box-shadow: none;">Previous</a>
{% else %}
<a href="/lms/course?name={{ course }}&program={{ program }}" class='btn text-muted' style="box-shadow: none;">Back to Course</a>
{% endif %}
{% if next %}
<button id="nextButton" onclick="handle('/lms/content?program={{ program }}&course={{ course }}&topic={{ topic }}&type={{ next.content_type }}&content={{ next.content }}')" class='btn btn-primary' disabled="true">Next</button>
{% else %}
<button id="nextButton" onclick="handle('/lms/course?name={{ course }}&program={{ program }}')" class='btn btn-primary' disabled="true">Finish Topic</button>
{% endif %}
</div>
{% macro title() %}
<div class="mb-3">
<a href="#" class="text-muted">
Back to Course
</a>
</div>
<div>
<h1>{{ content.name }} <span class="small text-muted">({{ position + 1 }}/{{length}})</span></h1>
</div>
{% endmacro %}
{% macro navigation() %}
{% if previous %}
<a href="/lms/content?program={{ program }}&course={{ course }}&topic={{ topic }}&type={{ previous.content_type }}&content={{ previous.content }}" class='btn text-muted' style="box-shadow: none;">Previous</a>
{% else %}
<a href="/lms/course?name={{ course }}&program={{ program }}" class='btn text-muted' style="box-shadow: none;">Back to Course</a>
{% endif %}
{% if next %}
<button id="nextButton" onclick="handle('/lms/content?program={{ program }}&course={{ course }}&topic={{ topic }}&type={{ next.content_type }}&content={{ next.content }}')" class='btn btn-primary' disabled="true">Next</button>
{% else %}
<button id="nextButton" onclick="handle('/lms/course?name={{ course }}&program={{ program }}')" class='btn btn-primary' disabled="true">Finish Topic</button>
{% endif %}
{% endmacro %}
{% macro video() %}
<div class="mb-5">
{{ navigation() }}
{{ title() }}
<div class="text-muted">
{% if content.duration %}
{{ content.duration }} Mins
@ -77,7 +86,7 @@
{% macro article() %}
<div class="mb-5">
{{ navigation() }}
{{ title() }}
<div class="text-muted">
{% if content.author or content.publish_date %}
Published
@ -97,11 +106,7 @@
{% macro quiz() %}
<div class="mb-5">
<div class="row">
<div class="col-md-7">
<h1>{{ content.name }} <span class="small text-muted">({{ position + 1 }}/{{length}})</span></h1>
</div>
</div>
{{ title() }}
</div>
<div id="quiz-wrapper">
</div>
@ -118,6 +123,9 @@
{% elif content_type=='Quiz' %}
{{ quiz() }}
{% endif %}
<div class="pull-right" {{ 'hidden' if content_type=='Quiz'}}>
{{ navigation() }}
</div>
</div>
</div>
</section>

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

@ -28,6 +28,9 @@
line-height: 1;
padding: 20px;
}
section {
padding: 5rem 0 5rem 0;
}
</style>
{% endblock %}
@ -84,7 +87,7 @@
{% endmacro %}
{% block content %}
<section class="section ">
<section class="section">
{{ hero(course.course_name, course.description, has_access, {'name': 'Program', 'url': '/lms/program?program=' + program }) }}
<div class='container'>
<div class="row mt-5">

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

@ -30,11 +30,15 @@
line-height: 1;
padding: 20px;
}
section {
padding: 5rem 0 5rem 0;
}
</style>
{% endblock %}
{% block content %}
<section class="top-section ">
<section class="top-section" style="padding: 6rem 0rem;">
<div class='container pb-5'>
<h1>{{ education_settings.portal_title }}</h1>
<p class='lead'>{{ education_settings.description }}</p>
@ -54,42 +58,4 @@
</p>
</div>
</section>
<section class="section-padding section-bg">
<div class='container'>
<div class='card-deck'>
<div class="card">
<!-- <img class='mt-3' src="/assets/erpnext_com/img/balloon.svg" style='height: 150px'> -->
<div class='card-body'>
<h5 class='card-title'>Curated Courses</h5>
<div>Start with a 14 day trial to get instant access to your own ERPNext Instance. Get expert support and world class hosting too.</div>
</div>
</div>
<div class="card">
<!-- <img class='mt-3' src="/assets/erpnext_com/img/umbrella.svg" style='height: 150px'> -->
<div class='card-body'>
<h5 class='card-title'>Built by Experts</h5>
<div>For self hosted users, ERPNext Support provides you the priority support and bug fix guarantee, so you can stop worrying.</div>
</div>
</div>
<div class="card">
<!-- <img class='mt-3' src="/assets/erpnext_com/img/sun.svg" style='height: 150px'> -->
<div class='card-body'>
<h5 class='card-title'>Learn from the OEMs</h5>
<div>ERPNext is open source and infinitely extensible. Customize it, build upon it, add your own apps built with <a href="https://frappe.io/frappe" class="underline">Frappe Framework</a>.</div>
</div>
</div>
</div>
</div>
</section>
<section class='section-padding'>
<div class='container text-center'>
<h3 class='text-center'>About ERPNext</h3>
<p class='lead'>ERPNext is the world's best 100% open source ERP used by over 5000 companies worldwide.</p>
<div class='mt-4 '>
<a class="btn btn-primary btn-lg" href="/pricing">Start Learning</a>
</div>
</div>
</section>
{% endblock %}

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

@ -11,7 +11,7 @@
{% endif %}
<div class='card-body'>
<h5 class='card-title'>{{ program.program_name }}</h5>
<div>{{ program.description or '' }}</div>
<div class="text-muted">{{ program.description or '' }}</div>
</div>
{% if has_access or program.intro_video%}
<div class='card-footer'>

2
erpnext/www/lms/macros/hero.html
View File

@ -2,7 +2,7 @@
<div class='container pb-5'>
<div class="mb-3">
<a href="{{ back.url }}" class="text-muted">
<i class="octicon octicon-chevron-left"></i> Back to {{ back.name }}
Back to {{ back.name }}
</a>
</div>
<h1>{{ title }}</h1>

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

@ -2,6 +2,14 @@
{% block title %}Profile{% endblock %}
{% from "www/lms/macros/hero.html" import hero %}
{% block head_include %}
<style>
section {
padding: 5rem 0 5rem 0;
}
</style>
{% endblock %}
{% macro card(program) %}
<div class="col-sm-4 mb-4 text-left">
<a href="/lms/program?program={{ program.name }}" class="no-decoration no-underline">
@ -15,7 +23,7 @@
{% elif course.started %} <span class="indicator orange">
{% else %} <span class="indicator blue">
{% endif %}
<a class="text-muted" href="/lms/course?program={{ program.name }}&name={{ course.course }}">{{ course.course }}</a>
<a class="text-muted" href="/lms/course?name={{ course.name }}&program={{ program.name }}">{{ course.course }}</a>
</span>
</li>
{% endfor %}
@ -35,7 +43,7 @@
<div class="mb-3 row">
<div class="col-md-7">
<a href="/lms" class="text-muted">
<i class="fa fa-chevron-left"></i> Back to Home
Back to Home
</a>
</div>
<div class="col-md-5 text-right">

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

@ -28,6 +28,10 @@
line-height: 1;
padding: 20px;
}
section {
padding: 5rem 0 5rem 0;
}
</style>
{% endblock %}
@ -45,7 +49,7 @@
{% endif %}
<div class='card-body'>
<h5 class='card-title'>{{ course.course_name }}</h5>
<div>{{ course.description or '' }}</div>
<div class="text-muted">{{ course.description or '' }}</div>
</div>
{% if has_access and progress[course.name] %}
<div class='card-footer'>

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

@ -2,6 +2,14 @@
{% block title %}Topic Title{% endblock %}
{% from "www/lms/macros/hero.html" import hero %}
{% block head_include %}
<style>
section {
padding: 5rem 0 5rem 0;
}
</style>
{% endblock %}
{% macro card(content, 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">