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

Merge remote-tracking branch 'origin/reborn' into apommier

Browse Source
This commit is contained in:
Alexandre POMMIER 2023-06-28 17:51:45 +02:00
commit c5371353f8
16 changed files with 7 additions and 215 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
containers/react/.env
View File

@ -1,13 +1,6 @@
REACT_APP_BASE_URL=paul-f5Ar4s4:8080
REACT_APP_SOCKET_URL=paul-f5Ar4s4
REACT_APP_API_SECRET=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
REACT_APP_CLIENT_UID=u-s4t2ud-2bd3c5d4f41e776f2e3d5d699d2a8421f6d0c0468ec882516d9ca89b0c211789
# REACT_APP_BASE_URL=92.143.191.152
# REACT_APP_BASE_URL=192.168.1.19
REACT_APP_INTRA_URL="https://api.intra.42.fr/oauth/authorize?client_id=u-s4t2ud-2bd3c5d4f41e776f2e3d5d699d2a8421f6d0c0468ec882516d9ca89b0c211789&redirect_uri=http%3A%2F%2Fpaul-f5Ar4s4%3A8080%2Fapi%2Fauth%2Flogin&response_type=code"
# REACT_APP_BASE_URL=92.143.191.152
# REACT_APP_BASE_URL=192.168.1.19

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

@ -4,19 +4,6 @@ import { AiOutlineCheckCircle } from "react-icons/ai";
import '../../styles/Messages.css'
import React from "react";
const dropIn = {
hidden: {
y: "-100vh",
},
visible: {
y: "0",
},
exit: {
y: "-100vh",
},
};
interface AlertProps {
handleClose: Function,
text: string
@ -30,7 +17,6 @@ function GreenAlert({ handleClose, text }: AlertProps) {
<motion.div
onClick={(e) => e.stopPropagation()}
className="greenAlert"
// variant={dropIn}
initial="hidden"
animate="visible"
exit="exit"

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

@ -4,19 +4,6 @@ import { BiErrorCircle } from "react-icons/bi";
import '../../styles/Messages.css'
import React from "react";
const dropIn = {
hidden: {
y: "-100vh",
},
visible: {
y: "0",
},
exit: {
y: "-100vh",
},
};
interface AlertProps {
handleClose: Function,
text: string

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

@ -6,18 +6,6 @@ import React from "react";
import { MdQrCodeScanner } from "react-icons/md";
import { GiCrownedSkull, GiWingedSword } from "react-icons/gi";
const dropIn = {
hidden: {
y: "-100vh",
},
visible: {
y: "0",
},
exit: {
y: "-100vh",
},
};
interface AlertProps {
handleClose: Function,
text: string,

2
containers/react/src/components/Social/Friend.tsx
View File

@ -6,7 +6,7 @@
/* By: apommier <apommier@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2023/06/09 08:18:58 by apommier #+# #+# */
/* Updated: 2023/06/28 17:46:36 by apommier ### ########.fr */
/* Updated: 2023/06/28 17:50:52 by apommier ### ########.fr */
/* */
/* ************************************************************************** */

2
containers/react/src/components/Social/FriendRequest.tsx
View File

@ -28,7 +28,7 @@ interface UserProps {
export default function Friend({currentUser}: UserProps)
{
const [profilePicture, setProfilePicture] = useState('');
const [request, setRequest] = useState<User>(); //user who invite
const [request, setRequest] = useState<User>();
const [clickEvent, setClickEvent] = useState(false);
useEffect(() => {

22
containers/react/src/components/Social/Social.tsx
View File

@ -1,37 +1,16 @@
import api from '../../script/axiosApi.tsx';
import React, { useState, useEffect} from "react";
import styled from "styled-components";
import Friend from './Friend.tsx';
import FriendRequest from './FriendRequest.tsx';
import {IoMdPeople} from 'react-icons/io'
import {User} from "../../../interfaces.tsx"
const TouchDiv = styled.div`
margin-left: 10px;
margin-right: 4px;
margin-bottom: 21px;
margin-top: 21px;
cursor: pointer;
justify-content: space-around;
&:hover {
color: #F4F3EF;
}
`
function Social (){
const [friends, setFriends] = useState([]);
const [invite, setInvite] = useState([]);
const [isLoading, setIsLoading] = useState<boolean>(true);
const [user, setUser] = useState<User>();
const [profilePicture, setProfilePicture] = useState('');
useEffect(()=> {
const getFriend = async ()=>{
@ -42,7 +21,6 @@ function Social (){
const pic = await api.post("/getPicture", {username: tmpUser.data.username})
setInvite(tmpInv.data);
setProfilePicture(pic.data);
setUser(tmpUser.data);
setFriends(tmpFriends.data);
setIsLoading(false)

5
containers/react/src/styles/Game.css
View File

@ -7,7 +7,6 @@
.rank_elements {
border-width:1px;
border-style:solid;
/* background-color: #5843e4; */
border-color: grey;
/* overflow: scroll; */
padding: 5px 100px;
@ -15,16 +14,12 @@
}
.scroll {
/* border:3px; */
/* background-color: #5843e4; */
/* border-color: white; */
overflow: scroll;
height: 68vh;
}
.profilePic{
margin-left: 10px;
/* margin-top: 10px; */
height: 30px;
width: 30px;
border-radius: 50%;

18
containers/react/src/styles/Header.css
View File

@ -1,10 +1,7 @@
.Header {
background-image: linear-gradient(90deg, #5843e4, #5a0760);
/* background-color: blue; */
height: 80px;
display: flex;
/* justify-content: start; */
align-items: center;
}
@ -25,10 +22,6 @@
top: 0;
left: 0;
transition: 350ms;
/* margin-top: 10px; */
/* left: -100%; */
/* transition: 850ms; */
}
.nav-menu.active {
@ -38,10 +31,8 @@
.nav-text {
display: flex;
/* justify-content: start; */
align-items: center;
padding: 8px 0px 8px 16px;
list-style: none;
height: 60px;
}
@ -54,9 +45,7 @@
height: 100%;
display: flex;
align-items: center;
/* padding: 0 16px; */
padding: 8px 8px 8px 8px;
border-radius: 20px;
}
@ -73,7 +62,6 @@
width: 100%;
height: 80px;
display: flex;
/* justify-content: start; */
align-items: center;
}
@ -92,17 +80,12 @@ span {
.success {
height: 2%;
width: 2%;
/* border: solid; */
margin-top: 1%;
margin: 3vh;
/* margin-bottom: -12vh; */
/* border-color: black; */
/* border-radius: 50%; */
}
.header-pic{
text-align: end;
/* id: right; */
}
.footer {
@ -122,7 +105,6 @@ span {
left: 0;
height: 100%;
width: 100%;
/* background: #000000e1; */
backdrop-filter: blur(1.5rem);
display: flex;
align-items: center;

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

@ -56,18 +56,13 @@ select{
width: 30%;
overflow: scroll;
border-radius: 0px 0px 0px 10px;
/* width: 2rem; */
/* height: 4rem; */
}
.messages_box{
background-color: rgb(0, 0, 0);
/* height: 90vh; */
display: flex;
align-items: center;
justify-content: center;
/* position:relative; */
}
.container{
@ -96,11 +91,8 @@ select{
}
.navbar{
/* width: clamp(50%, 500px, 20%); */
/* height: min(50%, 100px); */
display: flex;
align-items: center;
/* background-color: yellow; */
background-image: linear-gradient(90deg, #5843e4, #5a0760);
color: white;
padding: 3px;
@ -109,11 +101,8 @@ select{
}
.navbarSocial{
/* width: clamp(50%, 500px, 20%); */
/* height: min(50%, 100px); */
display: flex;
align-items: center;
/* background-color: yellow; */
margin: 10px;
background-image: linear-gradient(90deg, #5843e4, #5a0760);
color: white;
@ -142,14 +131,10 @@ select{
width: 50px;
border-radius: 50%;
object-fit: cover;
/* margin-right: 10px; */
}
.messages{
/* background-color: rgb(26, 26, 26); */
/* height: calc(100% - 118px); */
width: 70%;
/* height: 300px; */
border-radius: 0px 0px 10px 0px;
overflow: scroll;
}
@ -247,8 +232,6 @@ p {
.div_submit {
flex-direction: row;
align-items: center;
/* margin-left: 4px;
margin-right: 4px; */
}
.lookForFriends{
@ -268,7 +251,6 @@ p {
margin: auto;
padding: 1rem;
border-radius: 12px;
/* display: flex; */
flex-direction: row;
align-items: center;
background-color: rgba(0, 86, 27, 0.7);
@ -276,21 +258,6 @@ p {
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;
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);
@ -300,7 +267,6 @@ p {
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);
@ -335,8 +301,6 @@ p {
padding: 2rem;
border-radius: 12px;
display: flex;
/* flex-direction: column; */
/* align-items: center; */
background-color: #3e3c61;
overflow: scroll;
}
@ -354,8 +318,6 @@ p {
.settingSecondPart{
margin-top: 10%;
margin-left: 5%;
/* margin-left: 20%; */
}
.checkbox{

13
containers/react/src/styles/Profile.css
View File

@ -1,10 +1,6 @@
/* Container style */
.file-upload-container {
.file-upload-container {
margin-left: 2rem;
font-size: 1.7rem;
/* background: #5843e4; */
/* color:#f5f5f5; */
margin: 0 16px;
text-decoration: none;
padding: 10px 16px;
@ -15,11 +11,8 @@
gap: 10px;
}
/* File input style */
.file-input {
/* background: #5843e4; */
/* color:#f5f5f5; */
display: none; /* Hide the default file input */
.file-input {
display: none;
}
.file-label {

18
containers/react/src/styles/Win_Loss.css
View File

@ -1,17 +1,8 @@
.tab{
/* display: flex; */
/* flex-direction: column; */
/* background-color: red; */
height: 60vh;
/* padding: 15px; */
/* overflow: scroll; */
}
.scroll {
/* border:3px; */
/* background-color: #5843e4; */
/* border-color: white; */
overflow: scroll;
}
@ -20,26 +11,20 @@
}
.elements {
/* display: flex; */
border-width:1px;
border-style:solid;
/* background-color: #5843e4; */
border-color: grey;
/* overflow: scroll; */
}
.title {
color: #5843e4;
/* font-size: 22px; */
font-weight: bold;
margin-bottom: 25px;
}
.content {
color: white;
/* font-size: 22px; */
font-weight: bold;
/* display: flex; */
flex-direction: column;
margin-bottom: 5px;
}
@ -48,11 +33,8 @@
display:inline;
flex-direction: row;
color: white;
/* font-size: 22px; */
font-weight: bold;
flex-direction: row;
/* text-align: justify; */
/* margin-bottom: 5px; */
}
.me {

12
containers/react/src/styles/chat.css
View File

@ -156,14 +156,4 @@
bottom: 50px;
font-size: 13px;
font-style: italic;
}
/* Messages.css */
/* import '../../styles/Messages.css' */
/* General styles */
/* Messages.css */
/* import '../../styles/Messages.css' */
/* General styles
}

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

@ -18,32 +18,22 @@
.field {
background-color: rgb(249, 249, 249);
/* border-radius: 5vh; */
/* color: rgb(100, 42, 42); */
display: block;
margin: auto;
margin-top: 5vh;
/* padding: 2vh 5vw; */
height: 80%;
width: 80%;
/* font-size: 300%; */
}
.clicked{
/* justify-content: center; */
/* display: flex;
justify-content: center; */
background-color: rgb(0, 0, 0);
width: 70vw;
/* height: 70vh; */
margin:auto;
margin-right: 15vw;
margin-left: 15vw;
margin-top: 10vh;
position: relative;
padding-top: 35%;
/* padding-top: 25; */
/* padding-top: 177.77% */
}
@media screen and (max-width: 900px){
.playButton{
@ -74,36 +64,9 @@
flex-direction: column;
}
/* @media screen and (max-width: 350px){
.responsive{
display:list-item;
flex-direction: column;
}
} */
#myCanvas {
background-color: rgb(124, 47, 47);
/* position: absolute; */
/* top: 0; */
/* left: 0; */
/* cursor: none; */
width: 100%;
height: 100%;
margin: 0;
}
/* @media screen and (max-width: 768px) { */
/* #canvas_container { */
/* width: 50%; */
/* transform: rotate(90deg);
transform-origin: top right;
position: relative;
/* margin-right: 100vw; */
/* height: 100vw; */
/* width: 100vh; */
/* } */
/* #myCanvas {
height: 100%;
width: 100%;
} */
/* } */
}

1
containers/react/src/styles/index.css
View File

@ -5,7 +5,6 @@ body {
sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/* height: 100%; */
}
code {

6
containers/react/src/styles/old.css
View File

@ -1,5 +1,4 @@
body {
/* display: flex; */
margin: 0%;
width: 100vw;
height: 100vh;
@ -20,7 +19,6 @@ footer {
width: 7vw;
max-height: 7vh;
max-width: 7vh;
/* max-width: ; */
border-radius: 50%;
border: 5px solid rgb(255, 255, 255);
}
@ -66,7 +64,6 @@ input{
}
.username {
/* justify-content: center; */
margin-right: 1vw;
display: flex;
align-items: center;
@ -90,7 +87,6 @@ input{
.menu {
margin-left: 2vw;
color: aqua;
/* font-size: 4vh; */
font-size: 2vw;
text-decoration: none;
}
@ -111,9 +107,7 @@ input{
display:flex;
max-width: 33%;
height: 100%;
/* font-size: 50px; */
color:blueviolet;
/* font-size: 10vw; */
font-size: min(10vw, 10vh);
justify-content: center;
}