From cb1454afbb172a6b47428f333a8098af1ecc0f90 Mon Sep 17 00:00:00 2001 From: frperalde Date: Sat, 7 Nov 2020 20:49:49 +0100 Subject: [PATCH] src/ --- src/css/style.css | 221 +++++++++------------- src/index.html | 460 ++++++++++++++++++++++++++++------------------ 2 files changed, 370 insertions(+), 311 deletions(-) diff --git a/src/css/style.css b/src/css/style.css index 0332e43..c4309b4 100644 --- a/src/css/style.css +++ b/src/css/style.css @@ -30,15 +30,8 @@ body{ /* versions mobiles, tablette à faire*/ /*Version mobile V1*/ -@media only screen and (min-width: 320px) { - - .logop2 img { - position: absolute; - width: 25vw; - left: 37vw; - top: 98vw; - z-index: 30; - } +@media only screen and (min-width: 500px) { + .logo img{ position: absolute; @@ -119,71 +112,12 @@ body{ margin-top: -3vw; } - .flex-item { - background: var(--lightsedonca); - width: 25vw; - height: 40vw; - margin-top: 8vw; - border-radius: 25px; - line-height: 10vw; - color: white; - font-weight: bold; - font-size: 3em; - text-align: center; - padding-right: 0.4vw; - padding-left: 0.4vw; - padding-top: 0.4vw; - - list-style: none; - display: flex; - - -webkit-flex-flow: row wrap; - justify-content: space-around; - } - - .item-form { - width: 6vw; - padding-left: 0.8vw; - margin-top: 0.9vw; - height: 7.5vw; - border-radius: 10px; - background-color: var(--lighttercia); - } - - .buttonretour{ - position: absolute; - height: 6vw; - width: 6vw; - left: 63vw; - top: 99vw; - border-radius: 55vw; - background-color: var(--lightsedonca); - - } - - .txt{ - position: absolute; - font-family: Arial Black; - color: var(--lightprima); - font-size: 5vw; - padding-left: 1vw; - top : -2.9vw; - } - } /*Grande version*/ @media only screen and (min-width: 1280px) { - .logop2 img { - position: absolute; - width: 12vw; - left: 44vw; - top: 22vw; - z-index: 30; - } - .logo img{ position: absolute; width: 12vw; @@ -268,61 +202,6 @@ body{ justify-content: space-around; margin-top: -7vw; } - - .flex-item { - background: var(--lightsedonca); - width: 14vw; - height: 19vw; - margin-top: 8vw; - border-radius: 25px; - line-height: 10vw; - color: white; - font-weight: bold; - font-size: 3em; - text-align: center; - padding-right: 0.4vw; - padding-left: 0.4vw; - padding-top: 0.4vw; - padding-top: 0.4vw; - - list-style: none; - display: flex; - - -webkit-flex-flow: row wrap; - justify-content: space-around; - } - - .item-form { - width: 3vw; - padding-left: 0.8vw; - margin-top: 0.55vw; - height: 3.5vw; - border-radius: 10px; - background-color: var(--lighttercia); - } - - - - .buttonretour{ - position: absolute; - height: 3vw; - width: 3vw; - left: 57vw; - top: 22.6vw; - border-radius: 25px; - background-color: var(--lightsedonca); - - } - - .txt{ - position: absolute; - font-family: Arial Black; - color: var(--lightprima); - font-size: 2vw; - padding-left: 0.7vw; - top : -0.9vw; - } - } @@ -348,6 +227,35 @@ body{ } +.flex-item { + background: var(--lightsedonca); + width: auto; + height: auto; + border-radius: 25px; + 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); +} + + /* PARTIE ANNEAU / ROND */ .anneau{ @@ -503,26 +411,26 @@ body{ .losangephaut{ display: table; margin: 0 auto; - margin-top: -6vh; + margin-top: -3vw; border-left: 3vw solid transparent; border-right: 3vw solid transparent; - border-bottom: 6vh solid #B130DE; + border-bottom: 3vw solid #B130DE; } .losangepbas{ position: absolute; border-left: 3vw solid transparent; border-right: 3vw solid transparent; - border-top: 6vh solid #B130DE; + border-top: 3vw solid #B130DE; } .losangephauti{ display: table; margin: 0 auto; - margin-top: -3vh; + margin-top: -1.5vw; border-left: 1.5vw solid transparent; border-right: 1.5vw solid transparent; - border-bottom: 3vh solid var(--lightsedonca); + border-bottom: 1.5vw solid var(--lightsedonca); } .losangepbasi{ @@ -530,16 +438,16 @@ body{ margin-left: 1.5vw; border-left: 1.5vw solid transparent; border-right: 1.5vw solid transparent; - border-top: 3vh solid var(--lightsedonca); + border-top: 1.5vw solid var(--lightsedonca); } .losangephautc{ display: table; margin: 0 auto; - margin-top: -3vh; + margin-top: -1.5vw; border-left: 1.5vw solid transparent; border-right: 1.5vw solid transparent; - border-bottom: 3vh solid #B130DE; + border-bottom: 1.5vw solid #B130DE; } .losangepbasc{ @@ -547,7 +455,7 @@ body{ margin-left: 1.5vw; border-left: 1.5vw solid transparent; border-right: 1.5vw solid transparent; - border-top: 3vh solid #B130DE; + border-top: 1.5vw solid #B130DE; } @@ -555,6 +463,55 @@ body{ position: absolute; } +.menuhaut{ + height: 10vh; + width: inherit; + display: flex; +} + +.containcards{ + height: 87vh; + overflow-x:auto; +} + + +.logop2 img { + width: 20vh; + padding-top: 1vh; + position: relative; + left: 43.5vw; +} + +.buttonretour{ + position: relative; + height: 4vh; + width: 4vh; + border-radius: 55vw; + background-color: var(--lightsedonca); + z-index: 5; + margin-left: 2vw; + top: 1.75vw; +} + +.txt{ + position: absolute; + font-family: Arial Black; + color: var(--lightprima); + font-size: 1.5vw; + left: 0.4vw; + top : -1.6vh; +} + +table, +td { + border: 0px solid #333; +} + +table{ + height: 100%; + width: 100%; +} + /* J'ai trop avancé, mode multi*/ diff --git a/src/index.html b/src/index.html index 5e4b885..107c5f4 100644 --- a/src/index.html +++ b/src/index.html @@ -1,6 +1,7 @@ + SwishGame @@ -125,190 +126,291 @@
-
- - +
+
+ + + +
+ +
+

X

+
- -
-

X

-
- + +
+ + + + + + + + + + + + + + + + + + + + + +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 		+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 		+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 		+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 		+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 		+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 		+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 		+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 		+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 		+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 		+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 		+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 		+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 		+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 		+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + +