You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
123 lines
6.5 KiB
123 lines
6.5 KiB
<!DOCTYPE html>
|
|
<html lang="fr">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta name="description" content="Portfolio de Sasha Lorenc - Développeur web passionné par l'innovation et le design">
|
|
<title>Accueil - Portfolio de Sasha Lorenc</title>
|
|
<link rel="stylesheet" href="../css/accueil_css.css">
|
|
<link rel="stylesheet" href="../css/global.css">
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<nav>
|
|
<h1>Sasha Lorenc</h1>
|
|
<ul>
|
|
<li><a href="accueil.html" data-translate="nav-home" aria-current="page">Accueil</a></li>
|
|
<li><a href="about.html" data-translate="nav-about">À propos</a></li>
|
|
<li><a href="projet.html" data-translate="nav-projects">Projets</a></li>
|
|
<li><a href="skills.html" data-translate="nav-skills">Compétences</a></li>
|
|
<li><a href="contacts.html" data-translate="nav-contact">Contact</a></li>
|
|
</ul>
|
|
<div class="nav-controls">
|
|
<div class="language-selector-container">
|
|
<select id="language-selector" aria-label="Changer de langue">
|
|
<option value="fr">FR</option>
|
|
<option value="en">EN</option>
|
|
<option value="esp">ESP</option>
|
|
</select>
|
|
</div>
|
|
<button id="settings-icon" aria-label="Paramètres">⚙️</button>
|
|
</div>
|
|
</nav>
|
|
<div id="color-picker" class="color-picker" style="display: none;" role="dialog" aria-labelledby="color-picker-title">
|
|
<span id="color-picker-title" data-translate="accent-color">Couleur d'accentuation :</span>
|
|
<label><input type="radio" name="accent-color" value="#1abc9c" checked> <span data-translate="default">Default</span></label>
|
|
<label><input type="radio" name="accent-color" value="#e74c3c"> <span data-translate="red">Rouge</span></label>
|
|
<label><input type="radio" name="accent-color" value="#f39c12"> <span data-translate="orange">Orange</span></label>
|
|
<label><input type="radio" name="accent-color" value="#2ecc71"> <span data-translate="green">Vert</span></label>
|
|
<label><input type="radio" name="accent-color" value="#e84393"> <span data-translate="pink">Rose</span></label>
|
|
</div>
|
|
</header>
|
|
<main>
|
|
|
|
<section class="hero">
|
|
<div class="hero-content">
|
|
<h2 class="animate-text">Sasha Lorenc</h2>
|
|
<p class="animate-text-delay" data-translate="hero-subtitle">Développeur Web & Étudiant en BUT Informatique</p>
|
|
<div class="hero-buttons">
|
|
<a href="projet.html" class="btn primary" data-translate="view-projects">Voir mes projets</a>
|
|
<a href="contacts.html" class="btn secondary" data-translate="contact-me">Me contacter</a>
|
|
</div>
|
|
</div>
|
|
<div class="hero-image">
|
|
<img src="../images/sasha.png" alt="Sasha Lorenc" class="profile-image">
|
|
</div>
|
|
</section>
|
|
|
|
<section class="services">
|
|
<h2 data-translate="services-title">Ce que je peux faire pour vous</h2>
|
|
<div class="services-grid">
|
|
<div class="service-card">
|
|
<i class="service-icon web-dev"></i>
|
|
<h3 data-translate="web-dev-title">Développement Web</h3>
|
|
<p data-translate="web-dev-desc">Création de sites web responsifs et modernes utilisant les dernières technologies.</p>
|
|
</div>
|
|
<div class="service-card">
|
|
<i class="service-icon app-dev"></i>
|
|
<h3 data-translate="app-dev-title">Applications</h3>
|
|
<p data-translate="app-dev-desc">Développement d'applications performantes en C, C++ et autres langages.</p>
|
|
</div>
|
|
<div class="service-card">
|
|
<i class="service-icon ui-design"></i>
|
|
<h3 data-translate="ui-design-title">UI/UX Design</h3>
|
|
<p data-translate="ui-design-desc">Conception d'interfaces utilisateur intuitives et esthétiques.</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="skills-highlight">
|
|
<h2 data-translate="technical-expertise">Expertise Technique</h2>
|
|
<div class="stats-grid">
|
|
<div class="stat-card">
|
|
<span class="stat-number">1</span>
|
|
<p data-translate="years-experience">Année d'expérience en programmation</p>
|
|
</div>
|
|
<div class="stat-card">
|
|
<span class="stat-number">3+</span>
|
|
<p data-translate="completed-projects">Projets réalisés</p>
|
|
</div>
|
|
<div class="stat-card">
|
|
<span class="stat-number">5+</span>
|
|
<p data-translate="technologies-mastered">Technologies maîtrisées</p>
|
|
</div>
|
|
</div>
|
|
<a href="skills.html" class="btn" data-translate="view-all-skills">Voir toutes mes compétences</a>
|
|
</section>
|
|
|
|
<section class="quick-contact">
|
|
<h2 data-translate="lets-work">Travaillons ensemble</h2>
|
|
<p data-translate="project-idea">Vous avez un projet en tête ? Je serais ravi d'en discuter !</p>
|
|
<div class="contact-buttons">
|
|
<a href="contacts.html" class="btn primary" data-translate="contact-me">Me contacter</a>
|
|
<a href="../documents/Cv_fr.pdf" class="btn secondary" id="cv-download-btn" download data-translate="download-cv">Télécharger mon CV</a>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer>
|
|
<p>© 2024 Sasha Lorenc. <span data-translate="rights-reserved">Tous droits réservés.</span></p>
|
|
<div class="social-links">
|
|
<a href="https://www.linkedin.com/in/sasha-lorenc-9a073b278/" target="_blank" rel="noopener" aria-label="LinkedIn">LinkedIn</a>
|
|
<a href="https://codefirst.iut.uca.fr/git/sasha.lorenc" target="_blank" rel="noopener" aria-label="GitHub">GitHub</a>
|
|
</div>
|
|
</footer>
|
|
|
|
<button id="scroll-to-top" title="Remonter en haut" aria-label="Retourner en haut de la page">↑</button>
|
|
|
|
<script src="../js/translations.js"></script>
|
|
<script src="../js/common.js"></script>
|
|
</body>
|
|
</html>
|