bigbuffet/pleroma
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Extend Divider with 'textSize' prop

Browse source
This commit is contained in:
Justin 2022-09-07 08:09:32 -04:00
parent f39e811db5
commit 99e5e4492a
1 changed files with 9 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
app/soapbox/components/ui/divider/divider.tsx
View file

@ -1,11 +1,16 @@
import React from 'react';
import Text from '../text/text';
import type { Sizes as TextSizes } from '../text/text';
interface IDivider {
text?: string
textSize?: TextSizes
}
/** Divider */
const Divider = ({ text }: IDivider) => (
const Divider = ({ text, textSize = 'md' }: IDivider) => (
<div className='relative' data-testid='divider'>
<div className='absolute inset-0 flex items-center' aria-hidden='true'>
<div className='w-full border-t-2 border-gray-100 dark:border-gray-800 border-solid' />
@ -13,7 +18,9 @@ const Divider = ({ text }: IDivider) => (
{text && (
<div className='relative flex justify-center'>
<span className='px-2 bg-white text-gray-400' data-testid='divider-text'>{text}</span>
<span className='px-2 bg-white dark:bg-gray-900 text-gray-400' data-testid='divider-text'>
<Text size={textSize} tag='span' theme='inherit'>{text}</Text>
</span>
</div>
)}
</div>