From 8ae7eee2ad06b74e76cb60bdc204d82c6a0f8124 Mon Sep 17 00:00:00 2001
From: clverdoire <Clement.verdoire@etu.uca.fr>
Date: Tue, 15 Nov 2022 09:05:54 +0100
Subject: [PATCH] ajout Button mode sombre

---
 src/styles/components/_parametre.scss | 42 +++++++++++++++++++++++++--
 1 file changed, 39 insertions(+), 3 deletions(-)

diff --git a/src/styles/components/_parametre.scss b/src/styles/components/_parametre.scss
index facbe24..e28b1a5 100644
--- a/src/styles/components/_parametre.scss
+++ b/src/styles/components/_parametre.scss
@@ -233,6 +233,8 @@ body {
                     .two_haut {
                         display: flex;
                         height: 75%;
+                        
+                        border-bottom: 1px solid black;
                     }
 
                     .two_bas {
@@ -240,12 +242,46 @@ body {
                         flex-direction: row;
                         padding: 9px;
                         height: 25%;
-                        background-color: green;
 
                         .center {
                             position: absolute;
-                            top: 79%;
-                            right: 5%;
+                            top: 84%;
+                            right: 0.5%;
+                            transform: translate(-50%,-50%);
+
+                            input[type="checkbox"] {
+                                position: relative;
+                                width: 50px;
+                                height: 25px;
+                                -webkit-appearance: none;
+                                background-color: #e2e2e2;
+                                outline: none;
+                                border-radius: 20px;
+                                box-shadow: inset 0 0 5px rgba(0,0,0,.5);
+                                transition: .5s;
+                            }
+
+                            input:checked[type="checkbox"] {
+                                background-color: rgb(41, 186, 41);
+                            }
+
+                            input[type="checkbox"]:before {
+                                content: '';
+                                position: absolute;
+                                width: 18px;
+                                height: 18px;
+                                border-radius: 20px;
+                                top: 12%;
+                                left: 10%;
+                                background-color: white;
+                                transform: scale(1.1);
+                                box-shadow: 0 2px 5px rgba(0,0,0,.2);
+                                transition: .5s;
+                            }
+
+                            input:checked[type="checkbox"]:before {
+                                left: 27px;
+                            }
                         }
                     }
                 }