File reorganization / CSS improvements

www/app/(aboutAndPrivacy)/about.tsx

@@ -1,6 +1,6 @@
 "use client";
 import React, { useState } from "react";
-import FullscreenModal from "./transcripts/fullsreenModal";
+import FullscreenModal from "../transcripts/fullsreenModal";
 import AboutContent from "./aboutContent";
 
 type AboutProps = {

www/app/(aboutAndPrivacy)/aboutContent.tsx

@@ -1,4 +1,4 @@
-import { Paragraph, Subtitle, Title } from "./lib/textComponents";
+import { Paragraph, Subtitle, Title } from "../lib/textComponents";
 
 export default () => (
   <div className="max-w-xl">

www/app/(aboutAndPrivacy)/privacy.tsx

@@ -1,6 +1,6 @@
 "use client";
 import React, { useState } from "react";
-import FullscreenModal from "./transcripts/fullsreenModal";
+import FullscreenModal from "../transcripts/fullsreenModal";
 import PrivacyContent from "./privacyContent";
 
 type PrivacyProps = {

www/app/(aboutAndPrivacy)/privacyContent.tsx

@@ -1,22 +1,22 @@
-import { Paragraph, Title } from "./lib/textComponents";
+import { Paragraph, Title } from "../lib/textComponents";
 
 export default () => (
   <div className="max-w-xl">
     <Title>Privacy Policy</Title>
     <Paragraph className="italic">Last updated on September 22, 2023</Paragraph>
     <ul className="mb-2 md:mb-4">
-      <li>
+      <li className="mb-2">
         · Recording Consent: By using Reflector, you grant us permission to
         record your interactions for the purpose of showcasing Reflector's
         capabilities during the All In AI conference.
       </li>
-      <li>
+      <li className="mb-2">
         · Data Access: You will have convenient access to your recorded sessions
         and transcriptions via a unique URL, which remains active for a period
         of seven days. After this time, your recordings and transcripts will be
         deleted.
       </li>
-      <li>
+      <li className="mb-2">
         · Data Confidentiality: Rest assured that none of your audio data will
         be shared with third parties.
       </li>

www/app/layout.tsx

@@ -7,8 +7,8 @@ import { ErrorProvider } from "./(errors)/errorContext";
 import ErrorMessage from "./(errors)/errorMessage";
 import Image from "next/image";
 import Link from "next/link";
-import About from "./about";
-import Privacy from "./privacy";
+import About from "./(aboutAndPrivacy)/about";
+import Privacy from "./(aboutAndPrivacy)/privacy";
 
 const poppins = Poppins({ subsets: ["latin"], weight: ["200", "400", "600"] });
 

www/app/lib/textComponents.tsx

@@ -4,13 +4,13 @@ type SimpleProps = {
 };
 
 const Title = ({ children, className }: SimpleProps) => (
-  <h2 className={`text-lg md:text-xl ${className}`}>{children}</h2>
+  <h2 className={`text-lg font-bold md:text-xl ${className}`}>{children}</h2>
 );
 const Subtitle = ({ children, className }: SimpleProps) => (
   <h3 className={`text-base md:text-lg ${className}`}>{children}</h3>
 );
 const Paragraph = ({ children, className }: SimpleProps) => (
-  <p className={`md:text-justify mb-2 md:mb-4 ${className}`}>{children}</p>
+  <p className={`mb-2 md:mb-4 ${className}`}>{children}</p>
 );
 
 export { Title, Subtitle, Paragraph };

www/app/transcripts/new/page.tsx

@@ -13,8 +13,8 @@ import LiveTrancription from "../liveTranscription";
 import DisconnectedIndicator from "../disconnectedIndicator";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faGear } from "@fortawesome/free-solid-svg-icons";
-import About from "../../about";
-import Privacy from "../../privacy";
+import About from "../../(aboutAndPrivacy)/about";
+import Privacy from "../../(aboutAndPrivacy)/privacy";
 
 const TranscriptCreate = () => {
   const [stream, setStream] = useState<MediaStream | null>(null);