Wilfrid/Index.html at Main · wilfred0853/Wilfrid · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
<!DOCTYPE html><html lang="fr">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Wilfrid | Site personnel</title>
  <style>
    body {
      margin: 0;
      font-family: Arial, Helvetica, sans-serif;
      background-color: #f5f5f5;
      color: #222;
      line-height: 1.6;
    }
    header {
      background: #0a1a2f;
      color: #fff;
      padding: 40px 20px;
      text-align: center;
    }
    header h1 {
      margin: 0;
      font-size: 2.2em;
    }
    header p {
      margin-top: 10px;
      font-size: 1.1em;
      opacity: 0.9;
    }
    nav {
      background: #fff;
      padding: 10px;
      text-align: center;
      box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    }
    nav a {
      margin: 0 12px;
      text-decoration: none;
      color: #0a1a2f;
      font-weight: bold;
    }
    nav a:hover {
      color: #1abc9c;
    }
    section {
      max-width: 900px;
      margin: auto;
      padding: 40px 20px;
    }
    section h2 {
      color: #0a1a2f;
      margin-bottom: 15px;
    }
    .cards {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      gap: 20px;
    }
    .card {
      background: #fff;
      padding: 20px;
      border-radius: 10px;
      box-shadow: 0 4px 10px rgba(0,0,0,0.08);
    }
    footer {
      background: #0a1a2f;
      color: #fff;
      text-align: center;
      padding: 20px;
      font-size: 0.9em;
    }
  </style>
</head>
<body>  <header>
    <h1>Wilfrid</h1>
    <p>Étudiant en informatique · Passionné de football et de culture</p>
  </header>  <nav>
    <a href="#apropos">À propos</a>
    <a href="#interets">Centres d’intérêt</a>
    <a href="#projets">Projets</a>
    <a href="#contact">Contact</a>
  </nav>  <section id="apropos">
    <h2>À propos</h2>
    <p>
      Je suis Wilfrid, étudiant en informatique. J’aime comprendre, analyser et aller au fond des choses.
      Le football m’a appris la rigueur, la technologie me donne des outils, et la culture élargit ma vision.
    </p>
  </section>  <section id="interets">
    <h2>Centres d’intérêt</h2>
    <div class="cards">
      <div class="card">💻 Informatique & technologies</div>
      <div class="card">⚽ Football & analyse du jeu</div>
      <div class="card">🌍 Cultures & langues</div>
      <div class="card">📚 Lecture & musique</div>
    </div>
  </section>  <section id="projets">
    <h2>Projets</h2>
    <p>
      Cette section accueillera mes projets personnels, analyses et publications.
    </p>
  </section>  <section id="contact">
    <h2>Contact</h2>
    <p>
      Tu peux me contacter via mes réseaux sociaux ou par email.
    </p>
  </section>  <footer>
    © 2026 — Wilfrid · Site personnel
  </footer></body>
</html>