diff --git a/front/css/main.css b/front/css/main.css index 6d929e1..d6b6b1d 100644 --- a/front/css/main.css +++ b/front/css/main.css @@ -17,6 +17,243 @@ /* insert styles here */ } +*{ + box-sizing: border-box; + font-family: 'Poppins', sans-serif; +} + + +head{ + + background-image: url(../images/pexels-pixabay-236937.jpg); +} + +.row{ +display: flex; +justify-content: space-around; + +height: 80px; +width: 100%; +background-color: rgb(124, 122, 122); +opacity: 0.74; +border: none; +z-index: 100; +position: fixed; +} + +.imglogo{ + width: 150px; + height: 80px; +} + +.linkpage{ + display: flex; + +} + +a { + text-decoration: none; + box-shadow: none; + padding: 0px 10px 0px 20px; + color:white; +} + +a:hover{ + + color: #C57ED3; + border-color: #C57ED3; + +} +.carbone{ + margin-left: 50px; + margin-top: 30px; + display: flex; + +} + .section1 { + background: url(../images/pexels-pixabay-236937.jpg); + width: 100%; + height: 600px; + display: flex; + align-items: center; + justify-content: center; + background-size: cover; + background-position: center; +} +.presentation{ + display: flex; + width: 50%; + + flex-direction: column; + align-items: center; + color: white; +} +.section2-1{ + width: 45%; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; +} +.animate__animated.animate__lightSpeedInLeft { + --animate-duration: 1s; + padding-left: 120px; + } + +.section2-2{ + + background: url(/front/images/carr_6893.jpg); + border-radius: 10px; + width: 50%; + height: 350px; + background-size: 100% auto; + background-position: center; +} +.transport{ + display: flex; + margin-top: 40px; + width: 100%; + height: 600px; + +} +.section3-2{ + width: 40%; + + display: flex; + flex-direction: column; + align-content: center; + align-items: center; + justify-content: center; + +} +.animate__animated.animate__lightSpeedInRight{ + width: 60%; + --animate-duration: 1s; + +} + + +.duoimg { + display: flex; + padding: 0px 10px 0px 10px; + width: 100%; + } +.imgbus{ + + width: 50%; + height: 300px; + margin-left: 10px; + background: url(../images/Mercedes-Benz_Citaro_C2_-_RTM_Marseille-1024x576-2.jpg) no-repeat; + background-size: 100% auto; + background-position: center; + +} +.imgmetro{ + width: 50%; + height: 300px; + + background: url(../images/1200x680_index.jpg) no-repeat; + background-size: 100% auto; + background-position: center; +} + +.imgtram{ + width: 97.5%; + height: 300px; + margin-left: 10px; + background: url(../images/768x492_tramway-marseille.jpeg) no-repeat; + background-size: 100% auto; + background-position: center; + +} + +.recyclage{ + display: flex; + margin-top: 10px; + width: 100%; + height: 500px; +} +.section4-1{ + width: 50%; +} +.section4-2{ + width: 50%; +} +.imgtri{ + + height: 500px; + background: url(../images/borne-tri-2021.jpeg) no-repeat; + background-size: cover; + background-position: center; + +} + +.footer { + display: flex; + margin-top: 30px; + flex: 1; + flex-direction: row; + flex-wrap: wrap; + border: 1px solid #707070; + padding-bottom: 40px; + justify-content: center; + align-items: center; + } + + .footer a { + flex-basis: 30%; + text-align: center; + padding: 10px; + } + + .footer img { + height: 70px; + object-fit: contain; + } + + .smaller { + height: 40px !important; + } +/* +.container { + position: relative; + width: 100%; + height: 100vh; + scroll-behavior: smooth; + overflow: auto; + scroll-snap-type: y mandatory; + +} +.section { + width: 100%; + height: 100vh; + background-size: cover; + +} */ + /* .section1 { + background: url(../images/pexels-pixabay-236937.jpg); + width: 100%; + height: 500px; + + background-size: 100% auto; on peut utilsé un cover a la place + background-position: center; +} +/* .section:nth-child(2) { + background: url(https://cdn.pixabay.com/photo/2015/06/02/12/59/narrative-794978_960_720.jpg); +} +.section:nth-child(3) { + background: url(https://cdn.pixabay.com/photo/2016/09/08/22/43/books-1655783_960_720.jpg); +} +.section:nth-child(3) { + background: url(https://cdn.pixabay.com/photo/2015/12/19/20/32/paper-1100254_960_720.jpg); +} +.section:nth-child(4) { + background: url(https://cdn.pixabay.com/photo/2016/03/26/22/21/books-1281581_960_720.jpg); +} +.section:nth-child(5) { + background: url(https://cdn.pixabay.com/photo/2014/05/03/00/46/notebook-336634_960_720.jpg); +} */ */ + diff --git a/front/images/1200x680_index.jpg b/front/images/1200x680_index.jpg new file mode 100644 index 0000000..3b44b29 Binary files /dev/null and b/front/images/1200x680_index.jpg differ diff --git a/front/images/768x492_tramway-marseille.jpeg b/front/images/768x492_tramway-marseille.jpeg new file mode 100644 index 0000000..2d10cca Binary files /dev/null and b/front/images/768x492_tramway-marseille.jpeg differ diff --git a/front/images/AWS.png b/front/images/AWS.png new file mode 100644 index 0000000..3325daa Binary files /dev/null and b/front/images/AWS.png differ diff --git "a/front/images/Bouches-du-Rh\342\200\234ne_13_logo.png" "b/front/images/Bouches-du-Rh\342\200\234ne_13_logo.png" new file mode 100644 index 0000000..ffb8c1b Binary files /dev/null and "b/front/images/Bouches-du-Rh\342\200\234ne_13_logo.png" differ diff --git a/front/images/Logo_J-_eco_Recupere.png b/front/images/Logo_J-_eco_Recupere.png new file mode 100644 index 0000000..66cee28 Binary files /dev/null and b/front/images/Logo_J-_eco_Recupere.png differ diff --git a/front/images/Logo_JO_eco_Recupere_Plan_de_travail_1_copie.png b/front/images/Logo_JO_eco_Recupere_Plan_de_travail_1_copie.png new file mode 100644 index 0000000..31e1a7c Binary files /dev/null and b/front/images/Logo_JO_eco_Recupere_Plan_de_travail_1_copie.png differ diff --git a/front/images/Mercedes-Benz_Citaro_C2_-_RTM_Marseille-1024x576-2.jpg b/front/images/Mercedes-Benz_Citaro_C2_-_RTM_Marseille-1024x576-2.jpg new file mode 100644 index 0000000..645b483 Binary files /dev/null and b/front/images/Mercedes-Benz_Citaro_C2_-_RTM_Marseille-1024x576-2.jpg differ diff --git "a/front/images/Voyage_Priv\342\200\232.svg.png" "b/front/images/Voyage_Priv\342\200\232.svg.png" new file mode 100644 index 0000000..1c12ca7 Binary files /dev/null and "b/front/images/Voyage_Priv\342\200\232.svg.png" differ diff --git a/front/images/borne-tri-2021.jpeg b/front/images/borne-tri-2021.jpeg new file mode 100644 index 0000000..9cb8e3f Binary files /dev/null and b/front/images/borne-tri-2021.jpeg differ diff --git a/front/images/carr_6893.jpg b/front/images/carr_6893.jpg new file mode 100644 index 0000000..f129090 Binary files /dev/null and b/front/images/carr_6893.jpg differ diff --git a/front/images/code4marseille.png b/front/images/code4marseille.png new file mode 100644 index 0000000..5d095dc Binary files /dev/null and b/front/images/code4marseille.png differ diff --git a/front/images/d13.png b/front/images/d13.png new file mode 100644 index 0000000..ffb8c1b Binary files /dev/null and b/front/images/d13.png differ diff --git a/front/images/inco.png b/front/images/inco.png new file mode 100644 index 0000000..030c4e3 Binary files /dev/null and b/front/images/inco.png differ diff --git a/front/images/logonoir.png b/front/images/logonoir.png new file mode 100644 index 0000000..b24da91 Binary files /dev/null and b/front/images/logonoir.png differ diff --git a/front/images/pexels-pixabay-236937.jpg b/front/images/pexels-pixabay-236937.jpg new file mode 100644 index 0000000..8ad85c2 Binary files /dev/null and b/front/images/pexels-pixabay-236937.jpg differ diff --git a/front/images/provencetourisme.png b/front/images/provencetourisme.png new file mode 100644 index 0000000..25f8afa Binary files /dev/null and b/front/images/provencetourisme.png differ diff --git a/front/images/voyageprive.png b/front/images/voyageprive.png new file mode 100644 index 0000000..1c12ca7 Binary files /dev/null and b/front/images/voyageprive.png differ diff --git a/front/index.html b/front/index.html index 194caad..ab82cb0 100644 --- a/front/index.html +++ b/front/index.html @@ -1,26 +1,144 @@ -
- - - + + + + -Hello Front Row Viewers!
+ + + + + + + +Face au plus grand défi de l’Humanité, Paris 2024, organisateur du plus grand événement du monde prend ses responsabilités.
+ Les Jeux de Paris 2024 seront inédits, parce que spectaculaires et durables. Grâce à la sobriété, l’innovation et l’audace, nous imaginons de nouvelles façons de faire, et initions une nouvelle ère dans l’organisation des Jeux Olympiques et Paralympiques.
+
Marseille Repondra present !
+Paris 2024 : estime et se donne un objectif d’émissions carbone à ne pas dépasser, dès le début de l’organisation des Jeux, met en place des actions de réduction, mesure l’impact tout au long des Jeux. Les précédents Jeux d’été ont émis 3,5 millions de tonnes de CO2 en moyenne, Paris 2024 a considéré ce point de départ puis identifié des axes d’évitement et de réduction majeurs. Un objectif de 1,5 million de tonnes de CO2 a été défini, il s’agit d’émissions « résiduelles » qui ne pourront pas être évitées et qui seront compensées, et même au-delà, pour une contribution positive pour le climat.
+
+ Chaque été, Marseille voit sa population augmenter significativement. En effet, elle est l’une des destinations touristiques en vogue pour les français comme pour les étrangers et les JO vont venir renforcer ce phénomène. La mobilité va être l’un des points cruciaux de la réussite de cette édition des Jeux Olympiques et les transports marseillais se tient bien évidemment à votre disposition pendant toute la compétition pour vos besoins de déplacement.
+