- 
+ 
diff --git a/styles/styleLogin.css b/styles/styleLogin.css
index 5194393..482405b 100644
--- a/styles/styleLogin.css
+++ b/styles/styleLogin.css
@@ -1,6 +1,7 @@
@import url(./style.css);
-h1{
+/* ====== DARK MODE ====== */
+body.dark-mode h1{
color : white;
font-family: "Lemon", serif;
text-align: center;
@@ -8,7 +9,7 @@ h1{
margin-top: 10%;
}
-p{
+body.dark-mode p{
margin-top: 6%;
margin-bottom: 2%;
color : white;
@@ -16,49 +17,112 @@ p{
font-family: "Lemon", serif;
}
-.login{
+body.dark-mode .login{
background-color: black;
width: 30%;
margin-left: 35%;
margin-top: 3%;
border-radius: 25px;
+ border: 2px solid transparent;
padding: 2%;
}
-.connexion{
- width:90%;
- height: 40px;
- padding-left: 3%;
- margin-left: 1%;
- margin-top: -1%;
- border-radius: 25px;
- border: none;
- font-size: 15px;
-}
-
-
-.createAccount{
+body.dark-mode .createAccount{
margin-top: 5%;
margin-bottom: 5%;
font-size: 13px;
text-align: center;
padding-top: 1%;
color: white;
+ border: 1px solid transparent;
font-family: "Lemon", serif;
}
+body.dark-mode .buttonSudmite{
+ background: linear-gradient(90deg, #6100ff 0%, #1b0048 100%);
+ font-family: "Lemon", serif;
+ border: none;
+ color: white;
+ padding: 2%;
+ border-radius: 25px;
+ width: 75%;
+ font-size: 20px;
+}
-.buttonSudmiteDiv{
+/* ====== LIGHT MODE ====== */
+body.light-mode h1{
+ color : black;
+ font-family: "Lemon", serif;
text-align: center;
+ font-size: 32px;
+ margin-top: 10%;
}
-.buttonSudmite{
- background: linear-gradient(90deg, #6100ff 0%, #1b0048 100%);
+body.light-mode p{
+ margin-top: 6%;
+ margin-bottom: 2%;
+ color : black;
+ font-size: 20px;
+ font-family: "Lemon", serif;
+}
+
+body.light-mode .login{
+ background-color: white;
+ width: 30%;
+ margin-left: 35%;
+ margin-top: 3%;
+ border-radius: 25px;
+ border: 2px solid black;
+ padding: 2%;
+}
+
+body.light-mode .createAccount{
+ margin-top: 5%;
+ margin-bottom: 5%;
+ font-size: 13px;
+ text-align: center;
+ padding-top: 1%;
+ color: black;
+ font-family: "Lemon", serif;
+}
+
+body.light-mode .buttonSudmite{
+ background: linear-gradient(180deg, rgba(187,211,249,1) 0%, rgba(199,246,196,1) 100%);
font-family: "Lemon", serif;
border: none;
- color: white;
+ color: black;
padding: 2%;
border-radius: 25px;
width: 75%;
font-size: 20px;
-}
\ No newline at end of file
+}
+
+body.light-mode .connexion{
+ width:90%;
+ height: 40px;
+ padding-left: 3%;
+ margin-left: 1%;
+ margin-top: -1%;
+ border-radius: 25px;
+ border: 1px solid black;
+ background-color: #fff1f1;
+ font-size: 15px;
+}
+
+
+/* ====== OTHER ====== */
+.buttonSudmiteDiv{
+ text-align: center;
+}
+
+
+.connexion{
+ width:90%;
+ height: 40px;
+ padding-left: 3%;
+ margin-left: 1%;
+ margin-top: -1%;
+ border-radius: 25px;
+ border: none;
+ font-size: 15px;
+}
diff --git a/styles/styleProfil.css b/styles/styleProfil.css
index 2e5e60c..60219f4 100644
--- a/styles/styleProfil.css
+++ b/styles/styleProfil.css
@@ -1,7 +1,7 @@
@import url(./style.css);
-
-h1{
+/* ====== DARK MODE ====== */
+body.dark-mode h1{
color : white;
font-family: "Lemon", serif;
text-align: center;
@@ -9,7 +9,7 @@ h1{
margin-top: 10%;
}
-p{
+body.dark-mode p{
margin-top: 6%;
margin-bottom: 2%;
color : white;
@@ -18,7 +18,7 @@ p{
}
-.buttonSudmite{
+body.dark-mode .buttonSudmite{
background: linear-gradient(90deg, #6100ff 0%, #1b0048 100%);
font-family: "Lemon", serif;
border: none;
@@ -29,12 +29,9 @@ p{
font-size: 20px;
}
-.buttonSudmiteDiv{
- text-align: center;
-}
-.createQuote{
+body.dark-mode .createQuote{
margin-top: 5%;
margin-bottom: 5%;
font-size: 15px;
@@ -44,7 +41,7 @@ p{
font-family: "Lemon", serif;
}
-.login{
+body.dark-mode .login{
background-color: black;
width: 30%;
margin-left: 35%;
@@ -52,6 +49,63 @@ p{
border-radius: 25px;
padding-top: 1px;
padding-bottom: 1%;
+ border: 2px solid transparent;
+}
+
+/* ====== LIGHT MODE ====== */
+body.light-mode h1{
+ color : black;
+ font-family: "Lemon", serif;
+ text-align: center;
+ font-size: 35px;
+ margin-top: 10%;
+}
+body.light-mode p{
+ margin-top: 6%;
+ margin-bottom: 2%;
+ color : black;
+ font-size: 20px;
+ font-family: "Lemon", serif;
+}
+
+
+body.light-mode .buttonSudmite{
+ background: linear-gradient(180deg, rgba(187,211,249,1) 0%, rgba(199,246,196,1) 100%);
+ font-family: "Lemon", serif;
+ border: none;
+ color: black;
+ padding: 5%;
+ border-radius: 25px;
+ width: 75%;
+ font-size: 20px;
+}
+
+
+
+body.light-mode .createQuote{
+ margin-top: 5%;
+ margin-bottom: 5%;
+ font-size: 15px;
+ text-align: center;
+ padding-top: 1%;
+ color: black;
+ font-family: "Lemon", serif;
+}
+
+body.light-mode .login{
+ background-color: white;
+ width: 30%;
+ margin-left: 35%;
+ margin-top: 9%;
+ border-radius: 25px;
+ padding-top: 1px;
+ padding-bottom: 1%;
+ border: 2px solid black;
+}
+
+/* ====== OTHER ====== */
+.buttonSudmiteDiv{
+ text-align: center;
}
.imageProfil{