From 99e5e4492a732843f8993d2701764fb222ff5426 Mon Sep 17 00:00:00 2001
From: Justin <dice.warrant-02@icloud.com>
Date: Wed, 7 Sep 2022 08:09:32 -0400
Subject: [PATCH] Extend Divider with 'textSize' prop

---
 app/soapbox/components/ui/divider/divider.tsx | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/app/soapbox/components/ui/divider/divider.tsx b/app/soapbox/components/ui/divider/divider.tsx
index 033f139ae..343a1b948 100644
--- a/app/soapbox/components/ui/divider/divider.tsx
+++ b/app/soapbox/components/ui/divider/divider.tsx
@@ -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>