Skip to content
Snippets Groups Projects
Commit 08f8f55b authored by Chloé JACOB's avatar Chloé JACOB :alien:
Browse files

quelques modifications

parent dda523f2
Branches
Tags
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 67 additions and 65 deletions
src/assets/locales/en/common.json
+ 1
− 1
View file @ 08f8f55b
{ {
"languages": { "languages": {
"aaa": "EN", "actual": "English version\u00A0!",
"french": "french", "french": "french",
"english": "english" "english": "english"
}, },
......
src/assets/locales/fr/common.json
+ 1
− 1
View file @ 08f8f55b
{ {
"languages": { "languages": {
"aaa": "FR", "actual": "Version française\u00A0!",
"french": "français", "french": "français",
"english": "anglais" "english": "anglais"
}, },
......
src/components/Post.tsx
+ 2
− 2
View file @ 08f8f55b
...@@ -52,7 +52,7 @@ async function copyLink(text: string) { ...@@ -52,7 +52,7 @@ async function copyLink(text: string) {
return <> return <>
{/* A POST */} {/* A POST */}
<div className="border rounded-xl bg-white dark:bg-darkblue"> <div className="border rounded-xl bg-white dark:bg-darkblue overflow-hidden">
{/* HEADER POST */} {/* HEADER POST */}
<div className="flex justify-between p-4 items-center"> <div className="flex justify-between p-4 items-center">
<div className="flex items-center gap-4"> <div className="flex items-center gap-4">
...@@ -84,7 +84,7 @@ return <> ...@@ -84,7 +84,7 @@ return <>
</div> </div>
<div className="relative"> <div className="relative">
{/* ICON */} {/* ICON */}
<div className="w-10 flex justify-center items-center cursor-pointer" onClick={() => setDropdownOpen(!dropdownOpen)}> <div className="w-5 md:w-10 flex justify-center items-center cursor-pointer" onClick={() => setDropdownOpen(!dropdownOpen)}>
<FontAwesomeIcon className="text-[22px]" icon={faEllipsisVertical} /> <FontAwesomeIcon className="text-[22px]" icon={faEllipsisVertical} />
</div> </div>
{/* DROPDOWN */} {/* DROPDOWN */}
......
src/components/Suggestion.tsx
+ 3
− 3
View file @ 08f8f55b
...@@ -22,9 +22,9 @@ return <> ...@@ -22,9 +22,9 @@ return <>
{/* USER / STORY */} {/* USER / STORY */}
<li className="flex flex-col items-center"> <li className="flex flex-col items-center">
<div className="relative"> <div className="relative">
<div className="bg-gray-400 flex items-center justify-center rounded-full overflow-hidden w-24 h-24"> <div className="bg-gray-400 flex items-center justify-center rounded-full overflow-hidden w-16 md:w-24 h-16 md:h-24">
{/* <img src="/src/assets/images/pp_user.png" alt="" /> */} {/* <img src="/src/assets/images/pp_user.png" alt="" /> */}
<p className="uppercase text-white text-[38px]">{user.firstName.charAt(0)}</p> <p className="uppercase text-white text-2xl md:text-[38px]">{user.firstName.charAt(0)}</p>
</div> </div>
{user.isFollowedByViewer ? ( {user.isFollowedByViewer ? (
<button className="px-2 py-[7px] text-2xl rounded-full bg-blue-200 flex items-center justify-center absolute right-0 bottom-0" onClick={() => { <button className="px-2 py-[7px] text-2xl rounded-full bg-blue-200 flex items-center justify-center absolute right-0 bottom-0" onClick={() => {
...@@ -38,7 +38,7 @@ return <> ...@@ -38,7 +38,7 @@ return <>
dispatch(followUserSuggestionAsync(user)); dispatch(followUserSuggestionAsync(user));
}} }}
> >
<FontAwesomeIcon className="text-[14px]" icon={faPlus} /> <FontAwesomeIcon className="text-[10px] md:text-sm" icon={faPlus} />
</button> </button>
)} )}
</div> </div>
......
src/views/AddPostView.tsx
+ 45
− 43
View file @ 08f8f55b
...@@ -39,50 +39,52 @@ const AddPostView = () => { ...@@ -39,50 +39,52 @@ const AddPostView = () => {
{/* HEADER */} {/* HEADER */}
<Navbar /> <Navbar />
{/* MODAL */} {/* MODAL */}
<div className="max-w-[640px] mx-auto p-6 border rounded-xl mt-10 flex flex-col"> <div className="max-w-[640px] px-4 mx-auto">
<p className="text-center font-bold text-2xl">{t('addpost.title')}</p> <div className="p-6 border rounded-xl mt-10 flex flex-col">
<form className="flex flex-col gap-4 mt-6" onSubmit={(event)=> { <p className="text-center font-bold text-2xl">{t('addpost.title')}</p>
event.preventDefault(); <form className="flex flex-col gap-4 mt-6" onSubmit={(event)=> {
dispatch(addPost(selectedImg, location, caption)); //ajouter les autres éléments (accessibilityCaption, hasCommentsDisabled) ? event.preventDefault();
}}> dispatch(addPost(selectedImg, location, caption)); //ajouter les autres éléments (accessibilityCaption, hasCommentsDisabled) ?
{/* IMAGE */} }}>
<div className="flex flex-col gap-1"> {/* IMAGE */}
<label htmlFor="image-upload" className="font-bold">{t('addpost.image')} :</label> <div className="flex flex-col gap-1">
<input type="file" accept="image/*" id="image-upload" onChange={(test)=> { <label htmlFor="image-upload" className="font-bold">{t('addpost.image')} :</label>
if (test.target.files) { <input type="file" accept="image/*" id="image-upload" onChange={(test)=> {
setSelectedImg(selectedImg.concat(test.target.files[0])); if (test.target.files) {
} setSelectedImg(selectedImg.concat(test.target.files[0]));
}} }
/> }}
</div> />
{/* LOCATION */} </div>
<div className="flex flex-col gap-1"> {/* LOCATION */}
<label htmlFor="location-input" className="font-bold">{t('addpost.place')} :</label> <div className="flex flex-col gap-1">
<input className="h-10 p-2 rounded-sm border dark:text-darkblue" id="location-input" placeholder="Lieu" value={location} onChange={(e)=> <label htmlFor="location-input" className="font-bold">{t('addpost.place')} :</label>
setLocation(e.target.value)} /> <input className="h-10 p-2 rounded-sm border dark:text-darkblue" id="location-input" placeholder="Lieu" value={location} onChange={(e)=>
</div> setLocation(e.target.value)} />
{/* DESCRIPTION */} </div>
<div className="flex flex-col gap-1"> {/* DESCRIPTION */}
<label htmlFor="caption-input" className="font-bold">{t('addpost.caption')} :</label> <div className="flex flex-col gap-1">
<input className="h-10 p-2 rounded-sm border dark:text-darkblue" id="caption-input" placeholder="Description" value={caption} onChange={(e)=> <label htmlFor="caption-input" className="font-bold">{t('addpost.caption')} :</label>
setCaption(e.target.value)} /> <input className="h-10 p-2 rounded-sm border dark:text-darkblue" id="caption-input" placeholder="Description" value={caption} onChange={(e)=>
</div> setCaption(e.target.value)} />
{/* BTNS */} </div>
<div className="grid grid-cols-2 gap-4 mt-6"> {/* BTNS */}
{/* CANCEL BTN */} <div className="grid grid-cols-2 gap-4 mt-6">
<Link to="/feed"> {/* CANCEL BTN */}
<button <Link to="/feed">
className="bg-red-600 text-white font-bold h-10 rounded-md mt-2 uppercase w-full">{t('actions.cancel')}</button> <button
</Link> className="bg-red-600 hover:bg-red-800 text-white font-bold h-10 rounded-md mt-2 uppercase w-full">{t('actions.cancel')}</button>
{/* SUBMIT BTN */} </Link>
<button className="bg-green-700 text-white font-bold h-10 rounded-md mt-2 uppercase w-full" type="submit"> {/* SUBMIT BTN */}
{t('actions.send')} <button className="bg-green-700 hover:bg-green-900 text-white font-bold h-10 rounded-md mt-2 uppercase w-full" type="submit">
</button> {t('actions.send')}
</div> </button>
</form> </div>
</form>
{redirect && {redirect &&
<Navigate to={'post/' + post.id} replace={true} />} <Navigate to={'post/' + post.id} replace={true} />}
</div>
</div> </div>
</> </>
......
src/views/DiscoverView.tsx
+ 2
− 2
View file @ 08f8f55b
...@@ -60,9 +60,9 @@ return <> ...@@ -60,9 +60,9 @@ return <>
) : ( ) : (
<div className="flex flex-col items-center gap-4 mt-20"> <div className="flex flex-col items-center gap-4 mt-20">
<FontAwesomeIcon className="text-[96px]" icon={faCompass} /> <FontAwesomeIcon className="text-[96px]" icon={faCompass} />
<p className="font-bold text-xl">Votre discover est vide...</p> <p className="font-bold text-xl text-center">Votre discover est vide...</p>
<p className="text-center">Ajouter un post pour remplir votre discover&nbsp;!</p> <p className="text-center">Ajouter un post pour remplir votre discover&nbsp;!</p>
<button className="bg-gray-400 text-white font-bold h-10 rounded-md py-2 px-4"> <button className="bg-gray-400 hover:bg-gray-600 text-white font-bold h-10 rounded-md py-2 px-4">
<Link to="/addpost">Ajouter un post</Link> <Link to="/addpost">Ajouter un post</Link>
</button> </button>
</div> </div>
......
src/views/FeedView.tsx
+ 4
− 4
View file @ 08f8f55b
...@@ -51,7 +51,7 @@ return <> ...@@ -51,7 +51,7 @@ return <>
{/* FEEDVIEW */} {/* FEEDVIEW */}
<div className="max-w-[640px] mx-auto mt-8 mb-16 px-4"> <div className="max-w-[640px] mx-auto mt-8 mb-16 px-4">
{/* USERS / STORIES */} {/* USERS / STORIES */}
<ul className="flex gap-8"> <ul className="flex flex-wrap justify-center gap-8">
{/* USER / STORY */} {/* USER / STORY */}
{suggestionItems && //ici {suggestionItems && //ici
suggestionItems.map((user) => { suggestionItems.map((user) => {
...@@ -91,9 +91,9 @@ return <> ...@@ -91,9 +91,9 @@ return <>
) : ( ) : (
<div className="flex flex-col items-center gap-4 mt-20"> <div className="flex flex-col items-center gap-4 mt-20">
<FontAwesomeIcon className="text-[96px]" icon={faHouse} /> <FontAwesomeIcon className="text-[96px]" icon={faHouse} />
<p className="font-bold text-xl">Votre feed est vide...</p> <p className="font-bold text-xl text-center">Votre feed est vide...</p>
<p>Vous devriez suivre des utilisateurs pour remplir votre feed&nbsp;!</p> <p className="text-center">Vous devriez suivre des utilisateurs pour remplir votre feed&nbsp;!</p>
<button className="bg-gray-400 text-white font-bold h-10 rounded-md py-2 px-4"> <button className="bg-gray-400 hover:bg-gray-600 text-white font-bold h-10 rounded-md py-2 px-4">
<Link to="/discover">Découvrir des posts</Link> <Link to="/discover">Découvrir des posts</Link>
</button> </button>
</div> </div>
......
src/views/PostView.tsx
+ 1
− 1
View file @ 08f8f55b
...@@ -32,7 +32,7 @@ const PostView = () => { ...@@ -32,7 +32,7 @@ const PostView = () => {
<div className="h-full"> <div className="h-full">
{/* HEADER */} {/* HEADER */}
<Navbar /> <Navbar />
<div className="max-w-[640px] mx-auto py-16 px-4"> <div className="max-w-[640px] mx-auto py-10 md:py-16 px-4">
{/* A POST */} {/* A POST */}
{post && ( {post && (
<Post post={post} key={post.id} <Post post={post} key={post.id}
......
src/views/Profile.tsx
+ 8
− 8
View file @ 08f8f55b
...@@ -35,14 +35,14 @@ return <> ...@@ -35,14 +35,14 @@ return <>
<div className="flex flex-col gap-[30px] sm:gap-4"> <div className="flex flex-col gap-[30px] sm:gap-4">
<div className="flex gap-5 justify-center items-center"> <div className="flex gap-5 justify-center items-center">
<p className="text-xl">Chloé</p> <p className="text-xl">Chloé</p>
<button className="bg-red-500 text-white font-bold h-10 rounded-md py-2 px-4" onClick={() => { <button className="bg-red-600 hover:bg-red-800 text-white font-bold h-10 rounded-md py-2 px-4" onClick={() => {
dispatch(logoutAsync()); dispatch(logoutAsync());
}}>Se déconnecter</button> }}>Se déconnecter</button>
</div> </div>
<div className="flex gap-10"> <div className="flex gap-10">
<div className="flex flex-col items-center"> <div className="flex flex-col items-center">
<p>XX</p> <p>XX</p>
<p>publications</p> <p>posts</p>
</div> </div>
<div className="flex flex-col items-center"> <div className="flex flex-col items-center">
<p>XX</p> <p>XX</p>
...@@ -56,25 +56,25 @@ return <> ...@@ -56,25 +56,25 @@ return <>
</div> </div>
</div> </div>
{/* CHANGEMENT DE LANGUE */} {/* CHANGEMENT DE LANGUE */}
<div className="flex gap-10 mt-10"> <div className="flex flew-wrap gap-10 mt-10">
<button className="bg-blue-500 text-white font-bold h-10 rounded-md mt-2 py-2 px-4" <button className="bg-blue-500 text-white font-bold h-10 rounded-md py-2 px-4"
type="button" type="button"
onClick={() => { onClick={() => {
i18n.changeLanguage(Language.EN); i18n.changeLanguage(Language.EN);
}} }}
> >
{t('languages.english')} {t('languages.english')}
</button> </button>
<button className="bg-blue-500 text-white font-bold h-10 rounded-md mt-2 py-2 px-4" <button className="bg-blue-500 text-white font-bold h-10 rounded-md py-2 px-4"
type="button" type="button"
onClick={() => { onClick={() => {
i18n.changeLanguage(Language.FR); i18n.changeLanguage(Language.FR);
}} }}
> >
{t('languages.french')} {t('languages.french')}
</button> </button>
</div> </div>
<p>{t('languages.aaa')}</p> <p className="mt-8 text-center">{t('languages.actual')}</p>
</div> </div>
</div> </div>
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment