style error message better

This commit is contained in:
Thomas Ruoff
2020-09-15 22:53:54 +02:00
parent 9a0bf11749
commit e2e94d86a2
2 changed files with 8 additions and 6 deletions

View File

@@ -73,14 +73,12 @@ function WizardInternal() {
<DateSelect /> <DateSelect />
<Reason /> <Reason />
<Contact /> <Contact />
<div> <div className="flex items-end">
<button type="submit" disabled={postData} className="btn btn-blue"> <button type="submit" disabled={postData} className="btn btn-blue">
{postData ? 'Speichern...' : 'Absenden'} {postData ? 'Speichern...' : 'Absenden'}
</button> </button>
{postDataError && ( {postDataError && (
<div className="error-message"> <div className="error-message flex-grow">{postDataError}</div>
<strong>Error:</strong> {postDataError}
</div>
)} )}
</div> </div>
</form> </form>

View File

@@ -112,8 +112,12 @@
} }
.error-message { .error-message {
@apply inline-block bg-red-200 border-solid border-2 border-red-700 rounded text-red-700 py-1 px-2; @apply flex items-center bg-red-200 border-solid border border-red-700 rounded text-red-700 py-2 px-3;
max-width: 10rem; }
.error-message:before {
@apply mr-2;
content: '\274c';
} }
.Calendar-grid { .Calendar-grid {