[MERGE] survey: improve certification templates
PURPOSE Improve certification templates and make them more aligned with current state of the art certifications. SPECIFICATIONS Design has been completely redone to be more modern. Also displays dynamic certification number based on the ID of certification record for both modern and classic layouts. It consists in minimum 10 digits. It means that if the ID of the record is 5 it is displayed as 0000000005. Also improves the behavior by adding name of the certification in page title so that use can see the proper string on browser tab. For doing so, we create a new wrapper template that sets the title for the page, and use an iframe to loads the pdf file from existing controlloer (which returns response for the preview pdf). LINKS Task ID-2341847 COM PR #66028 Signed-off-by: Thibault Delavallee (tde) <tde@openerp.com>
@@ -570,6 +570,14 @@ class Survey(http.Controller):
|
||||
'format_date': lambda date: format_date(request.env, date),
|
||||
})
|
||||
|
||||
@http.route('/survey/<model("survey.survey"):survey>/certification_preview', type="http", auth="user", website=True)
|
||||
def show_certification_pdf(self, survey, **kwargs):
|
||||
preview_url = '/survey/%s/get_certification_preview' % survey.id
|
||||
return request.render('survey.certification_preview', {
|
||||
'preview_url': preview_url,
|
||||
'page_title': survey.title,
|
||||
})
|
||||
|
||||
@http.route(['/survey/<model("survey.survey"):survey>/get_certification_preview'], type="http", auth="user", methods=['GET'], website=True)
|
||||
def survey_get_certification_preview(self, survey, **kwargs):
|
||||
if not request.env.user.has_group('survey.group_survey_user'):
|
||||
|
||||
@@ -889,7 +889,7 @@ class Survey(models.Model):
|
||||
return {
|
||||
'type': 'ir.actions.act_url',
|
||||
'target': '_blank',
|
||||
'url': '/survey/%s/get_certification_preview' % (self.id)
|
||||
'url': '/survey/%s/certification_preview' % (self.id)
|
||||
}
|
||||
|
||||
def action_start_session(self):
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
Copyright (c) 2011 Alejandro Paul (sudtipos@sudtipos.com),
|
||||
with Reserved Font Name "Mr De Haviland"
|
||||
Copyright (c) 2011 TypeSETit, LLC (typesetit@att.net),
|
||||
with Reserved Font Name "Alex Brush"
|
||||
|
||||
This Font Software is licensed under the SIL Open Font License, Version 1.1.
|
||||
This license is copied below, and is also available with a FAQ at:
|
||||
@@ -19,7 +19,7 @@ with others.
|
||||
|
||||
The OFL allows the licensed fonts to be used, studied, modified and
|
||||
redistributed freely as long as they are not sold by themselves. The
|
||||
fonts, including any derivative works, can be bundled, embedded,
|
||||
fonts, including any derivative works, can be bundled, embedded,
|
||||
redistributed and/or sold with any software provided that any reserved
|
||||
names are not used by derivative works. The fonts and derivatives,
|
||||
however, cannot be released under any other type of license. The
|
||||
|
After Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 82 KiB |
|
Before Width: | Height: | Size: 77 KiB |
|
Before Width: | Height: | Size: 82 KiB |
|
Before Width: | Height: | Size: 7.7 KiB |
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.89 595.28"><polygon points="0 0 0 111.72 644.97 595.28 841.89 595.28 841.89 0 0 0" style="fill:#fff"/></svg>
|
||||
|
After Width: | Height: | Size: 165 B |
@@ -1 +0,0 @@
|
||||
<svg width="106" height="106" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="a"><stop stop-color="#C80000" offset="0%"/><stop stop-color="#8F0000" offset="100%"/></linearGradient><path d="M51.41 101.824l-1.112 1.459a2 2 0 0 1-3.368-.295l-.842-1.63a2 2 0 0 0-3.133-.552l-1.348 1.243a2 2 0 0 1-3.265-.875l-.546-1.75a2 2 0 0 0-2.99-1.089l-1.543.99a2 2 0 0 1-3.064-1.428l-.233-1.819a2 2 0 0 0-2.756-1.59l-1.692.707a2 2 0 0 1-2.769-1.94l.086-1.831a2 2 0 0 0-2.437-2.045l-1.79.403a2 2 0 0 1-2.39-2.39l.403-1.79a2 2 0 0 0-2.045-2.437l-1.832.086a2 2 0 0 1-1.939-2.77l.708-1.691a2 2 0 0 0-1.591-2.756l-1.82-.233a2 2 0 0 1-1.428-3.064l.99-1.543a2 2 0 0 0-1.087-2.99l-1.751-.546a2 2 0 0 1-.875-3.265l1.243-1.348a2 2 0 0 0-.552-3.133l-1.63-.842a2 2 0 0 1-.295-3.368l1.46-1.111a2 2 0 0 0 0-3.182l-1.46-1.111a2 2 0 0 1 .295-3.368l1.63-.842a2 2 0 0 0 .552-3.133l-1.243-1.348a2 2 0 0 1 .875-3.265l1.75-.546a2 2 0 0 0 1.089-2.99l-.99-1.543a2 2 0 0 1 1.428-3.064l1.819-.233a2 2 0 0 0 1.59-2.756l-.707-1.692a2 2 0 0 1 1.94-2.769l1.831.086a2 2 0 0 0 2.045-2.437l-.403-1.79a2 2 0 0 1 2.39-2.39l1.79.403a2 2 0 0 0 2.437-2.045l-.086-1.832a2 2 0 0 1 2.77-1.939l1.691.708a2 2 0 0 0 2.756-1.591l.233-1.82a2 2 0 0 1 3.064-1.428l1.543.99a2 2 0 0 0 2.99-1.087l.546-1.751a2 2 0 0 1 3.265-.875l1.348 1.243a2 2 0 0 0 3.133-.552l.842-1.63a2 2 0 0 1 3.368-.295l1.111 1.46a2 2 0 0 0 3.182 0l1.111-1.46a2 2 0 0 1 3.368.295l.842 1.63a2 2 0 0 0 3.133.552l1.348-1.243a2 2 0 0 1 3.265.875l.546 1.75a2 2 0 0 0 2.99 1.089l1.543-.99a2 2 0 0 1 3.064 1.428l.233 1.819a2 2 0 0 0 2.756 1.59l1.692-.707a2 2 0 0 1 2.769 1.94l-.086 1.831a2 2 0 0 0 2.437 2.045l1.79-.403a2 2 0 0 1 2.39 2.39l-.403 1.79a2 2 0 0 0 2.045 2.437l1.832-.086a2 2 0 0 1 1.939 2.77l-.708 1.691a2 2 0 0 0 1.591 2.756l1.82.233a2 2 0 0 1 1.428 3.064l-.99 1.543a2 2 0 0 0 1.087 2.99l1.751.546a2 2 0 0 1 .875 3.265l-1.243 1.348a2 2 0 0 0 .552 3.133l1.63.842a2 2 0 0 1 .295 3.368l-1.46 1.111a2 2 0 0 0 0 3.182l1.46 1.111a2 2 0 0 1-.295 3.368l-1.63.842a2 2 0 0 0-.552 3.133l1.243 1.348a2 2 0 0 1-.875 3.265l-1.75.546a2 2 0 0 0-1.089 2.99l.99 1.543a2 2 0 0 1-1.428 3.064l-1.819.233a2 2 0 0 0-1.59 2.756l.707 1.692a2 2 0 0 1-1.94 2.769l-1.831-.086a2 2 0 0 0-2.045 2.437l.403 1.79a2 2 0 0 1-2.39 2.39l-1.79-.403a2 2 0 0 0-2.437 2.045l.086 1.832a2 2 0 0 1-2.77 1.939l-1.691-.708a2 2 0 0 0-2.756 1.591l-.233 1.82a2 2 0 0 1-3.064 1.428l-1.543-.99a2 2 0 0 0-2.99 1.087l-.546 1.751a2 2 0 0 1-3.265.875l-1.348-1.243a2 2 0 0 0-3.133.552l-.842 1.63a2 2 0 0 1-3.368.295l-1.111-1.46a2 2 0 0 0-3.182 0z" id="b"/><filter x=".9%" y=".9%" width="98.2%" height="98.2%" filterUnits="objectBoundingBox" id="c"><feGaussianBlur stdDeviation=".5" in="SourceAlpha" result="shadowBlurInner1"/><feOffset dy="1" in="shadowBlurInner1" result="shadowOffsetInner1"/><feComposite in="shadowOffsetInner1" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner1"/><feColorMatrix values="0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.785265516 0" in="shadowInnerInner1" result="shadowMatrixInner1"/><feOffset dy="-1" in="SourceAlpha" result="shadowOffsetInner2"/><feComposite in="shadowOffsetInner2" in2="SourceAlpha" operator="arithmetic" k2="-1" k3="1" result="shadowInnerInner2"/><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.291220498 0" in="shadowInnerInner2" result="shadowMatrixInner2"/><feMerge><feMergeNode in="shadowMatrixInner1"/><feMergeNode in="shadowMatrixInner2"/></feMerge></filter><radialGradient fx="50%" fy="50%" id="d"><stop stop-color="#C40505" offset="0%"/><stop stop-color="#8D0101" offset="100%"/></radialGradient></defs><g fill="none" fill-rule="evenodd"><use fill="url(#a)" xlink:href="#b"/><use fill="#000" filter="url(#c)" xlink:href="#b"/><circle fill="url(#d)" cx="53" cy="53" r="42"/></g></svg>
|
||||
|
Before Width: | Height: | Size: 3.7 KiB |
|
After Width: | Height: | Size: 5.5 KiB |
|
After Width: | Height: | Size: 5.5 KiB |
|
After Width: | Height: | Size: 5.5 KiB |
|
After Width: | Height: | Size: 50 KiB |
@@ -0,0 +1,14 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 62.01 117.54">
|
||||
<defs>
|
||||
<clipPath id="a" transform="translate(0 0)">
|
||||
<rect width="62.01" height="117.54" style="fill:none" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
<g style="clip-path:url(#a)">
|
||||
<path d="M31,62A31,31,0,1,0,0,31,31,31,0,0,0,31,62" transform="translate(0 0)" style="fill:#263e86" />
|
||||
<path d="M14,59.92v57.62l17-13.9,17,13.9V59.92a31,31,0,0,1-34,0" transform="translate(0 0)"
|
||||
style="fill:#263e86" />
|
||||
<circle cx="31.01" cy="31.01" r="23.06" style="fill:none;stroke:#f1f2f2;stroke-width:0.16699999570846558px" />
|
||||
<circle cx="31.01" cy="31.01" r="22.23" style="fill:none;stroke:#f1f2f2;stroke-width:0.16699999570846558px" />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 807 B |
@@ -0,0 +1,14 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 62.01 117.54">
|
||||
<defs>
|
||||
<clipPath id="a" transform="translate(0 0)">
|
||||
<rect width="62.01" height="117.54" style="fill:none" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
<g style="clip-path:url(#a)">
|
||||
<path d="M31,62A31,31,0,1,0,0,31,31,31,0,0,0,31,62" transform="translate(0 0)" style="fill:#d7a520" />
|
||||
<path d="M14,59.92v57.62l17-13.9,17,13.9V59.92a31,31,0,0,1-34,0" transform="translate(0 0)"
|
||||
style="fill:#d7a520" />
|
||||
<circle cx="31.01" cy="31.01" r="23.06" style="fill:none;stroke:#f1f2f2;stroke-width:0.16699999570846558px" />
|
||||
<circle cx="31.01" cy="31.01" r="22.23" style="fill:none;stroke:#f1f2f2;stroke-width:0.16699999570846558px" />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 807 B |
@@ -0,0 +1,14 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 62.01 117.54">
|
||||
<defs>
|
||||
<clipPath id="a" transform="translate(0 0)">
|
||||
<rect width="62.01" height="117.54" style="fill:none" />
|
||||
</clipPath>
|
||||
</defs>
|
||||
<g style="clip-path:url(#a)">
|
||||
<path d="M31,62A31,31,0,1,0,0,31,31,31,0,0,0,31,62" transform="translate(0 0)" style="fill:#875A7B" />
|
||||
<path d="M14,59.92v57.62l17-13.9,17,13.9V59.92a31,31,0,0,1-34,0" transform="translate(0 0)"
|
||||
style="fill:#875A7B" />
|
||||
<circle cx="31.01" cy="31.01" r="23.06" style="fill:none;stroke:#f1f2f2;stroke-width:0.16699999570846558px" />
|
||||
<circle cx="31.01" cy="31.01" r="22.23" style="fill:none;stroke:#f1f2f2;stroke-width:0.16699999570846558px" />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 807 B |
|
Before Width: | Height: | Size: 60 KiB After Width: | Height: | Size: 54 KiB |
@@ -1,196 +1,339 @@
|
||||
@font-face {
|
||||
font-family: certification-cursive;
|
||||
src: url(/survey/static/src/fonts/MrDeHaviland-Regular.ttf);
|
||||
font-family: "certification-cursive";
|
||||
src: url("/survey/static/src/fonts/AlexBrush-Regular.ttf") format("truetype");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: certification-serif;
|
||||
src: url(/survey/static/src/fonts/ETHOS-REGULAR.OTF);
|
||||
font-family: "certification-serif";
|
||||
src: url("/survey/static/src/fonts/Cochin-LT-Std-Roman.ttf") format("truetype");
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: certification-modern;
|
||||
src: url(/survey/static/src/fonts/Oswald-Light.ttf);
|
||||
font-family: "certification-serif";
|
||||
src: url("/survey/static/src/fonts/Cochin-LT-Std-Bold.ttf") format("truetype");
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "certification-modern";
|
||||
src: url("/survey/static/src/fonts/HomepageBaukasten-Book.otf") format("opentype");
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "certification-modern";
|
||||
src: url("/survey/static/src/fonts/HomepageBaukasten-Bold.otf") format("opentype");
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
$lightgrey: #f2f2f2;
|
||||
$font-muted: #6b6d70;
|
||||
$font-color: #282f33;
|
||||
$white: #ffffff;
|
||||
$purple: #875A7B;
|
||||
$gold: #d7a520;
|
||||
$blue: #263e86;
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
zoom: 117.2%;
|
||||
}
|
||||
|
||||
#o_survey_certification.certification-wrapper {
|
||||
width: 250mm;
|
||||
height: 280mm;
|
||||
width: 297mm;
|
||||
height: 210mm;
|
||||
background-color: $purple;
|
||||
position: relative;
|
||||
display: flex;
|
||||
background-size: 100% 100%;
|
||||
background-color: #875A7B;
|
||||
margin-left: -15px;
|
||||
margin-right: -15px;
|
||||
|
||||
&.blue {
|
||||
background-color: #4761e2;
|
||||
background-color: $blue;
|
||||
}
|
||||
|
||||
&.gold {
|
||||
background-color: #af881a;
|
||||
background-color: $gold;
|
||||
}
|
||||
|
||||
.test-entry {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: url(/survey/static/src/img/watermark.png);
|
||||
background-size: 20%;
|
||||
background-position: center;
|
||||
z-index: 4;
|
||||
}
|
||||
|
||||
.certification {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
|
||||
.test-entry {
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
.certification-failed p{
|
||||
margin-top: 30mm;
|
||||
}
|
||||
|
||||
.certification-seal {
|
||||
position: absolute;
|
||||
content: '';
|
||||
height: 610px;
|
||||
width: 860px;
|
||||
background: url(/survey/static/src/img/watermark.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
background-position: center;
|
||||
}
|
||||
}
|
||||
|
||||
&.classic {
|
||||
padding: 5mm;
|
||||
background-image: url(/survey/static/src/img/certification_bg_classic_default.jpg);
|
||||
color: #3e2e3a;
|
||||
|
||||
&.blue {
|
||||
background-image: url(/survey/static/src/img/certification_bg_classic_blue.jpg);
|
||||
color: #272d4f;
|
||||
background-size: 100%;
|
||||
}
|
||||
|
||||
&.gold {
|
||||
background-image: url(/survey/static/src/img/certification_bg_classic_gold.jpg);
|
||||
color: #5A4721;
|
||||
}
|
||||
|
||||
.certification {
|
||||
padding: 20mm;
|
||||
font-family: certification-serif, serif;
|
||||
font-family: Times;
|
||||
text-align: center;
|
||||
color: inherit;
|
||||
|
||||
.certification-name-label {
|
||||
padding: 5mm 0 8mm;
|
||||
}
|
||||
|
||||
.certification-name {
|
||||
font-size: 45pt;
|
||||
line-height: 0.9;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.2mm;
|
||||
}
|
||||
|
||||
.user-name {
|
||||
padding-bottom: 6mm;
|
||||
padding-top: 3mm;
|
||||
font-family: certification-cursive, cursive;
|
||||
letter-spacing: -0.2mm;
|
||||
word-spacing: 0.2mm;
|
||||
.certification-top {
|
||||
h1 {
|
||||
font-size: 60pt;
|
||||
}
|
||||
text-transform: uppercase;
|
||||
line-height: 24pt;
|
||||
|
||||
hr {
|
||||
border-color: inherit;
|
||||
margin: 15mm auto;
|
||||
opacity: 0.6;
|
||||
width: 50mm;
|
||||
|
||||
&.small {
|
||||
margin: 2mm auto;
|
||||
}
|
||||
}
|
||||
|
||||
.certification-description, .certification-date {
|
||||
padding: 5mm 40mm 10mm;
|
||||
}
|
||||
|
||||
.certificate-signature {
|
||||
position: absolute;
|
||||
bottom: 10mm;
|
||||
right: 10mm;
|
||||
left: 10mm;
|
||||
font-size: 14pt;
|
||||
|
||||
img {
|
||||
max-width: 40mm;
|
||||
max-height: 40mm;
|
||||
}
|
||||
span {
|
||||
font-size: 20pt;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.modern {
|
||||
background-image: url(/survey/static/src/img/certification_bg_modern.png);
|
||||
.certification-content {
|
||||
p {
|
||||
font-size: 16pt;
|
||||
color: $font-muted;
|
||||
|
||||
.certification {
|
||||
padding-left: 40mm;
|
||||
padding-right: 40mm;
|
||||
font-family: certification-modern, sans-serif;
|
||||
color: #223541;
|
||||
|
||||
.certification-bg-dark {
|
||||
display: inline-block;
|
||||
background-color: #223541;
|
||||
background: rgba(34, 53, 65, 0.1);
|
||||
}
|
||||
|
||||
.certification-top {
|
||||
.certification-bg-dark {
|
||||
margin-bottom: 10mm;
|
||||
padding: 20mm 6mm 5mm;
|
||||
text-align: center;
|
||||
width: 56mm;
|
||||
}
|
||||
|
||||
.certification-company-wrapper {
|
||||
padding: 1mm 2mm;
|
||||
|
||||
img {
|
||||
max-width: 40mm;
|
||||
max-height: 30mm;
|
||||
}
|
||||
.user-name {
|
||||
font-family: certification-cursive, cursive;
|
||||
font-size: 50pt;
|
||||
line-height: 2;
|
||||
color: $font-color;
|
||||
border-bottom: 1pt solid $font-color;
|
||||
}
|
||||
|
||||
.certification-name {
|
||||
font-size: 18pt;
|
||||
line-height: 1.5;
|
||||
text-transform: uppercase;
|
||||
font-size: 40pt;
|
||||
line-height: 0.9;
|
||||
color: $font-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.certification-bottom {
|
||||
position: absolute;
|
||||
bottom: 15mm;
|
||||
|
||||
.certification-date-wrapper {
|
||||
width: 80mm;
|
||||
padding: 10mm;
|
||||
text-align: center;
|
||||
|
||||
.certification-date {
|
||||
border-bottom: 1pt solid $font-color;
|
||||
}
|
||||
}
|
||||
|
||||
.certification-company {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
width: 33%;
|
||||
text-align: center;
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.certification-number {
|
||||
color: $font-muted;
|
||||
position: absolute;
|
||||
font-size: 10pt;
|
||||
}
|
||||
}
|
||||
|
||||
// Classic Template
|
||||
&.classic {
|
||||
|
||||
&.blue .certification {
|
||||
color: $blue;
|
||||
|
||||
.certification-top {
|
||||
&:before, &:after {
|
||||
background-image: url("/survey/static/src/img/classic-ornament-blue.svg");
|
||||
}
|
||||
}
|
||||
|
||||
.certification-content p .certification-name {
|
||||
color: $blue;
|
||||
}
|
||||
}
|
||||
|
||||
&.gold .certification {
|
||||
color: $gold;
|
||||
|
||||
.certification-top {
|
||||
&:before, &:after{
|
||||
background-image: url("/survey/static/src/img/classic-ornament-gold.svg");
|
||||
}
|
||||
}
|
||||
.certification-content p .certification-name {
|
||||
color: $gold;
|
||||
}
|
||||
}
|
||||
|
||||
.certification {
|
||||
background-image: url("/survey/static/src/img/certification_bg_classic.svg");
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
font-family: "certification-serif", serif;
|
||||
width: 295mm;
|
||||
height: 208mm;
|
||||
margin: 1mm;
|
||||
color: $purple;
|
||||
|
||||
.certification-top {
|
||||
padding-top: 10mm;
|
||||
|
||||
&:before, &:after {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 108mm;
|
||||
height: 16mm;
|
||||
margin: 0 auto;
|
||||
background-image: url("/survey/static/src/img/classic-ornament-purple.svg");
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
&:before {
|
||||
margin-bottom: 10mm;
|
||||
}
|
||||
|
||||
&:after {
|
||||
-webkit-transform: scaleY(-1);
|
||||
transform: scaleY(-1);
|
||||
margin-bottom: 5mm;
|
||||
}
|
||||
}
|
||||
.certification-content {
|
||||
margin-bottom: 10mm;
|
||||
|
||||
p .certification-name {
|
||||
color: $purple;
|
||||
}
|
||||
}
|
||||
|
||||
.certification-bottom {
|
||||
padding: 60mm 0 10mm;
|
||||
font-size: 16pt;
|
||||
width: 295mm;
|
||||
bottom: 20mm;
|
||||
|
||||
.certification-date-wrapper {
|
||||
margin-left: 40mm;
|
||||
font-size: 18pt;
|
||||
color: $font-muted;
|
||||
|
||||
span {
|
||||
font-size: 18pt;
|
||||
}
|
||||
|
||||
.user-name {
|
||||
margin-bottom: 20mm;
|
||||
font-family: certification-cursive, cursive;
|
||||
font-size: 50pt;
|
||||
}
|
||||
|
||||
.certification-bottom-group {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 40mm;
|
||||
left: 40mm;
|
||||
top: 220mm;
|
||||
.certification-seal {
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
-webkit-transform: translate(-50% , -50%);
|
||||
transform: translate(-50% , -50%);
|
||||
width: 24mm;
|
||||
height: 24mm;
|
||||
background: url(/survey/static/src/img/classic-seal.png) no-repeat;
|
||||
}
|
||||
|
||||
> div {
|
||||
display: inline-block;
|
||||
height: 100%;
|
||||
float: left;
|
||||
bottom: 0;
|
||||
top: 0;
|
||||
}
|
||||
.certification-company {
|
||||
padding-left: 10mm;
|
||||
right: 35mm;
|
||||
}
|
||||
|
||||
.certification-bg-dark {
|
||||
width: 56mm;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.certification-date {
|
||||
padding-right: 30mm;
|
||||
padding-left: 15mm;
|
||||
}
|
||||
.certification-number {
|
||||
bottom: -15mm;
|
||||
left: 50%;
|
||||
-webkit-transform: translateX(-50%);
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Modern Template
|
||||
&.modern {
|
||||
background-image: url("/survey/static/src/img/certification_bg_modern.svg");
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
|
||||
&.blue .certification .certification-seal {
|
||||
background-image: url("/survey/static/src/img/modern-seal-blue.svg");
|
||||
}
|
||||
|
||||
&.gold .certification .certification-seal {
|
||||
background-image: url("/survey/static/src/img/modern-seal-gold.svg");
|
||||
}
|
||||
|
||||
.certification {
|
||||
font-family: "certification-modern", sans-serif;
|
||||
width: 272mm;
|
||||
height: 185mm;
|
||||
margin: 12.5mm;
|
||||
background-color: $lightgrey;
|
||||
text-align: center;
|
||||
|
||||
.certification-seal {
|
||||
top: -7mm;
|
||||
right: 20mm;
|
||||
width: 22mm;
|
||||
height: 42mm;
|
||||
background-image: url("/survey/static/src/img/modern-seal-purple.svg");
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.certification-top {
|
||||
padding-top: 28mm;
|
||||
padding-bottom: 10mm;
|
||||
color: $font-color;
|
||||
|
||||
h1 b {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.certification-bottom {
|
||||
width: 272mm;
|
||||
|
||||
.certification-date-wrapper {
|
||||
margin-left: 40mm;
|
||||
text-transform: uppercase;
|
||||
|
||||
.certification-date {
|
||||
font-size: 18pt;
|
||||
color: $font-color;
|
||||
}
|
||||
|
||||
span {
|
||||
font-size: 14pt;
|
||||
color: $font-muted;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.certification-company {
|
||||
right: 30mm;
|
||||
}
|
||||
}
|
||||
|
||||
.certification-number {
|
||||
bottom: -6mm;
|
||||
right:0;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -5,71 +5,83 @@
|
||||
<!-- Style classes to be applyed to '#o_survey_certification': [no class](purple), gold, blue -->
|
||||
<div id="o_survey_certification" t-att-data-oe-model="user_input._name" t-att-data-oe-id="user_input.id" t-att-class="'article certification-wrapper modern %s' % layout_color">
|
||||
<div class="certification">
|
||||
<div t-if="user_input.test_entry" class="test-entry"/>
|
||||
<div class="certification-seal" t-if="user_input.scoring_success"/>
|
||||
<div class="certification-top">
|
||||
<div class="certification-bg-dark">
|
||||
<div class="certification-company-wrapper" t-field="user_input.survey_id.create_uid.company_id.logo" t-options="{'widget': 'image'}" role="img"/>
|
||||
<h1><b>Certificate</b>
|
||||
<br/><span t-if="user_input.scoring_success">of achievement</span>
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<div class="certification-content">
|
||||
<div t-if="user_input.scoring_success">
|
||||
<p>This certificate is presented to
|
||||
<br/><span class="user-name" t-esc="user_input.partner_id.name or user_input.email"/>
|
||||
|
||||
<br/>by <span class="certification-company" t-field="user_input.survey_id.create_uid.company_id.display_name"/> for successfully completing
|
||||
<br/><b><span class="certification-name" t-field="user_input.survey_id.display_name"/></b>
|
||||
</p>
|
||||
</div>
|
||||
<div t-else="" class="certification-failed">
|
||||
<p>Certification Failed</p>
|
||||
</div>
|
||||
<div class="certification-name" t-field="user_input.survey_id.display_name"/>
|
||||
</div>
|
||||
|
||||
<div class="certification-bottom">
|
||||
<div t-if="user_input.scoring_success">
|
||||
<h5 class="user-name-label">This Certificate is Presented to</h5>
|
||||
<div class="user-name" t-esc="user_input.partner_id.name or user_input.email"/>
|
||||
|
||||
<div class="certification-description">
|
||||
<span t-field="user_input.survey_id.create_uid.company_id.display_name"/> is proud to award this certificate to
|
||||
<span t-esc="user_input.partner_id.name or user_input.email"/> for graduating <span t-field="user_input.survey_id.display_name"/>.
|
||||
</div>
|
||||
<div class="certification-date-wrapper">
|
||||
<div class="certification-date" t-field="user_input.create_date" t-options='{"widget": "date"}'/>
|
||||
<span>Date</span>
|
||||
</div>
|
||||
<div t-else="">
|
||||
<h5>Certification Failed</h5>
|
||||
<div class="certification-company">
|
||||
<span class="certification-company-logo" t-field="user_input.survey_id.create_uid.company_id.logo" t-options="{'widget': 'image'}" role="img"/>
|
||||
</div>
|
||||
|
||||
<div class="certification-bottom-group">
|
||||
<div class="certification-bg-dark"/>
|
||||
<div class="certification-date">
|
||||
<h5>Date</h5>
|
||||
<h5 t-field="user_input.create_date" t-options='{"widget": "date"}'/>
|
||||
</div>
|
||||
<div class="certification-seal">
|
||||
<img src="/survey/static/src/img/certification_seal.svg" alt="Certification Seal" role="image"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="certification-number" t-if="user_input.scoring_success">
|
||||
Certification n°<t t-esc="str(user_input.id).rjust(10, '0')"/>
|
||||
</div>
|
||||
</div>
|
||||
<div t-if="user_input.test_entry" class="test-entry"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template id="certification_report_view_classic">
|
||||
<!-- Style classes to be applyed to '#o_survey_certification': [no class](purple), gold, blue -->
|
||||
<div id="o_survey_certification" t-att-data-oe-model="user_input._name" t-att-data-oe-id="user_input.id" t-att-class="'article certification-wrapper classic %s' % layout_color">
|
||||
<div t-if="user_input.test_entry" class="test-entry"/>
|
||||
<div class="certification">
|
||||
<div t-if="user_input.test_entry" class="test-entry"/>
|
||||
<h5 class="certification-name-label">CERTIFICATE</h5>
|
||||
<div class="certification-name" t-field="user_input.survey_id.display_name"/>
|
||||
<hr/>
|
||||
<div class="certification-top">
|
||||
<h1><b>Certificate</b>
|
||||
<br/><span t-if="user_input.scoring_success">of achievement</span>
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<div t-if="user_input.scoring_success">
|
||||
<h5>This Certificate is Presented to</h5>
|
||||
<div class="user-name" t-esc="user_input.partner_id.name or user_input.email"/>
|
||||
<hr class="small"/>
|
||||
<div class="certification-content">
|
||||
<div t-if="user_input.scoring_success">
|
||||
<p>This certificate is presented to
|
||||
<br/><span class="user-name" t-esc="user_input.partner_id.name or user_input.email"/>
|
||||
|
||||
<div class="certification-description">
|
||||
<span t-field="user_input.survey_id.create_uid.company_id.display_name"/> is proud to award this certificate to
|
||||
<span t-esc="user_input.partner_id.name or user_input.email"/> for graduating <span t-field="user_input.survey_id.display_name"/>.
|
||||
<br/>by <span class="certification-company" t-field="user_input.survey_id.create_uid.company_id.display_name"/>
|
||||
for successfully completing
|
||||
<br/><b><span class="certification-name" t-field="user_input.survey_id.display_name"/></b>
|
||||
</p>
|
||||
</div>
|
||||
<div t-else="" class="certification-failed">
|
||||
<p>Certification Failed</p>
|
||||
</div>
|
||||
</div>
|
||||
<div t-else="">
|
||||
<h5>Certification Failed</h5>
|
||||
</div>
|
||||
|
||||
<div class="certification-date" t-field="user_input.create_date" t-options='{"widget": "date"}'/>
|
||||
<img src="/survey/static/src/img/certification_seal.svg" alt="Certification Seal" role="img"/>
|
||||
|
||||
<div class="certificate-signature">
|
||||
<span t-field="user_input.survey_id.create_uid.company_id.logo" t-options="{'widget': 'image'}" role="img"/>
|
||||
<div class="certification-bottom">
|
||||
<div class="certification-date-wrapper">
|
||||
<b><div class="certification-date" t-field="user_input.create_date" t-options='{"widget": "date"}'/></b>
|
||||
<span>Date</span>
|
||||
</div>
|
||||
<div class="certification-seal"/>
|
||||
<div class="certification-company">
|
||||
<span class="certification-company-logo" t-field="user_input.survey_id.create_uid.company_id.logo" t-options="{'widget': 'image'}" role="img"/>
|
||||
</div>
|
||||
<div class="certification-number" t-if="user_input.scoring_success">
|
||||
Certification n°<t t-esc="str(user_input.id).rjust(10, '0')"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,6 +1,19 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<odoo>
|
||||
<data>
|
||||
<!-- Paper Format -->
|
||||
<record id="paperformat_survey_certification" model="report.paperformat">
|
||||
<field name="name">Survey Certification</field>
|
||||
<field name="default" eval="True"/>
|
||||
<field name="format">A4</field>
|
||||
<field name="orientation">Landscape</field>
|
||||
<field name="margin_top">0</field>
|
||||
<field name="margin_bottom">0</field>
|
||||
<field name="margin_left">0</field>
|
||||
<field name="margin_right">0</field>
|
||||
<field name="header_line" eval="False"/>
|
||||
<field name="header_spacing">0</field>
|
||||
</record>
|
||||
<!-- QWeb Reports -->
|
||||
<record id="certification_report" model="ir.actions.report">
|
||||
<field name="name">Certifications</field>
|
||||
@@ -12,6 +25,7 @@
|
||||
<field name="attachment">'certification.pdf'</field>
|
||||
<field name="binding_model_id" ref="model_survey_user_input"/>
|
||||
<field name="binding_type">report</field>
|
||||
<field name="paperformat_id" ref="paperformat_survey_certification"/>
|
||||
</record>
|
||||
</data>
|
||||
</odoo>
|
||||
|
||||
@@ -52,5 +52,18 @@
|
||||
</div>
|
||||
</t>
|
||||
</template>
|
||||
|
||||
<!-- simple template with no assets, to show title on the certification preview -->
|
||||
<template id="certification_preview">
|
||||
<html>
|
||||
<head>
|
||||
<title t-esc="'%s Preview' % page_title"/>
|
||||
<link rel="shortcut icon" href="/web/static/src/img/favicon.ico" type="image/x-icon"/>
|
||||
</head>
|
||||
<body style="margin:0;">
|
||||
<iframe type="application/pdf" t-att-src="preview_url" frameBorder="0" width="100%" height="100%"/>
|
||||
</body>
|
||||
</html>
|
||||
</template>
|
||||
</data>
|
||||
</odoo>
|
||||
|
||||