From 68a3e2bee5b6eb24012037fd6351e2ac1512f638 Mon Sep 17 00:00:00 2001
From: Mark Bouslog <mcbouslog@gmail.com>
Date: Thu, 11 Jul 2024 16:37:02 -0500
Subject: [PATCH] lib-user: Certificate, change link label, center name, fix
 font color on dark mode print (#6145)

* Replace SVG with css pseudo element

* Center name

* Change link label to Save Certificate

* Set font color on print

* Revert decorative line back to svg
---
 .../src/components/Certificate/Certificate.js | 19 +++++++++++++------
 1 file changed, 13 insertions(+), 6 deletions(-)

diff --git a/packages/lib-user/src/components/Certificate/Certificate.js b/packages/lib-user/src/components/Certificate/Certificate.js
index b749f297b0..539e6efef2 100644
--- a/packages/lib-user/src/components/Certificate/Certificate.js
+++ b/packages/lib-user/src/components/Certificate/Certificate.js
@@ -25,6 +25,7 @@ const PrintableBox = styled(Box)`
 
     #certificate, #certificate * {
       visibility: visible;
+      color: #5c5c5c;
     }
 
     #certificate {
@@ -35,6 +36,11 @@ const PrintableBox = styled(Box)`
       width: 100%;
       height: 100%;
     }
+
+    #certificate svg,
+    #certificate svg g {
+      fill: #00979d;
+    }
   }
 
   @page {
@@ -79,7 +85,7 @@ function Certificate({
         }
       >
         <ContentBox
-          linkLabel='Generate Certificate'
+          linkLabel='Save Certificate'
           linkProps={{
             as: 'button',
             onClick: handleClickPrint
@@ -132,6 +138,7 @@ function Certificate({
                 <SpacedText
                   className='userName'
                   size='3.75rem'
+                  textAlign='center'
                   weight='bold'
                 >
                   {creditedName || displayName}
@@ -223,14 +230,14 @@ function Certificate({
                     alt='Signature of Dr. Laura Trouille'
                   />
                   <svg width='272' height='2' viewBox='0 0 272 2'>
-                    <path d='M1 1H271' stroke='url(#paint0_linear_1845_6607)'/>
                     <defs>
-                      <linearGradient id='paint0_linear_1845_6607' gradientUnits='userSpaceOnUse'>
-                        <stop stopColor='white'/>
-                        <stop offset='0.496986' stopColor='dark-5'/>
-                        <stop offset='1' stopColor='white' stopOpacity='0'/>
+                      <linearGradient id='signature_line' gradientUnits='userSpaceOnUse'>
+                        <stop stopColor='white' />
+                        <stop offset='0.5' stopColor='dark-5' />
+                        <stop offset='1' stopColor='white' />
                       </linearGradient>
                     </defs>
+                    <path d='M1 1H271' stroke='url(#signature_line)'/>
                   </svg>
                   <SpacedText
                     size='1.5rem'