Compare commits
No commits in common. "8919e8f1a25a79a1ce328c3df662037ffb4e1db8" and "1bb0efc749f515061485b3b9cecff4a09f9260d8" have entirely different histories.
8919e8f1a2
...
1bb0efc749
116
css/style.css
|
@ -3,16 +3,6 @@
|
||||||
src: url(../css/ProblematicPiercer.ttf);
|
src: url(../css/ProblematicPiercer.ttf);
|
||||||
}
|
}
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: Caveat;
|
|
||||||
src: url(../css/Caveat-Regular.ttf);
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: Whypo-rrey;
|
|
||||||
src: url(../css/Whypo-rrey.ttf);
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
body {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
@ -26,108 +16,6 @@ body {
|
||||||
font-family: ProblematicPiercer;
|
font-family: ProblematicPiercer;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.row {
|
div.test {
|
||||||
display: flex;
|
font-size: 100px;
|
||||||
flex-direction: row;
|
|
||||||
width: 1000px;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.photo {
|
|
||||||
border-radius: 300px;
|
|
||||||
box-shadow: rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px;
|
|
||||||
background-image: url(../images/favicon.jpg);
|
|
||||||
width: 300px;
|
|
||||||
height: 300px;
|
|
||||||
background-size: contain;
|
|
||||||
margin-right: 80px;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.info {
|
|
||||||
display: flex;
|
|
||||||
width: 620px;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.title {
|
|
||||||
font-size: 50px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.bio {
|
|
||||||
font-family: Caveat;
|
|
||||||
font-size: 25px;
|
|
||||||
text-align: justify;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.social {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
margin-top: 100px;
|
|
||||||
width: 800px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social div {
|
|
||||||
width: 50px;
|
|
||||||
height: 50px;
|
|
||||||
background-size: contain;
|
|
||||||
cursor: pointer;
|
|
||||||
transition: 0.2s;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social div:hover {
|
|
||||||
transform: scale(1.5);
|
|
||||||
}
|
|
||||||
|
|
||||||
.mastodon { background-image: url(../images/social/mastodon-off.png); }
|
|
||||||
.mastodon:hover { background-image: url(../images/social/mastodon-on.png); }
|
|
||||||
.twitter { background-image: url(../images/social/twitter-off.png); }
|
|
||||||
.twitter:hover { background-image: url(../images/social/twitter-on.png); }
|
|
||||||
.linkedin { background-image: url(../images/social/linkedin-off.png); }
|
|
||||||
.linkedin:hover { background-image: url(../images/social/linkedin-on.png); }
|
|
||||||
.facebook { background-image: url(../images/social/facebook-off.png); }
|
|
||||||
.facebook:hover { background-image: url(../images/social/facebook-on.png); }
|
|
||||||
.instagram { background-image: url(../images/social/instagram-off.png); }
|
|
||||||
.instagram:hover { background-image: url(../images/social/instagram-on.png); }
|
|
||||||
.git { background-image: url(../images/social/git-off.png); }
|
|
||||||
.git:hover { background-image: url(../images/social/git-on.png); }
|
|
||||||
.github { background-image: url(../images/social/github-off.png); }
|
|
||||||
.github:hover { background-image: url(../images/social/github-on.png); }
|
|
||||||
.telegram { background-image: url(../images/social/telegram-off.png); }
|
|
||||||
.telegram:hover { background-image: url(../images/social/telegram-on.png); }
|
|
||||||
.solus { background-image: url(../images/social/linux-off.png); }
|
|
||||||
.solus:hover { background-image: url(../images/social/linux-on.png); }
|
|
||||||
.blog { background-image: url(../images/social/blog-off.png); }
|
|
||||||
.blog:hover { background-image: url(../images/social/blog-on.png); }
|
|
||||||
.ftp { background-image: url(../images/social/ftp-off.png); }
|
|
||||||
.ftp:hover { background-image: url(../images/social/ftp-on.png); }
|
|
||||||
.email { background-image: url(../images/social/email-off.png); }
|
|
||||||
.email:hover { background-image: url(../images/social/email-on.png); }
|
|
||||||
|
|
||||||
.tooltip {
|
|
||||||
position: relative;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tooltip .tooltiptext {
|
|
||||||
visibility: hidden;
|
|
||||||
width: 120px;
|
|
||||||
left: 50%;
|
|
||||||
margin-left: -60px;
|
|
||||||
color: #000000;
|
|
||||||
text-align: center;
|
|
||||||
padding: 5px 0;
|
|
||||||
position: absolute;
|
|
||||||
z-index: 1;
|
|
||||||
top: 110%;
|
|
||||||
opacity: 0;
|
|
||||||
transition: opacity 1s;
|
|
||||||
font-family: Whypo-rrey;
|
|
||||||
}
|
|
||||||
|
|
||||||
.tooltip:hover .tooltiptext {
|
|
||||||
visibility: visible;
|
|
||||||
opacity: 1;
|
|
||||||
}
|
}
|
Before Width: | Height: | Size: 6.4 KiB |
Before Width: | Height: | Size: 10 KiB |
Before Width: | Height: | Size: 5.2 KiB |
Before Width: | Height: | Size: 6.4 KiB |
Before Width: | Height: | Size: 5.7 KiB |
Before Width: | Height: | Size: 6.8 KiB |
Before Width: | Height: | Size: 6.1 KiB |
Before Width: | Height: | Size: 9.2 KiB |
Before Width: | Height: | Size: 5.4 KiB |
Before Width: | Height: | Size: 8.0 KiB |
Before Width: | Height: | Size: 9.6 KiB |
Before Width: | Height: | Size: 14 KiB |
Before Width: | Height: | Size: 10 KiB |
Before Width: | Height: | Size: 18 KiB |
Before Width: | Height: | Size: 4.8 KiB |
Before Width: | Height: | Size: 7.0 KiB |
Before Width: | Height: | Size: 10 KiB |
Before Width: | Height: | Size: 18 KiB |
Before Width: | Height: | Size: 7.0 KiB |
Before Width: | Height: | Size: 11 KiB |
Before Width: | Height: | Size: 7.7 KiB |
Before Width: | Height: | Size: 14 KiB |
Before Width: | Height: | Size: 9.8 KiB |
Before Width: | Height: | Size: 12 KiB |
27
index.html
|
@ -11,31 +11,6 @@
|
||||||
<script src="js/script.js"></script>
|
<script src="js/script.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="row">
|
<div class="test">Page in development</div>
|
||||||
<div class="photo"></div>
|
|
||||||
<div class="info">
|
|
||||||
<div class="title">About me</div>
|
|
||||||
<div class="bio">
|
|
||||||
<p>Hi there!</p>
|
|
||||||
<p>I'm Alexander Zhirov from Russia! I am engaged in development in C/C++ and D, study Linux, share and contribute to the spread of the philosophy of Open Source software.</p>
|
|
||||||
<p>In my free time I read books, do music and sports.</p>
|
|
||||||
<p>If you have any questions or suggestions, you can always contact me.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="row social">
|
|
||||||
<div class="tooltip mastodon"><span class="tooltiptext">Mastodon</span></div>
|
|
||||||
<div class="tooltip twitter"><span class="tooltiptext">Twitter</span></div>
|
|
||||||
<div class="tooltip linkedin"><span class="tooltiptext">LinkedIn</span></div>
|
|
||||||
<div class="tooltip facebook"><span class="tooltiptext">Facebook</span></div>
|
|
||||||
<div class="tooltip instagram"><span class="tooltiptext">Instagram</span></div>
|
|
||||||
<div class="tooltip telegram"><span class="tooltiptext">Telegram</span></div>
|
|
||||||
<div class="tooltip git"><span class="tooltiptext">Git</span></div>
|
|
||||||
<div class="tooltip github"><span class="tooltiptext">GitHub</span></div>
|
|
||||||
<div class="tooltip solus"><span class="tooltiptext">Solus Linux</span></div>
|
|
||||||
<!-- <div class="tooltip blog"><span class="tooltiptext">Blog</span></div> -->
|
|
||||||
<!-- <div class="tooltip ftp"><span class="tooltiptext">FTP</span></div> -->
|
|
||||||
<!-- <div class="tooltip email"><span class="tooltiptext">Email</span></div> -->
|
|
||||||
</div>
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
51
js/script.js
|
@ -1,52 +1,3 @@
|
||||||
$(document).ready(function(){
|
$(document).ready(function(){
|
||||||
$(this).on("contextmenu", e => e.preventDefault());
|
$('body').delay(500).fadeTo(500, 1);
|
||||||
$("body").delay(500).fadeTo(500, 1);
|
|
||||||
|
|
||||||
$(".mastodon").on( "click", function() {
|
|
||||||
window.open("https://fosstodon.org/@alexanderzhirov");
|
|
||||||
});
|
|
||||||
|
|
||||||
$(".twitter").on( "click", function() {
|
|
||||||
window.open("https://twitter.com/zhirofficial");
|
|
||||||
});
|
|
||||||
|
|
||||||
$(".linkedin").on( "click", function() {
|
|
||||||
window.open("https://www.linkedin.com/in/alexander-zhirov-34b6711a6");
|
|
||||||
});
|
|
||||||
|
|
||||||
$(".facebook").on( "click", function() {
|
|
||||||
window.open("https://www.facebook.com/azhirov1991");
|
|
||||||
});
|
|
||||||
|
|
||||||
$(".instagram").on( "click", function() {
|
|
||||||
window.open("https://www.instagram.com/alexanderzhirov");
|
|
||||||
});
|
|
||||||
|
|
||||||
$(".git").on( "click", function() {
|
|
||||||
window.open("https://git.zhirov.kz/alexander");
|
|
||||||
});
|
|
||||||
|
|
||||||
$(".github").on( "click", function() {
|
|
||||||
window.open("https://github.com/AlexanderZhirov");
|
|
||||||
});
|
|
||||||
|
|
||||||
$(".telegram").on( "click", function() {
|
|
||||||
window.open("https://t.me/alexanderzhirov");
|
|
||||||
});
|
|
||||||
|
|
||||||
$(".solus").on( "click", function() {
|
|
||||||
window.open("https://dev.getsol.us/p/alexanderzhirov");
|
|
||||||
});
|
|
||||||
|
|
||||||
$(".blog").on( "click", function() {
|
|
||||||
window.open("https://blog.zhirov.kz");
|
|
||||||
});
|
|
||||||
|
|
||||||
$(".ftp").on( "click", function() {
|
|
||||||
window.open("https://ftp.zhirov.kz");
|
|
||||||
});
|
|
||||||
|
|
||||||
$(".email").on( "click", function() {
|
|
||||||
window.open("");
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
|
|