commit 1

2026-06-20 21:43:28 +02:00 · 2023-03-18 21:28:56 +01:00
parent e89c71f443
commit 8590c97e5a
2 changed files with 171 additions and 0 deletions
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html lang="fr">
+<head>
+    <meta charset="UTF-8">
+    <link rel="stylesheet" href="styles.css">
+    <title>Arthur Puechberty</title>
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;500;600;700&amp;display=swap" rel="stylesheet">
+</head>
+<body>
+    <section id="accueil" class="accueil">
+        <img class="profil_img" src="..\images/arthur.png" alt="Photo de profil Arthur">
+        <h1>Arthur</h1>
+        <h2>Une grande passion : la voile ⛵️</h2>
+    </section>
+    <section class="liste_btn">
+        <div classe="btn_1">
+            <a href="https://www.instagram.com/arthur.pbty/" class="btn" target="_blank"><img class="lien_img" src="..\images/logo insta.png" alt="Logo Instagram"><p class="txt_lien">Instagram</p></a>
+        </div>
+        <div classe="btn_2">
+            <a href="https://discord.gg/HxgaA44CPh" class="btn" target="_blank"><img class="lien_img" src="..\images/Logo Discord.png" alt="Logo Discord"><p class="txt_lien">Discord</p></a>
+        </div>
+        <div classe="btn_3">
+            <a href="https://twitter.com/arthur_pbty" class="btn" target="_blank"><img class="lien_img" src="..\images/logo twitter.png" alt="Logo Twitter"><p class="txt_lien">Twitter</p></a>
+        </div>
+        <div classe="btn_4">
+            <a href="https://www.youtube.com/channel/UCILN2CPA-wPbBUFkgqVCb9A" class="btn" target="_blank"><img class="lien_img" src="..\images/Logo YouTube.png" alt="Logo YouTube"><p class="txt_lien">YouTube</p></a>
+        </div>
+        <div classe="btn_5">
+            <a href="https://www.facebook.com/profile.php?id=100081982581492" class="btn" target="_blank"><img class="lien_img" src="..\images/Logo Facebook.png" alt="Logo Facebook"><p class="txt_lien">Facebook</p></a>
+        </div>
+        <div classe="btn_6">
+            <a href="https://www.twitch.tv/tuturp33" class="btn" target="_blank"><img class="lien_img" src="..\images/Twitch logo.png" alt="Logo Twitch"><p class="txt_lien">Twitch</p></a>
+        </div>
+        <div classe="btn_7">
+            <a href="https://github.com/TuturP33" class="btn" target="_blank"><img class="lien_img" src="..\images/logo github.png" alt="Logo Github"><p class="txt_lien">Github</p></a>
+        </div>
+        <div classe="btn_8">
+            <a href="https://fr.namemc.com/profile/TuturP33.1" class="btn" target="_blank"><img class="lien_img" src="..\images/Logo Minecraft.png" alt="Logo Minecraft"><p class="txt_lien">Minecraft</p></a>
+        </div>
+    </section>
+    <footer class="footer">
+        <span class="copyrights">&copy; 2022 - Arthur Puechberty</span>
+        <a href="../condition generale/condition_generale.html" class="conditions_generale" target="_blank">Condition générales</a>
+    </footer>
+</body>
+</html>
@@ -0,0 +1,125 @@
+@import url("https://fonts.googleapis.com/css?family=Montserrat:700");
+
+.btn {
+    color: white;
+    font-weight: bold;
+    font-size: 1em;
+    text-decoration: none;
+    text-transform: uppercase;
+    padding: 4px;
+    background-color: #222222;
+    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;
+    font-family: 'Inter', sans-serif;
+    border-radius: 10px;
+}
+.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;
+    padding-right: 48px;
+}
+
+*{
+    margin: 0;
+    padding: 0;
+    scroll-behavior: smooth;
+}
+
+body{
+    background-color: black;
+}
+
+section{
+    display: flex;
+    flex-direction: column;
+    -webkit-box-pack: justify;
+    justify-content: space-between;
+}
+
+div{
+    padding: 8px;
+}
+
+.accueil{
+    -webkit-box-align: center;
+    align-items: center;
+    padding: 64px 16px 32px;
+}
+
+.profil_img{
+    border-radius: 50%;
+    width : 100px;
+    height : 100px;
+}
+
+h1{
+    font-family: 'Inter', sans-serif;
+    font-weight: 900;
+    color: rgb(255, 255, 255);
+    font-size: 20px;
+    margin-left: 12px;
+    margin-right: 12px;
+    max-width: 100%;
+    margin-top: 15px;
+}
+
+h2{
+    font-family: 'Inter', sans-serif;
+    font-weight: 900;
+    color: rgba(255, 255, 255, 0.6);
+    font-size: 16px;
+    padding-left: 40px;
+    padding-right: 40px;
+    margin-top: 8px;
+}
+
+.liste_btn{
+    margin: 0px auto;
+    max-width: 680px;
+}
+
+.lien_img{
+    width : 48px;
+    height : 48px;
+    border-radius: 9px;
+}
+
+.footer{
+    font-family: "Montserrat", sans-serif;
+    min-height: 100px;
+    display: flex;
+    align-items: center;
+    margin-top: 50px;
+    justify-content: space-between;
+    padding: 0 100px;
+    flex-wrap: wrap;
+    background-color: rgb(50, 50, 50);
+}
+
+.copyrights{
+    padding-right: 20px;
+    color: white;
+}
+
+.conditions_generale{
+    text-decoration: none;
+    font-weight: 600;
+    color: white;
+}