- Add style home page
This commit is contained in:
madegryc pc
2024-08-10 17:19:05 +02:00
parent 601bfc99ab
commit 7a5014e2ed
15 changed files with 89 additions and 20 deletions

18
site/interface/package-lock.json generated Normal file
View File

@ -0,0 +1,18 @@
{
"name": "interface",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"dependencies": {
"three": "^0.167.1"
}
},
"node_modules/three": {
"version": "0.167.1",
"resolved": "https://registry.npmjs.org/three/-/three-0.167.1.tgz",
"integrity": "sha512-gYTLJA/UQip6J/tJvl91YYqlZF47+D/kxiWrbTon35ZHlXEN0VOo+Qke2walF1/x92v55H6enomymg4Dak52kw==",
"license": "MIT"
}
}
}

View File

@ -0,0 +1,5 @@
{
"dependencies": {
"three": "^0.167.1"
}
}

View File

@ -19,8 +19,13 @@
</div>
<div id="topBar">
<h1>PTME</h1>
<div id="topButton">
<p>HOME</p>
<p>PROJECT</p>
<p>NEWS</p>
</div>
<div id="loginButton">
<p>Login</p>
<p>LOGIN</p>
</div>
</div>
<div id="chatButton">

View File

@ -6,7 +6,7 @@
/* By: marvin <marvin@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/07 18:14:53 by edbernar #+# #+# */
/* Updated: 2024/08/10 01:10:03 by marvin ### ########.fr */
/* Updated: 2024/08/10 17:00:39 by marvin ### ########.fr */
/* */
/* ************************************************************************** */
@ -42,9 +42,10 @@ function createConnectDiv(divLogin)
const createAccText = document.createElement("p");
const newAccDiv = document.createElement("div");
const divCenter = document.createElement("div");
const orText = document.createElement("p");
addGlobalBg();
MainText.innerText = "Acces to a new WORLD";
MainText.innerText = "Access to a new WORLD";
MainText.setAttribute("id", "mainText");
mailText.innerText = "Email";
passText.innerText = "Password";
@ -53,7 +54,6 @@ function createConnectDiv(divLogin)
createAccText.innerText = "Create an account";
createAccText.setAttribute("id", "createAccText")
createAccText.addEventListener("mousedown", () => {
console.log("YO LES BG");
createButtonNewAcc(divConnect, divLogin);
});
newAccDiv.setAttribute("id", "newAccDiv");
@ -68,6 +68,8 @@ function createConnectDiv(divLogin)
inputPass.setAttribute("placeholder", "password");
buttonLogin.innerHTML = "Login";
buttonLogin.setAttribute("id", "styleButton");
orText.innerText = "▬▬▬▬▬▬▬▬▬▬ Or ▬▬▬▬▬▬▬▬▬▬";
orText.setAttribute("id", "orText");
buttonConnect42.innerHTML = "Log with 42";
buttonConnect42.setAttribute("id", "styleButton42")
divConnect.appendChild(MainText);
@ -79,6 +81,7 @@ function createConnectDiv(divLogin)
newAccDiv.appendChild(newPlayerText);
newAccDiv.appendChild(createAccText);
form.appendChild(newAccDiv);
form.appendChild(orText);
form.appendChild(buttonConnect42);
divCenter.appendChild(form);
divCenter.setAttribute("id", "divCenter");

View File

@ -3,10 +3,10 @@
/* ::: :::::::: */
/* createThreeDiv.js :+: :+: :+: */
/* +:+ +:+ +:+ */
/* By: edbernar <edbernar@student.42.fr> +#+ +:+ +#+ */
/* By: marvin <marvin@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/07 18:09:36 by edbernar #+# #+# */
/* Updated: 2024/08/07 18:11:19 by edbernar ### ########.fr */
/* Updated: 2024/08/10 17:13:41 by marvin ### ########.fr */
/* */
/* ************************************************************************** */
@ -15,6 +15,7 @@ function createThreeDiv()
const divThree = document.createElement("div");
divThree.setAttribute("id", "threeDiv");
return (divThree);
}

View File

@ -3,10 +3,10 @@
/* ::: :::::::: */
/* home.css :+: :+: :+: */
/* +:+ +:+ +:+ */
/* By: edbernar <edbernar@student.42.fr> +#+ +:+ +#+ */
/* By: marvin <marvin@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/07 12:00:55 by edbernar #+# #+# */
/* Updated: 2024/08/07 17:31:35 by edbernar ### ########.fr */
/* Updated: 2024/08/10 16:56:50 by marvin ### ########.fr */
/* */
/* ************************************************************************** */
@ -20,40 +20,66 @@ body {
padding: 0;
width: 100%;
height: 100%;
background-color: #616161;
background-color: #020202;
user-select: none;
}
#topBar {
margin: 10px;
margin-top: 25px;
padding: 0;
display: flex;
flex-direction: row;
justify-content: space-between;
background-color: black;
background-color: #020202;
}
#topButton{
margin: 0;
padding: 0;
color: white;
display: flex;
font-size: 25px;
padding-right: 45%;
padding-top: 12px;
font-family: "Poppins", sans-serif;
font-weight: 500;
font-style: normal;
gap: 25%;
}
#topBar h1 {
margin: 0;
padding: 0;
font-size: 40px;
padding-top: 4px;
font-size: 35px;
margin-left: 50px;
margin-right: 15px;
color: white;
font-family: 'Poppins';
font-style: italic;
font-weight: bold;
}
#topBar #loginButton {
font-size: 20px;
background-color: white;
height: 40px;
width: 100px;
width: 130px;
color: black;
font-family: 'Poppins';
font-family: "Poppins", sans-serif;
font-weight: 500;
font-style: normal;
text-align: center;
line-height: 40px;
margin: 10px 10px;
margin-right: 50px;
transition: background-color 0.3s ease;
}
#topBar #loginButton:hover {
background-color: #f0f0f0;
background-color: #020202;
color: white;
cursor: pointer;
}

View File

@ -3,10 +3,10 @@
/* ::: :::::::: */
/* liveChat.css :+: :+: :+: */
/* +:+ +:+ +:+ */
/* By: edbernar <edbernar@student.42.fr> +#+ +:+ +#+ */
/* By: marvin <marvin@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/07/30 13:53:39 by edbernar #+# #+# */
/* Updated: 2024/08/07 18:20:44 by edbernar ### ########.fr */
/* Updated: 2024/08/10 16:47:10 by marvin ### ########.fr */
/* */
/* ************************************************************************** */
@ -179,7 +179,6 @@
color: white;
display: flex;
flex-direction: row;
border: 1px solid #000000;
}
#inputMessageDiv p {

View File

@ -6,7 +6,7 @@
/* By: marvin <marvin@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2024/08/07 17:15:28 by edbernar #+# #+# */
/* Updated: 2024/08/10 01:18:47 by marvin ### ########.fr */
/* Updated: 2024/08/10 14:12:44 by marvin ### ########.fr */
/* */
/* ************************************************************************** */
@ -103,8 +103,20 @@
#createAccText{
margin-left: 10px;
cursor: pointer;
/* text-decoration: underline 2px; */
border-bottom: white 1px solid;
transition: color 0.3s ease;
}
#createAccText:hover{
color: rgb(165, 165, 165);
}
#orText{
align-content: center;
text-align: center;
margin-top: 15px;
margin-bottom: 15px;
}
#newAccDiv{
@ -124,7 +136,7 @@
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
animation: anim1 0.2s;
animation: anim1 0.4s;
font-family: "Poppins", sans-serif;
font-weight: 500;
font-style: normal;