From fc86b47eb099298c74b889bb7fed2e1a2b805fb4 Mon Sep 17 00:00:00 2001
From: Kim <56411016+kimsauce@users.noreply.github.com>
Date: Sat, 28 Aug 2021 17:55:08 -0700
Subject: [PATCH 1/3] Implementing CSS recommendations per Design Team

See https://saucedev.atlassian.net/browse/TCD-1698?focusedCommentId=314934
---
 src/theme/ReferenceCodeBlock/index.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/src/theme/ReferenceCodeBlock/index.tsx b/src/theme/ReferenceCodeBlock/index.tsx
index 7026736..e6c08d9 100644
--- a/src/theme/ReferenceCodeBlock/index.tsx
+++ b/src/theme/ReferenceCodeBlock/index.tsx
@@ -14,6 +14,10 @@ const noteStyle: React.CSSProperties = {
     textAlign: 'right',
     fontSize: '.9em',
     fontWeight: 600,
+    color: '#0E75DD',
+    textAlign: 'center',
+    paddingBottom: '13px',
+    textDecoration: 'underline',
 }
 
 /**

From dc7b9ef1973e18c33a1b59603b5e04cc13602155 Mon Sep 17 00:00:00 2001
From: Kim <56411016+kimsauce@users.noreply.github.com>
Date: Sat, 28 Aug 2021 17:59:47 -0700
Subject: [PATCH 2/3] Implemented Design Team's CSS recommendations

See https://saucedev.atlassian.net/browse/TCD-1698?focusedCommentId=314934
---
 src/theme/ReferenceCodeBlock/index.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/theme/ReferenceCodeBlock/index.tsx b/src/theme/ReferenceCodeBlock/index.tsx
index e6c08d9..a99175e 100644
--- a/src/theme/ReferenceCodeBlock/index.tsx
+++ b/src/theme/ReferenceCodeBlock/index.tsx
@@ -11,7 +11,6 @@ const initialFetchResultState = {
 }
 
 const noteStyle: React.CSSProperties = {
-    textAlign: 'right',
     fontSize: '.9em',
     fontWeight: 600,
     color: '#0E75DD',

From 20a2b8ccebc81787d1c896c0ac2b532184fdddc4 Mon Sep 17 00:00:00 2001
From: Kim <56411016+kimsauce@users.noreply.github.com>
Date: Sat, 28 Aug 2021 18:12:33 -0700
Subject: [PATCH 3/3] Implemented Design Team CSS recommendations

See https://saucedev.atlassian.net/browse/TCD-1698?focusedCommentId=314934. Added tweaks to current CSS and made the whole string (See full example on GitHub) a link to help visibility.
---
 src/theme/ReferenceCodeBlock/index.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/theme/ReferenceCodeBlock/index.tsx b/src/theme/ReferenceCodeBlock/index.tsx
index a99175e..17229fd 100644
--- a/src/theme/ReferenceCodeBlock/index.tsx
+++ b/src/theme/ReferenceCodeBlock/index.tsx
@@ -126,7 +126,7 @@ function ReferenceCode(props: ReferenceCodeBlockProps) {
     return (
         <div>
             <CodeBlock {...customProps}>{fetchResultState.code}</CodeBlock>
-            <div style={noteStyle}>See full example on <a href={props.children} target="_blank">GitHub</a></div>
+            <div style={noteStyle}><a href={props.children} target="_blank">See full example on GitHub</a></div>
         </div>
     );
 }