27 lines
962 B
TypeScript
27 lines
962 B
TypeScript
import React from 'react';
|
|
|
|
import { Stack, Text } from 'soapbox/components/ui';
|
|
|
|
import { generateText, randomIntFromInterval } from '../utils';
|
|
|
|
const PlaceholderEventPreview = () => {
|
|
const eventNameLength = randomIntFromInterval(5, 25);
|
|
const nameLength = randomIntFromInterval(5, 15);
|
|
|
|
return (
|
|
<div className='relative w-full animate-pulse overflow-hidden rounded-lg bg-gray-100 text-primary-50 dark:bg-primary-800 dark:text-primary-800'>
|
|
<div className='h-40 bg-primary-200 dark:bg-gray-600' />
|
|
<Stack className='p-2.5' space={2}>
|
|
<Text weight='semibold'>{generateText(eventNameLength)}</Text>
|
|
|
|
<div className='flex flex-wrap gap-x-2 gap-y-1 text-gray-700 dark:text-gray-600'>
|
|
<span>{generateText(nameLength)}</span>
|
|
<span>{generateText(nameLength)}</span>
|
|
<span>{generateText(nameLength)}</span>
|
|
</div>
|
|
</Stack>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default PlaceholderEventPreview;
|