pascal.lafourcade
/
swish
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

AJOUT btn règles et Code éthique CSS

Browse Source
Golfier
theo 5 years ago
parent 7c6b343cc2
commit ea982e3760
11 changed files with 1370 additions and 1210 deletions
Show Stats Download Patch File Download Diff File

BIN
SwichGIT/.vs/SwichGIT/v16/.suo
View File

Binary file not shown.

7
SwichGIT/.vs/VSWorkspaceState.json
Unescape View File

@ -0,0 +1,7 @@
{
"ExpandedNodes": [
"",
"\\src"
],
"PreviewInSolutionExplorer": false
}

BIN
SwichGIT/.vs/slnx.sqlite
View File

Binary file not shown.

236
SwichGIT/src/css/PageDaccueil.css
Unescape View File

@ -0,0 +1,236 @@
#pageAccueil {
visibility: visible;
}
#cloud {
z-index: 10
}
#mount1 {
z-index: 11;
}
#mount2 {
z-index: 10;
}
/*Bouton info*/
#infosec{
z-index:15;
}
#info {
color: #B7B7B7;
text-decoration: none;
font-size: 45px;
}
#info:hover {
color: #E4E8E7;
}
.activity {
padding: 0;
margin: 2em 0;
list-style: none;
}
li {
-webkit-transition: box-shadow 0.2s ease;
-moz-transition: box-shadow 0.2s ease;
transition: box-shadow 0.2s ease;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
border-radius: 50%;
color: #B7B7B7;
display: inline-block;
font-size: 0.889em;
height: 3em;
margin: 0 1em 1em;
position: relative;
text-align: center;
text-transform: lowercase;
width: 3em;
line-height: 3em;
}
li a {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
li:hover {
box-shadow: 0 0 0 7px #B7B7B7;
}
li:before {
-webkit-transition: all 0.2s ease;
-moz-transition: all 0.2s ease;
transition: all 0.2s ease;
border-radius: 50%;
bottom: 0;
box-shadow: 0 0 0 4px #B7B7B7;
content: '';
left: 0;
position: absolute;
right: 0;
top: 0;
background-color: #B130DE;
}
#infosec {
position: absolute;
left: 57%;
top: 35%;
}
/*Les règles popups*/
.overlay {
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgba(0, 0, 0, 0.7);
transition: opacity 500ms;
visibility: hidden;
opacity: 0;
z-index: 21;
}
.overlay:target {
visibility: visible;
opacity: 1;
}
.popup {
margin: 70px auto;
padding: 20px;
background: #fff;
border-radius: 5px;
width: 30%;
position: relative;
top:25%;
}
.popup h2 {
margin-top: 0;
color: #333;
font-family: Tahoma, Arial, sans-serif;
}
.popup .close {
position: absolute;
top: 20px;
right: 30px;
transition: all 200ms;
font-size: 30px;
font-weight: bold;
text-decoration: none;
color: #333;
}
.popup .close:hover {
color: #06D85F;
}
.popup .content {
max-height: 30%;
overflow: auto;
}
/* J'ai trop avancé, mode multi*/
#containpseudo {
position: absolute;
height: 15%;
width: 30%;
z-index: 12;
left: 35%;
top: 30%;
}
#pseudoenter {
background-color: red;
height: 100%;
border-radius: 45px;
background-color: #B130DE;
}
#inputpseudo {
position: absolute;
width: 99%;
height: 65%;
border-radius: 30px;
font-size: 3vw;
background-color: transparent;
-moz-appearance: none;
text-align: center;
color: #707070;
border-color: transparent;
font-family: impact, Arial Black;
z-index: 11;
}
#fondinput {
background-color: red;
position: absolute;
width: 97%;
background-color: var(--lightsedonca);
height: 90%;
border-radius: 40px;
left: 1.5%;
top: 5%;
z-index: 10;
}
#buttonadd {
position: absolute;
top: 30%;
right: -12%;
height: 3vw;
width: 3vw;
border-radius: 2vw;
background-color: #B130DE;
z-index: 18;
}
#textplus {
font-size: 3vw;
font-family: arial, Arial Black;
position: absolute;
margin-top: -0.15vw;
margin-left: 0.65vw;
color: var(--lightprima);
}
#containplayers {
position: absolute;
background-color: transparent;
color: var(--lightsedonca);
width: 15vw;
height: 20vw;
z-index: 17;
right: 0%;
top: 8vw;
}
.pseudojoueur {
float: right;
margin-top: 0px;
margin-bottom: 3%;
margin-right: 10%;
font-family: Lucida Console, Arial Black, Arial;
font-size: 2vw;
}
#pseudolist {
width: 100%;
height: 1.7vw;
}

15
SwichGIT/src/css/PartieGame.css
Unescape View File

@ -0,0 +1,15 @@
#pageGame {
visibility: hidden;
}
.menuhaut {
height: 10vh;
width: inherit;
display: flex;
}
.retourstp {
position: absolute;
}

311
SwichGIT/src/css/Resp1.css
Unescape View File

@ -0,0 +1,311 @@
/*Demi Ecran*/
@media screen and (max-width: 960px) and (min-height: 600px) {
.anneau {
box-sizing: border-box;
background-color: #FFD100;
border-radius: 3vw;
height: inherit;
width: inherit;
display: table-cell;
vertical-align: middle;
}
.rondinterieur {
background-color: var(--lightsedonca);
height: 3vw;
width: 3vw;
display: table;
margin: 0 auto;
border-radius: 3vw;
}
.containform {
box-sizing: content-box;
height: 6vw;
width: 6vw;
display: table-cell;
vertical-align: middle;
}
.rond {
display: table;
margin: 0 auto;
background-color: #FFD100;
height: 3vw;
width: 3vw;
border-radius: 3vw;
}
/* PARTIE CARRE */
.carre {
background-color: #30C0DE;
height: inherit;
width: inherit;
display: table-cell;
vertical-align: middle
}
.carreinterieur {
background-color: var(--lightsedonca);
height: 3vw;
width: 3vw;
display: table;
margin: 0 auto;
}
.pcarre {
display: table;
margin: 0 auto;
background-color: #30C0DE;
height: 3vw;
width: 3vw;
}
/* PARTIE TRIANGLE */
.triangle {
display: table;
margin: 0 auto;
border-left: 2.5vw solid transparent;
border-right: 2.5vw solid transparent;
border-bottom: 5vw solid #DEA430;
}
.trianglerinterieur {
position: absolute;
margin-left: -1.5vw;
margin-top: 1.25vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-bottom: 3vw solid var(--lightsedonca);
}
.ptriangle {
display: table;
margin: 0 auto;
margin-top: 0.75vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-bottom: 3vw solid #DEA430;
}
/* TRAPEZE */
.trapeze {
bottom: 0px;
height: 0;
margin-top: 2.58vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-top: 3vw solid #6FDE30;
}
.triangletrapeze {
padding-top: 0.1vw;
position: absolute;
border-left: 3vw solid transparent;
border-right: 3vw solid transparent;
border-bottom: 2.5vw solid #6FDE30;
}
.trapezeinte {
position: absolute;
margin-top: 3vw;
margin-left: 1.25vw;
width: 2vw;
border-left: 0.75vw solid transparent;
border-right: 0.75vw solid transparent;
border-top: 1.5vw solid var(--lightsedonca);
z-index: 15;
}
.triangletrapezeinte {
position: absolute;
margin-top: 1.45vw;
margin-left: 1.25vw;
padding-top: 0.1vw;
border-left: 1.75vw solid transparent;
border-right: 1.75vw solid transparent;
border-bottom: 1.5vw solid var(--lightsedonca);
z-index: 15;
}
.trapezep {
display: table;
margin: 0 auto;
margin-top: 2vw;
width: 2vw;
border-left: 0.75vw solid transparent;
border-right: 0.75vw solid transparent;
border-top: 1.5vw solid #6FDE30;
z-index: 15;
}
.triangletrapezep {
position: absolute;
margin-top: 0.55vw;
margin-left: 1.25vw;
border-left: 1.75vw solid transparent;
border-right: 1.75vw solid transparent;
border-bottom: 1.5vw solid #6FDE30;
z-index: 15;
}
.losangephaut {
display: table;
margin: 0 auto;
margin-top: -3vw;
border-left: 3vw solid transparent;
border-right: 3vw solid transparent;
border-bottom: 3vw solid #B130DE;
}
.losangepbas {
position: absolute;
border-left: 3vw solid transparent;
border-right: 3vw solid transparent;
border-top: 3vw solid #B130DE;
}
.losangephauti {
display: table;
margin: 0 auto;
margin-top: -1.5vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-bottom: 1.5vw solid var(--lightsedonca);
}
.losangepbasi {
position: absolute;
margin-left: 1.5vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-top: 1.5vw solid var(--lightsedonca);
}
.losangephautc {
display: table;
margin: 0 auto;
margin-top: -1.5vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-bottom: 1.5vw solid #B130DE;
}
.losangepbasc {
position: absolute;
margin-left: 1.5vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-top: 1.5vw solid #B130DE;
}
.buttonretour {
position: relative;
height: 4vh;
width: 4vh;
border-radius: 55vw;
background-color: var(--lightsedonca);
z-index: 5;
margin-left: 2vw;
top: 1.75vw;
}
.flex-item {
background: var(--lightsedonca);
width: 15vw;
height: 18vw;
border-radius: 2vw;
padding-right: 0.4vw;
padding-left: 0.4vw;
padding-bottom: 0.8vw;
padding-top: 0.4vw;
list-style: none;
display: flex;
margin-right: 1.75vw;
margin-left: 1.75vw;
-webkit-flex-flow: row wrap;
justify-content: space-around;
}
.item-form {
width: 4vw;
padding-left: 0.1vw;
margin-top: 0.5vw;
height: 4vw;
border-radius: 10px;
background-color: var(--lighttercia);
}
.containcards {
height: 87vh;
overflow-x: auto;
display: flex;
flex-wrap: wrap;
padding-left: 10vw;
padding-top: 2.5vw;
}
.logop2 img {
width: 20vh;
padding-top: 1vh;
position: relative;
left: 38vw;
}
.txt {
position: absolute;
font-family: Arial Black;
color: var(--lightprima);
font-size: 2.5vw;
left: 1vw;
top: -1vh;
}
.logo img {
position: absolute;
width: 25vw;
left: 38vw;
top: 13%;
z-index: 11;
}
.mounts img {
position: absolute;
height: 100%;
width: 100%;
pointer-events: none;
margin-left: -1vw;
margin-top: -1vw;
object-fit: cover;
}
#contourbuttonvalider {
position: absolute;
border-radius: 45px;
left: 3vw;
top: 5.5vw;
height: 9vw;
width: 25vw;
background-color: var(--lightsedonca);
z-index: 15;
}
.bouttonvalider {
position: absolute;
height: 6.8vw;
width: 22.8vw;
top: 1.1vw;
left: 1.1vw;
border-radius: 30px;
background-color: #B130DE;
}
#textjouer {
font-family: Montserrat, impact, Arial Black;
position: absolute;
font-size: 5vw;
margin-top: 0.2vw;
margin-left: 5.5vw;
color: var(--lightsedonca);
}
}

311
SwichGIT/src/css/Resp2.css
Unescape View File

@ -0,0 +1,311 @@
/*DemTéléphone 1i Ecran*/
@media screen and (max-width: 550px) and (max-height: 850px) {
.anneau {
box-sizing: border-box;
background-color: #DE3030;
border-radius: 3vw;
height: inherit;
width: inherit;
display: table-cell;
vertical-align: middle;
}
.rondinterieur {
background-color: var(--lightsedonca);
height: 3vw;
width: 3vw;
display: table;
margin: 0 auto;
border-radius: 3vw;
}
.containform {
box-sizing: content-box;
height: 6vw;
width: 6vw;
display: table-cell;
vertical-align: middle;
}
.rond {
display: table;
margin: 0 auto;
background-color: #DE3030;
height: 3vw;
width: 3vw;
border-radius: 3vw;
}
/* PARTIE CARRE */
.carre {
background-color: #30C0DE;
height: inherit;
width: inherit;
display: table-cell;
vertical-align: middle
}
.carreinterieur {
background-color: var(--lightsedonca);
height: 3vw;
width: 3vw;
display: table;
margin: 0 auto;
}
.pcarre {
display: table;
margin: 0 auto;
background-color: #30C0DE;
height: 3vw;
width: 3vw;
}
/* PARTIE TRIANGLE */
.triangle {
display: table;
margin: 0 auto;
border-left: 2.5vw solid transparent;
border-right: 2.5vw solid transparent;
border-bottom: 5vw solid #DEA430;
}
.trianglerinterieur {
position: absolute;
margin-left: -1.5vw;
margin-top: 1.25vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-bottom: 3vw solid var(--lightsedonca);
}
.ptriangle {
display: table;
margin: 0 auto;
margin-top: 0.75vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-bottom: 3vw solid #DEA430;
}
/* TRAPEZE */
.trapeze {
bottom: 0px;
height: 0;
margin-top: 2.58vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-top: 3vw solid #6FDE30;
}
.triangletrapeze {
padding-top: 0.1vw;
position: absolute;
border-left: 3vw solid transparent;
border-right: 3vw solid transparent;
border-bottom: 2.5vw solid #6FDE30;
}
.trapezeinte {
position: absolute;
margin-top: 3vw;
margin-left: 1.25vw;
width: 2vw;
border-left: 0.75vw solid transparent;
border-right: 0.75vw solid transparent;
border-top: 1.5vw solid var(--lightsedonca);
z-index: 15;
}
.triangletrapezeinte {
position: absolute;
margin-top: 1.45vw;
margin-left: 1.25vw;
padding-top: 0.1vw;
border-left: 1.75vw solid transparent;
border-right: 1.75vw solid transparent;
border-bottom: 1.5vw solid var(--lightsedonca);
z-index: 15;
}
.trapezep {
display: table;
margin: 0 auto;
margin-top: 2vw;
width: 2vw;
border-left: 0.75vw solid transparent;
border-right: 0.75vw solid transparent;
border-top: 1.5vw solid #6FDE30;
z-index: 15;
}
.triangletrapezep {
position: absolute;
margin-top: 0.55vw;
margin-left: 1.25vw;
border-left: 1.75vw solid transparent;
border-right: 1.75vw solid transparent;
border-bottom: 1.5vw solid #6FDE30;
z-index: 15;
}
.losangephaut {
display: table;
margin: 0 auto;
margin-top: -3vw;
border-left: 3vw solid transparent;
border-right: 3vw solid transparent;
border-bottom: 3vw solid #B130DE;
}
.losangepbas {
position: absolute;
border-left: 3vw solid transparent;
border-right: 3vw solid transparent;
border-top: 3vw solid #B130DE;
}
.losangephauti {
display: table;
margin: 0 auto;
margin-top: -1.5vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-bottom: 1.5vw solid var(--lightsedonca);
}
.losangepbasi {
position: absolute;
margin-left: 1.5vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-top: 1.5vw solid var(--lightsedonca);
}
.losangephautc {
display: table;
margin: 0 auto;
margin-top: -1.5vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-bottom: 1.5vw solid #B130DE;
}
.losangepbasc {
position: absolute;
margin-left: 1.5vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-top: 1.5vw solid #B130DE;
}
.buttonretour {
position: relative;
height: 4vh;
width: 4vh;
border-radius: 55vw;
background-color: var(--lightsedonca);
z-index: 5;
margin-left: 9.5vw;
top: 6.75vw;
}
.flex-item {
background: var(--lightsedonca);
width: 19vw;
height: 30vw;
border-radius: 2vw;
padding-right: 0.4vw;
padding-left: 0.4vw;
padding-bottom: 0.8vw;
padding-top: 0.4vw;
list-style: none;
display: flex;
margin-right: 1.75vw;
margin-left: 1.75vw;
-webkit-flex-flow: row wrap;
justify-content: space-around;
}
.item-form {
width: 5vw;
padding-left: 0.1vw;
margin-top: 1.5vw;
height: 5vw;
border-radius: 10px;
background-color: var(--lighttercia);
}
.containcards {
height: 87vh;
overflow-x: auto;
display: flex;
flex-wrap: wrap;
padding-left: 2.5vw;
padding-top: 2.5vw;
}
.logop2 img {
width: 20vh;
padding-top: 1vh;
position: relative;
left: 27vw;
}
.txt {
position: absolute;
font-family: Arial Black;
color: var(--lightprima);
font-size: 5.5vw;
left: 2.25vw;
top: -1vh;
}
.logo img {
position: absolute;
width: 45vw;
left: 28vw;
top: 13%;
z-index: 11;
}
.mounts img {
position: absolute;
height: 100%;
width: 100%;
pointer-events: none;
margin-left: -1vw;
margin-top: -1vw;
object-fit: cover;
}
#contourbuttonvalider {
position: absolute;
border-radius: 45px;
left: -10vw;
top: 5.5vw;
height: 15vw;
width: 50vw;
background-color: var(--lightsedonca);
z-index: 15;
}
.bouttonvalider {
position: absolute;
height: 13vw;
width: 47vw;
top: 1.1vw;
left: 1.5vw;
border-radius: 30px;
background-color: #B130DE;
}
#textjouer {
font-family: Montserrat, impact, Arial Black;
position: absolute;
font-size: 10vw;
margin-top: 0.2vw;
margin-left: 12.5vw;
color: var(--lightsedonca);
}
}

311
SwichGIT/src/css/Resp3.css
Unescape View File

@ -0,0 +1,311 @@
/*Ecran*/
@media screen and (min-width: 960px) {
.anneau {
box-sizing: border-box;
background-color: #DE3030;
border-radius: 3vw;
height: inherit;
width: inherit;
display: table-cell;
vertical-align: middle;
}
.rondinterieur {
background-color: var(--lightsedonca);
height: 3vw;
width: 3vw;
display: table;
margin: 0 auto;
border-radius: 3vw;
}
.containform {
box-sizing: content-box;
height: 6vw;
width: 6vw;
display: table-cell;
vertical-align: middle;
}
.rond {
display: table;
margin: 0 auto;
background-color: #DE3030;
height: 3vw;
width: 3vw;
border-radius: 3vw;
}
/* PARTIE CARRE */
.carre {
background-color: #30C0DE;
height: inherit;
width: inherit;
display: table-cell;
vertical-align: middle
}
.carreinterieur {
background-color: var(--lightsedonca);
height: 3vw;
width: 3vw;
display: table;
margin: 0 auto;
}
.pcarre {
display: table;
margin: 0 auto;
background-color: #30C0DE;
height: 3vw;
width: 3vw;
}
/* PARTIE TRIANGLE */
.triangle {
display: table;
margin: 0 auto;
border-left: 2.5vw solid transparent;
border-right: 2.5vw solid transparent;
border-bottom: 5vw solid #DEA430;
}
.trianglerinterieur {
position: absolute;
margin-left: -1.5vw;
margin-top: 1.25vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-bottom: 3vw solid var(--lightsedonca);
}
.ptriangle {
display: table;
margin: 0 auto;
margin-top: 0.75vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-bottom: 3vw solid #DEA430;
}
/* TRAPEZE */
.trapeze {
bottom: 0px;
height: 0;
margin-top: 2.58vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-top: 3vw solid #6FDE30;
}
.triangletrapeze {
padding-top: 0.1vw;
position: absolute;
border-left: 3vw solid transparent;
border-right: 3vw solid transparent;
border-bottom: 2.5vw solid #6FDE30;
}
.trapezeinte {
position: absolute;
margin-top: 3vw;
margin-left: 1.25vw;
width: 2vw;
border-left: 0.75vw solid transparent;
border-right: 0.75vw solid transparent;
border-top: 1.5vw solid var(--lightsedonca);
z-index: 15;
}
.triangletrapezeinte {
position: absolute;
margin-top: 1.45vw;
margin-left: 1.25vw;
padding-top: 0.1vw;
border-left: 1.75vw solid transparent;
border-right: 1.75vw solid transparent;
border-bottom: 1.5vw solid var(--lightsedonca);
z-index: 15;
}
.trapezep {
display: table;
margin: 0 auto;
margin-top: 2vw;
width: 2vw;
border-left: 0.75vw solid transparent;
border-right: 0.75vw solid transparent;
border-top: 1.5vw solid #6FDE30;
z-index: 15;
}
.triangletrapezep {
position: absolute;
margin-top: 0.55vw;
margin-left: 1.25vw;
border-left: 1.75vw solid transparent;
border-right: 1.75vw solid transparent;
border-bottom: 1.5vw solid #6FDE30;
z-index: 15;
}
.losangephaut {
display: table;
margin: 0 auto;
margin-top: -3vw;
border-left: 3vw solid transparent;
border-right: 3vw solid transparent;
border-bottom: 3vw solid #B130DE;
}
.losangepbas {
position: absolute;
border-left: 3vw solid transparent;
border-right: 3vw solid transparent;
border-top: 3vw solid #B130DE;
}
.losangephauti {
display: table;
margin: 0 auto;
margin-top: -1.5vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-bottom: 1.5vw solid var(--lightsedonca);
}
.losangepbasi {
position: absolute;
margin-left: 1.5vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-top: 1.5vw solid var(--lightsedonca);
}
.losangephautc {
display: table;
margin: 0 auto;
margin-top: -1.5vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-bottom: 1.5vw solid #B130DE;
}
.losangepbasc {
position: absolute;
margin-left: 1.5vw;
border-left: 1.5vw solid transparent;
border-right: 1.5vw solid transparent;
border-top: 1.5vw solid #B130DE;
}
.buttonretour {
position: relative;
height: 4vh;
width: 4vh;
border-radius: 55vw;
background-color: var(--lightsedonca);
z-index: 5;
margin-left: 2vw;
top: 1.75vw;
}
.flex-item {
background: var(--lightsedonca);
width: 10vw;
height: 15vw;
border-radius: 2vw;
padding-right: 0.4vw;
padding-left: 0.4vw;
padding-bottom: 0.8vw;
padding-top: 0.4vw;
list-style: none;
display: flex;
margin-right: 0.4vw;
margin-left: 0.4vw;
-webkit-flex-flow: row wrap;
justify-content: space-around;
}
.item-form {
width: 3vw;
padding-left: 0.1vw;
margin-top: 0.5vw;
height: 3vw;
border-radius: 10px;
background-color: var(--lighttercia);
}
.containcards {
height: 87vh;
overflow-x: auto;
display: flex;
flex-wrap: wrap;
padding-left: 3vw;
padding-top: 2.5vw;
}
.logop2 img {
width: 20vh;
padding-top: 1vh;
position: relative;
left: 43.5vw;
}
.txt {
position: absolute;
font-family: Arial Black;
color: var(--lightprima);
font-size: 1.5vw;
left: 0.4vw;
top: -1.6vh;
}
.logo img {
position: absolute;
width: 12vw;
left: 44vw;
top: 13%;
z-index: 11;
}
.mounts img {
position: absolute;
height: 100%;
width: 100%;
pointer-events: none;
margin-left: -10px;
}
#contourbuttonvalider {
position: absolute;
border-radius: 45px;
left: 9.2vw;
top: 5.5vw;
height: 4vw;
width: 12vw;
background-color: var(--lightsedonca);
z-index: 15;
}
.bouttonvalider {
position: absolute;
height: 3.4vw;
width: 11.4vw;
top: 0.3vw;
left: 0.3vw;
border-radius: 30px;
background-color: #B130DE;
}
#textjouer {
font-family: Montserrat, impact, Arial Black;
position: absolute;
font-size: 2.5vw;
margin-top: 0.2vw;
margin-left: 2.7vw;
color: var(--lightsedonca);
}
}

96
SwichGIT/src/css/base.css
Unescape View File

@ -0,0 +1,96 @@
:root{
/*couleur héhé*/
--lightprima: #DEDEDE;
--lightsedonca: #B7B7B7;
--lighttercia: #E6E6E6;
}
@font-face {
font-family: "Montserrat";
src: url("/fonts/MonstMontserrat-Black.woff") format("woff"),
url("/fonts/MonstMontserrat-Black.woff2") format("woff2");
}
a {
cursor: pointer;
z-index: 60;
}
body {
background-color: var(--lightprima);
height: 100%;
overflow-x: hidden;
overflow-y: hidden;
/*Desactiver la selection*/
-webkit-user-select: none; /* Chrome / Safari */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE 10+ */
user-select: none;
}
#ContainBottom {
position: absolute;
margin-left: 25vw;
height: 12vw;
width: auto;
bottom: 0;
z-index: 20;
}
#clic{
position: absolute;
left: 55vw;
top : 7vw;
height: auto;
width: 15vw;
}
#card-conteneur{
z-index: 20;
position: absolute;
left: 0vw;
}
.flex-container {
padding: 0;
margin: 0;
list-style: none;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-flow: row wrap;
justify-content: space-around;
margin-top: -7vw;
}

1154
SwichGIT/src/css/style.css
View File

File diff suppressed because it is too large Load Diff

139
SwichGIT/src/index.html
Unescape View File

@ -3,7 +3,13 @@
<head lang="fr">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>SwishGame</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" href="css/base.css">
<link rel="stylesheet" href="css/Resp1.css">
<link rel="stylesheet" href="css/Resp2.css">
<link rel="stylesheet" href="css/Resp3.css">
<link rel="stylesheet" href="css/PageDaccueil.css">
<link rel="stylesheet" href="css/PartieGame.css">
<script type="text/javascript" src="js/main.js"></script>
</head>
<body onload="ChoisirPseudo()">
@ -11,12 +17,22 @@
<div id="pageAccueil">
<div class="logo">
<div class="logo">
<a onclick="journuit()">
<img src="imgs/swishjour.png" id="imglogo">
</a>
</div>
<div id="infosec">
<div class="inner">
<ul class="activity">
<li>
<a id="info" href="#popup1">i</a>
</li>
</ul>
</div>
</div>
<div id="containpseudo">
<a onclick="lancerpartie()">
<div id="contourbuttonvalider">
@ -27,32 +43,43 @@
</a>
</div>
<div id="popup1" class="overlay">
<div class="popup">
<h2>Les Règles :</h2>
<a class="close" href="#">&times;</a>
<div class="content">
Swish : Jeu de 60 cartes composé chacun de billes et de cerceaux, de 4 couleurs
différentes possibles. 16 cartes sont posés sur une table et le joueur doit faire superposer
des cartes de manière que chaque bille soit dans le cerceau de même couleur d’une autre
carte.
</div>
</div>
</div>
<!--
<div id="containpseudo">
<div id="pseudoenter">
<div id="fondinput">
<input onkeypress="ajouterplayer(event)" maxlength="12" id="inputpseudo">
</div>
</div>
<a onclick="EnvoyerNouveauNom()">
<div id="contourbuttonvalider">
<div class="bouttonvalider" >
<h1 id="textjouer">JOUER</h1>
</div>
<!--
<div id="containpseudo">
<div id="pseudoenter">
<div id="fondinput">
<input onkeypress="ajouterplayer(event)" maxlength="12" id="inputpseudo">
</div>
</div>
<a onclick="EnvoyerNouveauNom()">
<div id="contourbuttonvalider">
<div class="bouttonvalider" >
<h1 id="textjouer">JOUER</h1>
</div>
</div>
</a>
<div id="buttonadd">
<a onclick="addplayer()">
<h2 id="textplus">+</h2>
</a>
<div id="buttonadd">
<a onclick="addplayer()">
<h2 id="textplus">+</h2>
</a>
</div>
</div>
</div>
<div id="containplayers">
</div>
-->
<div id="containplayers">
</div>
-->
<div id="ContainBottom">
<!-- Forme : rond-->
@ -70,7 +97,7 @@
<div class="carre">
<div class="carreinterieur inté"></div>
</div>
</div>
</div>
<div class="containform">
<div class="pcarre"></div>
</div>
@ -80,7 +107,7 @@
<div class="triangle">
<div class="trianglerinterieur"></div>
</div>
</div>
</div>
<div class="containform">
<div class="ptriangle"></div>
</div>
@ -92,7 +119,7 @@
<div class="triangletrapeze"></div>
<div class="trapeze"></div>
</div>
<div class="containform">
<div class="triangletrapezep"></div>
<div class="trapezep"></div>
@ -111,44 +138,44 @@
<div class="losangepbasc"></div>
</div>
</div>
<div class="mounts">
<img src="imgs/lightcloud.png" id="cloud">
<img src="imgs/mount1.png" id="mount1">
<img src="imgs/mount2.png" id="mount2">
</div>
<img src="imgs/lightcloud.png" id="cloud">
<img src="imgs/mount1.png" id="mount1">
<img src="imgs/mount2.png" id="mount2">
</div>
</div>
<div id="pageGame">
<div class="menuhaut">
<div id="Redistribution">
<a onclick="creePartie()">
<div id="contourbuttonvalider">
<div class="bouttonvalider">
<h1 id="textjouer">RELANCER</h1>
</div>
<div id="pageGame">
<div class="menuhaut">
<div id="Redistribution">
<a onclick="creecarte()">
<div id="contourbuttonvalider">
<div class="bouttonvalider">
<h1 id="textjouer">RELANCER</h1>
</div>
</div>
</a>
</div>
</a>
</div>
<div class="logop2">
<a onclick="journuit()">
<img src="imgs/swishjour.png" id="imglogo2">
</a>
</div>
<a class="retourstp" onclick="retour()">
<div class="buttonretour">
<h1 class="txt">X</h1>
<div class="logop2">
<a onclick="journuit()">
<img src="imgs/swishjour.png" id="imglogo2">
</a>
</div>
<a class="retourstp" onclick="retour()">
<div class="buttonretour">
<h1 class="txt">X</h1>
</div>
</a>
</div>
</a>
</div>
<div id="containcards" class="containcards">
</div>
</div>
<div id="containcards" class="containcards">
</div>
</div>
</body>
</html>

Write Preview
Loading…
Cancel
Save