wix-style-react
Version:
48 lines (46 loc) • 1.35 kB
JavaScript
import React from 'react';
import SocialPreview from '..';
import Image from '../../Image';
import Text from '../../Text';
import Tooltip from '../../Tooltip';
import { StorybookComponents } from 'wix-storybook-utils/StorybookComponents';
export default () => (
<StorybookComponents.Stack
flexDirection="column"
width="40%"
alignItems="flex-start"
gap="0"
>
<Text>Preview on Twitter</Text>
<Tooltip
fixed
content={
<Text light>
It takes time for changes you make to show live on Twitter. You can
also manually refresh them. <a>Find out how</a>
</Text>
}
>
<Text>
<a>When will changes show live?</a>
</Text>
</Tooltip>
<StorybookComponents.Stack padding="SP2 0 0 0" width="100%">
<SocialPreview
size="small"
skin="twitter"
title="Getting a grasp on adventure"
description="Create a blog post subtitle that summarizes your post in a few short, punchy sentences and entices your audience to continue reading."
previewUrl="www.wix.com"
media={
<Image
src="running_man.png"
width="100%"
height="100%"
borderRadius="11px 0 0 11px"
/>
}
/>
</StorybookComponents.Stack>
</StorybookComponents.Stack>
);