Certificate page digital credential fixes (#2842)

Author: jonkafton

frontends/main/src/app-pages/CertificatePage/CertificatePage.tsx

@@ -65,7 +65,10 @@ const Buttons = styled.div(({ theme }) => ({
   width: "fit-content",
   margin: "0 auto 50px auto",
   [theme.breakpoints.down("md")]: {
-    margin: "0 auto 32px auto",
+    flexDirection: "column",
+    width: "100%",
+    maxWidth: "460px",
+    marginBottom: "32px",
   },
 }))
 
@@ -768,11 +771,13 @@ const CertificatePage: React.FC<{
         onClose={() => setShareOpen(false)}
         pageUrl={pageUrl}
       />
-      <DigitalCredentialDialog
-        verifiableCredential={verifiableCredential}
-        open={digitalCredentialDialogOpen}
-        onClose={() => setDigitalCredentialDialogOpen(false)}
-      />
+      {verifiableCredential ? (
+        <DigitalCredentialDialog
+          verifiableCredential={verifiableCredential}
+          open={digitalCredentialDialogOpen}
+          onClose={() => setDigitalCredentialDialogOpen(false)}
+        />
+      ) : null}
       <Title>
         <Typography variant="h3">
           <strong>{title}</strong> {displayType}
@@ -786,13 +791,15 @@ const CertificatePage: React.FC<{
         >
           Download PDF
         </Button>
-        <Button
-          variant="bordered"
-          startIcon={<RiDownloadLine />}
-          onClick={() => setDigitalCredentialDialogOpen(true)}
-        >
-          Download Digital Credential
-        </Button>
+        {verifiableCredential ? (
+          <Button
+            variant="bordered"
+            startIcon={<RiDownloadLine />}
+            onClick={() => setDigitalCredentialDialogOpen(true)}
+          >
+            Download Digital Credential
+          </Button>
+        ) : null}
         <Button
           variant="bordered"
           startIcon={<RiShareLine />}