No support

package.json

@@ -22,6 +22,7 @@
     "axios": "^0.21.1",
     "flexsearch": "^0.6.32",
     "md5": "^2.3.0",
+    "react-doc-viewer": "^0.1.5",
     "react-use-flexsearch": "^0.1.1"
   },
   "devDependencies": {

src/layouts/BrandVoices/components/SignUp.tsx

@@ -16,64 +16,5 @@ import { Grid, Row, Col } from '@zendeskgarden/react-grid';
 import { XL, XXXL } from '@zendeskgarden/react-typography';
 
 export const SignUp: React.FC = () => {
-  return (
-    <SignUpWidthLayout
-      css={css`
-        padding-top: ${p => p.theme.space.base * 50}px;
-        padding-bottom: ${p => p.theme.space.base * 60}px;
-
-        ${p => mediaQuery('down', 'md', p.theme)} {
-          padding-top: ${p => p.theme.space.base * 25}px;
-          padding-bottom: ${p => p.theme.space.base * 30}px;
-        }
-
-        ${p => mediaQuery('down', 'sm', p.theme)} {
-          padding-top: ${p => p.theme.space.base * 15}px;
-          padding-bottom: ${p => p.theme.space.base * 18}px;
-        }
-      `}
-    >
-      <Well isFloating>
-        <Grid
-          gutters="lg"
-          css={css`
-            margin-top: ${p => p.theme.space.md};
-            margin-bottom: ${p => p.theme.space.md};
-          `}
-        >
-          <Row alignItems="center" justifyContent="center">
-            <Col size={12} order={0}>
-              <XXXL
-                isBold
-                css={css`
-                  text-align: center;
-                  ${headerStyling}
-                `}
-              >
-                Intrigued?
-              </XXXL>
-            </Col>
-          </Row>
-          <Row alignItems="center" justifyContent="center">
-            <Col size={12} order={0}>
-              <XL
-                isBold
-                css={css`
-                  text-align: center;
-                  ${textStyling}
-                `}
-              >
-                Sign Up and Stay in the Loop
-              </XL>
-            </Col>
-          </Row>
-          <Row alignItems="center" justifyContent="center">
-            <Col size={12} order={0}>
-              <SignUpForm url="https://coqui.us1.list-manage.com/subscribe/post?u=6faea2f1f19c814566173ffb0&amp;id=29217798a3" />
-            </Col>
-          </Row>
-        </Grid>
-      </Well>
-    </SignUpWidthLayout>
-  );
+  return null;
 };

src/layouts/Dubbing/components/SignUp.tsx

@@ -6,74 +6,7 @@
  */
 
 import React from 'react';
-import { css } from 'styled-components';
-import { SignUpForm } from './SignUpForm';
-import SignUpWidthLayout from './SignUpWidth';
-import { headerStyling, textStyling } from './Styles';
-import { Well } from '@zendeskgarden/react-notifications';
-import { mediaQuery } from '@zendeskgarden/react-theming';
-import { Grid, Row, Col } from '@zendeskgarden/react-grid';
-import { XL, XXXL } from '@zendeskgarden/react-typography';
 
 export const SignUp: React.FC = () => {
-  return (
-    <SignUpWidthLayout
-      css={css`
-        padding-top: ${p => p.theme.space.base * 50}px;
-        padding-bottom: ${p => p.theme.space.base * 60}px;
-
-        ${p => mediaQuery('down', 'md', p.theme)} {
-          padding-top: ${p => p.theme.space.base * 25}px;
-          padding-bottom: ${p => p.theme.space.base * 30}px;
-        }
-
-        ${p => mediaQuery('down', 'sm', p.theme)} {
-          padding-top: ${p => p.theme.space.base * 15}px;
-          padding-bottom: ${p => p.theme.space.base * 18}px;
-        }
-      `}
-    >
-      <Well isFloating>
-        <Grid
-          gutters="lg"
-          css={css`
-            margin-top: ${p => p.theme.space.md};
-            margin-bottom: ${p => p.theme.space.md};
-          `}
-        >
-          <Row alignItems="center" justifyContent="center">
-            <Col size={12} order={0}>
-              <XXXL
-                isBold
-                css={css`
-                  text-align: center;
-                  ${headerStyling}
-                `}
-              >
-                Intrigued?
-              </XXXL>
-            </Col>
-          </Row>
-          <Row alignItems="center" justifyContent="center">
-            <Col size={12} order={0}>
-              <XL
-                isBold
-                css={css`
-                  text-align: center;
-                  ${textStyling}
-                `}
-              >
-                Sign Up and Stay in the Loop
-              </XL>
-            </Col>
-          </Row>
-          <Row alignItems="center" justifyContent="center">
-            <Col size={12} order={0}>
-              <SignUpForm url="https://coqui.us1.list-manage.com/subscribe/post?u=6faea2f1f19c814566173ffb0&amp;id=29217798a3" />
-            </Col>
-          </Row>
-        </Grid>
-      </Well>
-    </SignUpWidthLayout>
-  );
+  return null;
 };

src/layouts/PostProduction/components/SignUp.tsx

@@ -6,74 +6,7 @@
  */
 
 import React from 'react';
-import { css } from 'styled-components';
-import { SignUpForm } from './SignUpForm';
-import SignUpWidthLayout from './SignUpWidth';
-import { headerStyling, textStyling } from './Styles';
-import { Well } from '@zendeskgarden/react-notifications';
-import { mediaQuery } from '@zendeskgarden/react-theming';
-import { Grid, Row, Col } from '@zendeskgarden/react-grid';
-import { XL, XXXL } from '@zendeskgarden/react-typography';
 
 export const SignUp: React.FC = () => {
-  return (
-    <SignUpWidthLayout
-      css={css`
-        padding-top: ${p => p.theme.space.base * 50}px;
-        padding-bottom: ${p => p.theme.space.base * 60}px;
-
-        ${p => mediaQuery('down', 'md', p.theme)} {
-          padding-top: ${p => p.theme.space.base * 25}px;
-          padding-bottom: ${p => p.theme.space.base * 30}px;
-        }
-
-        ${p => mediaQuery('down', 'sm', p.theme)} {
-          padding-top: ${p => p.theme.space.base * 15}px;
-          padding-bottom: ${p => p.theme.space.base * 18}px;
-        }
-      `}
-    >
-      <Well isFloating>
-        <Grid
-          gutters="lg"
-          css={css`
-            margin-top: ${p => p.theme.space.md};
-            margin-bottom: ${p => p.theme.space.md};
-          `}
-        >
-          <Row alignItems="center" justifyContent="center">
-            <Col size={12} order={0}>
-              <XXXL
-                isBold
-                css={css`
-                  text-align: center;
-                  ${headerStyling}
-                `}
-              >
-                Intrigued?
-              </XXXL>
-            </Col>
-          </Row>
-          <Row alignItems="center" justifyContent="center">
-            <Col size={12} order={0}>
-              <XL
-                isBold
-                css={css`
-                  text-align: center;
-                  ${textStyling}
-                `}
-              >
-                Sign Up and Stay in the Loop
-              </XL>
-            </Col>
-          </Row>
-          <Row alignItems="center" justifyContent="center">
-            <Col size={12} order={0}>
-              <SignUpForm url="https://coqui.us1.list-manage.com/subscribe/post?u=6faea2f1f19c814566173ffb0&amp;id=29217798a3" />
-            </Col>
-          </Row>
-        </Grid>
-      </Well>
-    </SignUpWidthLayout>
-  );
+  return null;
 };

src/layouts/Root/components/Footer.tsx

@@ -99,37 +99,6 @@ const Footer: React.FC<IFooterLayoutProps> = ({ isSubscribing }) => {
               }
             `}
           >
-            <div
-              css={css`
-                grid-area: col-1;
-                width: 380px;
-
-                ${p => mediaQuery('down', 'md', p.theme)} {
-                  width: 320px;
-                }
-
-                ${p => mediaQuery('down', 'sm', p.theme)} {
-                  width: 350px;
-                }
-              `}
-            >
-              <p
-                css={css`
-                  margin-bottom: 10px;
-                  width: 260px;
-                  line-height: 140%;
-                  font-size: 16px;
-                  font-weight: 400;
-
-                  ${p => mediaQuery('down', 'sm', p.theme)} {
-                    margin-bottom: 20px;
-                  }
-                `}
-              >
-                Sign up with your email address to receive the Coqui newsletter.
-              </p>
-              <NewsletterForm url="https://coqui.us1.list-manage.com/subscribe/post?u=6faea2f1f19c814566173ffb0&amp;id=f9b303df7f" />
-            </div>
             <div css="grid-area: col-3">
               <p
                 css={`

src/layouts/VideoGames/components/SignUp.tsx

@@ -6,74 +6,7 @@
  */
 
 import React from 'react';
-import { css } from 'styled-components';
-import { SignUpForm } from './SignUpForm';
-import SignUpWidthLayout from './SignUpWidth';
-import { headerStyling, textStyling } from './Styles';
-import { Well } from '@zendeskgarden/react-notifications';
-import { mediaQuery } from '@zendeskgarden/react-theming';
-import { Grid, Row, Col } from '@zendeskgarden/react-grid';
-import { XL, XXXL } from '@zendeskgarden/react-typography';
 
 export const SignUp: React.FC = () => {
-  return (
-    <SignUpWidthLayout
-      css={css`
-        padding-top: ${p => p.theme.space.base * 50}px;
-        padding-bottom: ${p => p.theme.space.base * 60}px;
-
-        ${p => mediaQuery('down', 'md', p.theme)} {
-          padding-top: ${p => p.theme.space.base * 25}px;
-          padding-bottom: ${p => p.theme.space.base * 30}px;
-        }
-
-        ${p => mediaQuery('down', 'sm', p.theme)} {
-          padding-top: ${p => p.theme.space.base * 15}px;
-          padding-bottom: ${p => p.theme.space.base * 18}px;
-        }
-      `}
-    >
-      <Well isFloating>
-        <Grid
-          gutters="lg"
-          css={css`
-            margin-top: ${p => p.theme.space.md};
-            margin-bottom: ${p => p.theme.space.md};
-          `}
-        >
-          <Row alignItems="center" justifyContent="center">
-            <Col size={12} order={0}>
-              <XXXL
-                isBold
-                css={css`
-                  text-align: center;
-                  ${headerStyling}
-                `}
-              >
-                Intrigued?
-              </XXXL>
-            </Col>
-          </Row>
-          <Row alignItems="center" justifyContent="center">
-            <Col size={12} order={0}>
-              <XL
-                isBold
-                css={css`
-                  text-align: center;
-                  ${textStyling}
-                `}
-              >
-                Sign Up and Stay in the Loop
-              </XL>
-            </Col>
-          </Row>
-          <Row alignItems="center" justifyContent="center">
-            <Col size={12} order={0}>
-              <SignUpForm url="https://coqui.us1.list-manage.com/subscribe/post?u=6faea2f1f19c814566173ffb0&amp;id=29217798a3" />
-            </Col>
-          </Row>
-        </Grid>
-      </Well>
-    </SignUpWidthLayout>
-  );
+  return null;
 };

src/pages/xtts_tos.tsx

@@ -0,0 +1,18 @@
+/**
+ * Copyright Coqui GmbH
+ *
+ * Use of this source code is governed under the Apache License, Version 2.0
+ * found at http://www.apache.org/licenses/LICENSE-2.0.
+ */
+
+import React, { useEffect } from 'react';
+import pdf from '../data/pdfs/xtts_tos.pdf';
+import DocViewer, { DocViewerRenderers } from 'react-doc-viewer';
+
+const ToS: React.FC = () => {
+  const docs = [{ uri: pdf }];
+
+  return <DocViewer documents={docs} pluginRenderers={DocViewerRenderers} />;
+};
+
+export default ToS;