diff --git a/SwichGIT/src/css/desktops.css b/SwichGIT/src/css/desktops.css index 3d1ec8b..642bbcb 100644 --- a/SwichGIT/src/css/desktops.css +++ b/SwichGIT/src/css/desktops.css @@ -61,7 +61,7 @@ width: 16vw; position: absolute; left: 42vw; - top: 50vh; + top: 44vh; z-index: 15; } @@ -70,7 +70,7 @@ width: 16vw; position: absolute; left: 42vw; - top: 55vh; + top: 50vh; z-index: 15; } @@ -303,9 +303,9 @@ position: absolute; border-radius: 45px; left: 9.2vw; - top: 3.5vw; height: 4vw; width: 12vw; + top: 1vw; background-color: var(--lightsedonca); z-index: 15; } @@ -484,4 +484,128 @@ margin-left: 0px; } + + #multiParams{ + height: 5vw; + width: 25vw; + position: absolute; + margin: 0 auto; + top: 58vh; + left: 38.5%; + z-index: 15; + display: none; + } + + #buttonMulti { + border-radius: 45px; + height: 2.5vw; + width: 10.4vw; + top: 1vw; + background-color: var(--lightsedonca); + z-index: 15; + } + + #buttonMulti2 { + border-radius: 45px; + height: 2.5vw; + width: 10.4vw; + background-color: var(--lightsedonca); + z-index: 15; + margin-top: 1vh; + } + + .bouttonvalider2 { + position: relative; + height: 2vw; + width: 10vw; + top: 0.25vw; + left: 0.2vw; + border-radius: 30px; + } + + #textmulti { + font-family: Montserrat, impact, Arial Black; + font-size: 1.5vw; + margin-top: 0.1vw; + color: var(--lightsedonca); + text-align: center; + width: inherit; + } + + #conteneurCreate{ + width: 40%; + height: 2.2vw; + left: 50%; + top: 3%; + position: absolute; + margin: 0 auto; + background-color: var(--lightsedonca); + border-radius: 5vw; + } + + + #conteneurJoin{ + width: 40%; + height: 2.2vw; + left: 50%; + top: 65%; + position: absolute; + margin: 0 auto; + background-color: var(--lightsedonca); + border-radius: 5vw; + } + + .form__field { + font-family: inherit; + width: 70%; + border: 0; + border-bottom: 2px solid #9b9b9b; + outline: 0; + font-size: 1vw; + color: black; + padding: 0.8vh 0; + background: transparent; + transition: border-color 0.2s; + margin-left: 1.5vw; + text-align: center; + } + .form__field::placeholder { + color: gray; + } + .form__field:placeholder-shown ~ .form__label { + font-size: 1.3rem; + cursor: text; + top: 20px; + } + + .form__label { + position: absolute; + top: 0; + display: block; + transition: 0.2s; + font-size: 1rem; + color: black; + } + + .form__field:focus { + padding-bottom: 6px; + font-weight: 700; + border-width: 3px; + border-image: linear-gradient(to right, #11998e, #38ef7d); + border-image-slice: 1; + } + .form__field:focus ~ .form__label { + position: absolute; + top: 0; + display: block; + transition: 0.2s; + font-size: 1rem; + color: #11998e; + font-weight: 700; + } + + + + + } diff --git a/SwichGIT/src/css/tablet.css b/SwichGIT/src/css/tablet.css index 528f20f..9b45d58 100644 --- a/SwichGIT/src/css/tablet.css +++ b/SwichGIT/src/css/tablet.css @@ -152,7 +152,7 @@ position: absolute; border-radius: 45px; left: -10vw; - top: -5vw; + top: -10vh; height: 15vw; width: 50vw; background-color: var(--lightsedonca); @@ -221,7 +221,6 @@ width: 80%; height: 80%; left : 10%; - top : 45%; position: absolute; background-color: var(--lightsedonca); border-radius: 5vw; @@ -491,5 +490,133 @@ top: 2.5vh; } + .last{ + display: none; + } + + #multiParams{ + height: 15vw; + width: 55vw; + position: absolute; + margin: 0 auto; + top: 58vh; + left: 25%; + z-index: 15; + display: none; + } + #buttonMulti { + border-radius: 45px; + height: 5.5vw; + width: 22.4vw; + top: 1vw; + background-color: var(--lightsedonca); + z-index: 15; + } + + #buttonMulti2 { + border-radius: 45px; + height: 5.5vw; + width: 22.4vw; + top: 1vw; + background-color: var(--lightsedonca); + z-index: 15; + margin-top: 1vh; + } + + .bouttonvalider2 { + position: relative; + height: 4.5vw; + width: 20vw; + top: 0.5vw; + left: 1.3vw; + border-radius: 30px; + } + + #textmulti { + font-family: Montserrat, impact, Arial Black; + font-size: 3vw; + margin-top: 0.3vw; + color: var(--lightsedonca); + text-align: center; + width: inherit; + } + + #conteneurCreate{ + width: 40%; + height: 5.2vw; + left: 50%; + top: 3%; + position: absolute; + margin: 0 auto; + background-color: var(--lightsedonca); + border-radius: 5vw; + } + + + #conteneurJoin{ + width: 40%; + height: 5.2vw; + left: 50%; + top: 45%; + position: absolute; + margin: 0 auto; + background-color: var(--lightsedonca); + border-radius: 5vw; + } + + .form__field { + font-family: inherit; + width: 70%; + border: 0; + border-bottom: 2px solid #9b9b9b; + outline: 0; + font-size: 2.5vw; + color: black; + padding: 0.8vh 0; + background: transparent; + transition: border-color 0.2s; + margin-left: 3.5vw; + text-align: center; + } + .form__field::placeholder { + color: black; + } + .form__field:placeholder-shown ~ .form__label { + font-size: 1.3rem; + cursor: text; + top: 20px; + } + + .form__label { + position: absolute; + top: 0; + display: block; + transition: 0.2s; + font-size: 1rem; + color: black; + } + + .form__field:focus { + padding-bottom: 6px; + font-weight: 700; + border-width: 3px; + border-image: linear-gradient(to right, #11998e, #38ef7d); + border-image-slice: 1; + } + .form__field:focus ~ .form__label { + position: absolute; + top: 0; + display: block; + transition: 0.2s; + font-size: 1rem; + color: #11998e; + font-weight: 700; + } + + .violet { + background-color: #B130DE; + } + + } diff --git a/SwichGIT/src/index.html b/SwichGIT/src/index.html index 545abe9..002917b 100644 --- a/SwichGIT/src/index.html +++ b/SwichGIT/src/index.html @@ -639,20 +639,16 @@