dejvino/homepage
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Socials

Browse Source
This commit is contained in:
Dejvino 2026-05-19 20:26:17 +02:00
parent 26fa67a233
commit ff65b74864
2 changed files with 21 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
index.php
View File

@ -23,9 +23,7 @@ $nav_links = [
$hardware_info = "Playing the mandolin, mountain biking, 3D printing and tinkering.";
$extra_contact_links = [
"LinkedIn" => "https://www.linkedin.com/in/hrdinadavid/",
"GitHub" => "https://github.com/dejvino",
"StackOverflow" => "https://stackoverflow.com/users/3551523/dejvino",
"LinkedIn" => "https://cz.linkedin.com/in/dejvino",
];
/**
@ -121,18 +119,19 @@ $cv_skills = [
<address class="mono-addr">
Email: <span id="contact-mail">uncovering...</span>
</address>
<ul class="link-grid">
<?php foreach ($extra_contact_links as $label => $url): ?>
<li><a href="<?= $url ?>" target="_blank"><span><?= $label ?></span></a></li>
<?php endforeach; ?>
</ul>
<address class="mono-addr">
Socials:
<?php foreach ($extra_contact_links as $label => $url): ?>
<br><a href="<?= $url ?>" target="_blank"><?= $label ?></a>
<?php endforeach; ?>
</address>
</section>
<section class="card links">
<h2>Navigation</h2>
<ul class="link-grid">
<?php foreach ($nav_links as $label => $url): ?>
<li><a href="<?= $url ?>" target="_blank"><span><?= $label ?></span></a></li>
<li><a href="<?= trim($url) ?>" target="_blank"><span><?= $label ?></span></a></li>
<?php endforeach; ?>
</ul>
</section>
@ -208,32 +207,14 @@ $cv_skills = [
<script>
((u, d, t) => {
const addr = u + '@' + d + '.' + t;
const addr = (atob(u) + '@' + d + '.' + t).trim();
const el = document.getElementById("contact-mail");
el.innerHTML = `<a href="mailto:${addr}">${addr}</a>`;
})('<?= $email_user ?>', 'dejvino', 'cz');
if (el) el.innerHTML = `<a href="mailto:${addr}">${addr}</a>`;
})('<?= base64_encode($email_user) ?>', 'dejvino', 'cz');
const animationDuration = 500; // Matches CSS animation duration (0.5s)
const staggerDelay = 200; // Delay between each panel unrolling (ms)
const applyShifting = (el, flashAtEnd = true, delay = animationDuration) => {
if (!el) return;
const card = el.classList.contains('card') ? el : el.closest('.card');
if (card && !card.dataset.isShifting) {
card.dataset.isShifting = "true";
card.classList.add('shifting');
setTimeout(() => {
card.classList.remove('shifting');
delete card.dataset.isShifting;
if (!flashAtEnd) return;
card.classList.add('flash-glow');
setTimeout(() => card.classList.remove('flash-glow'), 600);
}, delay);
}
};
const toggleCV = (show, updateHash = true, animate = true) => {
const grid = document.querySelector('.bento-grid');
const labelText = document.getElementById('toggle-label-text');
@ -255,7 +236,6 @@ $cv_skills = [
el.classList.remove('hidden', 'fade-out', 'reveal');
void el.offsetWidth; // Force reflow
el.classList.add('reveal');
if (animate) applyShifting(el, true, animationDuration);
};
if (animate) setTimeout(reveal, index * staggerDelay);
else reveal();
@ -267,7 +247,6 @@ $cv_skills = [
el.classList.remove('reveal');
if (animate) {
el.classList.add('fade-out');
applyShifting(el, false);
setTimeout(() => {
el.classList.add('hidden');
el.classList.remove('fade-out');

23
style.css
View File

@ -35,8 +35,6 @@
max-height: 0;
transform: scale(0.95);
}
/* Start fading in early so the flash effect has content to highlight */
15% { opacity: 0.3; }
to {
opacity: 1;
max-height: 1000px; /* Reduced to match content better and speed up animation */
@ -191,13 +189,6 @@ body {
backface-visibility: hidden;
}
.shifting {
filter: blur(1px) grayscale(0.8) brightness(0.7);
z-index: 10;
pointer-events: none !important;
transition: filter 0.5s ease;
}
/* CV Specific Content Styles */
.cv-section {
background: rgba(0, 243, 255, 0.03);
@ -233,9 +224,13 @@ body {
margin-bottom: 4px;
}
.address.mono-addr {
address.mono-addr {
font-style: normal;
margin-bottom: 15px;
padding-top: 5px;
}
address.mono-addr span {
display: block;
}
.cv-title {
@ -273,8 +268,8 @@ body {
}
.skill-categories {
display: flex;
flex-direction: column;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 2rem;
padding: 1rem 0;
}
@ -321,7 +316,7 @@ body {
pointer-events: none;
}
.link-grid { list-style: none; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.link-grid { list-style: none; padding: 0; display: grid; gap: 10px; }
.link-grid a {
font-size: 0.75rem;
@ -426,6 +421,8 @@ h1 {
margin: 0;
font-size: clamp(1.5rem, 5vw, 2.2rem);
color: #fff;
text-shadow: 1px 1px var(--accent-color), -1px -1px var(--text-color), 0 0 15px rgba(255, 255, 255, 0.3);
letter-spacing: 1px;
}
h2 {