diff --git a/client/public/css/style.css b/client/public/css/style.css new file mode 100644 index 0000000000000000000000000000000000000000..2c9bb8ea07aded63666a6cb9c3783836b4e84cf6 --- /dev/null +++ b/client/public/css/style.css @@ -0,0 +1,184 @@ +h4, h5, h6, +h1, h2, h3 {margin-top: 0;} +ul, ol {margin: 0;} +p {margin: 0;} +html, body{ + width: 100%; + font-family: 'Lato', sans-serif; + font-size: 100%; + background:#fff; +} +a:hover { + transition: 0.5s all; + -webkit-transition: 0.5s all; + -moz-transition: 0.5s all; + -o-transition: 0.5s all; +} + +.header { + background: #252e38; + border-bottom: 3px solid #0ab2d2; +} + +.logo { + float: left; + width:50%; + margin: 2.1em 0em 0em 0em; +} + +.logo h3 , .logo a:hover{ + color:#0ab2d2; + font-weight: bold; + text-decoration: none; +} +.head-right { + float: right; + width: 50%; +} +.top-nav { + float: left; +} +.top-nav ul { + padding:0px; + list-style: none; +} +.top-nav ul li { + display: inline-block; + float: left; +} +.top-nav ul li a { + font-size: 1.1em; + font-weight: 400; + color: #fff; + text-decoration: none; + padding: 2em 1em 2em 1em; + font-family: 'Lora', serif; + display:block; +} +.top-nav ul li a:hover,.top-nav ul li a.active{ + background:#0ab2d2; +} +span.menu{ + display:none; +} + +.footer { + background: #252e38; +} +.footer-main { + padding: 2em 0em 2em 0em; +} +.footer-grid h3 { + font-size: 1.5em; + font-weight: 400; + color: #fff; + margin: 0px 0px 25px 0px; +} +.footer-grid p { + font-size: 0.9em; + font-weight: 400; + color: #fff; + line-height: 1.6em; +} +.footer-grid a p { + font-size: 0.8em; + font-weight: 400; + color: #b6bdc0; + line-height: 1.6em; + text-decoration:none; +} +.footer-grid a p:hover { + color:#fff +} +.ftr-sub-gd { + padding: 0.5em 0em 0.5em 0em; + border-bottom: 1px solid #32484f; +} +.ftr-gd2-img { + padding: 0px; +} +.ftr-gd2-text h4 { + font-size: 0.9em; + font-weight: 400; + color: #fff; + margin: 0px 0px 3px 0px; +} +.ftr-gd2-text a:hover{ + text-decoration:none; +} +.ftr-gd2-text h4:hover { + color: #0ab2d2; +} +.ftr-gd2-text { + padding: 0px; +} +.footer-grid ul { + padding: 0px; + list-style:none; +} +.footer-grid ul li { + display: block; + padding: 0.6em 0em 0.6em 0em; + border-bottom: 1px solid #32484f; +} +.footer-grid ul li a { + font-size: 0.9em; + font-weight: 400; + color: #fff; + margin: 0px; +} +.footer-grid ul li a:hover { + text-decoration:none; + color: #0ab2d2; +} +.ftr-gd4-1 { + padding: 0px; +} +.ftr-gd4-img { + margin: 0px 0px 7px 0px; +} + +.copy-left { + float: left; +} +.copy-right { + float: right; +} +.copy-right ul { + padding: 0px; + list-style:none; +} +.copy-right ul li { + display: inline-block; + margin: 0px 5px 0px 5px; +} +.copy-right ul li a { + font-size: 1em; + font-weight: 400; + color: #fff; + text-decoration: none; +} +.copy-right ul li a:hover { + color: #000; + text-decoration: none; +} +.copyright { + background: #0ab2d2; + padding: 1em 0em 1em 0em; + height: 3.3em; +} +.copy-left p { + font-size: 1em; + font-weight: 400; + color: #fff; +} +.copy-left p a{ + font-size: 1em; + font-weight: 400; + color:#000; +} +.copy-left p a:hover{ + color:#fff; + text-decoration: none; +} + diff --git a/client/public/images/2019-M2-WEB-FSLAB-Graphique1.jpeg b/client/public/images/2019-M2-WEB-FSLAB-Graphique1.jpeg new file mode 100644 index 0000000000000000000000000000000000000000..8220772b8c2df2dc6e80bef4dd1ec334ecbe590e Binary files /dev/null and b/client/public/images/2019-M2-WEB-FSLAB-Graphique1.jpeg differ diff --git a/client/public/images/2019-M2-WEB-FSLAB-Graphique2.jpeg b/client/public/images/2019-M2-WEB-FSLAB-Graphique2.jpeg new file mode 100644 index 0000000000000000000000000000000000000000..676324834bd04de3185b69a75cee431ab67fdbca Binary files /dev/null and b/client/public/images/2019-M2-WEB-FSLAB-Graphique2.jpeg differ diff --git a/client/public/images/2019-M2-WEB-FSLAB-Graphique3.jpeg b/client/public/images/2019-M2-WEB-FSLAB-Graphique3.jpeg new file mode 100644 index 0000000000000000000000000000000000000000..62029a3292200e7818cbfa58179e69ff22ab2cb6 Binary files /dev/null and b/client/public/images/2019-M2-WEB-FSLAB-Graphique3.jpeg differ diff --git a/client/public/images/avataaars_fb.png b/client/public/images/avataaars_fb.png new file mode 100644 index 0000000000000000000000000000000000000000..33a697e003f0366e21fdd62bf793db76c43f724c Binary files /dev/null and b/client/public/images/avataaars_fb.png differ diff --git a/client/public/images/avataaars_fm.png b/client/public/images/avataaars_fm.png new file mode 100644 index 0000000000000000000000000000000000000000..9af559b33efd0bad650d593321c4e64122482f80 Binary files /dev/null and b/client/public/images/avataaars_fm.png differ diff --git a/client/public/images/avataaars_mc.png b/client/public/images/avataaars_mc.png new file mode 100644 index 0000000000000000000000000000000000000000..345d7b78f8cbc28dd51b6784388269fcab59dbc5 Binary files /dev/null and b/client/public/images/avataaars_mc.png differ diff --git a/client/public/images/avataaars_vv.png b/client/public/images/avataaars_vv.png new file mode 100644 index 0000000000000000000000000000000000000000..725a9925f748ed0cc84153a221f59cb248380e73 Binary files /dev/null and b/client/public/images/avataaars_vv.png differ diff --git a/client/public/images/icon.png b/client/public/images/icon.png new file mode 100644 index 0000000000000000000000000000000000000000..80fe226a8847bd1501768d059efd5b7c3037c106 Binary files /dev/null and b/client/public/images/icon.png differ diff --git a/client/public/images/img-sprite.png b/client/public/images/img-sprite.png new file mode 100644 index 0000000000000000000000000000000000000000..b578755e20230e0f20a8d158d3f76add474aa1b1 Binary files /dev/null and b/client/public/images/img-sprite.png differ diff --git a/client/public/images/next.png b/client/public/images/next.png new file mode 100644 index 0000000000000000000000000000000000000000..462b64e45ee4af56c38fab160b4c5af61edc8858 Binary files /dev/null and b/client/public/images/next.png differ diff --git a/client/public/images/plus.png b/client/public/images/plus.png new file mode 100644 index 0000000000000000000000000000000000000000..1591c29be88592ba8824315d1e5ab9727aa2bba0 Binary files /dev/null and b/client/public/images/plus.png differ diff --git a/client/public/images/prev.png b/client/public/images/prev.png new file mode 100644 index 0000000000000000000000000000000000000000..eda62a7e40f54a25d44c2cc1c87a8f61c783c314 Binary files /dev/null and b/client/public/images/prev.png differ diff --git a/client/public/images/search.png b/client/public/images/search.png new file mode 100644 index 0000000000000000000000000000000000000000..3234d227dd4dbda076c53b419dab7dda719e802b Binary files /dev/null and b/client/public/images/search.png differ diff --git a/client/public/images/user.png b/client/public/images/user.png new file mode 100644 index 0000000000000000000000000000000000000000..f74e13cdf285fd5046aaa94a6bdaf2505ec70e68 Binary files /dev/null and b/client/public/images/user.png differ diff --git a/client/public/index.html b/client/public/index.html index d400f1c1784c0f1411cf0a8aa62fe8af233420b5..100d51d768f74cabda43ac83a13e8517cd235382 100644 --- a/client/public/index.html +++ b/client/public/index.html @@ -21,13 +21,75 @@ work correctly both with client-side routing and a non-root public URL. Learn how to configure a non-root public URL by running `npm run build`. --> - Welcome to API Platform + API Platform IMMOCS 2020 + + + + + + + + + - + + + -
+ +
+
+
+ +
+
+ + +
+
+
+
+
+
+
+ +
+ +
+
+
+
+
+
+
+
+
+
+

Developped By Vivien, Fleurian, Florian, Matthieu

+
+
+ +
+
+
+
+
diff --git a/client/src/homepage.css b/client/src/homepage.css index e129c4541d2098267b4e647d00bc94cd3978c906..9d0075b373ed0020946c23d309b34276fe690999 100644 --- a/client/src/homepage.css +++ b/client/src/homepage.css @@ -1,313 +1,91 @@ -@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700|Roboto+Slab:300,700'); - -body { - margin: 0; -} - -/***** GLOBAL *****/ - -.welcome { - height: 100vh; - width: 100vw; - text-align: center; - color: #1d1e1c; - font-family: 'Open Sans', sans-serif; - font-size: 14px; - overflow: auto; - background-color: #ececec; -} - -.welcome a { - text-decoration: none; - color: #38a9b4; - font-weight: bold; -} - -.welcome h1 { - font-family: 'Roboto Slab', serif; - font-weight: 300; - font-size: 36px; - margin: 0 0 10px; - line-height: 30px; -} - -.welcome h1 strong { - font-weight: 700; - color: #38a9b4; -} - -.welcome h2 { - text-transform: uppercase; - font-size: 18px; - font-weight: bold; - margin: 25px 0 5px; -} - -.welcome h3 { - text-transform: uppercase; - font-weight: 500; - color: #38a9b4; - font-size: 16px; - margin: 0 0 5px; - display: block; -} - -/***** TOP *****/ - -.welcome__top { - background-color: #67cece; - padding-bottom: 40px; -} - -.welcome__flag { - transform: rotate(30deg); - position: fixed; - right: -190px; - top: 65px; - box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); - z-index: 5; -} - -/***** MAIN *****/ - -.welcome__main { - box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), - 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.3); - width: 80%; - max-width: 1100px; - margin-left: auto; - margin-right: auto; - transform: translateY(-50px); - background-color: white; - display: flex; -} - -.main__aside { - background-color: #afe5e5; - width: 30%; - position: relative; - overflow: hidden; -} - -.aside__circle, -.main__aside svg { - position: absolute; - left: 50%; - top: 50%; - transform: translate(-50%, -50%); -} - -.aside__circle { - background-color: white; - border-radius: 50%; - width: 90%; - height: 0; - padding-bottom: 90%; -} - -.aside__circle:after { - content: ''; - width: 4px; - left: calc(50% - 5px); - top: -50%; - position: absolute; - height: 100%; - background-color: #1d1e1c; -} - -.main__aside svg { - width: 100%; -} - -.main__content { - padding: 30px; - text-align: left; - flex: auto; -} -.other__bloc { - display: inline-flex; - align-items: center; - border: 4px solid #afe5e5; - padding: 10px 20px; - margin: 10px 0; - height: 170px; - box-sizing: border-box; - text-align: left; - width: 40%; -} - -.other__bloc:not(:last-of-type) { - margin-right: 10px; -} - -.other__bloc h3:not(:first-child) { - margin-top: 15px; - padding-top: 5px; -} - -.other__circle { - width: 110px; - height: 110px; - background-color: #afe5e5; - border-radius: 50%; - margin-right:20px; -} - -.other__circle svg{ - width: 110px; -} - -.buttons__group { - display: inline-flex; - vertical-align: center; -} - -.buttons__group .buttons__or { - width: 4px; - position: relative; - text-align:center; -} - -.buttons__group .buttons__or:before { - content: 'or'; - font-size: 12px; - color: #aaa; - line-height: 18px; - position: absolute; - border-radius: 50%; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - background-color: white; - width: 18px; - height: 18px; -} - -.buttons__group .other__button:first-child { - border-radius: 5px 0 0 5px; - padding-right: 15px; -} - -.buttons__group .other__button:last-child { - border-radius: 0 5px 5px 0; - padding-left: 15px; -} - -a.other__button { - background-color: #e0e1e2; - font-size: 11px; - color: #686e63; - cursor: pointer; - padding: 5px 10px; - display: inline-block; - transition: all ease 0.2s; - text-transform: uppercase; -} - -.other__button:hover { - background-color: #afe5e5; - color: #339ba5; -} - -.main__button { - display: inline-block; - padding: 10px 50px 10px 10px; - border: 3px solid #339ba5; - font-size: 22px; - color: #339ba5; - text-transform: uppercase; - margin: 15px 0; - overflow: hidden; - transition: all ease 0.3s; - cursor: pointer; - position: relative; -} - -.main__button svg { - position: absolute; - right: 10px; - top: 50%; - transform: translateY(-50%); - transition: transform ease 0.2s; -} - -.main__button:hover { - background-color: #afe5e5; -} - -.main__button:hover svg { - transform: translateY(-50%) rotate(35deg); -} - -/***** HELP *****/ - -.welcome__help { - background-color: white; - box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2); - padding: 10px; - position: fixed; - right: -5px; - top: 50%; - transform: translateY(-50%); - border-radius: 5px; - text-align: center; -} - -.welcome__help h2 { - color: #aaa; - font-size: 12px; - margin: 10px 0; -} - -.help__circle { - width: 36px; - height: 36px; - border-radius: 50%; - border: 2px solid #ccc; - display: block; - margin: 10px auto; - transition: all ease 0.2s; - position:relative; -} - -.help__circle svg { - position:absolute; - left: 50%; - top: 50%; - transform:translate(-50%, -50%); -} - -.help__circle:hover { - border-color: #67cece; - background-color: #afe5e5; -} - -/***** MEDIAS *****/ - -@media (max-width: 1200px) { - .main__aside, - .welcome__help { - display: none; - } - .main__content { - width: 100%; - text-align: center; - padding: 20px; - } -} - -@media (max-width: 600px) { - .welcome__main { - width: calc(100% - 40px); - } - .welcome h1 { - display: none; - } - .welcome__flag, - .main__other { - display: none; - } - .main__content { - padding: 10px; - } +.about { + padding: 3em 0px 2em 0px; +} +.about-top { +padding: 0px 0px 0px 15px; +} +.about-top h3{ +font-size: 2em; +color:#0ab2d2; +font-weight: 600; +margin: 0px 0px 0px 0px; +text-align: left; +font-family: 'Lora', serif; +} +.about-top h5{ +font-size: 18px; +font-weight: 400; +line-height: 1.4em; +margin: 7px 0px 10px 0px; +color: #010101; +font-family: 'Lora', serif; +} +.about-top p { +font-size: 16px; +line-height: 1.6em; +color: #959191; +margin: 4px 0px 0px 0px; +} +.about-text-left a h5 { +font-size: 20px; +font-weight: 400; +line-height: 1.4em; +margin: 7px 0px 0px 0px; +color: #010101; +font-family: 'Lora', serif; +text-decoration:none; +} +.about-text-left a:hover { +text-decoration:none; +} +.about-text-left h5:hover { +color:#0ab2d2; +} +.about-text-left p { +font-size: 16px; +line-height: 1.6em; +color: #959191; +margin: 4px 0px 0px 0px; +} +.about-text-left img{ +width:100%; +} +.about-text { +margin-top: 2.5em; +} + + +.team-main h3{ +font-size: 1.8em; +color:#777; +font-weight: 600; +margin: 0px 0px 0px 15px; +text-align: left; +font-family: 'Lora', serif; +} +.team-main{ +text-align:center; +} +.team { +padding: 1em 0px 4em 0px; +} +.team-top { +margin-top: 3em; +} +.team-details h4 { +font-size: 1.15em; +font-weight: 700; +color: #000; +margin: 0; +font-family: 'Lora', serif; +} +.team-details p { +color: #95928d; +font-size: 16px; +font-weight: 500; +margin-top: 8px; +width: 100% !important; +} +.team-details { +margin-top: 15px; } diff --git a/client/src/homepage.js b/client/src/homepage.js index 669cbc2a8fe4ea2fe3b98c6b49251c6c071aa30f..b9455479c4357032dc85ef76a0ca3108b5d2ec2d 100644 --- a/client/src/homepage.js +++ b/client/src/homepage.js @@ -2,41 +2,85 @@ import React from 'react'; import './homepage.css'; const homepage = () => ( -
- +
+
+
+
+
+

Présentation du Projet final FULL STACK du master IWOCS M2

+
Site de présentation du projet final
+

Ce site a été développé à partir du framework API Platform ...

+
+ +
+
+ Graphique1 + +
Prix du M²
+ +

Graphique montrant l'évolution du prix moyen du M² au cours du temps

+
+ +
+ Graphique2 + +
Nombre de Vente
+ +

Diagramme a bar.

+
+ +
+ Graphique3 + +
Repartition par region
+ +

Diagramme circulaire.

+
+
+
+
+
+
-
-

-   -

-
- -
-

- Projet Web Full Stack @2020 -

-
+
+
+
+

Notre équipe de choc

+
+
+ fm +
+

Fleurian

+

desc1

+
+
+
+ fb +
+

Florian Boubou

+

desc2

+
+
+
+ mc +
+

Mathieu

+

desc3

+
+
+ +
+ vv +
+

Vivien

+

Chasseur de cariboux tout doux tout roux

+
+
+
+
+
+
+
);