arthur/site_EMC
1
0
Fork 0
mirror of https://github.com/arthur-pbty/site_EMC.git synced 2026-06-03 15:07:38 +02:00
Code Issues Packages Projects Releases Wiki Activity

Add files via upload

Browse Source
This commit is contained in:
TuturP33
2023-03-19 02:13:17 +01:00
committed by GitHub
parent 0d3d0ee389
commit dcc948f56d
11 changed files with 463 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
condition generales.html
+66
View File
@@ -0,0 +1,66 @@
<!DOCTYPE html>
<html>
<head>
<title>Conditions générales</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="styles CGU.css">
</head>
<body>
<header>
<h1>Conditions générales</h1>
<p>L'utilisation des réseaux sociaux est devenue une partie intégrante de notre vie quotidienne, et avec cette utilisation accrue vient la nécessité de comprendre les règles et les limites qui régissent cette interaction en ligne. Cette page de conditions générales vise à énoncer les règles d'utilisation de ce site en ce qui concerne la liberté d'expression sur les réseaux sociaux. En naviguant sur ce site, vous acceptez les termes et les conditions énoncés ci-dessous.</p>
</header>
<main>
<section>
<h2>Règles générales d'utilisation</h2>
<p>Notre site Web s'engage à promouvoir la liberté d'expression sur les réseaux sociaux, mais cela ne signifie pas que nous tolérons la diffusion de messages haineux, violents, discriminatoires ou qui violent les droits d'autrui. Nous nous réservons le droit de supprimer tout contenu qui viole ces règles ou qui est contraire aux lois applicables. Nous nous engageons également à protéger les données de nos utilisateurs et à respecter leur vie privée. Nous ne vendrons ni ne partagerons vos données à des tiers sans votre consentement explicite.</p>
</section>
<section>
<h2>Responsabilités de l'utilisateur</h2>
<p>Tout utilisateur de ce site est responsable du contenu qu'il publie et de l'interaction qu'il a avec les autres utilisateurs. Nous encourageons une discussion respectueuse et constructive sur notre site et nous nous réservons le droit de supprimer tout contenu ou commentaire qui viole ces règles. En utilisant ce site, vous acceptez de ne pas publier de contenu qui soit diffamatoire, offensant, violent, discriminatoire ou qui enfreigne les droits d'autrui. Vous acceptez également de respecter les lois applicables en matière de propriété intellectuelle et de droits d'auteur. Si vous rencontrez un comportement inapproprié ou suspectez une activité illégale sur notre site, nous vous encourageons à nous en informer immédiatement.</p>
</section>
<section>
<h2>Restrictions d'utilisation</h2>
<p>Tous les contenus publiés sur ce site, y compris mais sans s'y limiter, les textes, les images, les vidéos, les graphiques, les logos et les marques de commerce, sont protégés par les lois applicables en matière de propriété intellectuelle et de droits d'auteur. Vous n'êtes pas autorisé à reproduire, distribuer, modifier ou utiliser ces contenus à des fins commerciales sans notre consentement écrit préalable. Tout usage non autorisé de ces contenus peut entraîner des poursuites judiciaires.</p>
<p>En utilisant ce site, vous acceptez également de ne pas violer les lois applicables en matière de propriété intellectuelle, de droits d'auteur et de protection des données. Nous nous réservons le droit de supprimer tout contenu ou utilisateur qui enfreint ces règles.</p>
</section>
<section>
<h2>Confidentialité des données</h2>
<p>Nous nous engageons à protéger les données de nos utilisateurs et à respecter leur vie privée. Nous collectons des données d'utilisation non personnelles, telles que des données de trafic et des informations sur les pages visitées, pour améliorer la qualité de notre site et de nos services. Nous pouvons également collecter des informations personnelles, telles que des noms et des adresses électroniques, lorsque vous vous inscrivez à notre site ou que vous nous contactez par courrier électronique.</p>
<p>Nous ne vendrons ni ne partagerons vos données à des tiers sans votre consentement explicite, sauf si la loi nous y oblige ou si cela est nécessaire pour protéger nos droits ou les droits de nos utilisateurs. Nous utilisons des mesures de sécurité appropriées pour protéger vos données contre l'accès non autorisé ou la divulgation.</p>
</section>
<section>
<h2>Résolution de conflits</h2>
<p>Nous sommes engagés à fournir une expérience utilisateur positive sur notre site, et nous nous efforçons de résoudre tous les différends de manière amiable et équitable. En cas de désaccord entre l'utilisateur et le site, nous encourageons les parties à communiquer directement pour tenter de résoudre le différend de manière informelle.</p>
<p>Si une résolution informelle n'est pas possible, nous pouvons recourir à la médiation ou à l'arbitrage pour résoudre le différend conformément aux lois applicables. Tout litige ou réclamation découlant de l'utilisation de notre site sera soumis à la juridiction compétente dans l'État ou le pays où notre entreprise est enregistrée.</p>
</section>
<section>
<h2>Contact</h2>
<p>Utilisez le formulaire ci-dessous pour poser des questions ou signaler des problèmes</p>
<form action="contact.php" method="post">
<label for="name">Nom :</label>
<input type="text" id="name" name="user_name" required>
<label for="email">Email :</label>
<input type="email" id="email" name="user_email" required>
<label for="message">Message :</label>
<textarea id="message" name="user_message" required></textarea>
<input type="submit" value="Envoyer">
</form>
</section>
</main>
<footer id="footer" class="footer">
<span class="copyrights">&copy; 2023 - Arthur Puechberty - Kieran Vilain - Nathan Toubiana</span>
<a href="condition generales.html" target="_top" class="conditions_generale">Conditions générales</a>
</footer>
</body>
</html>
contact.html
+13
View File
@@ -0,0 +1,13 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="styles contact.css">
<title>Erreur</title>
</head>
<body>
<h1>Désoler une erreur c'est produite !</h1>
<p>Le système de message n'a pas encore était mis en place désoler.</p>
<a href="index.html">Revenir sur le site</a>
</body>
</html>
images/app téléphone.jpg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 48 KiB

images/carte.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 187 KiB

images/img développement réseaux.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 10 KiB

images/img exemple de liberter.jpeg
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 536 KiB

index.html
+118
View File
@@ -0,0 +1,118 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="styles.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
<script src="scripts/main.js"></script>
<title>EMC</title>
</head>
<body>
<section class="header">
<div class="div_big_title" id="id_div_big_title">
<h1 class="big_title">La liberté d'expression sur les réseaux sociaux</h1>
<h2 class="sous_big_title">Y'a t-il une plus grande liberté d'expression sur les réseaux sociaux ?</h2>
</div>
<div class="div_btn">
<a href="#" class="btn"><p class="txt_lien">Accueil</p></a>
<a href="#1" class="btn"><p class="txt_lien">Définitions</p></a>
<a href="#2" class="btn"><p class="txt_lien">Développement</p></a>
<a href="#3" class="btn"><p class="txt_lien">Exemples</p></a>
<a href="#carte" class="btn"><p class="txt_lien">Carte</p></a>
<a href="#contact" class="btn"><p class="txt_lien">Me contacter</p></a>
</div>
<div class="div_btn_2">
<a href="#" class="btn"><p class="txt_lien">Accueil</p></a>
<a href="#1" class="btn"><p class="txt_lien">Définitions</p></a>
<a href="#2" class="btn"><p class="txt_lien">Développement</p></a>
<a href="#3" class="btn"><p class="txt_lien">Exemples</p></a>
<a href="#carte" class="btn"><p class="txt_lien">Carte</p></a>
<a href="#contact" class="btn"><p class="txt_lien">Me contacter</p></a>
</div>
</section>
<section class="sous_title" id="1">
<h2>Quelques définitions qui vont vous servir !</h2>
</section>
<section class="corps">
<div class="inter_corps">
<img src="images/app téléphone.jpg" alt="Image d'application sur un téléphone" class="img_1">
<div class="definition">
<div class="def_pv1_1">
<p><b> - <span style="text-decoration: underline;">Réseaux sociaux</span> : </b> Un réseau social est un environnement numérique qui peut être un site et où une application qui permet de communiquer, partager, rencontrer des gens... Tout ça sous le respect des CGU</p>
</div>
<div class="def_pv1_2">
<b> - <span style="text-decoration: underline;">CGU</span> : </b> Condition générales d'utilisation elle serve à définir les règles du réseau. Actuellement il n'existe aucune législation spécifique au réseau sociaux, cependant ils sont considéré comme des espace public.</p>
</div>
<div class="def_pv1_3">
<b> - <span style="text-decoration: underline;">liberté d'expression</span> : </b> Tout citoyen à le droit de s'exprimer librement de la manière qu'il souhaite tant qu'il ne néglige aucune lois écrite dans la constitution.</p>
</div>
</div>
</div>
</section>
<section class="sous_title" id="2">
<h2>Développement !</h2>
</section>
<section class="corps">
<div class="inter_corps">
<img src="images/img développement réseaux.png" alt="Image de développement sur les réseaux" class="img_2">
<div classe="paver">
<p class="id2_pv1">La liberté d'expression est un droit fondamental qui permet à chaque individu d'exprimer ses opinions, ses idées et ses pensées sans être censuré ou réprimandé. Avec l'avènement des réseaux sociaux, il est devenu plus facile que jamais pour les gens de s'exprimer publiquement et de partager leurs points de vue avec le monde entier.</p>
<p class="id2_pv2">En théorie, les réseaux sociaux offrent une plus grande liberté d'expression que les canaux de communication traditionnels tels que les journaux, les magazines ou la télévision. Tout le monde peut créer un compte et publier du contenu, qu'il s'agisse de textes, de photos, de vidéos ou de commentaires. Les réseaux sociaux permettent également aux gens de se connecter avec des personnes partageant les mêmes idées, de former des communautés et de participer à des débats en ligne.</p>
<p class="id2_pv3">Cependant, cette liberté d'expression sur les réseaux sociaux n'est pas absolue. Les plateformes ont des règles de modération pour limiter les contenus abusifs ou illégaux, comme la haine, la violence, le harcèlement ou la diffamation. Ces règles sont souvent critiquées pour être opaques ou biaisées, et pour entraîner une censure injustifiée de certains contenus.</p>
<p class="id2_pv4">De plus, la liberté d'expression sur les réseaux sociaux peut être limitée par des facteurs externes tels que la pression sociale, les trolls, les bots et les fake news. Les gens peuvent être intimidés ou harcelés pour avoir exprimé leur opinion, ou être victimes de campagnes de désinformation visant à discréditer leurs points de vue.</p>
<p class="id2_pv5">En fin de compte, la liberté d'expression sur les réseaux sociaux est un sujet complexe et controversé. Bien que les réseaux sociaux offrent un espace pour l'expression libre, cette liberté peut être compromise par des règles de modération, des pressions externes et des comportements abusifs. Il est important pour les utilisateurs de prendre des précautions lorsqu'ils s'expriment en ligne et de respecter les règles de chaque plateforme, tout en défendant leur droit à exprimer leurs opinions.</p>
</div>
</div>
</section>
<section class="sous_title" id="3">
<h2>Des exemples...</h2>
</section>
<section class="corps">
<div class="inter_corps">
<img src="images/img exemple de liberter.jpeg" alt="Image d'exemple de liberter" class="img_3">
<div classe="paver">
<p>Le zirconium fascine les chèvres qui ont soif de justice. Les brocolis se méfient des coquelicots car ils sont connus pour être fous. Les chaussettes en laine ont toujours été considérées comme le symbole ultime de la procrastination, tandis que les souliers en cuir sont souvent utilisés pour tromper les ennemis. Les girafes préfèrent les chapeaux à larges bords car ils leur permettent de se protéger du soleil, tandis que les pandas sont obsédés par les paillettes.</p>
<p>Les alligators aiment manger des pissenlits pour le petit-déjeuner, et les bananes sont utilisées comme monnaie dans le monde souterrain des fourmis. Les fraises sont souvent utilisées comme projectiles lors des batailles de polochons, et les aubergines sont souvent confondues avec des grenades.</p>
<p>Les hippopotames ont des conversations philosophiques sur la signification de la vie, tandis que les dauphins organisent des soirées karaoké sous-marines. Les citrouilles se transforment en carrosses magiques la nuit d'Halloween, et les étoiles filantes sont en fait des navires spatiaux extraterrestres en visite sur Terre.</p>
<p>Les abeilles adorent les bavoirs en dentelle, et les hiboux ont une obsession pour les chapeaux melons. Les pingouins ont une passion pour les puzzles en 3D, et les éléphants jouent du piano pour se détendre.</p>
<p>En fin de compte, il est clair que le monde est rempli de mystères et d'étrangetés, et que la vie est beaucoup plus intéressante lorsque l'on s'ouvre à toutes les possibilités.</p>
</div>
</div>
</section>
<section class="sous_title" id="carte">
<h2>Carte</h2>
</section>
<section class="corps">
<div class="inter_corps">
<img src="images/carte.png" alt="Image d'une carte de la liberté d'expression sur internet" class="img_carte">
</div>
</section>
<section class="sous_title" id="contact">
<h2>Me contacter</h2>
</section>
<section class="corps">
<div class="inter_corps_contact">
<h2>Contact</h2>
<p class="p_contact">Utilisez le formulaire ci-dessous pour poser des questions ou signaler des problèmes</p>
<form action="contact.html" method="post">
<label for="name">Nom :</label>
<input type="text" id="name" name="user_name" required>
<label for="email">Email :</label>
<input type="email" id="email" name="user_email" required>
<label for="message">Message :</label>
<textarea id="message" name="user_message" required></textarea>
<input type="submit" value="Envoyer">
</form>
</div>
</section>
<footer id="footer" class="footer">
<span class="copyrights">&copy; 2023 - Arthur Puechberty - Kieran Vilain - Nathan Toubiana</span>
<a href="condition generales.html" target="_blank" class="conditions_generale">Conditions générales</a>
</footer>
</body>
</html>
scripts/main.js
+11
View File
@@ -0,0 +1,11 @@
$(function() {
$('.div_btn').hide();
});
$(window).scroll(function(){
posScroll = $(document).scrollTop();
if(posScroll >=id_div_big_title.clientHeight)
$('.div_btn').show();
else
$('.div_btn').hide();
});
styles CGU.css
+63
View File
@@ -0,0 +1,63 @@
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
header {
background-color: #333;
color: #fff;
padding: 20px 150px;
text-align: center;
}
main {
max-width: 800px;
margin: 0 auto;
padding: 20px;
}
section {
margin-bottom: 30px;
}
h1, h2 {
margin-top: 0;
}
form {
display: flex;
flex-direction: column;
}
label {
margin-bottom: 5px;
}
input[type="text"], input[type="email"], textarea {
margin-bottom: 10px;
padding: 10px;
border: 1px solid #ccc;
}
.footer{
min-height: 100px;
display: flex;
align-items: center;
margin-top: 50px;
justify-content: space-between;
padding: 0 100px;
flex-wrap: wrap;
background-color: rgb(51, 50, 58);
}
.copyrights{
padding-right: 20px;
color: white;
}
.conditions_generale{
text-decoration: none;
font-weight: 600;
color: white;
}
styles contact.css
+3
View File
@@ -0,0 +1,3 @@
body{
text-align: center;
}
styles.css
+189
View File
@@ -0,0 +1,189 @@
@import url("https://fonts.googleapis.com/css?family=Montserrat:700");
*{
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Inter', sans-serif;
scroll-behavior: smooth;
}
body{
background-color: rgb(240, 240, 240);
}
.btn {
color: white;
font-weight: bold;
font-size: 1em;
text-decoration: none;
text-transform: uppercase;
padding: 10px;
background-color: gray;
transition: transform 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55), background-position 800ms cubic-bezier(0.68, -0.55, 0.265, 1.55), box-shadow 500ms linear;
background-image: url('data:image/svg+xml;utf8,<?xml version="1.0" encoding="utf-8"?><svg version="1.1" id="Livello_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="1296px" height="768px" viewBox="0 0 1296 768" enable-background="new 0 0 1296 768" xml:space="preserve"><g><polygon fill="#8694D1" points="766.6,1.2 -0.2,768 200.7,768 967.5,1.2 "/></g><g><polygon fill="#8694D1" points="1094.8,1.2 328,768 528.9,768 1295.7,1.2 "/></g></svg>');
background-size: contain;
background-position: -200px center;
background-repeat: no-repeat;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
display: flex;
align-items: center;
width: 100%;
}
.btn:hover {
transform: scale(1.04);
background-position: -60px;
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
}
.btn:active {
transform: scale(0.5);
background-position: 500px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}
.txt_lien{
width : 100%;
text-align: center;
}
.header{
align-items: center;
display: flex;
flex-direction: column;
background-color: white;
}
.div_big_title{
padding: 40px;
text-align: center;
}
.big_title{
font-weight: 900;
color: black;
font-size: 40px;
}
.sous_big_title{
font-size: 20px;
}
.div_btn{
display: flex;
flex-direction: row;
align-items: center;
width: 100%;
position: fixed;
}
.div_btn_2{
display: flex;
flex-direction: row;
align-items: center;
width: 100%;
}
.sous_title{
font-weight: 900;
color: black;
font-size: 17px;
text-align: center;
padding: 25px;
}
.corps{
margin: 0px 150px 0px;
background-color: white;
box-shadow: 0px 0px 10px 1px gray;
}
.inter_corps,
.inter_corps_contact{
padding: 15px;
}
.def_pv1_1,
.def_pv1_2{
padding: 0 0 25px;
}
.img_1,
.img_3{
width : 30%;
border: none;
float: right;
border-radius: 25% 10% 25% 15%;
padding: 0 0 15px 15px;
}
.img_2{
width : 30%;
border: none;
float: left;
border-radius: 10% 25% 15% 25%;
padding: 0 15px 15px 0;
}
.id2_pv1,
.id2_pv2,
.id2_pv3,
.id2_pv4{
padding: 0 0 25px;
}
.img_carte{
width : 100%;
border: none;
border-radius: 5% / 10%;
}
.clear{
clear:both
}
.inter_corps_contact{
margin-bottom: 30px;
}
.p_contact{
padding: 10px 0 10px 0;
}
form {
display: flex;
flex-direction: column;
}
label {
margin-bottom: 5px;
}
input[type="text"], input[type="email"], textarea {
margin-bottom: 10px;
padding: 10px;
border: 1px solid #ccc;
}
.footer{
min-height: 100px;
display: flex;
align-items: center;
margin-top: 50px;
justify-content: space-between;
padding: 0 100px;
flex-wrap: wrap;
background-color: rgb(51, 50, 58);
}
.copyrights{
padding-right: 20px;
color: white;
}
.conditions_generale{
text-decoration: none;
font-weight: 600;
color: white;
}