210 lines
9.1 KiB
HTML
210 lines
9.1 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
|
||
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Арсений Ахтамов</title>
|
||
<link rel="stylesheet" href="css/style.css">
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
||
</head>
|
||
|
||
<body>
|
||
|
||
<!-- Навигация -->
|
||
<nav class="navbar">
|
||
<div class="container">
|
||
<a href="#" class="logo">Арсений Ахтамов</a>
|
||
<div class="nav-links">
|
||
<a href="#about">Обо мне</a>
|
||
<a href="#interests">Интересы</a>
|
||
<a href="#projects">Проекты</a>
|
||
<a href="#blog">Блог</a>
|
||
<a href="#contact">Контакты</a>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
|
||
<!-- Герой-секция -->
|
||
<section class="hero">
|
||
<div class="container">
|
||
<div class="hero-content">
|
||
<div class="hero-text">
|
||
<h1>Привет, я </h1>
|
||
<h1><span class="highlight">Арсений Ахтамов</span></h1>
|
||
<p>Подросток, увлеченный технологиями, программированием и спортом</p>
|
||
<div class="social-links">
|
||
<a href="#"><i class="fab fa-vk"></i></a>
|
||
<a href="#"><i class="fab fa-whatsapp"></i></a>
|
||
<a href="#"><i class="fab fa-telegram"></i></a>
|
||
</div>
|
||
</div>
|
||
<div class="hero-image">
|
||
<img src="images/avatar.jpg" alt="Арсений Ахтамов" class="avatar-img">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Обо мне -->
|
||
<section id="about" class="section">
|
||
<div class="container">
|
||
<h2>Обо мне</h2>
|
||
<div class="about-content">
|
||
<div class="about-text">
|
||
<p>Меня зовут Арсений Ахтамов, мне 10 лет. Я учусь в 4а классе гимназии "Пеленг" и активно
|
||
интересуюсь современными технологиями.</p>
|
||
<p>В свободное время занимаюсь программированием, изучаю веб-разработку и работаю над собственными
|
||
проектами.</p>
|
||
<p>Люблю спорт - особенно футбол и велоспорт. Верю, что баланс между технологиями и физической
|
||
активностью важен для развития.</p>
|
||
</div>
|
||
<div class="facts">
|
||
<div class="fact-card">
|
||
<i class="fas fa-code"></i>
|
||
<h3>Программирование</h3>
|
||
<p>Изучаю Python и C#. Я ещё работал в Figma и Thunkable.</p>
|
||
</div>
|
||
<div class="fact-card">
|
||
<i class="fas fa-futbol"></i>
|
||
<h3>Спорт</h3>
|
||
<p>Футбол, плавание, велоспорт</p>
|
||
</div>
|
||
<div class="fact-card">
|
||
<i class="fas fa-gamepad"></i>
|
||
<h3>Гейминг</h3>
|
||
<p>Люблю стратегии и RPG игры</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Интересы -->
|
||
<section id="interests" class="section bg-light">
|
||
<div class="container">
|
||
<h2>Мои интересы</h2>
|
||
<div class="interests-grid">
|
||
<div class="interest-card">
|
||
<div class="interest-icon">
|
||
<i class="fas fa-laptop-code"></i>
|
||
</div>
|
||
<h3>IT технологии</h3>
|
||
<p>Искусственный интеллект, кибербезопасность, разработка игр</p>
|
||
</div>
|
||
<div class="interest-card">
|
||
<div class="interest-icon">
|
||
<i class="fas fa-camera"></i>
|
||
</div>
|
||
<h3>Фотография</h3>
|
||
<p>Люблю снимать природу и городские пейзажи</p>
|
||
</div>
|
||
<div class="interest-card">
|
||
<div class="interest-icon">
|
||
<i class="fas fa-music"></i>
|
||
</div>
|
||
<h3>Музыка</h3>
|
||
<p>Слушаю класическую музыку, фанк и неокласическую музыку.</p>
|
||
</div>
|
||
<div class="interest-card">
|
||
<div class="interest-icon">
|
||
<i class="fas fa-book"></i>
|
||
</div>
|
||
<h3>Чтение</h3>
|
||
<p>Фантастика, научпоп, техническая литература и детективы.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Проекты -->
|
||
<section id="projects" class="section">
|
||
<div class="container">
|
||
<h2>Мои проекты</h2>
|
||
<div class="projects-grid">
|
||
<div class="project-card">
|
||
<div class="project-image">
|
||
<i class="fas fa-globe"></i>
|
||
</div>
|
||
<h3>Персональный сайт</h3>
|
||
<p>Сайт-портфолио на HTML/CSS/JavaScript</p>
|
||
<a href="#" class="btn">Посмотреть</a>
|
||
</div>
|
||
<div class="project-card">
|
||
<div class="project-image">
|
||
<i class="fas fa-robot"></i>
|
||
</div>
|
||
<h3>Телеграм-бот</h3>
|
||
<p>Бот для помощи с домашними заданиями</p>
|
||
<a href="#" class="btn">Посмотреть</a>
|
||
</div>
|
||
<div class="project-card">
|
||
<div class="project-image">
|
||
<i class="fas fa-gamepad"></i>
|
||
</div>
|
||
<h3>2D игра</h3>
|
||
<p>Простая игра на Python с PyGame</p>
|
||
<a href="#" class="btn">Посмотреть</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Блог -->
|
||
<section id="blog" class="section bg-light">
|
||
<div class="container">
|
||
<h2>Последние записи</h2>
|
||
<div class="blog-grid">
|
||
<article class="blog-card">
|
||
<div class="blog-date">15.11.2025</div>
|
||
<h3>Мой первый сайт</h3>
|
||
<p>Расскажу о том, как я создавал этот сайт...</p>
|
||
<a href="#" class="read-more">Читать далее →</a>
|
||
</article>
|
||
<article class="blog-card">
|
||
<div class="blog-date">10.11.2025</div>
|
||
<h3>Изучаю Python</h3>
|
||
<p>Поделюсь своими впечатлениями от изучения Python...</p>
|
||
<a href="#" class="read-more">Читать далее →</a>
|
||
</article>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Контакты -->
|
||
<section id="contact" class="section">
|
||
<div class="container">
|
||
<h2>Свяжись со мной</h2>
|
||
<div class="contact-wrapper">
|
||
<div class="contact-info">
|
||
<p><i class="fas fa-envelope"></i> ascet.love@email.com</p>
|
||
<p><i class="fas fa-phone"></i> +7 (903)-953-59-XX</p>
|
||
<p><i class="fas fa-map-marker-alt"></i> Россия Томск</p>
|
||
</div>
|
||
<form class="contact-form">
|
||
<input type="text" placeholder="Ваше имя" required>
|
||
<input type="email" placeholder="Email" required>
|
||
<textarea placeholder="Сообщение" rows="4" required></textarea>
|
||
<button type="submit" class="btn">Отправить</button>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Футер -->
|
||
<footer>
|
||
<div class="container">
|
||
<p>© 2025 Арсений Ахтамов. Все права защищены.</p>
|
||
<p>Создано с ❤️ и папой</p>
|
||
</div>
|
||
<div class="footer-counter" data-counter data-format="simple"></div>
|
||
</footer>
|
||
|
||
<script src="js/script.js"></script>
|
||
|
||
</body>
|
||
|
||
</html>
|
||
|