stephane.liabeuf/cv-web-liabeuf
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
cv-web-liabeuf/index.html

524 lines
36 KiB
HTML
Raw Normal View History

Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
cyberpunk version
2026-03-30 02:00:45 +00:00
<title>LIABEUF_STÉPHANE // CV.EXE</title>
Fixing
2026-03-30 07:39:44 +00:00
<link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=Share+Tech+Mono&family=Rajdhani:wght@300;400;600;700&display=swap" rel="stylesheet">
<link href="https://fonts.bunny.net/css2?family=orbitron:wght@400;700;900&family=share-tech-mono&family=rajdhani:wght@300;400;600;700&display=swap" rel="stylesheet">
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
Fixing
2026-03-30 07:39:44 +00:00
:root {
--bg: #050810;
--bg2: #080d1a;
--cyan: #00f5ff;
--magenta: #ff00aa;
--green: #00ff88;
--text: #c8d8e8;
--muted: #4a6080;
--grid: rgba(0,245,255,0.04);
New CV version
2026-03-30 08:44:31 +00:00
--font-mono: 'Share Tech Mono', 'Courier New', Courier, monospace;
--font-display: 'Orbitron', 'Arial Black', Impact, sans-serif;
--font-body: 'Rajdhani', 'Segoe UI', Arial, sans-serif;
Fixing
2026-03-30 07:39:44 +00:00
}
html { scroll-behavior: smooth; }
body {
New CV version
2026-03-30 08:44:31 +00:00
font-family: var(--font-body);
Fixing
2026-03-30 07:39:44 +00:00
background: var(--bg);
color: var(--text);
overflow-x: hidden;
cursor: crosshair;
}
body::before {
content: '';
New CV version
2026-03-30 08:44:31 +00:00
position: fixed; inset: 0;
background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,0,0,0.13) 2px, rgba(0,0,0,0.13) 4px);
pointer-events: none; z-index: 9999;
Fixing
2026-03-30 07:39:44 +00:00
}
body::after {
content: '';
New CV version
2026-03-30 08:44:31 +00:00
position: fixed; inset: 0;
background-image: linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);
Fixing
2026-03-30 07:39:44 +00:00
background-size: 40px 40px;
New CV version
2026-03-30 08:44:31 +00:00
pointer-events: none; z-index: 0;
Fixing
2026-03-30 07:39:44 +00:00
}
New CV version
2026-03-30 08:44:31 +00:00
.glitch { position: relative; }
.glitch::before, .glitch::after { content: attr(data-text); position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.glitch::before { color: var(--magenta); animation: glitch1 4s infinite; clip-path: polygon(0 0, 100% 0, 100% 35%, 0 35%); }
.glitch::after { color: var(--cyan); animation: glitch2 4s infinite; clip-path: polygon(0 65%, 100% 65%, 100% 100%, 0 100%); }
@keyframes glitch1 { 0%,90%,100%{transform:none;opacity:1}91%{transform:translate(-3px,1px);opacity:.8}93%{transform:translate(3px,-1px);opacity:.8}95%{transform:translate(-2px,2px);opacity:.8} }
@keyframes glitch2 { 0%,90%,100%{transform:none;opacity:1}92%{transform:translate(3px,2px);opacity:.8}94%{transform:translate(-3px,-1px);opacity:.8}96%{transform:translate(2px,-2px);opacity:.8} }
@keyframes flicker { 0%,95%,100%{opacity:1}96%{opacity:.85}97%{opacity:1}98%{opacity:.7}99%{opacity:1} }
@keyframes fadeIn { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:none} }
@keyframes pulse { 0%,100%{opacity:.4}50%{opacity:1} }
Fixing
2026-03-30 07:39:44 +00:00
/* ── HERO ── */
.hero {
New CV version
2026-03-30 08:44:31 +00:00
position: relative; min-height: 100vh;
display: flex; flex-direction: column; justify-content: center;
padding: 80px; z-index: 1; overflow: hidden;
animation: flicker 9s infinite;
Fixing
2026-03-30 07:39:44 +00:00
}
.hero-bg {
New CV version
2026-03-30 08:44:31 +00:00
position: absolute; inset: 0;
background: radial-gradient(ellipse 60% 80% at 80% 50%, rgba(0,245,255,0.06) 0%, transparent 70%),
radial-gradient(ellipse 40% 60% at 10% 80%, rgba(255,0,170,0.08) 0%, transparent 60%);
Fixing
2026-03-30 07:39:44 +00:00
z-index: 0;
}
New CV version
2026-03-30 08:44:31 +00:00
.corner-bracket { position: absolute; width: 24px; height: 24px; z-index: 2; }
.corner-bracket.tl { top:20px; left:60px; border-top:2px solid var(--cyan); border-left:2px solid var(--cyan); }
.corner-bracket.tr { top:20px; right:60px; border-top:2px solid var(--cyan); border-right:2px solid var(--cyan); }
.corner-bracket.bl { bottom:20px; left:60px; border-bottom:2px solid var(--cyan); border-left:2px solid var(--cyan); }
.corner-bracket.br { bottom:20px; right:60px; border-bottom:2px solid var(--cyan); border-right:2px solid var(--cyan); }
.hero-corner { position: absolute; font-family: var(--font-mono); font-size: 11px; color: var(--muted); z-index: 2; }
.hero-corner.tl { top:32px; left:80px; }
.hero-corner.tr { top:32px; right:80px; text-align:right; }
.hero-corner.bl { bottom:32px; left:80px; }
.hero-corner.br { bottom:32px; right:80px; text-align:right; }
.hero-id { position:relative; z-index:2; font-family:var(--font-mono); font-size:12px; color:var(--cyan); letter-spacing:.3em; margin-bottom:20px; opacity:0; animation:fadeIn .5s ease .3s forwards; }
Fixing
2026-03-30 07:39:44 +00:00
.hero-id span { color: var(--magenta); }
New CV version
2026-03-30 08:44:31 +00:00
.hero-name { position:relative; z-index:2; font-family:var(--font-display); font-size:clamp(48px,8vw,110px); font-weight:900; line-height:.9; color:#fff; text-transform:uppercase; letter-spacing:-.02em; opacity:0; animation:fadeIn .6s ease .5s forwards; }
.hero-name .line2 { display:block; color:transparent; -webkit-text-stroke:1px var(--cyan); text-shadow:0 0 30px rgba(0,245,255,.4); }
.hero-subtitle { position:relative; z-index:2; margin-top:24px; font-family:var(--font-mono); font-size:13px; color:var(--magenta); letter-spacing:.2em; opacity:0; animation:fadeIn .6s ease .7s forwards; }
.hero-subtitle::before { content:'> '; color:var(--green); }
.hero-stats { position:relative; z-index:2; display:flex; gap:20px; margin-top:52px; flex-wrap:wrap; opacity:0; animation:fadeIn .6s ease .9s forwards; }
.stat-box { border:1px solid rgba(0,245,255,.25); padding:14px 22px; background:rgba(0,245,255,.03); clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px)); }
.stat-num { font-family:var(--font-display); font-size:32px; font-weight:700; color:var(--cyan); display:block; text-shadow:0 0 20px rgba(0,245,255,.6); }
.stat-label { font-family:var(--font-mono); font-size:10px; letter-spacing:.15em; color:var(--muted); text-transform:uppercase; }
.hero-scroll { position:absolute; bottom:48px; left:50%; transform:translateX(-50%); z-index:2; font-family:var(--font-mono); font-size:10px; letter-spacing:.2em; color:var(--muted); animation:pulse 2s ease infinite; }
Fixing
2026-03-30 07:39:44 +00:00
/* ── NAV ── */
New CV version
2026-03-30 08:44:31 +00:00
nav { position:sticky; top:0; z-index:100; background:rgba(5,8,16,.95); backdrop-filter:blur(16px); border-bottom:1px solid rgba(0,245,255,.15); display:flex; align-items:center; padding:0 48px; }
.nav-logo { font-family:var(--font-display); font-size:12px; font-weight:700; color:var(--cyan); letter-spacing:.2em; margin-right:auto; text-shadow:0 0 10px rgba(0,245,255,.5); }
nav a { font-family:var(--font-mono); font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); text-decoration:none; padding:18px 20px; transition:color .2s; position:relative; }
nav a::before { content:'//'; color:var(--magenta); margin-right:6px; opacity:0; transition:opacity .2s; }
nav a:hover { color:var(--cyan); }
nav a:hover::before { opacity:1; }
Fixing
2026-03-30 07:39:44 +00:00
/* ── SECTIONS ── */
New CV version
2026-03-30 08:44:31 +00:00
section { position:relative; z-index:1; padding:100px 80px; opacity:0; transform:translateY(20px); transition:opacity .6s ease,transform .6s ease; }
section.visible { opacity:1; transform:none; }
.section-header { margin-bottom:52px; }
.section-id { font-family:var(--font-mono); font-size:11px; color:var(--magenta); letter-spacing:.3em; margin-bottom:12px; }
.section-title { font-family:var(--font-display); font-size:clamp(28px,4vw,48px); font-weight:700; color:#fff; text-transform:uppercase; letter-spacing:.05em; display:inline-block; }
.section-title::after { content:''; display:block; margin-top:12px; height:2px; background:linear-gradient(90deg,var(--cyan),var(--magenta),transparent); }
/* ── EXP ── */
#experience { background:var(--bg); }
.exp-group { margin-bottom:40px; }
.exp-group-label { font-family:var(--font-mono); font-size:10px; letter-spacing:.25em; text-transform:uppercase; color:var(--bg); background:var(--cyan); display:inline-block; padding:3px 14px; margin-bottom:1px; }
.exp-group-label.mag { background:var(--magenta); }
.exp-item { display:grid; grid-template-columns:220px 1fr; border-top:1px solid rgba(0,245,255,.08); border-left:2px solid rgba(0,245,255,.12); padding:28px 0 28px 24px; margin-bottom:2px; position:relative; transition:border-color .2s,background .2s; }
.exp-item:hover { border-left-color:var(--cyan); background:rgba(0,245,255,.015); }
.exp-left { padding-right:28px; padding-top:2px; }
.exp-period { font-family:var(--font-mono); font-size:11px; color:var(--cyan); letter-spacing:.1em; margin-bottom:6px; }
.exp-co { font-family:var(--font-mono); font-size:10px; color:var(--muted); letter-spacing:.1em; text-transform:uppercase; line-height:1.5; }
.exp-role { font-family:var(--font-display); font-size:14px; font-weight:700; color:#fff; margin-bottom:4px; text-transform:uppercase; letter-spacing:.04em; line-height:1.3; }
.exp-program { font-family:var(--font-mono); font-size:11px; color:var(--magenta); letter-spacing:.1em; margin-bottom:10px; }
.exp-objective { font-family:var(--font-mono); font-size:11px; color:var(--muted); border-left:2px solid rgba(0,245,255,.2); padding-left:10px; margin-bottom:10px; line-height:1.6; }
.exp-objective strong { color:var(--cyan); }
.exp-desc { font-size:14px; color:#7a9ab8; line-height:1.7; max-width:640px; }
.exp-results { margin-top:12px; padding:12px 16px; border:1px solid rgba(0,255,136,.2); background:rgba(0,255,136,.03); clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,0 100%); }
.exp-results-title { font-family:var(--font-mono); font-size:10px; color:var(--green); letter-spacing:.2em; margin-bottom:6px; }
.exp-results ul { list-style:none; }
.exp-results ul li { font-size:13px; color:#8abba0; padding:2px 0; }
.exp-results ul li::before { content:'+ '; color:var(--green); }
.exp-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.exp-tag { font-family:var(--font-mono); font-size:10px; letter-spacing:.08em; color:var(--cyan); border:1px solid rgba(0,245,255,.3); padding:3px 10px; text-transform:uppercase; clip-path:polygon(6px 0,100% 0,calc(100% - 6px) 100%,0 100%); background:rgba(0,245,255,.05); }
.exp-tag.mag { color:var(--magenta); border-color:rgba(255,0,170,.3); background:rgba(255,0,170,.05); }
.exp-tag.grn { color:var(--green); border-color:rgba(0,255,136,.3); background:rgba(0,255,136,.05); }
Fixing
2026-03-30 07:39:44 +00:00
/* ── SKILLS ── */
New CV version
2026-03-30 08:44:31 +00:00
#competences { background:var(--bg2); }
.skills-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.skill-panel { border:1px solid rgba(0,245,255,.12); padding:28px; background:rgba(0,245,255,.02); position:relative; clip-path:polygon(0 0,calc(100% - 16px) 0,100% 16px,100% 100%,0 100%); }
.skill-panel::before { content:''; position:absolute; top:0; right:0; width:0; height:0; border-top:16px solid rgba(0,245,255,.3); border-left:16px solid transparent; }
.skill-panel-title { font-family:var(--font-display); font-size:11px; font-weight:700; color:var(--magenta); letter-spacing:.2em; text-transform:uppercase; margin-bottom:24px; padding-bottom:12px; border-bottom:1px solid rgba(255,0,170,.2); }
.skill-row { margin-bottom:16px; }
.skill-info { display:flex; justify-content:space-between; margin-bottom:6px; }
.skill-name { font-family:var(--font-body); font-size:13px; font-weight:600; color:var(--text); letter-spacing:.05em; }
.skill-meta { font-family:var(--font-mono); font-size:10px; color:var(--muted); }
.skill-bar { height:3px; background:rgba(255,255,255,.06); }
.skill-fill { height:100%; width:0; background:linear-gradient(90deg,var(--cyan),var(--green)); box-shadow:0 0 8px var(--cyan); transition:width 1.4s cubic-bezier(.4,0,.2,1); position:relative; }
.skill-fill::after { content:''; position:absolute; right:-1px; top:-3px; width:2px; height:9px; background:#fff; box-shadow:0 0 6px var(--cyan); }
Fixing
2026-03-30 07:39:44 +00:00
/* ── SECTORS ── */
New CV version
2026-03-30 08:44:31 +00:00
#secteurs { background:var(--bg); }
.sectors-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:2px; }
.sector-cell { border:1px solid rgba(0,245,255,.08); padding:16px 18px; font-family:var(--font-body); font-size:13px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); transition:all .2s; cursor:default; }
.sector-cell::before { content:'◈'; margin-right:8px; color:var(--magenta); font-size:9px; }
.sector-cell:hover { color:var(--cyan); border-color:rgba(0,245,255,.4); background:rgba(0,245,255,.03); }
Fixing
2026-03-30 07:39:44 +00:00
/* ── FORMATION ── */
New CV version
2026-03-30 08:44:31 +00:00
#formation { background:var(--bg2); }
.edu-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-bottom:48px; }
.edu-card { border:1px solid rgba(0,245,255,.15); padding:32px; background:rgba(0,245,255,.03); position:relative; clip-path:polygon(0 0,calc(100% - 20px) 0,100% 20px,100% 100%,0 100%); }
.edu-card::before { content:''; position:absolute; top:0; right:0; width:0; height:0; border-top:20px solid rgba(0,245,255,.4); border-left:20px solid transparent; }
.edu-year { font-family:var(--font-mono); font-size:11px; color:var(--magenta); letter-spacing:.2em; margin-bottom:12px; }
.edu-degree { font-family:var(--font-display); font-size:16px; font-weight:700; color:#fff; margin-bottom:6px; text-transform:uppercase; }
.edu-school { font-family:var(--font-mono); font-size:11px; color:var(--muted); line-height:1.7; }
.certs-title { font-family:var(--font-display); font-size:12px; color:var(--cyan); letter-spacing:.2em; margin-bottom:20px; text-transform:uppercase; }
.certs-grid { display:flex; flex-wrap:wrap; gap:10px; }
.cert-chip { font-family:var(--font-mono); font-size:11px; letter-spacing:.1em; color:var(--green); border:1px solid rgba(0,255,136,.25); padding:6px 14px; background:rgba(0,255,136,.04); text-transform:uppercase; }
Fixing
2026-03-30 07:39:44 +00:00
/* ── FOOTER ── */
New CV version
2026-03-30 08:44:31 +00:00
footer { position:relative; z-index:1; background:var(--bg); border-top:1px solid rgba(0,245,255,.15); padding:48px 80px; display:flex; justify-content:space-between; align-items:center; }
.footer-name { font-family:var(--font-display); font-size:20px; font-weight:900; color:var(--cyan); text-shadow:0 0 20px rgba(0,245,255,.5); letter-spacing:.1em; }
.footer-info { font-family:var(--font-mono); font-size:11px; color:var(--muted); text-align:right; line-height:1.8; }
Fixing
2026-03-30 07:39:44 +00:00
New CV version
2026-03-30 08:44:31 +00:00
.cursor-dot { position:fixed; width:8px; height:8px; background:var(--cyan); border-radius:50%; pointer-events:none; z-index:10000; transform:translate(-50%,-50%); box-shadow:0 0 10px var(--cyan),0 0 20px rgba(0,245,255,.5); }
Fixing
2026-03-30 07:39:44 +00:00
New CV version
2026-03-30 08:44:31 +00:00
@media (max-width:900px) {
section, .hero, footer { padding-left:24px; padding-right:24px; }
.exp-item { grid-template-columns:1fr; }
.exp-left { margin-bottom:10px; }
.skills-grid, .sectors-grid, .edu-grid { grid-template-columns:1fr; }
.hero-corner.tr, .hero-corner.br { display:none; }
nav { padding:0 16px; flex-wrap:wrap; }
nav a { padding:12px 12px; font-size:10px; }
Fixing
2026-03-30 07:39:44 +00:00
}
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
</style>
</head>
<body>
cyberpunk version
2026-03-30 02:00:45 +00:00
<div class="cursor-dot" id="cursorDot"></div>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
<header class="hero">
cyberpunk version
2026-03-30 02:00:45 +00:00
<div class="hero-bg"></div>
New CV version
2026-03-30 08:44:31 +00:00
<div class="corner-bracket tl"></div><div class="corner-bracket tr"></div>
<div class="corner-bracket bl"></div><div class="corner-bracket br"></div>
<div class="hero-corner tl">SYS://CV_LIABEUF_V3.EXE<br>STATUS: <span style="color:var(--green)">ONLINE</span></div>
cyberpunk version
2026-03-30 02:00:45 +00:00
<div class="hero-corner tr">CGI GROUP // CLERMONT-FERRAND<br>CLEARANCE: <span style="color:var(--magenta)">LEVEL_4</span></div>
New CV version
2026-03-30 08:44:31 +00:00
<div class="hero-corner bl">// 25 ANS D'EXPÉRIENCE DIGITALE</div>
<div class="hero-corner br">ENISE_1999 // INGÉNIEUR · CENTRALE LYON</div>
cyberpunk version
2026-03-30 02:00:45 +00:00
New CV version
2026-03-30 08:44:31 +00:00
<p class="hero-id">ID: <span>#SL-2025</span> // MODULE: <span>DIGITAL_DIRECTOR</span> // NODE: <span>CGI.FR</span></p>
<h1 class="hero-name glitch" data-text="LIABEUF">LIABEUF<br><span class="line2">STÉPHANE</span></h1>
<p class="hero-subtitle">UX &amp; DIGITAL MANAGER // PRODUCT MANAGER // E-COMMERCE ARCHITECT // DATA LEADER</p>
cyberpunk version
2026-03-30 02:00:45 +00:00
<div class="hero-stats">
New CV version
2026-03-30 08:44:31 +00:00
<div class="stat-box"><strong class="stat-num">25+</strong><span class="stat-label">ANS XP</span></div>
<div class="stat-box"><strong class="stat-num">40</strong><span class="stat-label">SQUADS</span></div>
<div class="stat-box"><strong class="stat-num">39</strong><span class="stat-label">PAYS</span></div>
<div class="stat-box"><strong class="stat-num">×2</strong><span class="stat-label">CONV. RATE</span></div>
<div class="stat-box"><strong class="stat-num">+70%</strong><span class="stat-label">CA E-COM</span></div>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
</div>
cyberpunk version
2026-03-30 02:00:45 +00:00
<div class="hero-scroll">[ SCROLL_DOWN ] ↓</div>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
</header>
<nav>
New CV version
2026-03-30 08:44:31 +00:00
<span class="nav-logo">SL://CV_2025</span>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
<a href="#experience">Parcours</a>
cyberpunk version
2026-03-30 02:00:45 +00:00
<a href="#competences">Skills</a>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
<a href="#secteurs">Secteurs</a>
<a href="#formation">Formation</a>
</nav>
<section id="experience">
cyberpunk version
2026-03-30 02:00:45 +00:00
<div class="section-header">
<p class="section-id">// MODULE_01 :: EXPERIENCE.LOG</p>
<h2 class="section-title">Parcours</h2>
</div>
New CV version
2026-03-30 08:44:31 +00:00
<div class="exp-group">
<div class="exp-group-label">CGI // DIRECTEUR CONSEIL SERVICE</div>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
Fixing
2026-03-30 07:39:44 +00:00
<div class="exp-item">
New CV version
2026-03-30 08:44:31 +00:00
<div class="exp-left"><p class="exp-period">MAI 2025 → NOW</p><p class="exp-co">Limagrain Europe<br>Field Seeds Division</p></div>
Fixing
2026-03-30 07:39:44 +00:00
<div>
New CV version
2026-03-30 08:44:31 +00:00
<h3 class="exp-role">Product Manager &amp; UX Designer</h3>
<p class="exp-program">// PLATEFORME BI &amp; CRM — PILOTAGE COMMERCIAL EUROPÉEN</p>
<div class="exp-objective"><strong>RÔLE :</strong> Transformation digitale du pôle Field Seeds — écosystème de tableaux de bord unifiés (Power BI + CRM Dynamics) pour piloter les performances commerciales, marketing et terrain à l'échelle européenne.</div>
<p class="exp-desc">Roadmap produit LFS, conception UX/UI (wireframes, maquettes, guidelines), ateliers Design Thinking avec équipes sales / marketing / CRM / data. KPIs par profil utilisateur (Comex, Country Managers, Sales Managers, commerciaux). Gouvernance Scrum : backlog, rituels Sprint, cadencement trimestriel, coaching des équipes Data et CRM.</p>
Fixing
2026-03-30 07:39:44 +00:00
<div class="exp-tags">
New CV version
2026-03-30 08:44:31 +00:00
<span class="exp-tag">Power BI</span><span class="exp-tag">CRM Dynamics</span><span class="exp-tag">UX/UI</span><span class="exp-tag">Product Manager</span><span class="exp-tag">Scrum</span><span class="exp-tag">Design Thinking</span><span class="exp-tag">KPIs</span>
Fixing
2026-03-30 07:39:44 +00:00
</div>
</div>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
</div>
Fixing
2026-03-30 07:39:44 +00:00
<div class="exp-item">
New CV version
2026-03-30 08:44:31 +00:00
<div class="exp-left"><p class="exp-period">DÉC 2024 → MAR 2025</p><p class="exp-co">Picture Organic Clothing<br>(mi-temps)</p></div>
<div>
<h3 class="exp-role">UX Designer</h3>
<p class="exp-program">// PROJET BI — POWER BI — FABRIK</p>
<p class="exp-desc">Conception de tableaux de bord ergonomiques pour les équipes commerciales, financières et le comité de direction. Guidelines graphiques et ergonomiques. Workshops UX en mode Design Thinking.</p>
<div class="exp-tags"><span class="exp-tag">Power BI</span><span class="exp-tag">UX Design</span><span class="exp-tag">Design Thinking</span><span class="exp-tag">Dashboards</span></div>
Fixing
2026-03-30 07:39:44 +00:00
</div>
New CV version
2026-03-30 08:44:31 +00:00
</div>
<div class="exp-item">
<div class="exp-left"><p class="exp-period">AVR 2023 → MAR 2025</p><p class="exp-co">Picture Organic Clothing</p></div>
Fixing
2026-03-30 07:39:44 +00:00
<div>
New CV version
2026-03-30 08:44:31 +00:00
<h3 class="exp-role">Directeur de Projet E-Commerce</h3>
<p class="exp-program">// REFONTE SITE + INTERNATIONALISATION (7 → 200+ PAYS)</p>
<p class="exp-desc">Refonte complète sous Salesforce PWA Kit. Internationalisation de 7 à 200+ pays : multidevise, multilingue, modules taxation/conformité, logistique internationale. Optimisation parcours clients (abandon panier, recherche prédictive, paiement 1 clic). Collaboration étroite design / marketing / IT.</p>
<div class="exp-results">
<p class="exp-results-title">// RÉSULTATS OBTENUS</p>
<ul>
<li>Doublement du taux de conversion</li>
<li>CA e-commerce +70% en cumulé annuel (YTD)</li>
<li>Déploiement dans 200+ pays vs 7 initialement</li>
<li>Performances techniques et fluidité navigation optimisées</li>
</ul>
</div>
Fixing
2026-03-30 07:39:44 +00:00
<div class="exp-tags">
New CV version
2026-03-30 08:44:31 +00:00
<span class="exp-tag">Salesforce PWA</span><span class="exp-tag">E-Commerce</span><span class="exp-tag">200+ pays</span><span class="exp-tag mag">×2 Conversion</span><span class="exp-tag grn">+70% CA</span>
Fixing
2026-03-30 07:39:44 +00:00
</div>
</div>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
</div>
Fixing
2026-03-30 07:39:44 +00:00
<div class="exp-item">
New CV version
2026-03-30 08:44:31 +00:00
<div class="exp-left"><p class="exp-period">2021 → NOW</p><p class="exp-co">CGI // Région AURA</p></div>
<div>
<h3 class="exp-role">UX &amp; Digital Manager</h3>
<p class="exp-desc">Développement de l'offre UX/UI sur le marché AURA. Études des besoins clients locaux, adaptation des solutions, renforcement de la notoriété CGI dans la région, création d'opportunités de croissance.</p>
<div class="exp-tags"><span class="exp-tag">UX/UI</span><span class="exp-tag">Business Dev</span><span class="exp-tag">Région AURA</span></div>
</div>
</div>
<div class="exp-item">
<div class="exp-left"><p class="exp-period">2021 → 2023</p><p class="exp-co">Michelin</p></div>
<div>
<h3 class="exp-role">UX &amp; Digital Manager</h3>
<p class="exp-desc">Déploiement UX/UI au sein des business units Michelin. Identification des besoins spécifiques, conception de solutions, implémentation et KPIs UX pour évaluer la progression et optimiser la satisfaction utilisateurs finaux.</p>
<div class="exp-tags"><span class="exp-tag">UX/UI</span><span class="exp-tag">KPIs</span><span class="exp-tag">Michelin</span></div>
Fixing
2026-03-30 07:39:44 +00:00
</div>
New CV version
2026-03-30 08:44:31 +00:00
</div>
<div class="exp-item">
<div class="exp-left"><p class="exp-period">2019 → 2021</p><p class="exp-co">Michelin</p></div>
Fixing
2026-03-30 07:39:44 +00:00
<div>
New CV version
2026-03-30 08:44:31 +00:00
<h3 class="exp-role">Delivery Manager</h3>
Fixing
2026-03-30 07:39:44 +00:00
<p class="exp-program">// PROGRAMME ENGAGE — SALESFORCE</p>
New CV version
2026-03-30 08:44:31 +00:00
<p class="exp-desc">Intégration des outils et services Michelin dans Salesforce CRM. Pilotage de ~40 squads sur 3 pays (USA, France, Maroc) en agile distribué. Maîtrise planification et qualité dans un environnement complexe multi-pays.</p>
<div class="exp-tags"><span class="exp-tag">Salesforce</span><span class="exp-tag">Agile Distribué</span><span class="exp-tag">~40 Squads</span><span class="exp-tag">3 Pays</span></div>
Fixing
2026-03-30 07:39:44 +00:00
</div>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
</div>
Fixing
2026-03-30 07:39:44 +00:00
<div class="exp-item">
New CV version
2026-03-30 08:44:31 +00:00
<div class="exp-left"><p class="exp-period">2017 → 2019</p><p class="exp-co">Michelin</p></div>
<div>
<h3 class="exp-role">Directeur Projet BI Europe</h3>
<p class="exp-program">// PROGRAMME ENGAGE — SALESFORCE</p>
<p class="exp-desc">Outil BI Europe pour 2 000 commerciaux dans 39 pays et 25 langues. Pilotage ventes et commandes jusqu'au SKU, intégré dans Salesforce dans le cadre de la transformation customer-centric Engage.</p>
<div class="exp-tags"><span class="exp-tag">Business Intelligence</span><span class="exp-tag">2000 Users</span><span class="exp-tag">39 Pays</span><span class="exp-tag">25 Langues</span><span class="exp-tag">Salesforce</span></div>
Fixing
2026-03-30 07:39:44 +00:00
</div>
New CV version
2026-03-30 08:44:31 +00:00
</div>
</div>
<div class="exp-group">
<div class="exp-group-label mag">PARCOURS AUTRE</div>
<div class="exp-item">
<div class="exp-left"><p class="exp-period">2016 → 2017</p><p class="exp-co">Le Temps des Travaux<br>Secteur Retail</p></div>
Fixing
2026-03-30 07:39:44 +00:00
<div>
<h3 class="exp-role">Dir. Associé E-Commerce &amp; CTO</h3>
New CV version
2026-03-30 08:44:31 +00:00
<p class="exp-desc">Élaboration du SI et stratégie de marque. Refonte complète du site E-Commerce. CA 450 k€ dès la 1ère année. Stratégie webmarketing, hébergement et sécurité serveur dédié.</p>
<div class="exp-tags"><span class="exp-tag">CTO</span><span class="exp-tag">E-Commerce</span><span class="exp-tag grn">450 k€ CA</span></div>
Fixing
2026-03-30 07:39:44 +00:00
</div>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
</div>
Fixing
2026-03-30 07:39:44 +00:00
<div class="exp-item">
New CV version
2026-03-30 08:44:31 +00:00
<div class="exp-left"><p class="exp-period">2013 → 2016</p><p class="exp-co">Trismégiste International<br>vetality.fr</p></div>
Fixing
2026-03-30 07:39:44 +00:00
<div>
<h3 class="exp-role">Directeur E-Commerce</h3>
New CV version
2026-03-30 08:44:31 +00:00
<p class="exp-desc">Création du pôle E-Commerce ex-nihilo : marque, recrutement, SI, logistique, webmarketing. CA 900 k€ en 1ère année. Rentabilité atteinte au 15e mois.</p>
<div class="exp-results">
<p class="exp-results-title">// RÉSULTATS</p>
<ul>
<li>900 k€ CA 1ère année — objectif 1 M€</li>
<li>Rentabilité au 15e mois — objectif 24 mois</li>
</ul>
Fixing
2026-03-30 07:39:44 +00:00
</div>
New CV version
2026-03-30 08:44:31 +00:00
<div class="exp-tags"><span class="exp-tag">Création ex-nihilo</span><span class="exp-tag grn">900 k€</span><span class="exp-tag">Retail</span></div>
Fixing
2026-03-30 07:39:44 +00:00
</div>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
</div>
Fixing
2026-03-30 07:39:44 +00:00
<div class="exp-item">
New CV version
2026-03-30 08:44:31 +00:00
<div class="exp-left"><p class="exp-period">2010 → 2013</p><p class="exp-co">Indépendant</p></div>
Fixing
2026-03-30 07:39:44 +00:00
<div>
<h3 class="exp-role">Consultant Digital &amp; UX Designer</h3>
New CV version
2026-03-30 08:44:31 +00:00
<p class="exp-desc">Accompagnement de PME et startups dans leur transformation digitale. Audits UX, wireframes, prototypes interactifs, conseil stratégie digitale, SEO, social media. Dev front-end HTML/CSS/JS. Ateliers Design Thinking.</p>
<div class="exp-tags"><span class="exp-tag">Conseil</span><span class="exp-tag">UX Design</span><span class="exp-tag">Design Thinking</span><span class="exp-tag">SEO</span></div>
Fixing
2026-03-30 07:39:44 +00:00
</div>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
</div>
Fixing
2026-03-30 07:39:44 +00:00
<div class="exp-item">
New CV version
2026-03-30 08:44:31 +00:00
<div class="exp-left"><p class="exp-period">2005 → 2010</p><p class="exp-co">Sescoi International<br>(Hexagon)</p></div>
Fixing
2026-03-30 07:39:44 +00:00
<div>
New CV version
2026-03-30 08:44:31 +00:00
<h3 class="exp-role">Product Manager &amp; Dir. Innovation &amp; Industrialisation</h3>
<p class="exp-desc">Gestion du cycle de vie produit ERP, outils planification et CAD viewer. Roadmap, R&amp;D agile, go-to-market, comités produit. Création cellule industrialisation — CMMI Level 1 → Level 4 en 3 ans (partenariat Mercury). Standardisation des processus dev / tests / déploiement.</p>
<div class="exp-tags"><span class="exp-tag">Product Management</span><span class="exp-tag">ERP</span><span class="exp-tag">CMMI L4</span><span class="exp-tag">Innovation</span><span class="exp-tag">Industrialisation</span></div>
Fixing
2026-03-30 07:39:44 +00:00
</div>
</div>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
Fixing
2026-03-30 07:39:44 +00:00
<div class="exp-item">
New CV version
2026-03-30 08:44:31 +00:00
<div class="exp-left"><p class="exp-period">2001 → 2005</p><p class="exp-co">Sescoi International<br>(Hexagon)</p></div>
Fixing
2026-03-30 07:39:44 +00:00
<div>
New CV version
2026-03-30 08:44:31 +00:00
<h3 class="exp-role">Resp. Dev Scheduling &amp; Business Analyste ERP Europe</h3>
<p class="exp-desc">Conception et développement du module scheduling intégré à l'ERP. Analyse processus métier industriels (multi-sites, langues, devises). Spécifications fonctionnelles. Formation équipes locales européennes. Support avant-vente.</p>
<div class="exp-tags"><span class="exp-tag">ERP</span><span class="exp-tag">Business Analysis</span><span class="exp-tag">Europe</span><span class="exp-tag">Scheduling</span></div>
Fixing
2026-03-30 07:39:44 +00:00
</div>
</div>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
Fixing
2026-03-30 07:39:44 +00:00
<div class="exp-item">
New CV version
2026-03-30 08:44:31 +00:00
<div class="exp-left"><p class="exp-period">1999 → 2001</p><p class="exp-co">Moul'Anjou Plastique</p></div>
Fixing
2026-03-30 07:39:44 +00:00
<div>
<h3 class="exp-role">Resp. Projet ERP · Injection Plastique</h3>
New CV version
2026-03-30 08:44:31 +00:00
<p class="exp-desc">Mise en œuvre ERP en production industrielle (injection plastique). Recueil besoins, cahier des charges, déploiement, formation utilisateurs. Intégration GPAO et systèmes supervision machine. Amélioration processus planification et gestion des stocks.</p>
<div class="exp-tags"><span class="exp-tag">ERP</span><span class="exp-tag">Plasturgie</span><span class="exp-tag">Industrie</span></div>
Fixing
2026-03-30 07:39:44 +00:00
</div>
</div>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
</div>
</section>
<section id="competences">
cyberpunk version
2026-03-30 02:00:45 +00:00
<div class="section-header">
<p class="section-id">// MODULE_02 :: SKILLS.DAT</p>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
<h2 class="section-title">Compétences</h2>
</div>
cyberpunk version
2026-03-30 02:00:45 +00:00
<div class="skills-grid">
<div class="skill-panel">
<p class="skill-panel-title">// Techniques</p>
New CV version
2026-03-30 08:44:31 +00:00
<div class="skill-row" data-level="100"><div class="skill-info"><span class="skill-name">Gestion de projet</span><span class="skill-meta">25A · EXPERT</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
<div class="skill-row" data-level="75"><div class="skill-info"><span class="skill-name">Méthodologies Agiles</span><span class="skill-meta">22A · ★★★</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
<div class="skill-row" data-level="75"><div class="skill-info"><span class="skill-name">UX / UI</span><span class="skill-meta">15A · ★★★</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
<div class="skill-row" data-level="75"><div class="skill-info"><span class="skill-name">Design Thinking</span><span class="skill-meta">15A · ★★★</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
<div class="skill-row" data-level="100"><div class="skill-info"><span class="skill-name">CMS E-Commerce</span><span class="skill-meta">6A · EXPERT</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
<div class="skill-row" data-level="100"><div class="skill-info"><span class="skill-name">Scheduling</span><span class="skill-meta">5A · EXPERT</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
<div class="skill-row" data-level="50"><div class="skill-info"><span class="skill-name">Dev HTML/CSS/PHP/JS</span><span class="skill-meta">8A · ★★</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
</div>
Fixing
2026-03-30 07:39:44 +00:00
<div class="skill-panel">
<p class="skill-panel-title">// Technologies IT</p>
New CV version
2026-03-30 08:44:31 +00:00
<div class="skill-row" data-level="100"><div class="skill-info"><span class="skill-name">E-Commerce</span><span class="skill-meta">6A · EXPERT</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
<div class="skill-row" data-level="100"><div class="skill-info"><span class="skill-name">Marketing Digital</span><span class="skill-meta">6A · EXPERT</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
<div class="skill-row" data-level="75"><div class="skill-info"><span class="skill-name">ERP</span><span class="skill-meta">10A · ★★★</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
<div class="skill-row" data-level="75"><div class="skill-info"><span class="skill-name">CRM (Salesforce / Dynamics)</span><span class="skill-meta">★★★</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
<div class="skill-row" data-level="50"><div class="skill-info"><span class="skill-name">Business Intelligence</span><span class="skill-meta">Power BI · ★★</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
<div class="skill-row" data-level="75"><div class="skill-info"><span class="skill-name">Data &amp; Analytics</span><span class="skill-meta">GA4 · Microstrategy</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
<div class="skill-row" data-level="75"><div class="skill-info"><span class="skill-name">Outils IA</span><span class="skill-meta">Analyse · Génération</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
Fixing
2026-03-30 07:39:44 +00:00
</div>
<div class="skill-panel">
<p class="skill-panel-title">// Management</p>
New CV version
2026-03-30 08:44:31 +00:00
<div class="skill-row" data-level="100"><div class="skill-info"><span class="skill-name">Pilotage de projets</span><span class="skill-meta">25A · EXPERT</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
<div class="skill-row" data-level="100"><div class="skill-info"><span class="skill-name">Gestion des risques</span><span class="skill-meta">25A · EXPERT</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
<div class="skill-row" data-level="100"><div class="skill-info"><span class="skill-name">Veille technologique</span><span class="skill-meta">10A · EXPERT</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
<div class="skill-row" data-level="75"><div class="skill-info"><span class="skill-name">Web Marketing</span><span class="skill-meta">7A · ★★★</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
<div class="skill-row" data-level="75"><div class="skill-info"><span class="skill-name">Stratégie commerciale</span><span class="skill-meta">6A · ★★★</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
<div class="skill-row" data-level="75"><div class="skill-info"><span class="skill-name">Stratégie des marques</span><span class="skill-meta">6A · ★★★</span></div><div class="skill-bar"><div class="skill-fill"></div></div></div>
Fixing
2026-03-30 07:39:44 +00:00
</div>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
</div>
</section>
<section id="secteurs">
cyberpunk version
2026-03-30 02:00:45 +00:00
<div class="section-header">
<p class="section-id">// MODULE_03 :: SECTORS.MAP</p>
<h2 class="section-title">Secteurs</h2>
</div>
<div class="sectors-grid">
<div class="sector-cell">User Experience</div>
<div class="sector-cell">Marketing Digital</div>
<div class="sector-cell">Innovation Logicielle</div>
<div class="sector-cell">E-Commerce</div>
<div class="sector-cell">Retail</div>
<div class="sector-cell">Automobile</div>
<div class="sector-cell">Manufacturing</div>
<div class="sector-cell">Plasturgie</div>
<div class="sector-cell">Éditeur ERP</div>
<div class="sector-cell">Qualité Logicielle</div>
New CV version
2026-03-30 08:44:31 +00:00
<div class="sector-cell">Data &amp; BI</div>
cyberpunk version
2026-03-30 02:00:45 +00:00
<div class="sector-cell">Design Thinking</div>
New CV version
2026-03-30 08:44:31 +00:00
<div class="sector-cell">Agile &amp; Scrum</div>
<div class="sector-cell">PMI</div>
<div class="sector-cell">CRM</div>
<div class="sector-cell">Product Management</div>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
</div>
</section>
<section id="formation">
cyberpunk version
2026-03-30 02:00:45 +00:00
<div class="section-header">
<p class="section-id">// MODULE_04 :: EDUCATION.SYS</p>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
<h2 class="section-title">Formation</h2>
</div>
cyberpunk version
2026-03-30 02:00:45 +00:00
<div class="edu-grid">
<div class="edu-card">
<p class="edu-year">// 1999</p>
<h3 class="edu-degree">Diplôme d'Ingénieur</h3>
New CV version
2026-03-30 08:44:31 +00:00
<p class="edu-school">ENISE — Saint-Étienne<br>Groupe Centrale Lyon<br>Spécialisation Design Industriel<br>Biennale du Design de Saint-Étienne</p>
cyberpunk version
2026-03-30 02:00:45 +00:00
</div>
<div class="edu-card">
<p class="edu-year">// 1994</p>
<h3 class="edu-degree">BAC E</h3>
<p class="edu-school">Clermont-Ferrand</p>
</div>
</div>
<p class="certs-title">// CERTIFICATIONS &amp; OUTILS</p>
<div class="certs-grid">
<span class="cert-chip">CMMI</span>
New CV version
2026-03-30 08:44:31 +00:00
<span class="cert-chip">PMI (2005)</span>
cyberpunk version
2026-03-30 02:00:45 +00:00
<span class="cert-chip">HP Quality Center</span>
<span class="cert-chip">HP Functional Testing &amp; BPT</span>
<span class="cert-chip">MS Project</span>
<span class="cert-chip">JIRA · Confluence</span>
New CV version
2026-03-30 08:44:31 +00:00
<span class="cert-chip">Prestashop · Magento · Salesforce</span>
<span class="cert-chip">Power BI · Microstrategy</span>
<span class="cert-chip">GA4</span>
<span class="cert-chip">Scrum · Kanban · XP</span>
<span class="cert-chip">Outils IA</span>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
</div>
</section>
<footer>
cyberpunk version
2026-03-30 02:00:45 +00:00
<div class="footer-name">LIABEUF_STÉPHANE</div>
<div class="footer-info">
CGI GROUP // CLERMONT-FERRAND<br>
UX &amp; DIGITAL MANAGER // DIRECTEUR CONSEIL<br>
New CV version
2026-03-30 08:44:31 +00:00
<span style="color:var(--green)">STATUS: AVAILABLE — CV NOV. 2025</span>
cyberpunk version
2026-03-30 02:00:45 +00:00
</div>
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
</footer>
<script>
cyberpunk version
2026-03-30 02:00:45 +00:00
const dot = document.getElementById('cursorDot');
document.addEventListener('mousemove', e => {
dot.style.left = e.clientX + 'px';
dot.style.top = e.clientY + 'px';
});
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
const obs = new IntersectionObserver((entries) => {
cyberpunk version
2026-03-30 02:00:45 +00:00
entries.forEach(entry => {
if (entry.isIntersecting) {
entry.target.classList.add('visible');
if (entry.target.id === 'competences') {
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
setTimeout(() => {
document.querySelectorAll('.skill-row').forEach(row => {
cyberpunk version
2026-03-30 02:00:45 +00:00
row.querySelector('.skill-fill').style.width = row.dataset.level + '%';
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
});
cyberpunk version
2026-03-30 02:00:45 +00:00
}, 300);
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
}
}
});
cyberpunk version
2026-03-30 02:00:45 +00:00
}, { threshold: 0.08 });
document.querySelectorAll('section').forEach(s => obs.observe(s));
const heroId = document.querySelector('.hero-id');
const txt = heroId.innerHTML;
heroId.innerHTML = '';
let i = 0;
setTimeout(() => {
const timer = setInterval(() => {
heroId.innerHTML = txt.slice(0, i++);
if (i > txt.length) clearInterval(timer);
New CV version
2026-03-30 08:44:31 +00:00
}, 16);
cyberpunk version
2026-03-30 02:00:45 +00:00
}, 400);
Add initial CV webpage structure in index.html This commit adds a complete HTML structure for a personal CV webpage, including sections for experience, skills, sectors, education, and a footer.
2026-03-30 01:44:25 +00:00
</script>
</body>
</html>
Reference in a new issue Copy permalink