work on styles

components/App.tsx

@@ -11,7 +11,7 @@ import { IDocProps } from '../interfaces/IDocProps'
 
 export default function App() {
   const [options, setOptions] = useState<IDocProps>({
-    address: 'Max Mustermann\\\\Musterstrasse\\\\12345 Musterstadt',
+    address: 'Max Mustermann\nMusterstrasse\n12345 Musterstadt',
     body: 'Inhalt des Briefs',
     closing: 'Mit freundlichen Grüßen',
     customer: '',
@@ -79,17 +79,17 @@ export default function App() {
   }
 
   return (
-    <div className="home">
-      <div>
+    <div className="flex flex-col space-x-5 max-w-7xl mx-auto py-3 sm:px-2 lg:px-3 bg-gray-100">
+      <div className="flex flex-col space-y-5 shadow sm:rounded-md sm:overflow-hidden">
         <LetterOptions onChange={_onChange} {...options} />
-        <LatestList latest={latest} onSelect={_onSelectLatest} onRemove={_onRemoveLatest} />
-      </div>
-      <div>
-        <div>
+        <div className="flex space-x-3">
           <Button onClick={_onGenerate}>Backe PDF</Button>
           <Button onClick={_onClear}>Alles Löschen</Button>
         </div>
+      </div>
+      <div className="flex flex-col space-y-5">
         <Preview pdfUrl={pdfUrl} pdfIsLoading={pdfIsLoading} pdfError={pdfError} />
+        <LatestList latest={latest} onSelect={_onSelectLatest} onRemove={_onRemoveLatest} />
       </div>
     </div>
   )