mirror of
https://github.com/Paris-est-Ludique/intranet.git
synced 2025-06-08 08:34:20 +02:00
Improve /profil
This commit is contained in:
parent
ce13e0c8b4
commit
60b7824011
@ -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>
|
||||
|
@ -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 />
|
||||
|
@ -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>
|
||||
{dayWishesString && <span>{dayWishesString}</span>}
|
||||
<span className={styles.dayLineTitle}>Mes jours :</span>
|
||||
{dayWishesString && <b>{dayWishesString}</b>}
|
||||
{!dayWishesString && <span className={styles.dayLineEmpty}>Non renseignés</span>}
|
||||
</div>
|
||||
{comment && (
|
||||
|
@ -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 {
|
||||
|
@ -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 }) => (
|
||||
|
@ -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 {
|
||||
|
@ -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}>
|
||||
|
@ -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
|
||||
|
@ -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;
|
||||
}
|
||||
|
@ -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}>
|
||||
|
Loading…
x
Reference in New Issue
Block a user