improve user a11y
This commit is contained in:
parent
e420e01e4f
commit
83c1b5685a
|
|
@ -30,14 +30,26 @@ const NewMessage = () => {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<footer className="new-message z-10 flex justify-center w-full">
|
<footer className="new-message z-10 flex justify-center w-full">
|
||||||
<form onSubmit={handleSubmit} className="flex gap-2 bg-grey-dark rounded-xl w-full max-w-3xl p-2 mx-2 sm:p-3 md:mx-0 shadow-md shadow-grey-dark">
|
<form
|
||||||
|
onSubmit={handleSubmit}
|
||||||
|
className="flex gap-2 bg-grey-dark rounded-xl w-full max-w-3xl p-2 mx-2 sm:p-3 md:mx-0 shadow-md shadow-grey-dark"
|
||||||
|
>
|
||||||
<div className="file">
|
<div className="file">
|
||||||
<label htmlFor="image" className="cursor-pointer block p-2">
|
<label htmlFor="image" className="cursor-pointer block p-2">
|
||||||
<div className="rounded-full text-grey-dark bg-red-light text-lg p-2">
|
<div className="rounded-full text-grey-dark bg-red-light text-lg p-2">
|
||||||
<FaPlus className="" />
|
<FaPlus className="" />
|
||||||
</div>
|
</div>
|
||||||
|
<p className="sr-only">Ajouter une image</p>
|
||||||
</label>
|
</label>
|
||||||
<input type="file" name="image" id="image" accept="image/*" className="hidden" value={image} onChange={e => setImage(e.target.value)} />
|
<input
|
||||||
|
type="file"
|
||||||
|
name="image"
|
||||||
|
id="image"
|
||||||
|
accept="image/*"
|
||||||
|
className="hidden"
|
||||||
|
value={image}
|
||||||
|
onChange={(e) => setImage(e.target.value)}
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<input
|
<input
|
||||||
|
|
@ -46,8 +58,8 @@ const NewMessage = () => {
|
||||||
onChange={(e) => setMessage(e.target.value)}
|
onChange={(e) => setMessage(e.target.value)}
|
||||||
placeholder="Message"
|
placeholder="Message"
|
||||||
className="bg-grey-dark text-white rounded-xl p-2.5 w-full placeholder-red-light"
|
className="bg-grey-dark text-white rounded-xl p-2.5 w-full placeholder-red-light"
|
||||||
id='content'
|
id="content"
|
||||||
name='content'
|
name="content"
|
||||||
/>
|
/>
|
||||||
<button
|
<button
|
||||||
type="submit"
|
type="submit"
|
||||||
|
|
|
||||||
|
|
@ -181,7 +181,7 @@ const User = ({ author }: any) => {
|
||||||
</div>
|
</div>
|
||||||
<div className="flex gap-4">
|
<div className="flex gap-4">
|
||||||
<div
|
<div
|
||||||
className="rounded-md border py-2 px-4 text-sm max-w-[100px] font-medium text-white hover:bg-white focus:outline-none focus:ring-2 focus:ring-offset-2 bg-transparent hover:text-red"
|
className="rounded-md border py-2 px-4 text-sm max-w-[100px] font-medium text-white hover:bg-white focus:outline-none focus:ring-2 focus:ring-offset-2 bg-transparent hover:text-red cursor-pointer"
|
||||||
onClick={(e) => setShow(false)}
|
onClick={(e) => setShow(false)}
|
||||||
>
|
>
|
||||||
Annuler
|
Annuler
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue