From ef802b0a2b055ff7f0f405d53477b9ece12f38f2 Mon Sep 17 00:00:00 2001 From: "serny.s" Date: Tue, 30 Nov 2021 20:25:05 +0100 Subject: [PATCH] nouvelle adresse -- config --- .gitignore | 1 + _content/fnac-icon.png | Bin 0 -> 6315 bytes index.html | 79 +++++++++------ reading.html | 206 ++++++++++++++++++++++++++++++++++++++ sign_in.html | 53 ++++------ sign_up.html | 69 ------------- sign_up.php | 110 ++++++++++++++++++++ style/style_index.css | 26 ++++- style/style_index.css.map | 2 +- style/style_log.css | 201 ++++++++++++++++++++++--------------- style/style_log.css.map | 1 + style/styles_index.scss | 32 +++++- style/styles_log.scss | 119 ++++++++++++++++++++++ 13 files changed, 679 insertions(+), 220 deletions(-) create mode 100644 _content/fnac-icon.png create mode 100644 reading.html delete mode 100644 sign_up.html create mode 100644 sign_up.php create mode 100644 style/style_log.css.map create mode 100644 style/styles_log.scss diff --git a/.gitignore b/.gitignore index e69de29..4abbf33 100644 --- a/.gitignore +++ b/.gitignore @@ -0,0 +1 @@ +"C:\Users\MiniV\OneDrive - lycée Paul Constans\Cours\1re\NSI\sernyS_nsi_web\style\style_index.css.map" \ No newline at end of file diff --git a/_content/fnac-icon.png b/_content/fnac-icon.png new file mode 100644 index 0000000000000000000000000000000000000000..38d267c646281650da273e8f2922fef57d9b1662 GIT binary patch literal 6315 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 x`*?C7tf?jXxtyly
-

PopOp

+

PopOp

@@ -30,80 +30,101 @@ thumbnail

Royals

-

Royals - Lorde
spotify-iconLien - (payant)

+

Royals - Lorde

+ + spotify-iconLien (légal)
thumbnail

Numb

-

Numb - Linkin Park
spotify-iconLien (payant)

+

Numb - Linkin Park

+ + spotify-iconLien (légal)
thumbnail

Red

-

Red - Survive said the prophet
spotify-iconLien (payant)

+

Red - Survive said the prophet

+ + spotify-iconLien (légal)
thumbnail

命に嫌われて

-

命に嫌われている。- Majiko
spotify-iconLien - (payant)

+

命に嫌われている。- Majiko

+ + spotify-iconLien (légal)
- + thumbnail

Symphony

-

Symphony - Clean Bandit (feat. Zara Larsson)
spotify-iconLien (payant)

+

Symphony - Clean Bandit (feat. Zara Larsson)>

+ + spotify-iconLien (légal)
thumbnail

Reckoning song

-

Reckoning song (cover) - Asaf Avidan, The Mojos
spotify-iconLien (payant)

+

Reckoning song (cover) - Asaf Avidan, The Mojos

+ + spotify-iconLien (légal)
- - thumbnail + + thumbnail
-

Boulevard of Broken Dreams

-

Boulevard of Broken Dreams - Green Day
spotify-iconLien (payant)

+

Boulevard of..

+

Boulevard of Broken Dreams - Green Day

+ + spotify-iconLien (légal)
thumbnail

Centuries

-

Centuries - Fall Out Boy
spotify-iconLien (payant)

+

Centuries - Fall Out Boy

+ + spotify-iconLien (légal)
thumbnail

Le temps est bon

-

Le temps est bon - Bon Entendeur
spotify-iconLien (payant)

+

Le temps est bon - Bon Entendeur

+ + spotify-iconLien (légal)
thumbnail

Radioactive

-

Radioactive - Imagine Dragons
spotify-iconLien (payant)

+

Radioactive - Imagine Dragons

+ + spotify-iconLien (légal)
@@ -137,7 +158,7 @@
diff --git a/reading.html b/reading.html new file mode 100644 index 0000000..4c1fee4 --- /dev/null +++ b/reading.html @@ -0,0 +1,206 @@ + + + + + PopOp + + + + + + + + +
+

PopOp

+ + +
+
+
+ + thumbnail +
+

La ballade de Lila K

+

Blandine le callet

+ + spotify-iconLien 7.70€ +
+
+ + thumbnail +
+

La Princesse de Clèves

+

Madame de Lafayette

+ + spotify-iconLien 2.95€ +
+
+ + thumbnail +
+

Banana Fish

+

Akimi Yoshida

+ + spotify-iconLien 16€ +
+
+ + thumbnail +
+

Les enfants du temps

+

Makoto Shinkai

+ + spotify-iconLien 14.95€ +
+
+ + thumbnail +
+

The Farm [EN]

+

Tom Rob Smith

+ + spotify-iconLien 0.90€ +
+
+ + thumbnail +
+

Edmond Rostand

+

Cyrano de Bergerac

+ + spotify-iconLien 3€ +
+
+ + thumbnail +
+

La ballade de Lila K

+

Blandine le callet

+ + spotify-iconLien 7.70€ +
+
+ + thumbnail +
+

La ballade de Lila K

+

Blandine le callet

+ + spotify-iconLien 7.70€ +
+
+ + thumbnail +
+

La ballade de Lila K

+

Blandine le callet

+ + spotify-iconLien 7.70€ +
+
+ + thumbnail +
+

La ballade de Lila K

+

Blandine le callet

+ + spotify-iconLien 7.70€ +
+
+ + thumbnail +
+

La ballade de Lila K

+

Blandine le callet

+ + spotify-iconLien 7.70€ +
+
+
+
+ + + +
+
+ + + + \ No newline at end of file diff --git a/sign_in.html b/sign_in.html index 2990cb0..14dc6ea 100644 --- a/sign_in.html +++ b/sign_in.html @@ -8,55 +8,36 @@ - Titre + Conenxion - - -
-

PopOp

- - -
-
-
- En attente de l'ajout d'un systeme PHP. -
Cette page est moche et mal faite. -
+
+

Connecte-toi pour accéder à plus de foncitonnalités

-

Connexion

- -
+
- +
-
- + +
+
+ -
- + \ No newline at end of file diff --git a/sign_up.html b/sign_up.html deleted file mode 100644 index dd68598..0000000 --- a/sign_up.html +++ /dev/null @@ -1,69 +0,0 @@ - - - - - - - Titre - - - - - - - - -
-

PopOp

- - -
-
-
- En attente de l'ajout d'un systeme PHP. -
Cette page est moche et mal faite. -
-
-

Inscription

- -
-
- -
- -
- -
-
- -
-
- -
-
- -
-
-
- - - - \ No newline at end of file diff --git a/sign_up.php b/sign_up.php new file mode 100644 index 0000000..ca7d0f2 --- /dev/null +++ b/sign_up.php @@ -0,0 +1,110 @@ + +prepare("SELECT * FROM membres WHERE pseudo = ?"); + $look->execute(array($pseudo)); + $alreadyexist = -1; + $alreadyexist = $look->rowCount(); + $lookmail = $bdd->prepare("SELECT * FROM membres WHERE mail = ?"); + $lookmail->execute(array($mail)); + $alreadyexist2 = -1; + $alreadyexist2 = $lookmail->rowCount(); + if ($alreadyexist == 0 AND $alreadyexist2 == 0) { + $ins = $bdd->prepare("INSERT INTO membres(pseudo, mail, password, signup_date) VALUES(?, ?, ?, now())"); + $ins->execute(array($pseudo, $mail, $password)); + $erreur ="Vous avez été correctement inscrit dans notre base de donnée."; + } else { + $erreur ="Ce pseudo/mail est déjà utilisé"; + } + } else { + $erreur ="Le mail est trop long (max 255c)"; + } + } else { + $erreur ="Le pseudo est trop long (max 255c)"; + } + } else { + $erreur = "Les mails sont différents."; + } + } else { + $erreur = "Les mots de passe sont différents."; + } + } +} + + +?> + + + + + Conenxion + + + + + + +
+

Inscris-toi pour accéder à plus de foncitonnalités

+
+
+
+ +
+
+ +
+
+ +
+
+ +
+
+ +
+
+
+ + +
+
+ +
+
+
+ + + \ No newline at end of file diff --git a/style/style_index.css b/style/style_index.css index 6f350f9..d6b4ccc 100644 --- a/style/style_index.css +++ b/style/style_index.css @@ -9,6 +9,11 @@ body { margin: 0; } +@media only screen and (min-width: 1080px) { + .main { + padding: 0 20vh 0 20vh; + } +} main { padding: 10px; background-color: white; @@ -26,8 +31,27 @@ main .element { padding-bottom: 24px; text-align: justify; width: 11em; - padding: 10px; + height: 25em; + padding: 10px 10px 10px 10px; margin: 2.5px 2.5px 0px 2.5px; + overflow: hidden; +} +main .element p:not(.hidden) { + display: block; +} +main .element p.hidden { + margin-top: 15px; + display: none; + font-style: italic; +} +main .element:hover p:not(.hidden) { + display: none; +} +main .element:hover h2 { + display: none; +} +main .element:hover p.hidden { + display: block; } main .element img { border-radius: 10% 40% 40% 40%; diff --git a/style/style_index.css.map b/style/style_index.css.map index dfd22bf..ca6b06d 100644 --- a/style/style_index.css.map +++ b/style/style_index.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["styles_index.scss"],"names":[],"mappings":"AAAQ;AACA;AACA;AACR;EACC;;;AAED;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;;AAGC;EACC;EACD;;AAID;EACC;EACA;EACA;EACA;EACA;EACA;;AAGA;EACC;EACA;;AAED;EASC;EACA;EACA;EACA;;AAXA;EACC;EACA;EACA;;AASD;EACC;;AAKH;EACC;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EAqEA;EACA;EACA;EACA;EACA;;AAxEA;EACC;EACA;;AAED;EACC;EACA;EACA;;AAEC;EACC;EACA;EACA;EACA;EACA;EACA;;AAIH;EACC;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACC;EACA;;AAED;EACC;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGA;EACC;EACA;;AAaL;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA","file":"style_index.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["styles_index.scss"],"names":[],"mappings":"AAAQ;AACA;AACA;AACR;EACC;;;AAED;EACC;;;AAED;EACC;IACC;;;AAGF;EACC;EACA;EACA;EACA;EACA;EACA;;AAGC;EACC;EACD;;AAID;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;;AAED;EACC;EACA;EACA;;AAIA;EACC;;AAED;EACC;;AAED;EACC;;AAGF;EACC;EACA;;AAED;EASC;EACA;EACA;EACA;;AAXA;EACC;EACA;EACA;;AASD;EACC;;AAKH;EACC;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;EAqEA;EACA;EACA;EACA;EACA;;AAxEA;EACC;EACA;;AAED;EACC;EACA;EACA;;AAEC;EACC;EACA;EACA;EACA;EACA;EACA;;AAIH;EACC;EACA;EACA;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACC;EACA;;AAED;EACC;;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGA;EACC;EACA;;AAaL;EACC;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACC;EACA;;AAED;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACC;EACA;EACA","file":"style_index.css"} \ No newline at end of file diff --git a/style/style_log.css b/style/style_log.css index 99e67c1..8f17fe4 100644 --- a/style/style_log.css +++ b/style/style_log.css @@ -1,87 +1,128 @@ -@import"https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap"; -@import"https://fonts.googleapis.com/css2?family=Roboto:wght@300;500&display=swap"; - -main { - padding: 5px 20%; - height: 79vh; -} -main .red-banner { - background-color: red; - color: white; - height: auto; - font-size: 24px; - padding: 30px 0; - text-align: center; - font-family: "Montserrat", sans-serif; +@import "https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap"; +@import "https://fonts.googleapis.com/css2?family=Roboto:wght@300;500&display=swap"; +/* Reset CSS */ +input[type=submit i] { + appearance: none; + user-select: none; + white-space: normal; + align-items: flex-start; + text-align: start; + cursor: default; + color: black; + background-color: white; + box-sizing: border-box; + padding: 0px; + border-width: 0px; + border-style: none; + border-color: white; + border-image: initial; + font-size: 16px; } -form { - display: flex; - justify-content: center; - font-family: "Roboto", sans-serif; - flex-direction: column; - align-items: center; - text-align: center; -} -form .names { - display: flex; - flex-direction: row; - justify-content: space-between; - margin: 5px 0px; - align-items: inherit; -} -form .form_p_contents { - display: flex; - flex-direction: column; - justify-content: flex-start; - align-items: center; -} -form .form_p_contents p a { - font-size: 14px; - color: #696969; - text-decoration: none; -} -form .form_p_contents p a:hover { - font-size: 14px; - color: #696969; - text-decoration: none; + +a:-webkit-any-link { + color: black; + cursor: default; + text-decoration: none; +} + +input { + writing-mode: auto; + text-rendering: auto; + color: black; + letter-spacing: normal; + word-spacing: normal; + text-transform: none; + text-indent: auto; + text-shadow: none; + display: inline-block; + text-align: auto; + appearance: none; + background-color: white; + -webkit-rtl-ordering: none; + cursor: text; + margin: 0em; + font: 400 13.3333px Arial; + padding: 1px 2px; + border-width: 2px; + border-style: none; + border-color: white; + border-image: initial; +} + +input:focus-visible { + outline: rgba(0, 0, 0, 0) solid 0px; + outline-offset: 0px; +} + +/* Fin Reset */ +input:focus { + position: relative; + color: red; +} +input:focus::before { + content: " "; + position: absolute; + background-color: red; + top: 0; + width: 10px; + height: 1000px; +} + +body { + position: relative; + margin: 0; +} + +.log-area { + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; + height: 20vh; + margin: 30vh 0 50vh 0; + font-family: "montserrat", sans-serif; +} + +.log-area > p { + text-align: center; } + form { - margin: 5px 0px; - font-size: 24px; + font-family: monospace, sans-serif; } -label { - letter-spacing: -1px; + +.f_inputs { + text-align: center; } -input { - border: 0px; - background-color: #24252a; - color: rgb(255, 0, 0); - border-radius: 3.5px; - margin-left: 2px; - padding: 3px; - font-size: 18px; - + +.f_inputs > div { + margin-top: 5px; } -input:focus { - outline: 1px solid #24252a ; - transition: 0.2s; - text-decoration: underline; - background-color: #edf0f1; - color: #24252a; - -} -input[type="submit"] { - border: 0px; - background-color: #24252a; - color: #edf0f1; - font-family: "Montserrat", sans-serif; - padding: 10px; - font-weight: 700; - letter-spacing: 3px; -} -input[type="submit"]:hover { - transition: 0.2s; - outline: 4px solid #24252a; - color: #24252a; - background-color: #edf0f1; + +.buttons { + display: flex; + align-items: center; + justify-content: center; + margin-top: 25px; +} + +.sign_in { + background-color: #00dc64; +} + +.sign_up { + background-color: #6a6a6a; +} + +.buttons > div { + padding: 10px 40px; + border-radius: 25px; + margin: 0 20px; +} + +div > input[type=submit], div > a { + font-family: roboto, sans-serif; + background-color: inherit; } + +/*# sourceMappingURL=style_log.css.map */ diff --git a/style/style_log.css.map b/style/style_log.css.map new file mode 100644 index 0000000..4e27c8f --- /dev/null +++ b/style/style_log.css.map @@ -0,0 +1 @@ +{"version":3,"sourceRoot":"","sources":["styles_log.scss"],"names":[],"mappings":"AAAO;AACA;AAGP;AACA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EACI;EACA;EACA;;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EACI;EACA;;;AAEJ;AACA;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;;AAIR;EACI;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EACI;;;AAEJ;EACI;;;AAEJ;EACI;;;AAEJ;EACI;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACI;;;AAEJ;EACI;;;AAEJ;EACI;EACA;EACA;;;AAGJ;EACI;EACA","file":"style_log.css"} \ No newline at end of file diff --git a/style/styles_index.scss b/style/styles_index.scss index 132ae89..d48a494 100644 --- a/style/styles_index.scss +++ b/style/styles_index.scss @@ -7,7 +7,11 @@ body { margin: 0; } - +@media only screen and (min-width: 1080px) { + .main { + padding: 0 20vh 0 20vh; + } + } main { padding: 10px; background-color: rgb(255, 255, 255); @@ -28,10 +32,30 @@ main { padding-bottom: 24px; text-align: justify; width: 11em; - padding: 10px; + height: 25em; + padding: 10px 10px 10px 10px; margin: 2.5px 2.5px 0px 2.5px; - - + overflow: hidden; + p:not(.hidden) { + display: block; + } + p.hidden { + margin-top: 15px; + display: none; + font-style: italic; + } + + &:hover { + p:not(.hidden) { + display: none; + } + h2 { + display: none; + } + p.hidden { + display: block; + } + } & img { border-radius: 10% 40% 40% 40%; filter: blur(0.10px); diff --git a/style/styles_log.scss b/style/styles_log.scss new file mode 100644 index 0000000..2bb5dc7 --- /dev/null +++ b/style/styles_log.scss @@ -0,0 +1,119 @@ +@import"https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap"; +@import"https://fonts.googleapis.com/css2?family=Roboto:wght@300;500&display=swap"; + + +/* Reset CSS */ +input[type="submit" i] { + appearance: none; + user-select: none; + white-space: normal; + align-items: flex-start; + text-align: start; + cursor: default; + color: black; + background-color: white; + box-sizing: border-box; + padding: 0px; + border-width: 0px; + border-style: none; + border-color: white; + border-image: initial; + font-size: 16px; +} +a:-webkit-any-link { + color: black; + cursor: default; + text-decoration: none; +} +input { + writing-mode: auto; + text-rendering: auto; + color: black; + letter-spacing: normal; + word-spacing: normal; + text-transform: none; + text-indent: auto; + text-shadow: none; + display: inline-block; + text-align: auto; + appearance: none; + background-color: white; + -webkit-rtl-ordering: none; + cursor: text; + margin: 0em; + font: 400 13.3333px Arial; + padding: 1px 2px; + border-width: 2px; + border-style: none; + border-color: white; + border-image: initial; +} +input:focus-visible { + outline: rgba(0, 0, 0, 0) solid 0px; + outline-offset: 0px; +} +/* Fin Reset */ +input:focus { + position: relative; + color: red; + + &::before { + content: " "; + position: absolute; + background-color: red; + top: 0; + width: 10px; + height: 1000px; + } +} + +body { + position: relative; + margin: 0; +} + +.log-area { + display: flex; + justify-content: center; + flex-direction: column; + align-items: center; + height: 20vh; + margin: 30vh 0 50vh 0; + font-family: 'montserrat', sans-serif; +} +.log-area > p { + text-align: center; +} +form { + font-family: monospace, sans-serif; +} +.f_inputs { + text-align: center; +} +.f_inputs > div { + margin-top: 5px; +} +.buttons { + display : flex; + align-items: center; + justify-content: center; + margin-top: 25px; +} +.sign_in { + background-color:#00dc64; +} +.sign_up { + background-color: #6a6a6a; +} +.buttons > div { + padding:10px 40px; + border-radius: 25px; + margin: 0 20px; +} + +div > input[type="submit"], div > a { + font-family: roboto, sans-serif; + background-color: inherit; +} + +