feat: dialog styling (#26)

closes #24 
- header is full width + add space between
- title is same line height as icon + font color

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@e-krebs/react-library",
-  "version": "0.0.21",
+  "version": "0.0.22",
   "description": "A collection of components to be reused across personal projects",
   "repository": "github.com/e-krebs/react-library",
   "author": "Emmanuel Krebs <[email protected]>",

src/Modal/ModalComponent.tsx

@@ -119,11 +119,17 @@ export const ModalComponent: ModalComponentProps = forwardRef<ModalRef, PropsWit
             contentClassName
           )}
         >
-          <header {...headerProps} className={cx('flex items-center space-x-1', headerClassName)}>
+          <header
+            {...headerProps}
+            className={cx('flex w-full items-center justify-between space-x-8', headerClassName)}
+          >
             <h1
               {...titleProps}
               id={titleId}
-              className={cx('m-0 grow truncate text-xl font-bold capitalize', titleClassName)}
+              className={cx(
+                'm-0 grow truncate text-xl font-bold capitalize leading-8 text-black dark:text-white',
+                titleClassName
+              )}
             >
               {title}
             </h1>