05

oxica · Aug 31, 2024 · 147610e · 147610e
1 parent df3845f
commit 147610e
Show file tree

Hide file tree

Showing 2 changed files with 86 additions and 1 deletion.
diff --git a/index.html b/index.html
@@ -36,7 +36,7 @@ <h3>Front End Developer</h3>
                 </div>
             </div>
         </div>
-        <div class="book-page page-right" id="turn-1">
+        <div class="book-page page-right turn" id="turn-1">
             <div class="page-front">
                 <h1 class="title">Work experience</h1>
 
@@ -65,10 +65,55 @@ <h3>Accountant in a Public organization ST"DELTA"</h3>
                         <p>- created the official website of the organization</p>
                     </div>
                 </div>
+
+                <span class="number-page">1</span>
+
+                <span class="nextprev-btn" data-page="turn-1">
+                    <i class='bx bx-chevron-right'></i>
+                </span>
             </div>
 
             <div class="page-back">
                 <h1 class="title">Education</h1>
+
+                <div class="workeduc-box">
+
+                    <div class="workeduc-content">
+                        <span class="year"><i class='bx bx-calendar'></i>2009 - 2010</span>
+                        <h3>Vinnytsia National Agrarian University</h3>
+                        <p>Specialist, Management of organization</p>
+                    </div>
+
+                    <h3 class="workeduc-pretitle">
+                        Additional  education
+                    </h3>
+
+                    <div class="workeduc-content">
+                        <span class="year"><i class='bx bx-calendar'></i>2021 – I’m currently continuing my education</span>
+                        <h3>IT School GoIT</h3>
+                        <p>Full Stack Developer</p>
+
+                    </div>
+
+                    <div class="workeduc-content">
+                        <span class="year"><i class='bx bx-calendar'></i>2021 - 2024</span>
+                        <h3 class="workeduc-pretitle">Udemy</h3>
+                        <a href="https://github.com/oxica/cv/tree/main/certificates"></a>
+
+                        <h4>Creating HTML5 games with JavaScript and Canvas</h4>
+                        <p>Credential ID UC-c10b155b-92cb-47cf-815a-be2a60d45c86</p>
+                        <h4>50 Projects In 50 Days - HTML, CSS & JavaScript</h4>
+                        <p>Credential ID UC-866846b1-6c69-4e28-b791-df41e7ee9255</p>
+                        <!-- <h4>[2022] Programowanie w JavaScript od Zera do Mastera</h4>
+                        <p>Credential ID UC-417a1a7b-f3d2-41d1-b3bf-e30082eac83f</p> -->
+                    </div>
+                </div>
+
+                <span class="number-page">2</span>
+
+                <span class="nextprev-btn back" data-page="turn-1">
+                    <i class='bx bx-chevron-left' ></i>
+                </span>
             </div>
         </div>
     </div>

diff --git a/style.css b/style.css
@@ -171,6 +171,11 @@ color: var(--white-color);
     position: absolute;
     right: 0;
     transform-style: preserve-3d;
+    transform-origin: left;
+}
+
+.book-page.page-right.turn{
+    transform: rotateY(-180deg);
 }
 
 .book-page .page-front,
@@ -229,3 +234,38 @@ color: var(--white-color);
 .workeduc-content .year i{
     margin-right: .4rem;
 }
+
+.workeduc-pretitle{
+    text-align: center;
+    margin-bottom: 1rem;
+}
+
+.number-page{
+    position: absolute;
+    bottom: 1.2rem;
+    left: 50%;
+    transform: translateX(-50%);
+}
+
+.nextprev-btn{
+    position: absolute;
+    bottom: .9rem;
+    right: 1.5rem;
+    width: 2rem;
+    height: 2rem;
+    cursor: pointer;
+    font-size: 2rem;
+    color: var(--second-text-color);
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+    transition: .5s;
+}
+
+.nextprev-btn:hover{
+    color: var(--main-color);
+}
+
+.nextprev-btn.back{
+    left: 1.5rem;
+}