-Making responsive :
     - Home page (note finished)
     - Profil page
     - Settings page
This commit is contained in:
Mathis Degryck
2024-10-04 19:51:04 +02:00
parent 975763d20f
commit 7f5cf36eb7
4 changed files with 172 additions and 3 deletions

View File

@ -6,7 +6,7 @@
/* By: madegryc <madegryc@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/07 12:00:55 by edbernar #+# #+# */
/* Updated: 2024/10/01 17:17:24 by madegryc ### ########.fr */
/* Updated: 2024/10/04 19:40:55 by madegryc ### ########.fr */
/* */
/* ************************************************************************** */
@ -399,6 +399,7 @@ button {
position: absolute;
bottom: 65px;
left: 50%;
text-align: center;
transform: translateX(-50%);
font-size: 24px;
color: white;
@ -477,4 +478,59 @@ footer {
#popMenuLoginButton p:hover {
background-color: #020202;
color: white;
}
@media (max-width: 700px){
#topButton {
display: none;
}
#firstText{
font-size: 30px;
padding-inline: 20px;
padding-top: 70px;
}
#secondText{
font-size: 30px;
padding-inline: 20px;
padding-top: 140px;
}
#firstBall{
position: absolute;
width: 250px;
transform-origin: center;
transform: translateX(-50%);
left: 0;
}
#secondBall{
position: absolute;
width: 250px;
transform-origin: center;
transform: translateX(50%);
top: 650px;
right: 0;
}
.containerHomePage {
width: 100%;
height: 100%;
}
.right-side {
padding-inline: 30px;
}
.right-side-register {
padding-inline: 30px;
}
.left-side {
display: none;
}
.team {
padding-inline: 30px;
padding-block: 50px;
}
.team-member {
max-width: 250px;
width: 100%;
height: auto;
}
}

View File

@ -3,10 +3,10 @@
/* ::: :::::::: */
/* liveChat.css :+: :+: :+: */
/* +:+ +:+ +:+ */
/* By: edbernar <edbernar@student.42angouleme. +#+ +:+ +#+ */
/* By: madegryc <madegryc@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/07/30 13:53:39 by edbernar #+# #+# */
/* Updated: 2024/09/29 03:24:21 by edbernar ### ########.fr */
/* Updated: 2024/10/04 18:03:56 by madegryc ### ########.fr */
/* */
/* ************************************************************************** */
@ -268,4 +268,10 @@
.status img {
object-fit: cover;
object-position: center;
}
@media (max-width: 700px){
#chatButton {
left: 40px;
}
}