diff --git a/SwichGIT/src/css/base.css b/SwichGIT/src/css/base.css
index b9c88f5..3b38ad5 100644
--- a/SwichGIT/src/css/base.css
+++ b/SwichGIT/src/css/base.css
@@ -20,7 +20,6 @@
--colorsix : #E6792F;/*HOCTO*/
/*Tailles cartes*/
- --tailleTablette : 12vw;
--taille: 10vw;
/*Les formes*/
--u: calc(var(--x) / 2.75);
diff --git a/SwichGIT/src/css/phone.css b/SwichGIT/src/css/phone.css
index 2418cd2..7d9a47b 100644
--- a/SwichGIT/src/css/phone.css
+++ b/SwichGIT/src/css/phone.css
@@ -1,6 +1,109 @@
-/*Demi Ecran*/
-@media screen and (max-width: 768px) {
- body{
- background-color: green;
+@media screen and (max-width: 880px) {
+ .flex-item {
+ flex-grow: 1;
+ background: var(--lightsedonca);
+ width: 14vw;
+ border-radius: 0.75vw;
+ padding-right: 0.15vw;
+ padding-left: 0.15vw;
+ padding-bottom: 0.25vw;
+ list-style: none;
+ display: flex;
+ margin-right: 0.4vw;
+ margin-left: 0.4vw;
+ margin-bottom: 1vw;
+ -webkit-flex-flow: row wrap;
+ justify-content: space-around;
+ }
+
+
+}
+
+@media screen and (max-width: 855px) {
+ .flex-item {
+ flex-grow: 1;
+ background: var(--lightsedonca);
+ width: 15vw;
+ border-radius: 0.75vw;
+ padding-right: 0.15vw;
+ padding-left: 0.15vw;
+ padding-bottom: 0.25vw;
+ list-style: none;
+ display: flex;
+ margin-right: 0.4vw;
+ margin-left: 0.4vw;
+ margin-bottom: 1vw;
+ -webkit-flex-flow: row wrap;
+ justify-content: space-around;
+ }
+}
+
+@media screen and (max-width: 680px) {
+ .flex-item {
+ flex-grow: 1;
+ background: var(--lightsedonca);
+ width: 19vw;
+ border-radius: 0.75vw;
+ padding-right: 0.15vw;
+ padding-left: 0.15vw;
+ padding-bottom: 0.25vw;
+ list-style: none;
+ display: flex;
+ margin-right: 0.4vw;
+ margin-left: 0.4vw;
+ margin-bottom: 1vw;
+ -webkit-flex-flow: row wrap;
+ justify-content: space-around;
+ }
+}
+
+
+@media screen and (max-width: 545px) {
+ .flex-item {
+ flex-grow: 1;
+ background: var(--lightsedonca);
+ width: 23vw;
+ border-radius: 0.75vw;
+ padding-right: 0.15vw;
+ padding-left: 0.15vw;
+ padding-bottom: 0.25vw;
+ list-style: none;
+ display: flex;
+ margin-right: 0.4vw;
+ margin-left: 0.4vw;
+ margin-bottom: 1vw;
+ -webkit-flex-flow: row wrap;
+ justify-content: space-around;
+ }
+}
+
+@media screen and (max-width: 510px) {
+ .item-form {
+ width: 3vh;
+ padding-left: 0.1vw;
+ margin-top: 0.25vw;
+ height: 3vh;
+ border-radius: 10px;
+ display: table-cell;
+ position: relative;
+ vertical-align: middle;
+ background-color: var(--lighttercia);
+ }
+
+ .flex-item {
+ flex-grow: 1;
+ background: var(--lightsedonca);
+ width: 17vw;
+ border-radius: 0.75vw;
+ padding-right: 0.15vw;
+ padding-left: 0.15vw;
+ padding-bottom: 0.25vw;
+ list-style: none;
+ display: flex;
+ margin-right: 0.4vw;
+ margin-left: 0.4vw;
+ margin-bottom: 1vw;
+ -webkit-flex-flow: row wrap;
+ justify-content: space-around;
}
}
diff --git a/SwichGIT/src/index.html b/SwichGIT/src/index.html
index 002917b..c84e142 100644
--- a/SwichGIT/src/index.html
+++ b/SwichGIT/src/index.html
@@ -12,6 +12,7 @@
+
diff --git a/SwichGIT/src/js/main.js b/SwichGIT/src/js/main.js
index 9fc3122..04df59b 100644
--- a/SwichGIT/src/js/main.js
+++ b/SwichGIT/src/js/main.js
@@ -25,8 +25,8 @@ var offreSWISH = false;
var lesPoints = 0; //Points du Joueur1
function majSizeCard(column) {
- var newTailleOrdi = column * 3.2 + 1;
- var newTailleTablette = newTailleOrdi + 2;
+ var newTailleOrdi = column * 3.3 + 1;
+ var newTailleTablette = newTailleOrdi * 1.2;
document.documentElement.style.setProperty('--taille', newTailleOrdi + "vw");
document.documentElement.style.setProperty('--tailleTablette', newTailleTablette + "vw");
}