-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
13 changed files
with
18 additions
and
529 deletions.
There are no files selected for viewing
Binary file not shown.
Binary file not shown.
File renamed without changes
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,344 +1,8 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<title> | ||
Alek - Aleksei Polechin - Front-end developer with graphic design skills | ||
</title> | ||
<meta charset="UTF-8" /> | ||
<meta name="viewport" content="width=device-width" /> | ||
<link rel="shortcut icon" href="favicon.png"> | ||
<style> | ||
* { | ||
box-sizing: border-box; | ||
} | ||
|
||
body { | ||
margin: 0; | ||
min-height: 100dvh; | ||
font-family: 'Montserrat', sans-serif; | ||
color: black; | ||
display: flex; | ||
width: 100%; | ||
flex-direction: column; | ||
background-color: #111; | ||
color: rgb(255, 221, 69); | ||
} | ||
|
||
.intro { | ||
display: flex; | ||
flex-direction: column; | ||
flex: 1 1 auto; | ||
justify-content: center; | ||
align-items: center; | ||
padding-bottom: 10dvh; | ||
} | ||
.logo-full { | ||
display: flex; | ||
flex-direction: column; | ||
align-items: center; | ||
justify-content: center; | ||
} | ||
|
||
.footer { | ||
display: flex; | ||
flex: 0 0 auto; | ||
height: 40px; | ||
width: 100%; | ||
text-align: center; | ||
align-items: center; | ||
justify-content: center; | ||
font-size: 10px; | ||
color: rgb(136, 135, 135); | ||
} | ||
|
||
.alek-logo { | ||
width: 90px; | ||
animation: blink 0.3s forwards; | ||
animation-delay: 0.55s; | ||
} | ||
|
||
.alek-logo-type { | ||
position: relative; | ||
display: block; | ||
width: 140px; | ||
margin-top: 10px; | ||
animation: alek-in 0.6s both; | ||
animation-delay: 1s; | ||
} | ||
|
||
.profile-link { | ||
display: inline-block; | ||
margin: 0 10px; | ||
font-size: 40px; | ||
text-decoration: none; | ||
color: inherit; | ||
} | ||
|
||
.icon { | ||
width: 1em; | ||
height: 1em; | ||
} | ||
|
||
.skills { | ||
font-size: 11px; | ||
color: #bebebe; | ||
} | ||
|
||
.svg-shadow { | ||
filter: drop-shadow(0px 0px 3px rgba(255, 221, 69, 0.5)) | ||
drop-shadow(0px 0px 10px rgba(255, 10, 100, 1)); | ||
animation: glow 1s infinite alternate-reverse ease-in-out; | ||
} | ||
|
||
.alek-logo:hover .one, | ||
.alek-logo:hover .two, | ||
.alek-logo:hover { | ||
animation: none; | ||
stroke-dasharray: 0; | ||
stroke-dashoffset: 0; | ||
} | ||
|
||
.one { | ||
stroke: currentColor; | ||
stroke-dasharray: 400; | ||
stroke-dashoffset: 400; | ||
animation: dash 0.3s ease-in-out forwards; | ||
animation-delay: 0.25s; | ||
} | ||
|
||
a:hover { | ||
color: inherit; | ||
filter: drop-shadow(0px 0px 3px rgba(255, 221, 69, 0.5)) | ||
drop-shadow(0px 0px 10px rgba(255, 10, 100, 1)); | ||
} | ||
|
||
a { | ||
transition: filter 0.3s; | ||
} | ||
|
||
.two { | ||
stroke: currentColor; | ||
stroke-width: 110px; | ||
stroke-dasharray: 1000; | ||
stroke-dashoffset: 1000; | ||
animation: dash 0.55s ease-in-out forwards; | ||
} | ||
|
||
.who-i-am { | ||
margin-top: 70px; | ||
font-size: 13px; | ||
text-align: center; | ||
animation: alek-in 0.6s both; | ||
animation-delay: 2s; | ||
} | ||
.job, | ||
.name { | ||
letter-spacing: 0.1em; | ||
white-space: nowrap; | ||
} | ||
|
||
.name { | ||
margin-bottom: 0; | ||
margin-top: 20px; | ||
font-size: 16px; | ||
letter-spacing: 0.128em; | ||
} | ||
|
||
@keyframes dash { | ||
to { | ||
stroke-dashoffset: 0; | ||
} | ||
} | ||
|
||
@keyframes alek-in { | ||
from { | ||
opacity: 0; | ||
margin-top: -30px; | ||
} | ||
to { | ||
} | ||
} | ||
|
||
@keyframes blink { | ||
0% { | ||
opacity: 0; | ||
} | ||
10% { | ||
opacity: 100%; | ||
} | ||
30% { | ||
opacity: 0; | ||
} | ||
40% { | ||
opacity: 100%; | ||
} | ||
60% { | ||
opacity: 0; | ||
} | ||
80% { | ||
opacity: 100%; | ||
} | ||
} | ||
|
||
@keyframes glow { | ||
to { | ||
filter: drop-shadow(0px 0px 4px rgba(255, 221, 69, 0.6)) | ||
drop-shadow(0px 0px 15px rgba(255, 10, 100, 1)); | ||
} | ||
} | ||
|
||
.broken { | ||
animation: broken 4s infinite; | ||
} | ||
|
||
@keyframes broken { | ||
1% { | ||
opacity: .1 | ||
} | ||
2% { | ||
opacity: 1 | ||
} | ||
3% { | ||
opacity: .4 | ||
} | ||
4% { | ||
opacity: .4 | ||
} | ||
6% { | ||
opacity: 1 | ||
} | ||
8% { | ||
opacity: 1 | ||
} | ||
9% { | ||
opacity: .4 | ||
} | ||
12% { | ||
opacity: .4 | ||
} | ||
13% { | ||
opacity: 1 | ||
} | ||
} | ||
</style> | ||
<link rel="preconnect" href="https://fonts.googleapis.com" /> | ||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> | ||
<link | ||
href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap" | ||
rel="stylesheet" | ||
/> | ||
</head> | ||
<body> | ||
<div class="intro"> | ||
<div class="logo-full svg-shadow"> | ||
<svg | ||
class="alek-logo" | ||
xmlns="http://www.w3.org/2000/svg" | ||
xmlns:xlink="http://www.w3.org/1999/xlink" | ||
viewBox="0 0 627 627" | ||
> | ||
<defs> | ||
<clipPath id="uuid-e78cf07c-5296-4015-b7be-d1373f5ef3ed"> | ||
<polygon | ||
points="383.98 228.96 325.51 312.94 438.11 474.68 555.04 474.68 383.98 228.96" | ||
fill="none" | ||
/> | ||
</clipPath> | ||
<clipPath id="uuid-c8667381-0771-42b6-96ee-8c9746b688d4"> | ||
<polygon | ||
points="466.95 69.52 350.02 69.52 67.96 474.68 254.89 474.68 317.22 385.15 247.22 385.15 466.95 69.52" | ||
fill="none" | ||
/> | ||
</clipPath> | ||
</defs> | ||
<g clip-path="url(#uuid-e78cf07c-5296-4015-b7be-d1373f5ef3ed)"> | ||
<line | ||
x1="321.5" | ||
y1="228.5" | ||
x2="527.5" | ||
y2="515.5" | ||
fill="none" | ||
stroke-miterlimit="10" | ||
stroke-width="110" | ||
class="one" | ||
/> | ||
</g> | ||
<g clip-path="url(#uuid-c8667381-0771-42b6-96ee-8c9746b688d4)"> | ||
<polyline | ||
points="325.51 431 161 431 440.27 29.6" | ||
fill="none" | ||
stroke-miterlimit="10" | ||
stroke-width="110" | ||
class="two" | ||
/> | ||
</g> | ||
</svg> | ||
</div> | ||
|
||
<div class="alek-logo-type"> | ||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 140.48 24.92" class="svg-shadow"> | ||
<polygon points="11.46 0 0 24.92 2.67 24.92 12.55 3.12 22.47 24.92 25.14 24.92 13.67 0 11.46 0" fill="currentColor"/> | ||
<polygon points="47.36 0 44.9 0 44.9 24.92 61.31 24.92 61.31 22.64 47.36 22.64 47.36 0" fill="currentColor"/> | ||
<g class="broken"> | ||
<rect x="81.32" width="17.41" height="2.28" fill="currentColor"/> | ||
<rect x="81.32" y="11.15" width="17.41" height="2.25" fill="currentColor"/> | ||
<rect x="81.32" y="22.64" width="17.41" height="2.28" fill="currentColor"/> | ||
</g> | ||
<g> | ||
<polygon points="128.8 11.37 139.81 0 136.7 0 125.63 11.41 137.42 24.92 140.48 24.92 128.8 11.37" fill="currentColor"/> | ||
<rect x="119.61" width="2.46" height="24.92" fill="currentColor"/> | ||
</g> | ||
</svg> | ||
</div> | ||
<div class="who-i-am"> | ||
<p> | ||
<span class="name"><span class="bold">Aleksei</span> Polechin</span | ||
><br /> | ||
<strong class="job">Front-end developer</strong><br /> | ||
with graphic design skills | ||
</p> | ||
<!--<button>Download CV.pdf</button>--> | ||
|
||
<div class="social-links"> | ||
<a | ||
class="profile-link" | ||
href="https://www.linkedin.com/in/aleksei-polechin/" | ||
target="_blank" | ||
title="Get in touch on LinkedIn" | ||
> | ||
<svg | ||
xmlns="http://www.w3.org/2000/svg" | ||
class="icon" | ||
viewBox="0 0 448 512" | ||
> | ||
<path | ||
fill="currentColor" | ||
d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z" | ||
></path> | ||
</svg> | ||
</a> | ||
<a | ||
class="profile-link" | ||
href="https://github.com/alekart" | ||
target="_blank" | ||
title="Check out my code on GitHub" | ||
> | ||
<svg | ||
xmlns="http://www.w3.org/2000/svg" | ||
class="icon" | ||
viewBox="0 0 496 512" | ||
> | ||
<path | ||
fill="currentColor" | ||
d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z" | ||
></path> | ||
</svg> | ||
</a> | ||
</div> | ||
<p class="skills">Angular, TypeScript, JavaScript, NodeJs, Adobe Suite</p> | ||
</p> | ||
</div> | ||
</div> | ||
<div class="footer">© Aleksei Polechin</div> | ||
</body> | ||
</html> | ||
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Alek - Aleksei Polechin - Front-end developer with graphic design skills</title><meta name="description" content="Experienced Software Developer adept in bringing forth expertise in design, installation, testing and maintenance of web based software systems. Able to effectively self-manage during independent projects, as well as collaborate as part of a productive team"><meta content="width=device-width, initial-scale=1" name="viewport"><link rel="shortcut icon" href="favicon.a96a3052.png"><link rel="stylesheet" href="main.933950f7.css"><link rel="preconnect" href="https://fonts.googleapis.com"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin=""><link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet"><script async src="https://www.googletagmanager.com/gtag/js?id=GTM-PTQZFMH"></script><script>function a(){dataLayer.push(arguments)}window.dataLayer=window.dataLayer||[],a("js",new Date),a("config","GTM-PTQZFMH");</script></head><body> | ||
|
||
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-PTQZFMH" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript> | ||
<main class="intro"> <div class="logo-full svg-shadow"> <svg class="alek-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 627 627"><defs><clipPath id="a"><polygon points="383.98 228.96 325.51 312.94 438.11 474.68 555.04 474.68 383.98 228.96" fill="none"/></clipPath><clipPath id="b"><polygon points="466.95 69.52 350.02 69.52 67.96 474.68 254.89 474.68 317.22 385.15 247.22 385.15 466.95 69.52" fill="none"/></clipPath></defs><g clip-path="url(#a)"><line x1="321.5" y1="228.5" x2="527.5" y2="515.5" fill="none" class="logo-line logo-line--two"/></g><g clip-path="url(#b)"><polyline points="325.51 431 161 431 440.27 29.6" fill="none" class="logo-line logo-line--one"/></g></svg> </div> <div class="alek-logo-type"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 140.48 24.92" class="svg-shadow"><polygon points="11.46 0 0 24.92 2.67 24.92 12.55 3.12 22.47 24.92 25.14 24.92 13.67 0 11.46 0" fill="currentColor"/><polygon points="47.36 0 44.9 0 44.9 24.92 61.31 24.92 61.31 22.64 47.36 22.64 47.36 0" fill="currentColor"/><g class="broken" fill="currentColor"><rect x="81.32" width="17.41" height="2.28"/><rect x="81.32" y="11.15" width="17.41" height="2.25"/><rect x="81.32" y="22.64" width="17.41" height="2.28"/></g><g fill="currentColor"><polygon points="128.8 11.37 139.81 0 136.7 0 125.63 11.41 137.42 24.92 140.48 24.92 128.8 11.37"/><rect x="119.61" width="2.46" height="24.92"/></g></svg> </div> <div class="who-i-am"> <p> <span class="name"><span class="bold">Aleksei</span> Polechin</span><br> <strong class="job">Front-end developer</strong><br> with graphic design skills </p> <a class="btn" data-t="cv-download" target="_blank" href="__/assets/aleksei-polechin-cv.pdf">Download CV</a> <div class="social-links"> <a class="profile-link" href="https://www.linkedin.com/in/aleksei-p/" target="_blank" data-t="linkedin-link"> <span class="sr-only"> Get in touch on LinkedIn </span> <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 448 512"><path fill="currentColor" d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"/></svg> | ||
</a> | ||
<a class="profile-link" href="https://github.com/alekart" target="_blank" data-t="github-link"> <span class="sr-only"> Check out my code on GitHub </span> <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 496 512"><path fill="currentColor" d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"/></svg> | ||
</a> </div> <p class="skills">Angular, TypeScript, JavaScript, NodeJs, Adobe Suite</p> </div> </main> <script src="scripts.22b2e209.js"></script> | ||
</body></html> |
Oops, something went wrong.