ditch boostrap and use tailwind instead

This commit is contained in:
Thomas Ruoff
2020-08-13 23:45:44 +02:00
parent 9554793520
commit 9485d936b3
13 changed files with 1102 additions and 347 deletions

View File

@@ -2,9 +2,6 @@ import React, { useContext } from 'react'
import { WizardContext } from '../context/wizardStore'
import Required from './required'
import Form from 'react-bootstrap/Form'
import Col from 'react-bootstrap/Col'
export default function Contact() {
const { state, onChangeEvent } = useContext(WizardContext)
@@ -12,68 +9,77 @@ export default function Contact() {
return (
<>
<Form.Group>
<Form.Label>
Name <Required />
</Form.Label>
<Form.Control
type="text"
name="name"
value={name}
onChange={onChangeEvent}
required
/>
</Form.Group>
<Form.Group>
<Form.Label>
E-Mail <Required />
</Form.Label>
<Form.Control
type="email"
name="email"
value={email}
onChange={onChangeEvent}
required
/>
</Form.Group>
<Form.Group>
<Form.Label>
Straße <Required />
</Form.Label>
<Form.Control
type="text"
name="street"
value={street}
onChange={onChangeEvent}
required
/>
</Form.Group>
<Form.Row>
<Form.Group as={Col} xs={4}>
<Form.Label>
<div className="fsw">
<div className="fs">
<label className="flabel">
Name <Required />
</label>
<input
type="text"
name="name"
value={name}
onChange={onChangeEvent}
required
className="input-text"
/>
</div>
</div>
<div className="fsw">
<div className="fs">
<label className="flabel">
E-Mail <Required />
</label>
<input
type="email"
name="email"
value={email}
onChange={onChangeEvent}
required
className="input-text"
/>
</div>
</div>
<div className="fsw">
<div className="fs">
<label className="flabel">
Straße <Required />
</label>
<input
type="text"
name="street"
value={street}
onChange={onChangeEvent}
required
className="input-text"
/>
</div>
</div>
<div className="fsw">
<div className="fs">
<label className="flabel">
PLZ <Required />
</Form.Label>
<Form.Control
</label>
<input
type="text"
name="zip"
value={zip}
onChange={onChangeEvent}
required
className="input-text"
/>
</Form.Group>
<Form.Group as={Col}>
<Form.Label>
<label className="flabel">
Stadt <Required />
</Form.Label>
<Form.Control
</label>
<input
type="text"
name="city"
value={city}
onChange={onChangeEvent}
required
className="input-text"
/>
</Form.Group>
</Form.Row>
</div>
</div>
</>
)
}