Improve /profil

src/components/Navigation/MainMenu.tsx

@@ -30,9 +30,6 @@ const MainMenu: FC = (): JSX.Element | null => {
                 <li className={styles.mainMenuItem}>
                     <a href="/profil">Mon profil</a>
                 </li>
-                <li className={styles.mainMenuItem}>
-                    <a href="/equipes">Equipes</a>
-                </li>
                 <button type="button" className={styles.close} onClick={onClose}>
                     ×
                 </button>

src/components/VolunteerBoard/Board.tsx

@@ -16,7 +16,7 @@ import VolunteerConfirmation from "../VolunteerConfirmation/VolunteerConfirmatio
 const Board: FC = (): JSX.Element => (
     <>
         <VolunteerConfirmation />
-        <ContentTitle title="Pour le jour J" />
+        <ContentTitle title="Profil spécifique au festival" />
         <DayWishes />
         <DayWishesFormModal />
         <ParticipationDetails />

src/components/VolunteerBoard/DayWishes/DayWishes.tsx

@@ -14,9 +14,10 @@ const DayWishes: FC = (): JSX.Element | null => {
 
     return (
         <div className={styles.dayWishes}>
+            <div className={styles.title}>Mes présences</div>
             <div className={styles.daysLine}>
-                <span className={styles.dayLineTitle}>Mes jours de présence :</span>
+                <span className={styles.dayLineTitle}>Mes jours :</span>
-                {dayWishesString && <span>{dayWishesString}</span>}
+                {dayWishesString && <b>{dayWishesString}</b>}
                 {!dayWishesString && <span className={styles.dayLineEmpty}>Non renseignés</span>}
             </div>
             {comment && (

src/components/VolunteerBoard/DayWishes/styles.module.scss

@@ -1,6 +1,11 @@
 @import "../../../theme/variables";
 @import "../../../theme/mixins";
 
+.title {
+    padding-bottom: 5px;
+    font-weight: bold;
+}
+
 .dayWishes {
     @include inner-content-wrapper();
 
@@ -17,7 +22,6 @@
 
 .dayLineTitle {
     padding-right: 5px;
-    font-weight: bold;
 }
 
 .dayLineEmpty {

src/components/VolunteerBoard/DayWishesForm/DayWishesForm.tsx

@@ -50,7 +50,7 @@ const DayWishesForm: FC<Props> = ({ afterSubmit }): JSX.Element => {
     }, [selection, commentRef, saveWishes, afterSubmit])
 
     return (
-        <div className={styles.dayWishesForm}>
+        <div>
             <div className={styles.dayWishesTitle}>Mes jours de présence</div>
             <ul className={styles.dayWishesList}>
                 {daysChoice.map(({ id, label }) => (

src/components/VolunteerBoard/DayWishesForm/styles.module.scss

@@ -1,10 +1,6 @@
 @import "../../../theme/variables";
 @import "../../../theme/mixins";
 
-.dayWishesForm {
-    width: 470px;
-}
-
 .dayWishesTitle {
     padding: 15px 0;
     font-weight: bold;
@@ -13,6 +9,8 @@
 
 .dayWishesList {
     @include clear-ul-style;
+
+    text-align: center;
 }
 
 .dayWishesItem {

src/components/VolunteerBoard/ParticipationDetails/ParticipationDetails.tsx

@@ -23,30 +23,30 @@ const ParticipationDetails: FC<Props> = (): JSX.Element | null => {
 
     return (
         <div className={styles.root}>
-            <div className={styles.title}>Mes informations pour le festival</div>
+            <div className={styles.title}>Mes infos logistiques</div>
             {tshirtCount === 0 && (
                 <div className={styles.line}>
-                    Je n'ai <b>aucun t-shirt</b>. (Taille <b>{tshirtSize}</b>)
+                    Je n'ai <b>aucun t-shirt</b> et je suis taillé <b>{tshirtSize}</b>
                 </div>
             )}
             {tshirtCount === 1 && (
                 <div className={styles.line}>
-                    J'ai déjà <b>1 t-shirt</b>. (Taille <b>{tshirtSize}</b>)
+                    J'ai déjà <b>1 t-shirt</b> et je suis taillé <b>{tshirtSize}</b>
                 </div>
             )}
             {tshirtCount === 2 && (
                 <div className={styles.line}>
-                    J'ai déjà <b>2 t-shirts</b>.
+                    J'ai déjà <b>2 t-shirts</b>
                 </div>
             )}
             {adult === 0 && (
                 <div className={styles.line}>
-                    Je suis <b>mineur</b>
+                    Je serai <b>mineur</b> les 2-3 juillet 2022
                 </div>
             )}
             {adult === 1 && (
                 <div className={styles.line}>
-                    Je suis <b>majeur</b>
+                    Je serai <b>majeur</b> les 2-3 juillet 2022
                 </div>
             )}
             <div className={styles.line}>

src/components/VolunteerBoard/ParticipationDetailsForm/ParticipationDetailsForm.tsx

@@ -61,7 +61,7 @@ const ParticipationDetailsForm: FC<Props> = ({ afterSubmit }): JSX.Element | nul
 
     return (
         <div>
-            <div className={styles.title}>Mes informations pour le festival</div>
+            <div className={styles.title}>Mes infos logistiques</div>
             <div className={styles.inputWrapper}>
                 <div className={styles.leftCol}>
                     <div className={styles.tshirtCountTitle}>Combien as-tu de t-shirts PeL ?</div>
@@ -98,10 +98,12 @@ const ParticipationDetailsForm: FC<Props> = ({ afterSubmit }): JSX.Element | nul
             </div>
             <div className={styles.inputWrapper}>
                 <div className={styles.leftCol}>
-                    <div className={styles.tshirtSizesTitle}>Taille</div>
+                    <label htmlFor="tshirtSize" className={styles.tshirtSizesTitle}>
+                        Taille
+                    </label>
                 </div>
                 <div>
-                    <select ref={sizeRef} className={styles.tshirtCountSelect}>
+                    <select id="tshirtSize" ref={sizeRef} className={styles.tshirtCountSelect}>
                         {tshirtSizes.map((size) => (
                             <option key={size} value={size}>
                                 {size}
@@ -138,7 +140,9 @@ const ParticipationDetailsForm: FC<Props> = ({ afterSubmit }): JSX.Element | nul
             </div>
             <div className={styles.inputWrapper}>
                 <div className={styles.leftCol}>
-                    <label htmlFor="dday-diet">Préférence alimentaire</label>
+                    <label className={styles.foodTitle} htmlFor="dday-diet">
+                        Préférence alimentaire
+                    </label>
                 </div>
                 <div>
                     <input

src/components/VolunteerBoard/ParticipationDetailsForm/styles.module.scss

@@ -3,12 +3,13 @@
 
 .title {
     padding: 4px;
+    margin: 15px 0;
     font-weight: bold;
     text-align: center;
 }
 
 .inputWrapper {
-    margin: 10px 0;
+    margin: 25px 0;
 
     @include desktop {
         display: flex;
@@ -29,28 +30,26 @@
     flex: 0 0 240px;
 }
 
-.tshirtWrapper {
-    margin: 10px 0;
-    height: 28px;
-}
-
 .tshirtCountTitle {
     display: inline-block;
-    margin-top: 6px;
     width: 240px;
+    margin-bottom: 10px;
 }
 
 .tshirtCountLabel {
+    margin-bottom: 10px;
     width: 55px;
 }
 
 .tshirtSizesTitle {
     display: inline-block;
     width: 240px;
+    margin-bottom: 10px;
 }
 
 .tshirtCountSelect {
     width: 120px;
+    margin-bottom: 10px;
     border: 1px solid $color-grey-medium;
     border-radius: 4px;
     background-color: $color-white;
@@ -59,11 +58,12 @@
 
 .adultTitle {
     display: inline-block;
-    margin-top: 6px;
     width: 240px;
+    margin-bottom: 10px;
 }
 
 .adultLabel {
+    margin-bottom: 10px;
     width: 55px;
 }
 
@@ -71,3 +71,7 @@
     margin-bottom: 10px;
     text-align: center;
 }
+
+.foodTitle {
+    margin-bottom: 10px;
+}

src/components/VolunteerBoard/TeamWishes/TeamWishes.tsx

@@ -31,7 +31,11 @@ const TeamWishes: FC<Props> = (): JSX.Element | null => {
     return (
         <div className={styles.root}>
             <div className={styles.title}>Mon choix d'équipe</div>
-            {teamWishesString && <span>{teamWishesString}</span>}
+            {teamWishesString && (
+                <span>
+                    Mes équipes préférées : <b>{teamWishesString}</b>
+                </span>
+            )}
             {!teamWishesString && <span className={styles.lineEmpty}>Non renseignés</span>}
             {comment && (
                 <div className={styles.commentLine}>