From a0bff14badfc6c8974596e16da12c27dc6930bb8 Mon Sep 17 00:00:00 2001
From: Quentin Roussel <contact@quentinrsl.com>
Date: Mon, 27 Mar 2023 10:36:00 +0200
Subject: [PATCH] ajout interface yasmine

---
 code/formulaire/Logo-PACT.svg     | 297 ++++++++++++++++++++++++++++++
 code/formulaire/deuxiemepage.html |  43 +++++
 code/formulaire/index.html        | 110 +++++++++++
 code/formulaire/style.css         | 105 +++++++++++
 code/formulaire/style2.css        |  16 ++
 5 files changed, 571 insertions(+)
 create mode 100644 code/formulaire/Logo-PACT.svg
 create mode 100644 code/formulaire/deuxiemepage.html
 create mode 100644 code/formulaire/index.html
 create mode 100644 code/formulaire/style.css
 create mode 100644 code/formulaire/style2.css

diff --git a/code/formulaire/Logo-PACT.svg b/code/formulaire/Logo-PACT.svg
new file mode 100644
index 0000000..c76b3ee
--- /dev/null
+++ b/code/formulaire/Logo-PACT.svg
@@ -0,0 +1,297 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   width="297mm"
+   height="210mm"
+   viewBox="0 0 297 210"
+   version="1.1"
+   id="svg961"
+   inkscape:version="1.2.2 (b0a8486, 2022-12-01)"
+   sodipodi:docname="newLogo_PACT.svg"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:xlink="http://www.w3.org/1999/xlink"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview963"
+     pagecolor="#ffffff"
+     bordercolor="#000000"
+     borderopacity="0.25"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="0.40802939"
+     inkscape:cx="562.45948"
+     inkscape:cy="397.03022"
+     inkscape:window-width="1440"
+     inkscape:window-height="524"
+     inkscape:window-x="0"
+     inkscape:window-y="25"
+     inkscape:window-maximized="0"
+     inkscape:current-layer="layer1-9" />
+  <defs
+     id="defs958">
+    <radialGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient1015"
+       id="radialGradient1577"
+       cx="46.324703"
+       cy="54.236473"
+       fx="46.324703"
+       fy="54.236473"
+       r="9.7529726"
+       gradientTransform="matrix(1.0262877,0,0,2.8906258,10.246812,-48.359093)"
+       gradientUnits="userSpaceOnUse" />
+    <linearGradient
+       inkscape:collect="always"
+       id="linearGradient1015">
+      <stop
+         style="stop-color:#4b4b4b;stop-opacity:1;"
+         offset="0"
+         id="stop1011" />
+      <stop
+         style="stop-color:#6d8000;stop-opacity:0;"
+         offset="0.77950311"
+         id="stop1013" />
+    </linearGradient>
+    <linearGradient
+       inkscape:collect="always"
+       xlink:href="#linearGradient1585"
+       id="linearGradient931"
+       x1="50.124367"
+       y1="104.73888"
+       x2="69.711563"
+       y2="104.73888"
+       gradientUnits="userSpaceOnUse"
+       gradientTransform="matrix(1.0262877,0,0,1.0657601,-3.7037881,-3.2082859)" />
+    <linearGradient
+       id="linearGradient1585"
+       inkscape:swatch="solid">
+      <stop
+         style="stop-color:#000000;stop-opacity:0;"
+         offset="0"
+         id="stop1583" />
+    </linearGradient>
+    <inkscape:path-effect
+       effect="spiro"
+       id="path-effect2117"
+       is_visible="true"
+       lpeversion="1" />
+    <inkscape:path-effect
+       effect="spiro"
+       id="path-effect4103"
+       is_visible="true"
+       lpeversion="1" />
+    <rect
+       x="175.62975"
+       y="396.53903"
+       width="138.58284"
+       height="617.4483"
+       id="rect1031" />
+    <rect
+       x="506.30762"
+       y="539.23822"
+       width="141.32706"
+       height="229.14194"
+       id="rect1089" />
+  </defs>
+  <g
+     inkscape:label="Calque 1"
+     inkscape:groupmode="layer"
+     id="layer1">
+    <g
+       inkscape:label="Calque 1"
+       inkscape:groupmode="layer"
+       id="layer1-9"
+       style="display:inline"
+       transform="translate(-6.8793579,-34.482385)">
+      <text
+         xml:space="preserve"
+         transform="matrix(0.26458333,0,0,0.26458333,10.866416,15.4233)"
+         id="text1087"
+         style="font-size:24px;line-height:0;text-align:start;white-space:pre;shape-inside:url(#rect1089);display:inline;fill:#008080;stroke:#000000;stroke-width:1.00157" />
+      <g
+         id="g3949"
+         transform="matrix(0,-1.0354543,1.0166345,0,-30.252411,250.68828)"
+         style="stroke-width:0.974658">
+        <g
+           id="g3924"
+           style="stroke-width:0.974658">
+          <ellipse
+             style="display:inline;opacity:1;fill:url(#radialGradient1577);fill-opacity:1;stroke:url(#linearGradient931);stroke-width:0.258283"
+             id="path1185"
+             cx="57.789291"
+             cy="108.41822"
+             rx="9.873373"
+             ry="28.050983"
+             inkscape:label="path1185" />
+          <path
+             style="opacity:1;fill:#6b8000;fill-opacity:1;stroke:#000000;stroke-width:0.745613;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+             d="m 59.640969,108.74356 c 16.125641,15.02162 34.884565,27.2086 55.163291,35.83755 3.07571,1.30877 6.19589,2.53971 9.43207,3.37636 11.95769,3.09142 25.2781,0.37293 35.06817,-7.15687 9.79006,-7.52981 15.83594,-19.70646 15.91676,-32.05704"
+             id="path2115"
+             sodipodi:nodetypes="caac"
+             inkscape:original-d="m 59.640969,108.74356 c 18.38798,11.81708 35.48186,26.09188 55.163291,35.83755 2.98863,1.47988 6.1279,3.89204 9.43207,3.37636 21.30112,-3.3245 50.98514,-23.17636 50.98493,-39.21391"
+             inkscape:path-effect="#path-effect2117" />
+          <path
+             style="display:inline;fill:#6d8000;fill-opacity:1;stroke:#000000;stroke-width:0.745613;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+             d="M 59.640967,108.74356 C 75.856676,93.93741 94.595435,81.901561 114.80426,73.312341 c 3.07623,-1.30747 6.19609,-2.539053 9.43207,-3.376363 11.89279,-3.077258 25.13611,-0.410572 34.91108,7.029724 9.77497,7.440295 15.8725,19.495045 16.07385,31.777858"
+             id="path4099"
+             sodipodi:nodetypes="caac"
+             inkscape:original-d="m 59.640967,108.74356 c 18.38798,-11.817079 35.52356,-25.769479 55.163293,-35.431219 2.99257,-1.47219 6.12659,-3.883836 9.43207,-3.376363 21.22615,3.258763 50.98514,22.770043 50.98493,38.807582"
+             inkscape:path-effect="#path-effect4103" />
+          <ellipse
+             style="fill:#ffffff;stroke:#000000;stroke-width:0.745613;stroke-dasharray:none;stroke-opacity:1;paint-order:normal"
+             id="path4588"
+             cx="132.49054"
+             cy="109.20644"
+             inkscape:transform-center-x="-0.27264539"
+             inkscape:transform-center-y="1.0661581"
+             rx="30.040001"
+             ry="29.367502" />
+          <rect
+             style="fill:#6b8000;fill-opacity:1;stroke:#000000;stroke-width:0.258283"
+             id="rect958"
+             width="3.9934042"
+             height="59.710579"
+             x="55.279675"
+             y="144.61224"
+             ry="1.9199082" />
+          <rect
+             style="fill:#6b8000;fill-opacity:1;stroke:#000000;stroke-width:0.258282"
+             id="rect963"
+             width="3.9934042"
+             height="126.69983"
+             x="97.347488"
+             y="175.84691"
+             ry="1.9967021" />
+          <text
+             xml:space="preserve"
+             transform="matrix(0,1.1197512,-1.3566798,0,616.31543,-29.867975)"
+             id="text1029"
+             style="font-size:24px;line-height:0;text-align:start;white-space:pre;shape-inside:url(#rect1031);display:inline;fill:#a6cc00;fill-opacity:1;stroke:#000000;stroke-width:0.209554"
+             x="0"
+             y="0"><tspan
+               x="175.62891"
+               y="403.43499"
+               id="tspan4111">éléReview</tspan></text>
+          <text
+             xml:space="preserve"
+             style="font-size:43.7761px;line-height:0;text-align:start;text-anchor:start;fill:#6b8000;fill-opacity:1;stroke:#000000;stroke-width:0.258283"
+             x="151.92831"
+             y="-64.824944"
+             id="text1095"
+             transform="matrix(0,0.95344217,-1.0488313,0,0,0)"><tspan
+               sodipodi:role="line"
+               id="tspan1093"
+               style="fill:#6b8000;fill-opacity:1;stroke-width:0.258284"
+               x="151.92831"
+               y="-64.824944">T</tspan></text>
+          <path
+             style="fill:#97b200;fill-opacity:1;stroke:#000000;stroke-width:0.258283"
+             d="m 134.06656,103.34153 c -4.77643,-0.36805 -14.29433,-0.1229 -14.29433,-0.1229 l 0.0714,17.51515 c 0.0138,3.38266 3.79451,3.84526 3.8232,0.82284 0.1102,3.03193 4.67921,3.02185 4.53493,0.25905 0.0868,2.61897 4.31947,3.36526 4.35763,0.0643 0.0138,3.44405 3.90092,3.75645 4.23345,0.8526 0.30682,-2.67944 0.1973,-7.29251 0.17302,-10.17805 1.55836,0.87747 4.39964,2.01469 6.15797,2.7031 1.2111,0.30578 2.3042,0.53963 4.55554,-0.26464 1.51703,-0.54194 2.90566,-3.29802 0.66168,-4.71347 0,0 -2.98334,0.31993 -4.10587,-0.46506 -1.92885,-1.34887 -5.45973,-6.10997 -10.16858,-6.47282 z"
+             id="path1479"
+             sodipodi:nodetypes="scscccsccscsss" />
+          <path
+             style="fill:#576600;fill-opacity:1;stroke:#000000;stroke-width:0.258283"
+             d="m 135.76752,93.178413 h -15.86714 v 7.590727 c 0,0 13.09479,2.62351 15.94648,0 2.85169,-2.623517 0,-7.590727 0,-7.590727 z"
+             id="path1483"
+             sodipodi:nodetypes="ccczcc" />
+          <rect
+             style="fill:#6b8000;fill-opacity:1;stroke:#000000;stroke-width:0.258282"
+             id="rect1177"
+             width="3.2409523"
+             height="4.0823917"
+             x="205.9617"
+             y="55.295101"
+             ry="1.6204761"
+             transform="matrix(0,1,1,0,0,0)" />
+          <rect
+             style="fill:#6b8000;fill-opacity:1;stroke:#000000;stroke-width:0.258282"
+             id="rect1183"
+             width="3.2409523"
+             height="11.874199"
+             x="210.45601"
+             y="51.243004"
+             ry="1.6204761"
+             transform="matrix(0,1,1,0,0,0)" />
+          <rect
+             style="fill:#6b8000;fill-opacity:1;stroke:#000000;stroke-width:0.258282"
+             id="rect1185"
+             width="3.2409523"
+             height="18.448845"
+             x="215.0782"
+             y="47.678936"
+             ry="1.6204761"
+             transform="matrix(0,1,1,0,0,0)" />
+          <rect
+             style="fill:#6b8000;fill-opacity:1;stroke:#000000;stroke-width:0.258282"
+             id="rect1187"
+             width="3.2409523"
+             height="5.9441247"
+             x="224.41055"
+             y="53.807995"
+             ry="1.6204761"
+             transform="matrix(0,1,1,0,0,0)" />
+          <rect
+             style="fill:#6b8000;fill-opacity:1;stroke:#000000;stroke-width:0.258282"
+             id="rect1189"
+             width="3.2409523"
+             height="14.065748"
+             x="219.74197"
+             y="49.881874"
+             ry="1.6204761"
+             transform="matrix(0,1,1,0,0,0)" />
+          <rect
+             style="fill:#6b8000;fill-opacity:1;stroke:#000000;stroke-width:0.258282"
+             id="rect1195"
+             width="3.2409523"
+             height="18.448845"
+             x="229.04878"
+             y="47.194241"
+             ry="1.6204761"
+             transform="matrix(0,1,1,0,0,0)" />
+          <rect
+             style="fill:#6b8000;fill-opacity:1;stroke:#000000;stroke-width:0.258282"
+             id="rect1251"
+             width="3.2409523"
+             height="10.359351"
+             x="233.68971"
+             y="51.805531"
+             ry="1.6204761"
+             transform="matrix(0,1,1,0,0,0)" />
+          <rect
+             style="fill:#6b8000;fill-opacity:1;stroke:#000000;stroke-width:0.258282"
+             id="rect1253"
+             width="3.2409523"
+             height="4.0823917"
+             x="205.9617"
+             y="55.295101"
+             ry="1.6204761"
+             transform="matrix(0,1,1,0,0,0)" />
+          <rect
+             style="fill:#6b8000;fill-opacity:1;stroke:#000000;stroke-width:0.258282"
+             id="rect1285"
+             width="3.2409523"
+             height="4.0823917"
+             x="238.05586"
+             y="55.23875"
+             ry="1.6204761"
+             transform="matrix(0,1,1,0,0,0)" />
+          <rect
+             style="fill:#6b8000;fill-opacity:1;stroke:#000000;stroke-width:0.258283"
+             id="rect1287"
+             width="3.9934042"
+             height="59.710579"
+             x="55.441879"
+             y="242.85898"
+             ry="1.9199082" />
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/code/formulaire/deuxiemepage.html b/code/formulaire/deuxiemepage.html
new file mode 100644
index 0000000..ae66a2e
--- /dev/null
+++ b/code/formulaire/deuxiemepage.html
@@ -0,0 +1,43 @@
+<html lang="fr">
+    <head>
+        <title>Nom de l'exposition</title>
+        <link href="style2.css" rel="stylesheet">
+        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
+    </head>
+
+    <body>
+        <header>
+            <div class="banniere">
+                <!-- image en baniere -->
+                <img src="Logo-PACT.svg" class="img-fluid" alt="logo Téléreview" />
+            </div>
+        </header>
+
+        <main>
+
+            <div class="container">
+
+                <div class="col-md-6   offset-md-3">
+                    <div class ='merci'>
+                        <p class ='merci'>
+                            Merci pour vos réponse <br>
+                            
+                            Vos réponses ont bien été enregistré<br>
+                            <br>
+                            A la prochaine !
+                        </p>
+                    </div>
+
+                </div>
+
+            </div>
+            
+        </main>
+
+        <footer>
+
+        </footer>
+    
+    </body>
+
+</html>
\ No newline at end of file
diff --git a/code/formulaire/index.html b/code/formulaire/index.html
new file mode 100644
index 0000000..2b29396
--- /dev/null
+++ b/code/formulaire/index.html
@@ -0,0 +1,110 @@
+<html lang="fr">
+
+<head>
+    <title>Nom de l'exposition</title>
+    <link href="style.css" rel="stylesheet">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet"
+        integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">
+</head>
+
+<body>
+    <header>
+        <div class="banniere d-flex">
+            <!-- image en baniere -->
+            <img src="Logo-PACT.svg" class="img-fluid col-12 col-md-6 mx-auto" alt="logo Téléreview" />
+        </div>
+        <!-- <div class="col-md-6 offset-md-3">
+                <p class="titre">
+                    Nom de l'exposition<br>
+                </p>
+            </div> -->
+    </header>
+
+    <main>
+
+        <form method="get" action="deuxiemepage.html">
+
+            <div class="row justify-content-md-center">
+
+                <div class="container">
+
+                    <div class="col-md-6   offset-md-3">
+                        <p class="sexe">
+                            <label for="sexe">Sexe</label><br>
+                            <select name="sexe" id="sexe">
+                                <option value="femme">Femme</option>
+                                <option value="homme">Homme</option>
+                                <option value="autre">Autre</option>
+                            </select>
+                        </p>
+                    </div>
+
+                    <div class="col-md-6 offset-md-3">
+                        <p class="age">
+                            <label for="age"> Dans quelle tranche d'âge vous situez-vous ?</label>
+                            <select name="age" id="age">
+                                <option value="moins12"> Moins de 12 ans</option>
+                                <option value="medium12-18">12-18 ans</option>
+                                <option value="medium18-30">18-30 ans</option>
+                                <option value="medium30-50">30-50 ans</option>
+                                <option value="medium50-70">50-70 ans</option>
+                                <option value="plus70">Plus de 70 ans</option>
+                            </select>
+                        </p>
+                    </div>
+
+                    <div class="col-md-6 offset-md-3">
+                        <p class="note">
+                            <label for="note"> Quelle note sur 10 donneriez-vous à l'exposition ? </label><br>
+                            <select name="note" id="note">
+                                <option value="zero">0</option>
+                                <option value="un">1</option>
+                                <option value="deux">2</option>
+                                <option value="trois">3</option>
+                                <option value="quatre">4</option>
+                                <option value="cinq">5</option>
+                                <option value="six">6</option>
+                                <option value="sept">7</option>
+                                <option value="huit">8</option>
+                                <option value="neuf">9</option>
+                                <option value="dix">10</option>
+                            </select>
+                        </p>
+                    </div>
+
+                    <div class="col-md-6 offset-md-3">
+                        <p class="commentaire">
+                            <label for="commentaire">Commentaire : </label><br>
+                            <textarea name="ameliorer" id="ameliorer"></textarea>
+                        </p>
+                    </div>
+
+                    <div class="col-md-6 offset-md-3">
+                        <p class="bonheur">
+                            <label for="bonheur"> Placez votre humeur sur cette barre du bonheur : </label><br>
+                            <input type="range">
+                        </p>
+                    </div>
+
+                    <div class="col-md-6 offset-md-3">
+                        <input type="submit" class="envoyer btn btn-primary btn-lg w-100" value="Envoyer">
+                    </div>
+                </div>
+        </form>
+
+    </main>
+
+    <footer>
+        <div class=".col-md-4 .offset-md-3">
+            <!-- pb de position -->
+            <p class="end">
+                @mail<br>
+                sitewebsiteexpo<br>
+                mention legale
+            </p>
+        </div>
+    </footer>
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/code/formulaire/style.css b/code/formulaire/style.css
new file mode 100644
index 0000000..885e6b4
--- /dev/null
+++ b/code/formulaire/style.css
@@ -0,0 +1,105 @@
+/* .container{
+    background-color: #FAEBD7;
+}  */
+
+
+.sexe {
+    font-size: 25px;
+    border-top: 3px #6B8E23 solid;
+    border-right: 3px #6B8E23 solid;
+    border-bottom: 3px #6B8E23 solid;
+    border-left: 3px #6B8E23 solid;
+    border-radius: 10px;
+    padding: 50px;
+    display: flex;
+    flex-direction: column;
+    align-content: center;
+    align-content: space-between;
+    gap: 10px;
+    align-content: space-around;
+}
+
+.age {
+    font-size: 25px;
+    border-top: 3px #6B8E23 solid;
+    border-right: 3px #6B8E23 solid;
+    border-bottom: 3px #6B8E23 solid;
+    border-left: 3px #6B8E23 solid;
+    border-radius: 10px;
+    padding: 50px;
+    display: flex;
+    flex-direction: column;
+    align-content: center;
+    align-content: space-between;
+    gap: 10px;
+    align-content: space-around;
+}
+
+.note{
+    font-size: 25px;
+    border-top: 3px #6B8E23 solid;
+    border-right: 3px #6B8E23 solid;
+    border-bottom: 3px #6B8E23 solid;
+    border-left: 3px #6B8E23 solid;
+    border-radius: 10px;
+    padding: 50px;
+    display: flex;
+    flex-direction: column;
+    align-content: center;
+    align-content: space-between;
+    gap: 10px;
+    align-content: space-around;
+}
+
+.bonheur{
+    font-size: 25px;
+    border-top: 3px #6B8E23 solid;
+    border-right: 3px #6B8E23 solid;
+    border-bottom: 3px #6B8E23 solid;
+    border-left: 3px #6B8E23 solid;
+    border-radius: 10px;
+    padding: 50px;
+    display: flex;
+    flex-direction: column;
+    align-content: center;
+    align-content: space-between;
+    gap: 10px;
+    align-content: space-around;
+}
+
+.commentaire{
+    font-size: 25px;
+    border-top: 3px #6B8E23 solid;
+    border-right: 3px #6B8E23 solid;
+    border-bottom: 3px #6B8E23 solid;
+    border-left: 3px #6B8E23 solid;
+    border-radius: 10px;
+    padding: 50px;
+    display: flex;
+    flex-direction: column;
+    align-content: center;
+    align-content: space-between;
+    gap: 10px;
+    align-content: space-around;
+}
+
+.envoyer{
+    width: 7em;
+    font-size: 0.94em;
+}
+
+.end{
+    background-color: #6B8E23;
+}
+
+/* .banniere {
+    padding: 100px; 
+    width : 100%;
+    height : 30%;
+    text-align: center;
+    background-image: url('Logo-PACT.svg');
+} */
+
+
+
+
diff --git a/code/formulaire/style2.css b/code/formulaire/style2.css
new file mode 100644
index 0000000..142ab42
--- /dev/null
+++ b/code/formulaire/style2.css
@@ -0,0 +1,16 @@
+.message{
+    
+}
+
+/* .container{
+    background-color: #FAEBD7;
+} */
+
+.merci{
+    display: flex;
+    flex-direction: column;
+    align-content: center;
+    align-content: space-between;
+    gap: 10px;
+    align-content: space-around;
+}
\ No newline at end of file