From 6ca64c8a57dea85196f635231f82b8164a3744c5 Mon Sep 17 00:00:00 2001 From: Estefania Cassingena Navone <85124911+estefaniacn@users.noreply.github.com> Date: Mon, 10 Jul 2023 02:29:25 -0400 Subject: [PATCH] feat: certification redesign (#50443) Co-authored-by: ahmad abdolsaheb --- client/i18n/locales/english/translations.json | 4 +- client/src/assets/images/ribbon.svg | 1 + .../client-only-routes/show-certification.tsx | 132 +++++++------ client/src/pages/certification.css | 182 ++++++++++-------- cypress/e2e/default/show-certification.ts | 8 +- 5 files changed, 172 insertions(+), 155 deletions(-) create mode 100644 client/src/assets/images/ribbon.svg diff --git a/client/i18n/locales/english/translations.json b/client/i18n/locales/english/translations.json index 136af68046c..511fa40826d 100644 --- a/client/i18n/locales/english/translations.json +++ b/client/i18n/locales/english/translations.json @@ -683,9 +683,9 @@ }, "certification": { "executive": "Executive Director, freeCodeCamp.org", - "verify": "Verify this certification at {{certURL}}", + "verify": "Verify this certification at:", "issued": "Issued", - "fulltext": "<0>This certifies that <1>{{user}} <2>has successfully completed the freeCodeCamp.org <3>{{title}} <4>Developer Certification, representing approximately {{time}} hours of coursework.", + "fulltext": "<0>This certifies that <1>{{user}} <2>successfully completed the <3>{{title}} <4>Developer Certification on {{time}}", "project": { "heading-legacy-full-stack": "As part of this Legacy Full Stack certification, {{user}} completed the following certifications:", "heading": "As part of this certification, {{user}} built the following projects and got all automated test suites to pass:", diff --git a/client/src/assets/images/ribbon.svg b/client/src/assets/images/ribbon.svg new file mode 100644 index 00000000000..4e52af4ac58 --- /dev/null +++ b/client/src/assets/images/ribbon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/client/src/client-only-routes/show-certification.tsx b/client/src/client-only-routes/show-certification.tsx index f48b24bbb10..9ba5fce5e73 100644 --- a/client/src/client-only-routes/show-certification.tsx +++ b/client/src/client-only-routes/show-certification.tsx @@ -32,6 +32,7 @@ import reallyWeirdErrorMessage from '../utils/really-weird-error-message'; import standardErrorMessage from '../utils/standard-error-message'; import { PaymentContext } from '../../../config/donation-settings'; +import ribbon from '../assets/images/ribbon.svg'; import ShowProjectLinks from './show-project-links'; const { clientLocale } = envData; @@ -208,13 +209,7 @@ const ShowCertification = (props: ShowCertificationProps): JSX.Element => { return ; } - const { - date, - name: userFullName = null, - username, - certTitle, - completionTime - } = cert; + const { date, name: userFullName = null, username, certTitle } = cert; const { user } = props; @@ -302,64 +297,73 @@ const ShowCertification = (props: ShowCertificationProps): JSX.Element => { return ( {isDonationDisplayed && !isDonationClosed ? donationSection : ''} - -
- -
-
- - -
- {t('certification.issued')}  - - {certDate.toLocaleString([localeCode, 'en-US'], { - year: 'numeric', - month: 'long', - day: 'numeric' - })} - -
- -
- -
-
- -

placeholder

-

- {{ user: displayName }} -

-

placeholder

-

- - {{ title: t(`certification.title.${certTitle}`, certTitle) }} - -

-

{{ time: completionTime }}

- -
-
-
-
- Quincy Larson's Signature -

- Quincy Larson -

-

{t('certification.executive')}

-
- - - - -

- {t('certification.verify', { certURL: certURL })} -

+ + + +
+ +
+
+ +
+
+
+ +

placeholder

+

+ {{ user: displayName }} +

+

placeholder

+

+ + {{ + title: t(`certification.title.${certTitle}`, certTitle) + }} + +

+

+ {{ + time: certDate.toLocaleString([localeCode, 'en-US'], { + year: 'numeric', + month: 'long', + day: 'numeric' + }) + }} +

+ +
+
+
+
+ Quincy Larson's Signature +

+ Quincy Larson +

+

{t('certification.executive')}

+
+ + + + + + + +

+ {t('certification.verify')} +
+ {certURL} +

+ +
-
+
diff --git a/client/src/pages/certification.css b/client/src/pages/certification.css index 84ef55e662e..53c6d086439 100644 --- a/client/src/pages/certification.css +++ b/client/src/pages/certification.css @@ -4,16 +4,15 @@ } .certification-namespace h1 { - margin: 12px 0; + margin: 15px 0; } .certification-namespace { max-width: 1500px; width: 100%; - padding: 30px; - border: var(--theme-color) 15px solid; + border: var(--gray-00) 3px solid; border-radius: 3px; - background-color: var(--gray-00); + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' viewBox='0 0 450 390' height='520' version='1.0'%3E%3Cdefs%3E%3CclipPath id='s'%3E%3Cpath d='M393 0h56.957v33.25H393zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='c'%3E%3Cpath d='M0 0h450v390H0z'/%3E%3C/clipPath%3E%3CclipPath id='d'%3E%3Cpath d='M74.246 388.5h1.75v1.496h-1.75zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='e'%3E%3Cpath d='M111.73 373h29.485v16.996H111.73zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='f'%3E%3Cpath d='M75 356.75h57.219v33.246H75zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='g'%3E%3Cpath d='M159 356.75h10.703v33.246H159zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='h'%3E%3Cpath d='M205.434 324.75h1.75v65.246h-1.75zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='i'%3E%3Cpath d='M223.426 324.75h40.73v65.246h-40.73zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='j'%3E%3Cpath d='M177.7 324.75h11.491v65.246H177.7zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='k'%3E%3Cpath d='M18.023 324.75h57.223v65.246H18.023zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='l'%3E%3Cpath d='M.035 324.75h39.23v65.246H.036zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='m'%3E%3Cpath d='M393 128.5h56.957v34.75H393zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='n'%3E%3Cpath d='M449.316 65h.641v65h-.64zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='o'%3E%3Cpath d='M412.586 172.5h37.371v24h-37.371zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='p'%3E%3Cpath d='M449.316 194h.641v1h-.64zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='q'%3E%3Cpath d='M430.574 150.75h19.383V164h-19.383zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='r'%3E%3Cpath d='M449.316 130h.641v1.5h-.64zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='I'%3E%3Cpath d='M430.574 324.75h1.75v65.246h-1.75zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='t'%3E%3Cpath d='M412.586 42.5h37.371v24h-37.371zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='u'%3E%3Cpath d='M449.316 64h.641v1h-.64zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='v'%3E%3Cpath d='M430.574 20.75h19.383V34h-19.383zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='w'%3E%3Cpath d='M449.316 0h.641v1.5h-.64zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='x'%3E%3Cpath d='M393 226h56.957v67.25H393zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='y'%3E%3Cpath d='M449.316 194.75h.641V260h-.64zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='z'%3E%3Cpath d='M412.586 302.5h37.371V325h-37.371zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='A'%3E%3Cpath d='M449.316 324h.641v1h-.64zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='B'%3E%3Cpath d='M430.574 280.75h19.383V294h-19.383zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='C'%3E%3Cpath d='M449.316 260h.641v1.5h-.64zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='D'%3E%3Cpath d='M336.621 373h29.484v16.996h-29.484zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='E'%3E%3Cpath d='M243 259.75h133.602v130.246H243zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='F'%3E%3Cpath d='M402.59 324.75h11.742v65.246H402.59zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='G'%3E%3Cpath d='M384 356.75h10.594v33.246H384zm0 0'/%3E%3C/clipPath%3E%3CclipPath id='H'%3E%3Cpath d='M448.566 324.75h1.391v65.246h-1.39zm0 0'/%3E%3C/clipPath%3E%3Cfilter x='0%25' y='0%25' width='100%25' height='100%25' id='a'%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 1 0' color-interpolation-filters='sRGB'/%3E%3C/filter%3E%3Cmask id='b'%3E%3Cg filter='url(%23a)'%3E%3Cpath fill-opacity='.098' d='M-45-39h540v468H-45z'/%3E%3C/g%3E%3C/mask%3E%3C/defs%3E%3Cg mask='url(%23b)'%3E%3Cg clip-path='url(%23c)'%3E%3Cpath fill='%233b3b4f' d='m56.691 31.852-1.12 1.945V52.87l-8.258-4.77-.747 1.297 9.004 5.204V65h1.5V32.496a.747.747 0 0 0-.379-.644M94.574 33.797l.004.004V0h-1.5v31.203-.004V65h1.496V33.797M65.32 16.902l9.004 5.2v42.464l-.75.434h2.246V.434L76.57 0h-1.496l-.75 1.3v19.071l-8.254-4.77-.75 1.301M47.316 81.898l28.133-16.25A.752.752 0 0 0 75.82 65h-2.246l-16.508 9.535V65h-1.5v10.402l-9 5.2.75 1.296M66.07 114.398l27.008-15.601 1.5-2.602-29.258 16.903.75 1.3'/%3E%3Cpath fill='%233b3b4f' d='m55.57 96.2 1.121 1.945.004.003 55.137-31.851.75-1.297v-.004h1.477l-.75-.43v-.824l.023-.043V44.63l8.238 4.754-.007.015 27.007 15.598h3L122.328 48.11l.008-.011h-.004l-9-5.203V.434l.75-.434h-2.25v64.566l-.75.434-16.508 9.535V65h-1.5v10.398L56.32 96.633l-.75-.434M74.324 128.695l.75 1.301.375-.648.375-.653-.75.434-.75-.434'/%3E%3Cpath fill='%233b3b4f' d='m130.945 33.137-.004.011-.004.004L186.078 65h1.496l-.75-1.3-16.508-9.536 8.254-4.766-.75-1.3-9.004 5.199-36.754-21.23v-.825l.024-.039V12.13l8.238 4.758-.008.015 28.133 16.25a.748.748 0 0 0 .746-.004l-1.12-1.945-16.512-9.535 8.257-4.77-.75-1.296-9.004 5.199-8.984-5.188.008-.015-9.004-5.2V0h-1.5v32.5c0 .273.144.504.36.637M130.96 96.852l-55.136 31.847-.75 1.297h1.5l16.508-9.535v9.535h1.5v-10.402l36.754-21.227.75.43-1.125-1.945M140.336 113.098l-28.133 16.25a.752.752 0 0 0-.371.648h2.246l16.508-9.535.004 9.535h1.496v-10.402l9-5.2-.75-1.296M93.078 98.8l29.254-16.902-.746-1.296-27.012 15.601-1.496 2.598M112.207 65.648l-.375.649.75-.43.75.43-.75-1.297-.375.648'/%3E%3Cpath fill='%233b3b4f' d='m112.582 65 .75 1.297 16.508 9.539-8.254 4.766.75 1.296 9.004-5.199 36.754 21.235v.863l1.125-1.945L114.082 65h-1.5M130.96 96.852l1.126 1.945 16.508 9.531-8.254 4.774.75 1.296 9.004-5.203 9 5.2.75-1.297-28.133-16.25a.737.737 0 0 0-.75.004M148.59 65l29.258 16.898.75-1.296L151.586 65h-2.996M187.598 65h-1.496l.746.434v.863l.75-1.297M169.223 96.852l-1.125 1.945v19.07l-8.254-4.765-.75 1.296 9.004 5.204v10.394h1.5v-32.5a.744.744 0 0 0-.375-.644M207.105 98.797v.004V65h-1.5v31.2-.005 33.801h1.5v-31.2'/%3E%3Cpath fill='%233b3b4f' d='m178.598 80.602-.75 1.296v.004l9.004 5.2v42.464l-.75.43h2.25V65.434l.75-.434 16.507-9.54v9.536h1.5V54.598l36.754-21.23.75.429-1.12-1.945h-.005l-55.136 31.847-.75 1.301-.75 1.297V85.37l-8.254-4.77'/%3E%3Cpath fill='%233b3b4f' d='M188.352 129.996h-2.247l-16.507 9.54-.004-9.536h-1.496v10.402l-9 5.2.75 1.296 28.129-16.25a.749.749 0 0 0 .375-.652M178.602 179.395l27.007-15.602 1.5-2.598-29.257 16.903.75 1.297M187.977 194.348l.375-.653-.75.438-.75-.438.75 1.301.375-.648'/%3E%3Cpath fill='%233b3b4f' d='m234.863 113.094-9.004-5.2v-42.46l.75-.434h-2.25v64.566l-.75.43-16.507 9.54v-9.54h-1.5v10.402l-36.754 21.235-.75-.434 1.125 1.946v.003l55.136-31.851.75-1.3h1.477l-.75-.43v-.829l.023-.039v-19.07l8.239 4.754-.008.015 27.012 15.598h2.996l-29.239-16.887.004-.011v-.004M252.867 178.098l-28.133 16.25a.739.739 0 0 0-.37.648h2.241l16.512-9.535v9.535h1.5v-10.402l9-5.2-.75-1.296M205.605 163.8l29.258-16.902-.75-1.296-27.008 15.601-1.5 2.598'/%3E%3Cpath fill='%233b3b4f' d='M205.61 194.996h1.5v-10.402l36.753-21.23.75.433-1.12-1.945-.005-.004-55.136 31.851-.75 1.297-.75 1.3v19.071l-8.254-4.765-.75 1.296 9.004 5.204v42.46l-.75.434h2.25V195.43l.75-.434 16.507-9.535v9.535M225.11 130l-.75 1.297.75-.43.75.43-.75-1.297M264.117 129.996h-3l29.207 16.871-.02.031v.004l9.005 5.2v42.46l-.75.434h2.25V130.43l.75-.434h-1.5V130h-1.43l.75.434v.746l-.07.117v19.074l-8.2-4.738.016-.031-27.008-15.606M159.848 16.902 187.977.648a.743.743 0 0 0 .375-.648h-2.247l-16.507 9.54-.004-9.54h-1.496v10.402l-9 5.2.75 1.3M178.602 49.398l27.007-15.601 1.5-2.598-29.257 16.899.75 1.3M168.098 31.2l1.125 1.948v.004l55.136-31.851.75-1.301h-1.5l-16.507 9.535V0h-1.5v10.402l-36.754 21.23-.75-.433M187.977 64.348l.375-.649-.75.434-.75-.434.75 1.297.375-.648M252.867 48.098l-28.133 16.25a.748.748 0 0 0-.37.648h2.241l16.512-9.535v9.535h1.5V54.594l9-5.196-.75-1.3'/%3E%3Cpath fill='%233b3b4f' d='m205.605 33.8 29.258-16.898-.75-1.3-27.008 15.601-1.5 2.598M225.11 0l-.376.648-.375.653.75-.434.75.434L225.11 0'/%3E%3Cpath fill='%233b3b4f' d='m242.371 10.836-8.254 4.766h-.004l.75 1.3h.004l9-5.203 36.754 21.235v.746l-.066.117V52.87l-8.203-4.742.02-.031-28.134-16.25a.739.739 0 0 0-.746.004l1.121 1.945 16.508 9.535-8.254 4.77.75 1.296 9.004-5.203 8.95 5.172-.016.031 9 5.204V65h1.5V32.496a.735.735 0 0 0-.325-.61l.016-.034L226.61 0h-1.496l.746 1.3 16.512 9.536M57.07 194.996v-32.5a.743.743 0 0 0-.379-.644l-1.12 1.941v19.074l-8.258-4.765-.747 1.296 9.004 5.204v10.394h1.5M66.07 145.602l-.75 1.296v.004l9.004 5.2v42.46l-.75.434h2.246V130.43l.75-.434h-1.496l-.75 1.3v19.075l-8.254-4.77'/%3E%3Cpath fill='%233b3b4f' d='m56.695 228.148 55.137-31.851.75-1.3h1.477l-.75-.435v-.824l.023-.039v-19.074l8.238 4.758-.007.012 27.007 15.601h3l-29.242-16.89.008-.012h-.004l-9-5.2V130.43l.75-.434h-2.25v64.566l-.75.434-16.508 9.535v-9.535h-1.5v10.402L56.32 226.633l-.75-.438 1.121 1.95.004.003'/%3E%3Cpath fill='%233b3b4f' d='m47.316 211.898 28.133-16.25a.752.752 0 0 0 .371-.648h-2.246l-16.508 9.535V195h-1.5v10.398l-9 5.204.75 1.296M93.078 228.793l1.5-2.598-29.258 16.899.75 1.3 27.008-15.601M75.45 259.344l.374-.649-.75.434-.75-.434.75 1.301.375-.652M168.45 163.148c.238.141.523.13.745 0l-1.12-1.945-16.512-9.539 8.257-4.766-.75-1.3-9.004 5.199-8.984-5.188.008-.011-9.004-5.2v-10.402h-1.5V162.5c0 .27.144.504.36.637l-.005.008-.004.003 55.141 31.848h1.496l-.75-1.297-16.508-9.535 8.254-4.77-.75-1.3v.004l-9.004 5.199-36.754-21.234v-.825l.024-.035V142.13l8.238 4.758-.008.011 28.133 16.25M93.078 161.2v-.005 33.801h1.496v-31.2h.004v-33.8h-1.5V161.2M140.336 243.094l-28.133 16.25a.758.758 0 0 0-.371.652h2.246l16.508-9.535.004 9.535h1.496v-10.402l9-5.2-.75-1.3'/%3E%3Cpath fill='%233b3b4f' d='m93.078 228.797 29.254-16.899-.746-1.3-27.012 15.601-1.496 2.598M94.582 259.996v-10.402l36.754-21.23.75.433-1.125-1.945v-.004l-55.137 31.847-.75 1.301h1.5l16.508-9.535v9.535h1.5M112.582 195l-.75 1.297.75-.434.75.434-.75-1.297M178.598 210.598 151.586 195h-2.996l29.258 16.898.75-1.3'/%3E%3Cpath fill='%233b3b4f' d='m150.094 239.195 9 5.2.75-1.301-28.133-16.25a.755.755 0 0 0-.75.004l1.125 1.945 16.508 9.535-8.254 4.77.75 1.3 9.004-5.203M169.219 226.852v-.004l-55.137-31.852h-1.5l.75 1.3 16.508 9.536-8.254 4.77.75 1.296 9.004-5.199 36.754 21.23v.868l1.125-1.945M187.598 195h-1.496l.746.43v.867l.75-1.297M168.098 259.996h1.5v-32.5a.75.75 0 0 0-.375-.648l-1.125 1.945v19.074l-8.254-4.77-.75 1.301 9.004 5.2v10.398M159.848 276.898l28.129-16.25a.753.753 0 0 0 .375-.652h-2.247l-16.507 9.535-.004-9.535h-1.496v10.402l-9 5.2.75 1.3M207.11 291.195l-29.258 16.899.75 1.297 27.007-15.598 1.5-2.598M187.977 324.344l.375-.649-.75.434-.75-.434.75 1.301.375-.652'/%3E%3Cpath fill='%233b3b4f' d='m234.863 243.094-9.004-5.203V195.43l.75-.434h-2.25v64.566l-.746.434h-.004l-16.507 9.535v-9.535h.003v-65h-1.5V226.2v-.004 33.801h-.003v10.402l-36.754 21.23-.75-.433 1.125 1.946v.004l55.136-31.848.75-1.3h1.477l-.75-.435v-.824l.023-.043v-19.07l8.239 4.758-.008.012 27.012 15.601h2.996l-29.239-16.89.004-.012M252.867 308.094l-28.133 16.25a.745.745 0 0 0-.37.652h2.241l16.512-9.539v9.54h1.5v-10.403l9-5.203-.75-1.297M234.113 275.598l-27.008 15.601-1.5 2.598 29.258-16.899-.75-1.3'/%3E%3Cpath fill='%233b3b4f' d='m224.36 261.297.75-.434.75.434-.75-1.3-.376.651-.375.649M244.613 293.797l-1.12-1.945-.005-.004-55.136 31.847-.75 1.301h1.5l16.507-9.535v9.535h1.5v-10.402l36.754-21.23.75.433M55.57 324.996h1.5v-32.5a.754.754 0 0 0-.379-.648l-1.12 1.945v19.074l-8.258-4.77-.747 1.301 9.004 5.2v10.398M47.316 341.898l28.133-16.253a.747.747 0 0 0 .371-.649h-2.246l-16.508 9.535v-9.535h-1.5v10.402l-9 5.2.75 1.3M94.578 356.191 65.32 373.094l.75 1.297 27.008-15.598 1.5-2.602'/%3E%3Cg clip-path='url(%23d)'%3E%3Cpath fill='%233b3b4f' d='m75.074 389.996.375-.652.375-.649-.75.434-.75-.434.75 1.301'/%3E%3C/g%3E%3Cpath fill='%233b3b4f' d='m187.574 324.996-.75-1.3-16.508-9.536 8.254-4.77-.75-1.296-9.004 5.203-36.754-21.235v-.824l.024-.039v-19.07l8.234 4.754-.004.015 28.133 16.25c.238.141.524.125.746-.003l-1.12-1.946-16.512-9.535 8.257-4.77-.75-1.3-9.004 5.203-8.984-5.188.008-.015-9.004-5.2v-10.398h-1.5v32.5c0 .27.144.508.36.637l-.005.008-.004.004 55.141 31.851h1.496'/%3E%3Cpath fill='%233b3b4f' d='m122.328 308.105.008-.011h-.004l-9-5.203V260.43l.75-.434h-2.25v64.567l-.75.433-16.508 9.535v-9.535h-1.5v10.402l-36.754 21.23-.75-.433 1.121 1.946.004.004 55.137-31.848.75-1.3h1.477l-.75-.435v-.824l.023-.043v-19.07l8.234 4.758-.004.008 27.008 15.605h3l-29.242-16.89'/%3E%3Cpath fill='%233b3b4f' d='M93.078 291.195v33.801h1.496v-31.203l.004.004v-33.8h-1.5v31.198M76.57 259.996h-1.496l-.75 1.3v19.071l-8.254-4.765-.75 1.296 9.004 5.204v42.46l-.75.434h2.246V260.43l.75-.434'/%3E%3Cg clip-path='url(%23e)'%3E%3Cpath fill='%233b3b4f' d='m140.336 373.094-28.133 16.25a.753.753 0 0 0-.371.652h2.246l16.508-9.539.004 9.54h1.496v-10.403l9-5.203-.75-1.297'/%3E%3C/g%3E%3Cpath fill='%233b3b4f' d='m121.586 340.598-27.012 15.597-1.496 2.602 29.254-16.902-.746-1.297'/%3E%3Cg clip-path='url(%23f)'%3E%3Cpath fill='%233b3b4f' d='m132.086 358.797-1.125-1.95v-.003l-55.137 31.851-.75 1.301h1.5l16.508-9.539v9.539h1.496v-.004l.004-10.398 36.754-21.235.75.438'/%3E%3C/g%3E%3Cpath fill='%233b3b4f' d='m112.582 324.996-.375.649-.375.652.75-.434.75.434-.75-1.3M131.71 356.844a.756.756 0 0 0-.75 0l1.126 1.949 16.508 9.535-8.254 4.766.75 1.3 9.004-5.203 9 5.2.75-1.297-28.133-16.25M151.586 324.996h-2.996l29.258 16.899.75-1.297-27.012-15.602M169.219 356.848v-.004l-55.137-31.848h-1.5l.75 1.3 16.508 9.532-8.254 4.77.75 1.3 9.004-5.203 36.754 21.235v.867l1.125-1.95M187.598 324.996h-1.496l.746.434v.867l.75-1.3'/%3E%3Cg clip-path='url(%23g)'%3E%3Cpath fill='%233b3b4f' d='m169.223 356.848-1.125 1.945v19.074l-8.254-4.77-.75 1.298 9.004 5.203v10.398h1.5v-32.504a.744.744 0 0 0-.375-.644'/%3E%3C/g%3E%3Cg clip-path='url(%23h)'%3E%3Cpath fill='%233b3b4f' d='M205.605 356.195v33.801h1.5v-31.203.004-33.8h-1.5v31.198'/%3E%3C/g%3E%3Cg clip-path='url(%23i)'%3E%3Cpath fill='%233b3b4f' d='m234.863 373.094-9.004-5.203V325.43l.75-.434h-2.25v64.567l-.75.433h2.977l-.75-.437v-.825l.023-.039v-19.074l8.239 4.762-.008.008 27.012 15.605h2.996l-29.239-16.89.004-.012'/%3E%3C/g%3E%3Cg clip-path='url(%23j)'%3E%3Cpath fill='%233b3b4f' d='M189.102 324.996h-1.5l-.75 1.3v19.071l-8.254-4.765v-.004l-.75 1.3 9.004 5.204v42.46l-.75.434h2.25V325.43l.75-.434'/%3E%3C/g%3E%3Cpath fill='%233b3b4f' d='m18.39 98.148 55.137 31.848h1.5l-.75-1.297-16.507-9.535 8.253-4.77-.75-1.296-9.003 5.199-36.754-21.23v-.825l.02-.039V77.13l8.237 4.758-.007.011 28.132 16.25c.243.141.524.13.75 0l-1.125-1.945-16.507-9.539 8.254-4.766-.75-1.3-9.004 5.203-8.985-5.192.008-.011-9.004-5.2V65h-1.5v32.5c0 .27.149.504.36.633l-.004.012v.003'/%3E%3Cpath fill='%233b3b4f' d='M.758 129.996h.75l-.75-.43v-.824l.023-.043v-19.07l8.239 4.754-.008.015 27.011 15.598h2.997L9.78 113.11l.004-.011v-.004l-9.004-5.2v-42.46l.75-.434H.035v64.996h.723M18.04 185.46v9.536h1.5v-10.402l9-5.2-.75-1.296-27.755 16.03v.868h1.496l16.508-9.535M9.035 145.602l-9 5.199v1.73l9.75-5.633-.75-1.296M19.535 163.797l-1.12-1.945-.005-.004L.035 172.465v1.73l18.75-10.832.75.434M.035 130v.867l.746.43zm0 0'/%3E%3Cpath fill='%233b3b4f' d='m65.297 146.898.75-1.296-27.008-15.606h-3l29.258 16.902M28.54 179.398l9.003-5.203 9.004 5.2.746-1.297-28.133-16.254a.748.748 0 0 0-.746.004l1.121 1.945 16.512 9.535-8.258 4.77.75 1.3M9.04 145.602l.75 1.296 9.003-5.199 36.754 21.23v.868l1.121-1.945.004-.004-55.137-31.852h-1.5l.75 1.3 16.508 9.54-8.254 4.766M75.05 130h-1.5l.75.434v.863l.75-1.297M18.04 55.46v9.536h1.5V54.594l9-5.196-.75-1.3L.034 64.128v.868h1.496l16.508-9.535M9.035 15.602l-9 5.203v1.726l9.75-5.629-.75-1.3M19.535 33.797l-1.12-1.945h-.005L.035 42.469v1.726l18.75-10.828.75.43M.035.004v.863l.746.434zM17.293 10.836l-8.254 4.766.75 1.3 9.004-5.203 36.754 21.235v.863l1.121-1.945h.004L1.535 0h-1.5l.75 1.3 16.508 9.536M66.047 15.602 39.039 0h-3l29.258 16.902.75-1.3'/%3E%3Cpath fill='%233b3b4f' d='m28.54 49.398 9.003-5.203 9.004 5.203.746-1.3-28.133-16.25a.739.739 0 0 0-.746.004l1.121 1.945 16.512 9.535-8.258 4.77.75 1.296M74.3 1.3l.75-1.3h-1.5l.75.434V1.3M18.39 228.148l55.137 31.848h1.5l-.75-1.3-16.507-9.536 8.253-4.765-.75-1.301-9.003 5.203-36.754-21.234v-.825l.02-.039v-19.07l8.237 4.754-.007.015 28.132 16.25c.243.141.524.125.75 0l-1.125-1.945-16.507-9.539 8.254-4.77-.75-1.296-9.004 5.199-8.985-5.188.008-.015-9.004-5.2v-10.398h-1.5V227.5c0 .27.149.504.36.633l-.004.012v.003'/%3E%3Cpath fill='%233b3b4f' d='M.758 259.996h.75l-.75-.433v-.825l.023-.043v-19.07l8.239 4.758-.008.012 27.011 15.601h2.997L9.78 243.106l.004-.012-9.004-5.203V195.43l.75-.434H.035v65h.723M18.04 315.457v9.54h1.5v-10.403l9-5.203-.75-1.297L.034 324.129v.867h1.496l16.508-9.539M9.035 275.598l-9 5.199v1.734l9.75-5.633-.75-1.3M19.535 293.797l-1.12-1.945-.005-.004L.035 302.46v1.734l18.75-10.832.75.434M.035 260v.867l.746.43zM65.297 276.898l.75-1.3-27.008-15.602h-3l29.258 16.902'/%3E%3Cpath fill='%233b3b4f' d='m28.54 309.395 9.003-5.2 9.004 5.196.746-1.297-28.133-16.25a.739.739 0 0 0-.746.004l1.121 1.945 16.512 9.535-8.258 4.77.75 1.297M9.04 275.602l.75 1.296 9.003-5.203 36.754 21.235v.867l1.121-1.945.004-.004-55.137-31.852h-1.5l.75 1.3 16.508 9.536-8.254 4.766v.004M75.05 259.996h-1.5l.75.434v.867l.75-1.3'/%3E%3Cg clip-path='url(%23k)'%3E%3Cpath fill='%233b3b4f' d='m57.77 379.16 8.253-4.77-.75-1.296-9.003 5.199-36.754-21.23v-.829l.02-.039v-19.07l8.237 4.758-.007.015 28.132 16.25a.755.755 0 0 0 .75-.003l-1.125-1.946-16.507-9.535 8.254-4.77-.75-1.3-9.004 5.203-8.985-5.188.008-.015-9.004-5.203v-10.395h-1.5v32.5c0 .27.149.504.36.637l-.004.008v.004l55.136 31.851h1.5l-.75-1.3-16.507-9.536'/%3E%3C/g%3E%3Cg clip-path='url(%23l)'%3E%3Cpath fill='%233b3b4f' d='M9.785 373.094.781 367.89V325.43l.75-.434H.035v65h1.473l-.75-.437v-.825l.023-.039v-19.074l8.239 4.762-.008.008 27.011 15.605h2.997L9.78 373.106l.004-.012'/%3E%3C/g%3E%3Cpath fill='%233b3b4f' d='M319.563 33.797v.004V0h-1.497v31.203l-.003-.004V65h1.5V33.797M300.707 22.047zm-.648.375zm-9.754-5.52 9.004 5.2v42.464l-.75.434h2.25V.434l.75-.434h-2.93l.75.434v.746l-.07.12v19.071l-8.2-4.738.016-.031L264.117 0h-3l29.207 16.871-.02.031'/%3E%3Cpath fill='%233b3b4f' d='m280.621 96.238-.02-.035-16.507-9.539 8.254-4.766-.012-.02 28.101-16.23a.752.752 0 0 0 .372-.648h-2.247l-16.507 9.535V65h-1.5v10.402l-9 5.2.011.015-8.972 5.184-8.98-5.192.003-.011-9.004-5.2V65h-1.5v32.5c0 .27.149.504.364.633l-.008.012v.003l55.136 31.848h2.954l16.507-9.535v9.535h1.5v-10.402l36.754-21.227.75.43-1.12-1.945h-.005l-55.136 31.847-.727 1.262.356-.613.375-.653-.75.434-.688-.395-.02-.035-16.507-9.535 8.254-4.77-.012-.015 26.976-15.582 1.497-2.602-29.254 16.903.011.02-8.972 5.179-36.754-21.23v-.825l.02-.039V77.13l8.238 4.758-.008.011 28.133 16.25c.242.141.523.13.75 0l-.012-.02 55.105-31.831.746-1.297v-.004h1.48l-.75-.43v-.824l.02-.043V44.63l8.239 4.754-.004.015 27.004 15.598h3L347.316 48.11l.004-.011-9.004-5.203V.434l.75-.434h-2.246v64.566l-.75.434-16.511 9.535V65h-1.5v10.398l-36.754 21.235-.684-.395'/%3E%3Cpath fill='%233b3b4f' d='m355.934 33.137-.008.011v.004L411.063 65h1.5l-.75-1.3-16.508-9.536 8.254-4.766-.75-1.3-9.004 5.199-36.754-21.23v-.825l.02-.039V12.13l8.238 4.758-.004.015 28.129 16.25a.755.755 0 0 0 .75-.004l-1.122-1.945-16.511-9.535 8.254-4.77-.75-1.296-9 5.199-8.985-5.188.008-.015-9.008-5.2V0h-1.5v32.5c0 .273.149.504.364.637M336.82 129.996h2.246l16.508-9.535v9.535h1.5v-10.402l9-5.2-.75-1.296-28.133 16.25a.752.752 0 0 0-.37.648M318.063 98.8l29.257-16.902-.75-1.296-27.007 15.601-1.5 2.598M337.566 65l-.375.648-.37.649.745-.43.75.43-.75-1.297'/%3E%3Cpath fill='%233b3b4f' d='m373.582 108.328-8.258 4.774.75 1.296 9.008-5.203 9 5.2.75-1.297-28.137-16.25a.73.73 0 0 0-.746.004l1.121 1.945 16.512 9.531M403.586 80.602 376.574 65h-3l29.262 16.898.75-1.296M347.324 81.898l9.004-5.199 36.754 21.235v.863l1.125-1.945L339.067 65h-1.5l.75 1.297 16.511 9.539-8.254 4.766.75 1.296M412.586 65h-1.496l.75.434v.863l.746-1.297'/%3E%3Cpath fill='%233b3b4f' d='M413.34 66.297 412.59 65l-.75 1.297V85.37l-8.254-4.77-.75 1.297v.004l9.004 5.2v42.464l-.75.43h2.25v-63.7M394.586 129.996v-32.5a.74.74 0 0 0-.379-.644l-1.121 1.945v19.07l-8.254-4.765-.75 1.296 9.004 5.204v10.394h1.5M430.594 129.996h1.5v-31.2l-1.5-2.6v33.8'/%3E%3Cg clip-path='url(%23m)'%3E%3Cpath fill='%233b3b4f' d='M430.688 141.207zm18.66-12.508v.867l-.75.43-16.508 9.54v-9.54h-1.5v10.402l-36.754 21.235-.75-.434 1.121 1.946v.003l55.14-31.851.61-1.055v-.488l-.234-.406-.375-.649'/%3E%3C/g%3E%3Cpath fill='%233b3b4f' d='M413.336 129.996h-2.242l-16.512 9.54V130h-1.5l.004 10.402-9.004 5.2.75 1.296 28.133-16.25a.745.745 0 0 0 .37-.652M432.094 161.195l-29.258 16.903.75 1.297 27.008-15.602 1.5-2.598M412.965 194.348l.375-.653-.75.438-.75-.438.75 1.301.375-.648'/%3E%3Cg clip-path='url(%23n)'%3E%3Cpath fill='%233b3b4f' d='M449.348 65v63.7l.609 1.054V65h-.61'/%3E%3C/g%3E%3Cpath fill='%233b3b4f' d='M432.094 65h-1.5v31.203l1.5 2.598V65'/%3E%3Cg clip-path='url(%23o)'%3E%3Cpath fill='%233b3b4f' d='M432 183.79zm-19.41 11.206.375.652.375.649v-.867l.75-.434 16.508-9.535-.004 9.535h1.5l.004-10.402 17.859-10.317v-1.73l-36.617 21.152-.75 1.297'/%3E%3C/g%3E%3Cg clip-path='url(%23p)'%3E%3Cpath fill='%233b3b4f' d='M449.348 194.996h.609v-.785l-.234.137a.743.743 0 0 0-.375.648'/%3E%3C/g%3E%3Cg clip-path='url(%23q)'%3E%3Cpath fill='%233b3b4f' d='m430.594 163.8 19.363-11.187v-1.73l-17.863 10.32-1.5 2.598'/%3E%3C/g%3E%3Cg clip-path='url(%23r)'%3E%3Cpath fill='%233b3b4f' d='m449.348 131.297.609-.352v-.703l-.234.406-.375.649'/%3E%3C/g%3E%3Cg clip-path='url(%23s)'%3E%3Cpath fill='%233b3b4f' d='M430.688 11.21zM448.598 0 432.09 9.535V0h-1.5v10.402l-36.754 21.23-.75-.433 1.121 1.95v.003l55.14-31.851.61-1.059V0h-1.36'/%3E%3C/g%3E%3Cpath fill='%233b3b4f' d='M384.832 16.902 412.965.648a.739.739 0 0 0 .37-.648h-2.241l-16.512 9.54V0h-1.5l.004 10.402-9.004 5.2.75 1.3M432.094 31.2l-29.258 16.898.75 1.3 27.008-15.601 1.5-2.598M412.965 64.348l.375-.649-.75.434-.75-.434.75 1.297.375-.648'/%3E%3Cg clip-path='url(%23t)'%3E%3Cpath fill='%233b3b4f' d='M432 53.79zM412.59 65l.75 1.297v-.863l.75-.434 16.508-9.54-.004 9.536h1.5l.004-10.398 17.859-10.317v-1.734L413.34 63.699 412.59 65'/%3E%3C/g%3E%3Cg clip-path='url(%23u)'%3E%3Cpath fill='%233b3b4f' d='M449.348 64.996h.609v-.785l-.234.137a.752.752 0 0 0-.375.648'/%3E%3C/g%3E%3Cg clip-path='url(%23v)'%3E%3Cpath fill='%233b3b4f' d='m430.594 33.8 19.363-11.183v-1.734l-17.863 10.32-1.5 2.598'/%3E%3C/g%3E%3Cg clip-path='url(%23w)'%3E%3Cpath fill='%233b3b4f' d='m449.348 1.3.609-.355V.242l-.234.406-.375.653'/%3E%3C/g%3E%3Cpath fill='%233b3b4f' d='M282.055 194.996v-32.5a.742.742 0 0 0-.325-.613l.016-.031v-.004l-55.137-31.852h-1.496l.746 1.3 16.512 9.54-8.254 4.766h-.004l.75 1.296h.004l9-5.199 36.754 21.23v.75l-.066.114v19.074l-8.203-4.738.02-.031-28.134-16.254a.748.748 0 0 0-.746.004l1.121 1.945 16.508 9.535-8.254 4.77.75 1.3 9.004-5.203 8.95 5.172-.016.031 9 5.204v10.394h1.5M319.563 163.797v-33.8h-1.497v31.202l-.003-.004v33.801h1.5v-31.2M393.434 163.148c.242.141.523.13.75 0l-1.122-1.945-16.511-9.539 8.254-4.766-.75-1.3-9 5.199-8.985-5.188.008-.011-9.008-5.2v-10.402h-1.5V162.5c0 .27.149.504.364.633l-.008.012v.003l55.137 31.848h1.5l-.75-1.297-16.508-9.535 8.254-4.77-.75-1.3v.004l-9.004 5.199-36.754-21.234v-.825l.02-.035V142.13l8.238 4.758-.004.011 28.129 16.25M355.574 250.46v9.536h1.5v-10.402l9-5.2-.75-1.3-28.133 16.25a.758.758 0 0 0-.37.652h2.245l16.508-9.535M318.063 228.797l29.257-16.899-.75-1.3-27.007 15.601-1.5 2.598'/%3E%3Cpath fill='%233b3b4f' d='M319.566 259.996v-10.402l36.754-21.23.75.433-1.12-1.945-.005-.004-55.136 31.847-.727 1.262.356-.613.375-.649-.75.434-.688-.395-.02-.039-16.507-9.535 8.254-4.765-.012-.02 26.976-15.582 1.497-2.598-29.254 16.899.011.02-8.972 5.183-36.754-21.234v-.825l.02-.039v-19.07l8.238 4.754-.008.015 28.133 16.25c.242.141.523.125.75 0l-.012-.023 55.105-31.828.746-1.3h1.48l-.75-.435v-.824l.02-.039v-19.074l8.239 4.758-.004.012 27.004 15.601h3l-29.239-16.89.004-.012-9.004-5.2V130.43l.75-.434h-2.246v64.566l-.75.434-16.511 9.535v-9.535h-1.5v10.402l-36.754 21.235-.684-.399-.02-.03-16.507-9.54 8.254-4.77-.012-.015 28.101-16.23a.752.752 0 0 0 .372-.649h-2.247l-16.507 9.535V195h-1.5v10.398l-9 5.204.011.015-8.972 5.18-8.98-5.188.003-.015-9.004-5.2v-10.398h-1.5V227.5c0 .27.149.504.364.633l-.008.012v.003l55.136 31.848h2.954l16.507-9.535v9.535h1.5'/%3E%3Cpath fill='%233b3b4f' d='m337.566 195-.746 1.297.746-.434.75.434-.75-1.297M403.586 210.598 376.574 195h-3l29.262 16.898.75-1.3M366.074 244.398l9.008-5.203 9 5.2.75-1.301-28.137-16.25a.748.748 0 0 0-.746.004l1.121 1.945 16.512 9.535-8.258 4.77.75 1.3M347.324 211.898l9.004-5.199 36.754 21.23v.868l1.125-1.945v-.004l-55.14-31.852h-1.5l.75 1.3 16.511 9.536-8.254 4.77.75 1.296M412.586 195h-1.496l.75.43v.867l.746-1.297'/%3E%3Cpath fill='%233b3b4f' d='m413.34 196.297-.75-1.3-.75 1.3v19.07l-8.254-4.765-.75 1.296 9.004 5.204v42.46l-.75.434h2.25v-63.7M394.586 259.996v-32.5a.746.746 0 0 0-.379-.648l-1.121 1.945v19.074l-8.254-4.77-.75 1.301 9.004 5.2v10.398h1.5'/%3E%3Cg clip-path='url(%23x)'%3E%3Cpath fill='%233b3b4f' d='M430.688 271.207zm18.66-12.512v.868l-.746.433h-.004l-16.508 9.535v-9.535h.004v-31.203l-1.5-2.598v33.801h-.004v10.402l-36.754 21.23-.75-.433 1.121 1.946v.004l55.14-31.848.61-1.055v-.488l-.234-.406-.375-.653'/%3E%3C/g%3E%3Cpath fill='%233b3b4f' d='M413.336 259.996h-2.242l-16.512 9.535v-9.535h-1.5l.004 10.402-9.004 5.2.75 1.3 28.133-16.25a.75.75 0 0 0 .37-.652M432.094 291.195l-29.258 16.899.75 1.297 27.008-15.598 1.5-2.598M412.59 324.996l.375-.652.375-.649-.75.434-.75-.434.75 1.301'/%3E%3Cg clip-path='url(%23y)'%3E%3Cpath fill='%233b3b4f' d='M449.348 194.996v63.7l.609 1.058v-64.758h-.61'/%3E%3C/g%3E%3Cpath fill='%233b3b4f' d='M432.094 194.996h-1.5V226.2l1.5 2.598v-33.8'/%3E%3Cg clip-path='url(%23z)'%3E%3Cpath fill='%233b3b4f' d='M432 313.785zm-19.41 11.211h1.5l16.508-9.535-.004 9.535h1.5l.004-10.402 17.859-10.32v-1.727l-36.617 21.148-.75 1.301'/%3E%3C/g%3E%3Cg clip-path='url(%23A)'%3E%3Cpath fill='%233b3b4f' d='M449.348 324.996h.609v-.789l-.234.137a.749.749 0 0 0-.375.652'/%3E%3C/g%3E%3Cg clip-path='url(%23B)'%3E%3Cpath fill='%233b3b4f' d='m430.594 293.797 19.363-11.184v-1.734l-17.863 10.32-1.5 2.598'/%3E%3C/g%3E%3Cg clip-path='url(%23C)'%3E%3Cpath fill='%233b3b4f' d='m449.348 261.297.609-.352v-.703l-.234.406-.375.649'/%3E%3C/g%3E%3Cpath fill='%233b3b4f' d='M282.055 324.996v-32.5a.75.75 0 0 0-.325-.617l.016-.027v-.004l-55.137-31.852h-1.496l.746 1.3 16.512 9.536-8.254 4.766s0 .004-.004.004l.75 1.296h.004l9-5.203 36.754 21.235v.746l-.066.117v19.074l-8.203-4.738.02-.035-28.134-16.25a.739.739 0 0 0-.746.004l1.121 1.945 16.508 9.535-8.254 4.77.75 1.297 9.004-5.2 8.95 5.172-.016.031 9 5.2v10.398h1.5M393.434 293.148c.242.141.523.125.75-.003l-1.122-1.946-16.511-9.535 8.254-4.77-.75-1.3-9 5.203-8.985-5.188.008-.015-9.008-5.2v-10.398h-1.5v32.5c0 .27.149.508.364.637l-.008.008v.004l55.137 31.851h1.5l-.75-1.3-16.508-9.536 8.254-4.77-.75-1.296-9.004 5.203-36.754-21.235v-.824l.02-.039v-19.07l8.238 4.754-.004.015 28.129 16.25M318.066 291.195h-.003v33.801h1.5v-31.203.004-33.8h-1.497v31.198'/%3E%3Cpath fill='%233b3b4f' d='M301.559 259.996h-2.93l.75.434v.75l-.07.117v19.07l-8.2-4.738.016-.031-27.008-15.602h-3l29.207 16.871-.02.031 9.005 5.204v42.46l-.75.434h2.25V260.43l.75-.434'/%3E%3Cg clip-path='url(%23D)'%3E%3Cpath fill='%233b3b4f' d='m365.324 373.094-28.133 16.25a.753.753 0 0 0-.37.652h2.245l16.508-9.539v9.54h1.5v-10.403l9-5.203-.75-1.297'/%3E%3C/g%3E%3Cpath fill='%233b3b4f' d='m318.063 358.797 29.257-16.902-.75-1.297-27.007 15.597-1.5 2.602'/%3E%3Cg clip-path='url(%23E)'%3E%3Cpath fill='%233b3b4f' d='m357.07 358.797-1.12-1.95-.005-.003-55.136 31.851-.727 1.258.356-.61.375-.648-.75.434-.688-.395-.02-.039-16.507-9.535 8.254-4.77-.012-.019 26.976-15.578 1.497-2.602-29.254 16.903.011.02-8.972 5.179-36.754-21.23v-.829l.02-.039v-19.07l8.238 4.758-.008.015 28.133 16.25a.755.755 0 0 0 .75-.003l-.012-.02 55.105-31.828.746-1.3h1.48l-.75-.435v-.824l.02-.043v-19.07l8.239 4.758-.004.008 27.004 15.605h3l-29.239-16.89.004-.012-9.004-5.203V260.43l.75-.434h-2.246v64.567l-.75.433-16.511 9.535v-9.535h-1.5v10.402l-36.754 21.23-.684-.394-.02-.035-16.507-9.535 8.254-4.77-.012-.015 28.101-16.234a.747.747 0 0 0 .372-.649h-2.247l-16.507 9.535v-9.535h-1.5v10.402l-9 5.2.011.02-8.972 5.179-8.98-5.188.003-.015-9.004-5.203v-10.395h-1.5v32.5c0 .27.149.504.364.637l-.008.008v.004l55.136 31.851h2.954l16.507-9.539v9.54h1.5v-10.403l36.754-21.235.75.438'/%3E%3C/g%3E%3Cpath fill='%233b3b4f' d='m337.566 324.996-.375.649-.37.652.745-.434.75.434-.75-1.3M356.695 356.844a.748.748 0 0 0-.746 0l1.121 1.949 16.512 9.535-8.258 4.766.75 1.3 9.008-5.203 9 5.2.75-1.297-28.137-16.25M376.574 324.996h-3l29.262 16.899.75-1.297-27.012-15.602M394.207 356.848v-.004l-55.14-31.848h-1.5l.75 1.3 16.511 9.532-8.254 4.77.75 1.3 9.004-5.203 36.754 21.235v.867l1.125-1.95M412.586 324.996h-1.496l.75.434v.867l.746-1.3'/%3E%3Cg clip-path='url(%23F)'%3E%3Cpath fill='%233b3b4f' d='M411.84 326.297v19.07l-8.254-4.765v-.004l-.75 1.3 9.004 5.204v42.46l-.75.434h2.25V325.43l.75-.434h-1.5l-.75 1.3'/%3E%3C/g%3E%3Cg clip-path='url(%23G)'%3E%3Cpath fill='%233b3b4f' d='m394.207 356.848-1.121 1.945v19.074l-8.254-4.77-.75 1.298 9.004 5.203v10.398h1.5v-32.504a.74.74 0 0 0-.379-.644'/%3E%3C/g%3E%3Cg clip-path='url(%23H)'%3E%3Cpath fill='%233b3b4f' d='M449.348 324.996v64.567l-.75.433h1.359v-65h-.61'/%3E%3C/g%3E%3Cg clip-path='url(%23I)'%3E%3Cpath fill='%233b3b4f' d='M430.594 356.195v33.801h1.5v-31.203.004-33.8h-1.5v31.198'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); } .certification-namespace .row { @@ -55,18 +54,44 @@ color: var(--quaternary-color); } +.certificate-inner-wrapper { + background-color: var(--gray-90); + margin: 0; + padding: 20px; +} + +.certificate-inner-wrapper .row { + margin: 0; +} + +.certificate-second-inner-wrapper { + padding: 14px; + border: 10px solid white; +} + +.certificate-wrapper { + background-color: white; +} + .certification-namespace header { width: 100%; - height: 140px; + height: 100px; background-color: var(--theme-color); position: relative; } +.certification-namespace header div { + height: 100%; + display: flex; + justify-content: center; + align-items: center; +} + .certification-namespace .logo { display: flex; align-items: center; - height: 140px; - margin-inline-start: 100px; + justify-content: center; + height: 50px; } .certification-namespace .logo svg { @@ -75,22 +100,9 @@ max-width: 500px; } -.certification-namespace .issue-date { - line-height: 140px; - font-size: 20px; - text-align: right; - margin-inline-end: 100px; - color: var(--gray-00); -} - -.certification-namespace .issue-date strong { - color: var(--gray-00); -} - .certification-namespace .information { height: 380px; text-align: center; - background-color: var(--gray-05); } .certification-namespace .information-container { @@ -110,19 +122,17 @@ } .certification-namespace h4 { - margin-top: 25px; - font-size: 20px; + font-size: 25px; } .certification-namespace h1 { - font-size: 40px; + font-size: 45px; color: var(--theme-color); } .certification-namespace .signatures { text-align: center; margin: 0 auto; - background-color: var(--gray-05); } .certification-namespace .signatures img { @@ -132,23 +142,30 @@ } .certification-namespace .signatures p { - font-size: 18px; - padding-top: 10px; + padding-top: 1px; +} + +.certification-namespace .quincy-name { + font-size: 20px; +} + +.certification-namespace .quincy-role { + font-size: 17px; } .certification-namespace .verify { - padding: 30px 0; + padding: 30px 0 4px; font-size: 15px; text-align: center; word-wrap: break-word; - background-color: var(--gray-05); } .certificate-outer-wrapper { margin-top: var(--header-height); } -.qr-wrap { +.qr-wrap, +.ribbon-wrap { display: block; width: 100%; height: 0; @@ -157,47 +174,41 @@ .qr-code { position: absolute; - width: 128px; - height: 128px; - top: -128px; - right: 60px; + width: 150px; + height: 150px; + top: -120px; + left: 35px; +} + +.ribbon { + position: absolute; + width: 180px; + height: 180px; + top: -130px; + right: 0px; } /*mobile media queries*/ @media screen and (max-width: 1200px) { .qr-code { - right: 40px; + left: 40px; + } + + .ribbon { + right: 3px; } } @media screen and (max-width: 992px) { .certification-namespace header { - height: 160px; + height: 100px; } .certification-namespace .logo { margin-inline-start: 0; padding: 20px; justify-content: center; - height: 80px; - } - - .certification-namespace .logo svg { - margin-top: 20px; - } - - .certification-namespace .issue-date { - margin-top: 10px; - margin-inline-end: 0; - text-align: center; - line-height: 0px; - word-wrap: break-word; - } - - .certification-namespace .issue-date strong { - display: block; - margin-top: 15px; - line-height: 25px; + height: 85px; } .certification-namespace .information { @@ -210,48 +221,55 @@ word-wrap: break-word; } - .certification-namespace h3 { - font-size: 25px; + .certification-namespace h3, + .certification-namespace h4 { + font-size: 20px; } .certification-namespace h1 { - font-size: 28px; + font-size: 30px; } - .qr-code { + .qr-code, + .ribbon { position: absolute; width: 96px; height: 96px; top: calc(-96px - 50px); - right: 20px; + } + + .ribbon { + height: 140px; + width: 140px; + right: 5px; + top: -90px; + } + + .qr-code { + width: 120px; + height: 120px; + top: -80px; + left: 20px; + } + + .qr-code, + .ribbon { + display: none; } } @media screen and (max-width: 675px) { - .certification-namespaces.issue-date { - padding: 0; - border: 0; - } - .certification-namespace header { - height: 190px; + height: 100px; } - .certification-namespace h3 { - font-size: 15px; + .certification-namespace h3, + .certification-namespace h4 { + font-size: 20px; } .certification-namespace h1 { - font-size: 17px; - } - - .certification-namespace h4 { - font-size: 15px; - margin-top: 20px; - } - - .qr-code { - display: none; + font-size: 25px; } } @@ -281,17 +299,13 @@ justify-content: space-around; } - .certification-namespace h3 { + .certification-namespace h3, + .certification-namespace h4 { font-size: 25px; } .certification-namespace h1 { - font-size: 28px; - } - - .certification-namespace .issue-date, - .certification-namespace .issue-date strong { - color: var(--gray-00) !important; + font-size: 45px; } .certification-namespace .information { diff --git a/cypress/e2e/default/show-certification.ts b/cypress/e2e/default/show-certification.ts index 33d9718e00c..aa500a95c2d 100644 --- a/cypress/e2e/default/show-certification.ts +++ b/cypress/e2e/default/show-certification.ts @@ -31,8 +31,8 @@ describe('A certification,', function () { it('should be issued with the submission date', () => { cy.visit(certifiedUser); - const issued = `Issued\xa0August 3, 2018`; - cy.get('[data-cy=issue-date]').should('have.text', issued); + const issued = `Developer Certification on August 3, 2018`; + cy.get('[data-cy=issue-date]').should('include.text', issued); }); }); @@ -42,9 +42,7 @@ describe('A certification,', function () { }); it('should display certificate', function () { - cy.contains('has successfully completed the freeCodeCamp.org').should( - 'exist' - ); + cy.contains('successfully completed').should('exist'); cy.contains('Responsive Web Design').should('exist'); });