diff --git a/SwichGIT/src/css/PageDaccueil.css b/SwichGIT/src/css/PageDaccueil.css index 3dbd4eb..d3d001c 100644 --- a/SwichGIT/src/css/PageDaccueil.css +++ b/SwichGIT/src/css/PageDaccueil.css @@ -14,25 +14,40 @@ z-index: 10; } +.containerparam{ + position: absolute; + display: flex; + margin-left: 1vw; +} + +.containerparam > div { + margin-right: 4vh; +} + /*Bouton info*/ #infosec{ z-index:15; + width: 2vw; +} + +#infosec2{ + z-index:15; + width: 2vw; } #info { - color: #B7B7B7; + color: var(--lightprima); text-decoration: none; font-size: 45px; } #info:hover { - color: #E4E8E7; + color: var(--lightprima); } .activity { padding: 0; - margin: 2em 0; list-style: none; } @@ -47,7 +62,6 @@ li { display: inline-block; font-size: 0.889em; height: 3em; - margin: 0 1em 1em; position: relative; text-align: center; text-transform: lowercase; @@ -79,15 +93,9 @@ li { position: absolute; right: 0; top: 0; - background-color: #B130DE; + background-color: var(--lightsedonca); } -#infosec { - position: absolute; - left: 57%; - top: 35%; -} - /*Les règles popups*/ .overlay { position: fixed; @@ -143,7 +151,85 @@ li { overflow: auto; } + /*Parametres*/ + +.popup2 { + margin: 70px auto; + padding: 20px; + background: #fff; + border-radius: 5px; + width: 45%; + height: 65%; + position: relative; + top:10%; +} + +.popup2 h2 { + margin-top: 0; + color: #333; + font-family: Tahoma, Arial, sans-serif; +} +h3 { + margin: 0; + color: #333; + font-family: Tahoma, Arial, sans-serif; +} +.popup2 .close { + position: absolute; + top: 20px; + right: 30px; + transition: all 200ms; + font-size: 30px; + font-weight: bold; + text-decoration: none; + color: #333; +} + .popup2 .close:hover { + color: #06D85F; + } +.popup2 .content { + max-height: 30%; +} + +.titre{ + display: ruby-base; +} + +label { + cursor: pointer; + text-indent: -9999px; + width: 2vw; + height: 1vw; + background: grey; + display: block; + border-radius: 100px; + position: relative; +} + +label:after { + content: ''; + position: absolute; + top: 0.1vw; + left: 0.1vw; + width: 0.8vw; + height: 0.8vw; + background: #fff; + border-radius: 90px; + transition: 0.3s; +} +input:checked + label { + background: #bada55; +} + +input:checked + label:after { + left: calc(100% - 0.1vw); + transform: translateX(-100%); +} + +label:active:after { + width: 1.4vw; +} /* J'ai trop avancé, mode multi*/ diff --git a/SwichGIT/src/index.html b/SwichGIT/src/index.html index 17e4107..07a3b30 100644 --- a/SwichGIT/src/index.html +++ b/SwichGIT/src/index.html @@ -23,13 +23,24 @@ -
-
- +
+
+
+
    +
  • + i +
  • +
+
+
+
+
+ +
@@ -43,6 +54,7 @@
+
+
+
+

Les Paramètres :

+ × +
+
+
+

Mode Forme

+ +
+ +
+ + + +

Choix Couleur

+
+
+
+