Browse Source

changed demos site

pull/5/head
remorses 1 year ago
parent
commit
3d60ca2a37
17 changed files with 38 additions and 38 deletions
  1. +1
    -1
      landing-blocks/package.json
  2. +4
    -2
      landing-blocks/src/GumroadButton.tsx
  3. +4
    -2
      website/constants.tsx
  4. +18
    -20
      website/pages/demo_roll/[name].tsx
  5. BIN
      website/public/screens/airtable.jpeg
  6. BIN
      website/public/screens/datocms.jpeg
  7. BIN
      website/public/screens/dovetail.jpeg
  8. BIN
      website/public/screens/kintohub.jpeg
  9. BIN
      website/public/screens/prisma.jpeg
  10. BIN
      website/public/screens/prismic.jpeg
  11. BIN
      website/public/screens/qovery.jpeg
  12. BIN
      website/public/screens/rocketchat.jpeg
  13. BIN
      website/public/screens/segment.jpeg
  14. BIN
      website/public/screens/spendesk.jpeg
  15. BIN
      website/public/screens/testim.jpeg
  16. +7
    -9
      website/scripts/screenshotter.ts
  17. +4
    -4
      yarn.lock

+ 1
- 1
landing-blocks/package.json View File

@ -58,7 +58,7 @@
"lodash.merge": "^4.6.2",
"prism-react-renderer": "^1.1.0",
"react-mailchimp-subscribe": "^2.1.0",
"react-script-hook": "^1.0.17",
"react-script-hook": "^1.1.1",
"react-twitter-embed": "^3.0.3",
"react-typical": "^0.1.3",
"react-typist": "^2.0.5",

+ 4
- 2
landing-blocks/src/GumroadButton.tsx View File

@ -20,6 +20,7 @@ export const GumroadButton: FC = forwardRef(
) => {
const [loading, error] = useScript({
src: 'https://gumroad.com/js/gumroad.js',
// checkForExisting: true
})
if (loading || error) {
return <Placeholder children={error?.message} />
@ -28,12 +29,13 @@ export const GumroadButton: FC = forwardRef(
return (
<Placeholder
ref={ref as any}
className='gumroad-button'
href={`https://gum.co/${productId}?wanted=true`}
target='_blank'
data-gumroad-single-product={singlePurchase ? 'true' : 'false'}
lineHeight='1em'
{...props}
className='gumroad-button'
>
{children || 'Buy Now My Product'}
</Placeholder>
@ -52,7 +54,7 @@ const Placeholder = (props) => {
justifyContent='center'
borderRadius='6px'
fontWeight='semibold'
color='gray.300'
color='gray.500'
minWidth='230px'
h='50px'
bg={{ light: 'gray.100', dark: 'rgba(255,255,255,.1)' }[colorMode]}

+ 4
- 2
website/constants.tsx View File

@ -5,12 +5,14 @@ import { GithubLink } from 'dokz'
export const GUMROAD_PRODUCT_ID = 'XJbw'
export const DEMOS_WEBSITE = 'https://landing-blocks-demos.now.sh'
export const headingNavLinks = [
<MyLink href='/#components'>Components</MyLink>,
<MyLink href='/docs'>Docs</MyLink>,
<MyLink href='/#demos'>Demos</MyLink>,
<MyLink href='/#newsletter'>Newsletter</MyLink>,
<GithubLink url='https://github.com/remorses/landing-blocks' />,
<GithubLink url='https://github.com/remorses/landing-blocks' />,
]
const BASE_PATH = '/docs/components/'
@ -95,7 +97,7 @@ export const demosPaths = [
'airtable',
].map((name) => {
return {
urlPath: '/demos/' + name, // TODO add different
url: DEMOS_WEBSITE + '/demos/' + name, // TODO add different
demoPath: '/demo_roll/' + name, // TODO add different
imagePath: `screens/${name}.jpeg`,

+ 18
- 20
website/pages/demo_roll/[name].tsx View File

@ -1,17 +1,9 @@
import {
LandingProvider,
Section,
NavBar,
PageContainer,
Box,
Stack,
} from 'landing-blocks/src'
import { HeadingLogoIcon } from '../_app'
import { headingNavLinks } from '../../constants'
import { BuyDemosButton } from '..'
import Iframe from 'react-iframe'
import { LandingProvider, NavBar, Stack } from 'landing-blocks/src'
import { useRouter } from 'next/router'
import Iframe from 'react-iframe'
import { BuyDemosButton } from '..'
import { DEMOS_WEBSITE, headingNavLinks } from '../../constants'
import { Spinner } from '@chakra-ui/core'
export default function Page({}) {
const { query } = useRouter()
@ -43,13 +35,19 @@ export default function Page({}) {
h='100%'
align='flex-start'
>
<Iframe
url={`/demos/${name}`}
width='100%'
height='100%'
// display='initial'
position='relative'
/>
{!name ? (
<Stack align='center' justify='center'>
<Spinner />
</Stack>
) : (
<Iframe
url={`${DEMOS_WEBSITE}/demos/${name}`}
width='100%'
height='100%'
// display='initial'
position='relative'
/>
)}
</Stack>
</LandingProvider>
)

BIN
website/public/screens/airtable.jpeg View File

Before After
Width: 600  |  Height: 700  |  Size: 45 KiB Width: 600  |  Height: 700  |  Size: 45 KiB

BIN
website/public/screens/datocms.jpeg View File

Before After
Width: 600  |  Height: 700  |  Size: 46 KiB Width: 600  |  Height: 700  |  Size: 46 KiB

BIN
website/public/screens/dovetail.jpeg View File

Before After
Width: 600  |  Height: 700  |  Size: 51 KiB Width: 600  |  Height: 700  |  Size: 50 KiB

BIN
website/public/screens/kintohub.jpeg View File

Before After
Width: 600  |  Height: 700  |  Size: 36 KiB Width: 600  |  Height: 700  |  Size: 36 KiB

BIN
website/public/screens/prisma.jpeg View File

Before After
Width: 600  |  Height: 700  |  Size: 50 KiB Width: 600  |  Height: 700  |  Size: 51 KiB

BIN
website/public/screens/prismic.jpeg View File

Before After
Width: 600  |  Height: 700  |  Size: 42 KiB Width: 600  |  Height: 700  |  Size: 41 KiB

BIN
website/public/screens/qovery.jpeg View File

Before After
Width: 600  |  Height: 700  |  Size: 34 KiB Width: 600  |  Height: 700  |  Size: 34 KiB

BIN
website/public/screens/rocketchat.jpeg View File

Before After
Width: 600  |  Height: 700  |  Size: 49 KiB Width: 600  |  Height: 700  |  Size: 48 KiB

BIN
website/public/screens/segment.jpeg View File

Before After
Width: 600  |  Height: 700  |  Size: 49 KiB Width: 600  |  Height: 700  |  Size: 49 KiB

BIN
website/public/screens/spendesk.jpeg View File

Before After
Width: 600  |  Height: 700  |  Size: 40 KiB Width: 600  |  Height: 700  |  Size: 40 KiB

BIN
website/public/screens/testim.jpeg View File

Before After
Width: 600  |  Height: 700  |  Size: 38 KiB Width: 600  |  Height: 700  |  Size: 37 KiB

+ 7
- 9
website/scripts/screenshotter.ts View File

@ -1,23 +1,21 @@
import { Sema } from 'async-sema'
import url from 'url'
import capture from 'capture-website'
import { demosPaths } from '../constants'
import { demosPaths, DEMOS_WEBSITE } from '../constants'
// capture-website --type jpeg http://localhost:3000/docs --output screen.jpg --overwrite --scale-factor 0.5 --width 1200 --height 1400
const semaphore = new Sema(10)
const semaphore = new Sema(100)
async function main({ paths }: { paths: typeof demosPaths }) {
const promises = paths.map(async ({ urlPath, imagePath }) => {
const promises = paths.map(async ({ url, imagePath }) => {
try {
await semaphore.acquire()
const output = `public/${imagePath}`
const uri = new url.URL(
urlPath,
'http://localhost:3000/',
).toString()
console.log(`screenshotting '${uri}' to '${output}'`)
const res = await capture.file(uri, output, {
console.log(`screenshotting '${url}' to '${output}'`)
const res = await capture.file(url, output, {
width: 1200,
height: 1400,
scaleFactor: 0.5,

+ 4
- 4
yarn.lock View File

@ -7024,10 +7024,10 @@ react-refresh@0.8.2:
resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.8.2.tgz#24bb0858eac92b0d7b0dd561747f0c9fd6c60327"
integrity sha512-n8GXxo3DwM2KtFEL69DAVhGc4A1THn2qjmfvSo3nze0NLCoPbywazeJPqdp0RdSGLmyhQzeyA+XPXOobbYlkzg==
react-script-hook@^1.0.17:
version "1.0.17"
resolved "https://registry.yarnpkg.com/react-script-hook/-/react-script-hook-1.0.17.tgz#9c3c3bd196d677d48838ac09134c912d555c67a9"
integrity sha512-maLLOqAfHcbcQPwDo9wuqdCzHSbyL/uDhULtb7Yrvh8IrbNN24LRXluHnti8Y+bk0LNn3s15esl3wDVeCMjbIg==
react-script-hook@^1.1.1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/react-script-hook/-/react-script-hook-1.1.1.tgz#63e06ee04188f04ae411e6dd70b9b1434152d4f1"
integrity sha512-numo44ztaQXKBWdJFiSeBsn0tnpZh7BND3PENwlzk0ya5atMQofjSmNvbfIy4pLmS488PFM5mH6kW3Ruj3aWDg==
react-simple-code-editor@^0.10.0:
version "0.10.0"

Loading…
Cancel
Save