pit2pit · pit2pit · Jun 26, 2024 · Jun 26, 2024 · Jun 26, 2024 · Jun 26, 2024
diff --git a/README.md b/README.md
@@ -1 +1,2 @@
-# rsschool-cv
+# rsschool-cv
+https://pit2pit.github.io/rsschool-cv/
diff --git a/assets/img/avatar small.png b/assets/img/avatar small.png
diff --git a/assets/img/avatar.png b/assets/img/avatar.png
diff --git a/assets/img/favicon.ico b/assets/img/favicon.ico
diff --git a/assets/img/rsschool-logo.svg b/assets/img/rsschool-logo.svg
diff --git a/cv.md b/cv.md
@@ -0,0 +1,15 @@
+* **Name Surname:** Vitaly Zverko    ![pit2pit](173596577-1.png)
+
+* **Contacts:** mail - *pit2pit4y@gmail.com*, discord - *pit2pit*
+
+* **Brif information about yourself:** I want to complite the course
+
+* **Skill:** no
+
+* **Code examples:** `console.log("Hello, World!")`
+
+* **Work experience Junior Dev:** rsschool-cv project [https://pit2pit.github.io/rsschool-cv/cv]
+
+* **Education:** no
+
+* **English:** with a dictionary
diff --git a/index.html b/index.html
@@ -0,0 +1,108 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>CV</title>
+  <link rel="stylesheet" href="style.css">
+  <link rel="icon" href="./assets/img/favicon.ico">
+</head>
+<body>
+  <header class="header">
+    <div class="container">
+      <nav class="nav">
+        <ul class="nav-list">
+          <li class="nav-item"><a href="#about" class="nav-link">About</a></li>
+          <li class="nav-item"><a href="#contacts" class="nav-link">Contacts</a></li>
+          <li class="nav-item"><a href="#skills" class="nav-link">Skills</a></li>
+          <li class="nav-item"><a href="#code" class="nav-link">Code</a></li>
+          <li class="nav-item"><a href="#projects" class="nav-link">Projects</a></li>
+          <li class="nav-item"><a href="#education" class="nav-link">Education</a></li>
+        </ul>
+      </nav>
+    </div>
+  </header>
+  <main class="main">
+    <div class="container">
+      <section class="section" id="profile">
+        <div class="section-profile">
+          <h1 class="section-title-name">Vitaly Zverko</h1>
+          <h3 class="section-subtitle">beginner front-end developer</h3>
+        </div>
+        <div  class="img-profile">
+          <img src="./assets/img/avatar.png" alt="pit2pit" class="section-profile-logo" width="250" height="250">
+        </div>
+      </section>
+      <section class="section" id="about">
+        <h2 class="section-title">About</h2>
+        <p>
+          I am beginner in web development and have no experience in programming, but I am sure that the RSScholl courses will contribute as much as possible to mastering the profession of front-end developer.
+        </p>
+      </section>
+      <section class="section" id="contacts">
+        <h2 class="section-title">Contacts</h2>
+        <ul class="section-list">
+          <li class="section-item contacts-item">
+            Address: Minsk, Belarus
+          </li>
+          <li class="section-item contacts-item">
+            GitHab: <a href="https://github.com/pit2pit" title="github">pit2pit</a>
+          </li>
+          <li class="section-item contacts-item">
+            E-mail: <a href="mailto:pit2pit4y@gmail.com" title="email">pit2pit4y@gmail.com</a>
+          </li>
+        </ul>
+      </section>
+      <section class="section" id="skills">
+        <h2 class="section-title">Skills</h2>
+        <ul class="section-list">
+          <li class="section-item">
+            Web-development: beginner
+          </li>
+          <li class="section-item">
+            Photo design
+          </li>
+        </ul>
+      </section>
+      <section class="section" id="code">
+        <h2 class="section-title">Code</h2>
+<pre class="pre">
+  <code>
+&lt;div&gt;
+  &lt;p&gt;
+    Lorem ipsum!
+  &lt;/p&gt;
+&lt;/div&gt;
+</code>
+</pre>
+      </section>
+      <section class="section" id="projects">
+        <h2 class="section-title">Projects</h2>
+        <ul class="section-list">
+          <li class="section-item"><a href="https://pit2pit.github.io/rsschool-cv/">CV - project (JS/FE Pre-School 2025Q2)</a></li>
+        </ul>
+      </section>
+      <section class="section" id="education">
+        <h2 class="section-title">Education</h2>
+        <ul class="section-list">
+          <li class="section-item">Knowledge and skills gained so far during this course
+            (JS/FE Pre-School 2025Q2)</li>
+          <li class="section-item">Self-education</li>
+          <li class="section-item">English:  A1 - Beginner</li>
+        </ul>
+      </section>
+    </div>
+  </main>
+  <footer class="footer">
+    <div class="container">
+      <div class="container container-footer">
+        <p class="year">&copy; 2025</p>
+        <div>
+          <a href="https://github.com/pit2pit" class="github-nav-link">pit2pit</a>
+        </div>
+        <a href="https://rs.school/courses/javascript-ru" class="rss"><img src="./assets/img/rsschool-logo.svg" alt="RSS" width="108" height="40"></a>
+      </div>
+    </div>
+  </footer>
+</body>
+</html>
diff --git a/style.css b/style.css
@@ -0,0 +1,112 @@
+* {
+  box-sizing: border-box;
+}
+
+html {
+  scroll-behavior: smooth;
+}
+
+body {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  min-height: 100vh;
+  margin: 0;
+  padding: 0;
+  font: 400 24px/1.5 tahoma;
+  color: rgb(46, 24, 24);
+}
+.container {
+  max-width: 1440px;
+  margin: 0 auto;
+}
+
+.main {
+  padding-top: 50px;
+}
+.nav-item {
+  margin: 0 30px;
+  font-size: 28px;
+}
+
+.nav-link {
+  text-decoration: none;
+}
+
+a {
+  text-decoration: none;
+  color: rgb(46, 24, 24);
+  transition: color 0.3s;
+}
+
+a:hover {
+  color: rgb(243, 223, 223);
+}
+
+.nav-list {
+  position: fixed;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  list-style: none;
+  width: 1440px;
+  height: 90px;
+  margin: 0;
+  padding: 0 20px;
+  background-color: rgb(142, 162, 163);
+}
+
+pre {
+  line-height: 1;
+}
+
+#profile {
+  display: flex;
+}
+
+.section-profile {
+  width: 50%;
+  margin-top: 30px;
+  text-align: center;
+}
+
+.section {
+  margin-left: 30px;
+  padding-top: 40px;
+}
+
+.section-title {
+  margin-left: 50px;
+  padding-top: 20px;
+  font-style: italic;
+}
+
+.section-title-name {
+  font-size: 45px;
+  font-style: italic;
+}
+
+.img-profile {
+  display: flex;
+  padding-top: 40px;
+  padding-left: 100px;
+}
+
+.section-profile-logo {
+  border-radius: 50%;
+}
+
+.container-footer {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background-color: rgb(142, 162, 163);
+}
+
+.year {
+  padding-left:  20px;
+}
+
+.rss {
+  padding-right: 20px;
+}