ditch boostrap and use tailwind instead

components/wizard.js

@@ -1,8 +1,5 @@
 import React, { useContext } from 'react'
 
-import Button from 'react-bootstrap/Button'
-import Form from 'react-bootstrap/Form'
-
 import WizardStore, { WizardContext } from '../context/wizardStore'
 
 import DateSelect from './dateSelect'
@@ -24,21 +21,22 @@ function WizardInternal() {
     return (
       <>
         <h3>Danke, die Buchung ist in Bearbeitung!</h3>
-        <p>Wir melden uns per E-Mail sobald die Buchung bestätigt ist.</p>
+        <p>Nach Prüfung bestätigen wir die Buchung bald per E-Mail!</p>
         {typeof dataStored !== 'boolean' && (
           <>
             <p>
               Sollen die eingegebenen Daten in <strong>Deinem Browser</strong>{' '}
               für die nächste Buchung gespeichert werden?
             </p>
-            <Button onClick={() => storeData(true)}>Ja, bitte speichern</Button>
-            <Button
+            <button onClick={() => storeData(true)} className="btn btn-blue">
+              Ja, bitte speichern
+            </button>
+            <button
               onClick={() => storeData(false)}
-              className="ml-2"
-              variant="secondary"
+              className="btn btn-grey ml-2"
             >
               Nein danke
-            </Button>
+            </button>
           </>
         )}
         {dataStored === true && (
@@ -49,7 +47,8 @@ function WizardInternal() {
   }
 
   return (
-    <Form
+    <form
+      className="w-full max-w-lg"
       onSubmit={(event) => {
         event.preventDefault()
         onSubmit()
@@ -57,20 +56,20 @@ function WizardInternal() {
     >
       {dataStoredLoaded && (
         <p>
-          Gespeicherte Daten aus Deinem Browser geladen.{' '}
-          <Button size="sm" variant="outline-secondary" onClick={forgetData}>
-            Daten wieder Vergessen
-          </Button>
+          Gespeicherte Daten wurden aus Deinem Browser geladen.{' '}
+          <a onClick={forgetData}>Daten vergessen</a>
         </p>
       )}
       <DateSelect />
       <Reason />
       <Contact />
       <div>{postDataError}</div>
-      <Button type="submit" disabled={postData}>
-        {postData ? 'Speichern...' : 'Absenden'}
-      </Button>
-    </Form>
+      <div>
+        <button type="submit" disabled={postData} className="btn btn-blue">
+          {postData ? 'Speichern...' : 'Absenden'}
+        </button>
+      </div>
+    </form>
   )
 }