Generalize homepage

2022-03-21 13:45:57 -05:00 · 2022-03-21 13:45:57 -05:00 · c5e89969c8
commit c5e89969c8
--- a/app/soapbox/features/landing_page/index.js
+++ b/app/soapbox/features/landing_page/index.js
@ -4,7 +4,7 @@ import { useSelector } from 'react-redux';

 import VerificationBadge from 'soapbox/components/verification_badge';

-import { Button, Card, CardBody, HStack, Stack, Text } from '../../components/ui';
+import { Button, Card, CardBody, Stack, Text } from '../../components/ui';

 const LandingPage = () => {
  const instance = useSelector((state) => state.get('instance'));
@ -38,42 +38,11 @@ const LandingPage = () => {
            <div>
              <Stack space={3}>
                <h1 className='text-5xl font-extrabold text-transparent bg-clip-text bg-gradient-to-br from-pink-600 via-primary-500 to-blue-600 sm:mt-5 sm:leading-none lg:mt-6 lg:text-6xl xl:text-7xl'>
-                  Follow <br /> the Truth
+                  {instance.title}
                </h1>
                <Text size='lg'>
-                  Truth Social is America&apos;s "Big Tent" social media platform that encourages an open,
-                  free, and honest global conversation without discriminating against political ideology.
+                  {instance.description}
                </Text>
-
-                <HStack space={2} alignItems='center' className='sm:justify-center lg:justify-start'>
-                  <a
-                    href='https://apps.apple.com/us/app/truth-social/id1586018825'
-                    target='_blank'
-                    className='flex w-48 h-16 bg-transparent border border-gray-900 border-solid text-gray-900 rounded-xl items-center justify-center'
-                  >
-                    <div className='mr-3'>
-                      <svg viewBox='0 0 384 512' width='30' >
-                        <path fill='currentColor' d='M318.7 268.7c-.2-36.7 16.4-64.4 50-84.8-18.8-26.9-47.2-41.7-84.7-44.6-35.5-2.8-74.3 20.7-88.5 20.7-15 0-49.4-19.7-76.4-19.7C63.3 141.2 4 184.8 4 273.5q0 39.3 14.4 81.2c12.8 36.7 59 126.7 107.2 125.2 25.2-.6 43-17.9 75.8-17.9 31.8 0 48.3 17.9 76.4 17.9 48.6-.7 90.4-82.5 102.6-119.3-65.2-30.7-61.7-90-61.7-91.9zm-56.6-164.2c27.3-32.4 24.8-61.9 24-72.5-24.1 1.4-52 16.4-67.9 34.9-17.5 19.8-27.8 44.3-25.6 71.9 26.1 2 49.9-11.4 69.5-34.3z' />
-                      </svg>
-                    </div>
-                    <div>
-                      <div className='text-xs'>Download on the</div>
-                      <div className='text-2xl font-semibold font-sans -mt-1'>App Store</div>
-                    </div>
-                  </a>
-
-                  <div className='flex w-48 h-16 opacity-25 bg-transparent border border-gray-900 border-solid text-gray-900 rounded-xl items-center justify-center'>
-                    <div className='mr-3'>
-                      <svg width='30' height='30' viewBox='0 0 34 34' fill='none' xmlns='http://www.w3.org/2000/svg'>
-                        <path d='M0.798828 16.741C0.798828 7.74655 8.11642 0.428955 17.1109 0.428955C20.7435 0.428955 24.1818 1.59768 27.0541 3.80882L23.2635 8.73289C21.4875 7.36578 19.3599 6.64308 17.1109 6.64308C11.5429 6.64308 7.01295 11.173 7.01295 16.741C7.01295 22.309 11.5429 26.839 17.1109 26.839C21.5955 26.839 25.4064 23.9008 26.7198 19.8481H17.1109V13.634H33.423V16.741C33.423 25.7355 26.1054 33.0531 17.1109 33.0531C8.11642 33.0531 0.798828 25.7355 0.798828 16.741Z' fill='black' />
-                      </svg>
-                    </div>
-                    <div>
-                      <div className='text-xs'>Coming soon</div>
-                      <div className='text-2xl font-semibold font-sans -mt-1'>Play Store</div>
-                    </div>
-                  </div>
-                </HStack>
              </Stack>
            </div>
          </div>
@ -96,30 +65,6 @@ const LandingPage = () => {
            </Card>
          </div>
        </div>
-
-        <div className='relative mt-12 sm:mt-16 lg:mt-24 px-4 sm:px-6'>
-          <div className='lg:grid lg:grid-flow-row-dense lg:grid-cols-3 lg:gap-8 lg:items-start'>
-            <div className='lg:col-span-1 lg:mt-24 order-1 lg:order-2'>
-              <div className='space-y-3 text-left sm:text-center lg:text-left'>
-                <h3 className='text-4xl font-extrabold text-transparent bg-clip-text bg-gradient-to-br from-pink-600 via-primary-500 to-blue-600 sm:mt-5 sm:leading-none lg:mt-6 lg:text-6xl'>
-                  <span>Web +<br className='hidden lg:block' /> Mobile</span>
-                </h3>
-
-                <Text size='lg'>
-                  TRUTH Social is America&apos;s &quot;Big Tent&quot; social media platform that encourages an open, free, and honest global conversation without discriminating against political ideology.
-                </Text>
-              </div>
-            </div>
-
-            <div className='lg:col-span-2 order-2 lg:order-1'>
-              <img
-                src='/instance/images/marketing.png'
-                alt='Marketing'
-                srcSet='/instance/images/marketing@2x.png'
-              />
-            </div>
-          </div>
-        </div>
      </div>
    </main>
  );
--- a/app/soapbox/features/public_layout/components/header.js
+++ b/app/soapbox/features/public_layout/components/header.js
@ -96,23 +96,6 @@ const Header = () => {
            />

            <div className='hidden md:flex items-center space-x-6'>
-              <HStack space={6} alignItems='center'>
-                <a
-                  href='https://apps.apple.com/us/app/truth-social/id1586018825'
-                  target='_blank'
-                  className='text-sm font-medium text-gray-500 hover:text-gray-900'
-                >
-                  Download
-                </a>
-                <a
-                  href='#'
-                  target='_blank'
-                  className='text-sm font-medium text-gray-500 hover:text-gray-900'
-                >
-                  Help Center
-                </a>
-              </HStack>
-
              <HStack space={2} className='xl:hidden'>
                <Button to='/login' theme='secondary'>
                  {intl.formatMessage(messages.login)}
--- a/app/soapbox/features/ui/components/modals/landing-page-modal.js
+++ b/app/soapbox/features/ui/components/modals/landing-page-modal.js
@ -1,7 +1,6 @@
 import classNames from 'classnames';
 import PropTypes from 'prop-types';
 import React from 'react';
-import InlineSVG from 'react-inlinesvg';
 import { defineMessages, useIntl } from 'react-intl';
 import { useSelector } from 'react-redux';

@ -29,32 +28,6 @@ const LandingPageModal = ({ onClose }) => {
      onClose={() => onClose('LANDING_PAGE')}
    >
      <div className='mt-4 divide-y divide-solid divide-gray-200'>
-        <nav className='grid gap-y-8 mb-6'>
-          <a
-            href='https://apps.apple.com/us/app/truth-social/id1586018825'
-            target='_blank'
-            className='-m-3 p-3 flex items-center rounded-md hover:bg-gray-50'
-          >
-            <InlineSVG src={require('@tabler/icons/icons/download.svg')} className='flex-shrink-0 h-6 w-6 text-gray-400' />
-
-            <span className='ml-3 text-base font-medium text-gray-900'>
-              {intl.formatMessage(messages.download)}
-            </span>
-          </a>
-
-          <a
-            href='#'
-            target='_blank'
-            className='-m-3 p-3 flex items-center rounded-md hover:bg-gray-50'
-          >
-            <InlineSVG src={require('@tabler/icons/icons/lifebuoy.svg')} className='flex-shrink-0 h-6 w-6 text-gray-400' />
-
-            <span className='ml-3 text-base font-medium text-gray-900'>
-              {intl.formatMessage(messages.helpCenter)}
-            </span>
-          </a>
-        </nav>
-
        <div
          className={classNames('pt-6 grid gap-4', {
            'grid-cols-2': isOpen,