Kinou/ft_transcendence
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

recentre alerte

Browse Source
This commit is contained in:
Elisee ADJIGUIDI 2023-06-26 05:09:47 +02:00
parent ba5490cf90
commit 3d74296bb8
4 changed files with 76 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
containers/react/src/components/Alert/GreenAlert.tsx
View File

@ -36,7 +36,9 @@ function GreenAlert ({handleClose, text}: AlertProps){
exit="exit"
>
<AiOutlineCheckCircle />
<p>{text}</p>
<div className="text_alert">
<h5>{text}</h5>
</div>
</motion.div>
</Backdrop>
)

4
containers/react/src/components/Alert/RedAlert.tsx
View File

@ -35,7 +35,9 @@ function RedAlert ({handleClose, text}: AlertProps) {
exit="exit"
>
<BiErrorCircle/>
<p>{text}</p>
<div className="text_alert">
<h5>{text}</h5>
</div>
</motion.div>
</Backdrop>
)

2
containers/react/src/components/Alert/YellowAlert.tsx
View File

@ -52,7 +52,9 @@ function YellowAlert ({handleClose, text, icon}: AlertProps) {
<GiWingedSword />
) : ("")}
<div className="text_alert">
<h5>{text}</h5>
</div>
</motion.div>
</Backdrop>
)

39
containers/react/src/styles/Messages.css
View File

@ -266,7 +266,7 @@ p {
color: rgba(255, 255, 255, 1);
}
.redAlert{
/* .redAlert{
width: clamp(50%, 500px, 90%);
height: min(50%, 100px);
@ -275,23 +275,30 @@ p {
border-radius: 12px;
flex-direction: row;
align-items: center;
text-align: center;
background-color: rgba(133, 6, 6, 0.7);
font-size: 25px;
color: rgba(255, 255, 255, 1);
} */
.redAlert{
width: clamp(50%, 500px, 90%);
height: min(50%, 100px);
margin: auto;
padding: 1rem;
border-radius: 12px;
flex-direction: row;
text-align: center;
/* align-items: center; */
background-color: rgba(133, 6, 6, 0.7);
font-size: 25px;
color: rgba(255, 255, 255, 1);
}
.redAlert{
width: clamp(50%, 500px, 90%);
height: min(50%, 100px);
margin: auto;
padding: 1rem;
border-radius: 12px;
flex-direction: row;
align-items: center;
background-color: rgba(133, 6, 6, 0.7);
font-size: 25px;
color: rgba(255, 255, 255, 1);
.text_alert{
text-align: center;
justify-content: center;
}
.yellowAlert{
@ -303,17 +310,13 @@ p {
border-radius: 12px;
flex-direction: row;
align-items: center;
text-align: center;
background-color: rgba(212, 175, 55, 0.7);
font-size: 25px;
color: rgba(255, 255, 255, 1);
flex-wrap: wrap;
}
.yellowAlert::p {
overflow-wrap: break-word;
max-width: 1000px;
}
.modalSetting{
width: clamp(50%, 700px, 90%);
height: min(50%, 300px);