fix: certificate design
This commit is contained in:
@@ -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
|
||||
}
|
||||
}
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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",
|
||||
|
||||
@@ -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 {
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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")
|
||||
|
||||
Reference in New Issue
Block a user