mirror of
https://codeberg.org/vlw/victorwesterlund.com.git
synced 2025-09-13 19:13:42 +02:00
65 lines
No EOL
2.1 KiB
HTML
65 lines
No EOL
2.1 KiB
HTML
<!-- Victor Westerlund - www.victorwesterlund.com -->
|
|
<style>
|
|
.button.copied {
|
|
pointer-events: none;
|
|
animation: beat 500ms forwards;
|
|
animation-delay: 200ms;
|
|
}
|
|
|
|
.button.copied svg,
|
|
.button.copied p:first-of-type {
|
|
opacity: 0;
|
|
}
|
|
|
|
.button.copied p:last-of-type {
|
|
position: absolute;
|
|
animation: slide 1000ms forwards;
|
|
}
|
|
|
|
@keyframes beat {
|
|
0% { transform: scale(1); }
|
|
25% { transform: scale(.95); }
|
|
55% { transform: scale(1.05); }
|
|
100% { transform: scale(1); }
|
|
}
|
|
|
|
@keyframes slide {
|
|
0% { transform: translateY(calc(var(--padding))); opacity: 0; }
|
|
30% { transform: translateY(0); opacity: 1; }
|
|
70% { transform: translateY(0); opacity: 1; }
|
|
100% { transform: translateY(calc(var(--padding) * -1)); opacity: 0; }
|
|
}
|
|
|
|
a.button {
|
|
color: var(--swatch-accent);
|
|
cursor: pointer;
|
|
}
|
|
|
|
a.button::before {
|
|
content: "tap ";
|
|
}
|
|
|
|
@media (max-width: 300px) {
|
|
.button.copied p:last-of-type {
|
|
display: initial;
|
|
}
|
|
}
|
|
|
|
@media (pointer: fine) {
|
|
a.button::before {
|
|
content: "click ";
|
|
}
|
|
}
|
|
</style>
|
|
<div class="button phantom" data-action="openPage" data-value="contact_email_pgp" data-type="card">
|
|
<svg xmlns="http://www.w3.org/2000/svg" height="24" width="24"><path d="M0 0h24v24H0z" fill="none"/><path d="M12.65 10C11.83 7.67 9.61 6 7 6c-3.31 0-6 2.69-6 6s2.69 6 6 6c2.61 0 4.83-1.67 5.65-4H17v4h4v-4h2v-4H12.65zM7 14c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z"/></svg>
|
|
<p>PGP key</p>
|
|
</div>
|
|
<p></p>
|
|
<h1>hello@victorwesterlund.com</h1>
|
|
<p>You can also <a class="button" href="mailto:hello@victorwesterlund.com?subject=Hello Victor!">here</a> to send a mail directly from your mail app</p>
|
|
<p></p>
|
|
<div class="button solid" data-action="copyText" data-value="hello@victorwesterlund.com">
|
|
<svg xmlns="http://www.w3.org/2000/svg" height="24" width="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M18 2H9c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h9c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H9V4h9v12zM3 15v-2h2v2H3zm0-5.5h2v2H3v-2zM10 20h2v2h-2v-2zm-7-1.5v-2h2v2H3zM5 22c-1.1 0-2-.9-2-2h2v2zm3.5 0h-2v-2h2v2zm5 0v-2h2c0 1.1-.9 2-2 2zM5 6v2H3c0-1.1.9-2 2-2z"/></svg>
|
|
<p>copy email</p>
|
|
</div> |