fix: certificate design

This commit is contained in:
Jannat Patel
2022-04-05 21:13:21 +05:30
parent 208720545e
commit dcaccaca35
7 changed files with 92 additions and 91 deletions

View File

@@ -1,6 +1,5 @@
{
"actions": [],
"autoname": "format:CERT-{#####}",
"creation": "2021-08-16 15:47:19.494055",
"doctype": "DocType",
"editable_grid": 1,
@@ -49,11 +48,10 @@
],
"index_web_pages_for_search": 1,
"links": [],
"modified": "2022-04-01 18:40:27.651944",
"modified": "2022-04-05 14:19:34.409244",
"modified_by": "Administrator",
"module": "LMS",
"name": "LMS Certificate",
"naming_rule": "Expression",
"owner": "Administrator",
"permissions": [
{
@@ -72,5 +70,6 @@
"sort_field": "modified",
"sort_order": "DESC",
"states": [],
"title_field": "member",
"track_changes": 1
}
}

View File

@@ -26,5 +26,5 @@ school.patches.v0_0.set_course_in_lesson #21-03-2022
school.patches.v0_0.set_status_in_course #21-03-2022
lms.patches.v0_0.change_published_field_data #25-03-2022
execute:frappe.delete_doc("Workspace", "School", ignore_missing=True, force=True)
lms.patches.v0_0.certification_member_field_data #01-04-2022
lms.patches.v0_0.certification_member_field_data #04-04-2022
lms.patches.v0_0.move_certification_to_certificate

View File

@@ -1,7 +1,7 @@
import frappe
def execute():
old = frappe.get_all("LMS Certification", fields=["name", "course", "member", "student", "issue_date", "expiry_date"])
old = frappe.get_all("LMS Certification", fields=["name", "course", "student", "issue_date", "expiry_date"])
for data in old:
frappe.get_doc({
"doctype": "LMS Certificate",

View File

@@ -856,41 +856,54 @@ pre {
.certificate-content {
padding: 2.5rem 3rem;
background-color: #FFFFFF;
}
.certificate-footer {
margin-top: 4.5rem;
display: flex;
}
.certificate-footer-item {
margin-right: 3.5rem;
display: flex;
justify-content: space-between;
width: 50%;
margin: 5rem auto 0;
}
.certificate-ribbon {
background-color: var(--primary-color);
margin-left: auto;
margin-right: 2.5rem;
width: 4.5rem;
padding: 1rem;
border-radius: var(--border-radius-md);
}
.certificate-heading {
font-size: 3rem;
font-size: 1.5rem;
font-weight: 500;
color: var(--gray-800);
color: var(--text-color);
}
.certificate-para {
margin-bottom: 4rem;
}
.certificate-card {
background: #FFFFFF;
border-radius: var(--border-radius-md);
position: relative;
box-shadow: var(--shadow-sm);
padding: 2rem;
text-align: center;
margin: 0 6rem;
}
.certificate-footer-item {
color: var(--text-color);
font-weight: 500;
}
.certificate-logo {
height: 20px;
height: 1.5rem;
}
@media (max-width: 768px) {
.certificate-heading {
font-size: 2rem;
font-size: 1rem;
}
}
@@ -898,25 +911,16 @@ pre {
.certificate-footer {
flex-direction: column;
}
.certificate-footer-item {
margin-bottom: 1rem;
}
}
@media (max-width: 500px) {
.certificate-heading {
font-size: 1.5rem;
font-size: 0.5rem;
}
.certificate-content {
padding: 2.5rem 2rem;
}
.certificate-ribbon {
margin-right: 1rem;
width: 1.5rem;
}
}
.profile-card {

View File

@@ -1,49 +1,50 @@
<div class="common-card-style">
<div class="certificate-content">
<img src="{{ logo }}" class="certificate-logo">
<div class="text-muted mt-18">
Completion Certificate
<div class="certificate-card">
<div class="certificate-ribbon">
<div class="certificate-content">
<img src="{{ logo }}" class="certificate-logo">
<div class="mt-20">
{{ _("This certifies that") }}
</div>
<div class="certificate-heading"> {{ member.full_name }} </div>
<div class="mt-5"> {{ _("has successfully completed the course on") }} </div>
<div class="certificate-heading"> {{ course.title }} </div>
<div class="certificate-footer">
{% if certificate.issue_date %}
<div class="">
<div class="certificate-footer-item">
{{ frappe.utils.format_date(certificate.issue_date, "medium") }}
</div>
<div>
{{ _("Issue date") }}
</div>
</div>
{% endif %}
{% if certificate.expiry_date %}
<div class="">
<div class="certificate-footer-item">
{{ frappe.utils.format_date(certificate.expiry_date, "medium") }}
</div>
<div>
{{ _("Expiry date") }}
</div>
</div>
{% endif %}
{% if instructor.full_name %}
<div class="">
<div class="certificate-footer-item">
{{ instructor.full_name }}
</div>
<div>
{{ _("Instructor") }}
</div>
</div>
{% endif %}
</div>
</div>
</div>
<div class="certificate-heading"> {{ course.title }} </div>
<div class="text-muted mt-18"> Awarded To </div>
<div class="certificate-heading"> {{ student.full_name }} </div> 
<div class="certificate-footer">
{% if certificate.issue_date %}
<div class="certificate-footer-item">
<div class="font-weight-bold">
{{ frappe.utils.format_date(certificate.issue_date, "medium") }}
</div>
<div>
Issue date
</div>
</div>
{% endif %}
{% if certificate.expiry_date %}
<div class="certificate-footer-item">
<div class="font-weight-bold">
{{ frappe.utils.format_date(certificate.expiry_date, "medium") }}
</div>
<div>
Expiry date
</div>
</div>
{% endif %}
{% if instructor.full_name %}
<div class="certificate-footer-item">
<div class="font-weight-bold">
{{ instructor.full_name }}
</div>
<div>
Instructor
</div>
</div>
{% endif %}
</div>
</div>
<div class="certificate-ribbon"></div>
</div>
<script src="/assets/lms/js/html2canvas.js"></script>

View File

@@ -1,24 +1,21 @@
{% extends "templates/base.html" %}
{% from "www/macros/common_macro.html" import MentorsSection %}
{% block title %} {{ student.full_name }} - {{ course.title }} {% endblock %}
{% block title %} {{ member.full_name }} - {{ course.title }} {% endblock %}
{% block content %}
<div class="common-page-style">
<div class="container certificate-page">
<div class="breadcrumb">
<a class="dark-links" href="/courses">All Courses</a>
<img class="ml-1 mr-1" src="/assets/lms/icons/chevron-right.svg">
<a class="dark-links" href="/courses/{{ course.name }}">{{ course.title }}</a>
</div>
{% if certificate.student == frappe.session.user %}
<div class="d-flex justify-content-end mb-5">
<div class="button is-secondary pull-right" id="export-as-pdf" data-certificate="{{ certificate.name }}"
data-certificate-name="{{ student.full_name }} - {{ course.title }}">Export</div>
</div>
{% if certificate.member == frappe.session.user %}
<div class="button is-secondary pull-right mt-4" id="export-as-pdf" data-certificate="{{ certificate.name }}"
data-certificate-name="{{ member.full_name }} - {{ course.title }}">{{ _("Export") }}</div>
{% endif %}
<div class="breadcrumb">
<a class="dark-links" href="/courses">{{ _("All Courses") }}</a>
<img class="ml-1 mr-1" src="/assets/lms/icons/chevron-right.svg">
<a class="dark-links" href="/courses/{{ course.name }}">{{ course.title }}</a>
</div>
{% include "lms/templates/certificate.html" %}
</div>
</div>

View File

@@ -10,7 +10,7 @@ def get_context(context):
redirect_to_course_list()
context.certificate = frappe.db.get_value("LMS Certificate", certificate_name,
["name", "student", "issue_date", "expiry_date", "course"], as_dict=True)
["name", "member", "issue_date", "expiry_date", "course"], as_dict=True)
if context.certificate.course != course_name:
redirect_to_course_list()
@@ -21,7 +21,7 @@ def get_context(context):
context.instructor = frappe.db.get_value("User", context.course.instructor,
["full_name", "username"], as_dict=True)
context.student = frappe.db.get_value("User", context.certificate.student,
context.member = frappe.db.get_value("User", context.certificate.member,
["full_name"], as_dict=True)
context.logo = frappe.db.get_single_value("Website Settings", "banner_image")