update the thing
This commit is contained in:
+54
-6
@@ -72,6 +72,54 @@
|
|||||||
text-decoration: underline solid;
|
text-decoration: underline solid;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.button {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 3px 6px;
|
||||||
|
font-size: 16px;
|
||||||
|
text-align: center;
|
||||||
|
color: white;
|
||||||
|
background-color: black;
|
||||||
|
border: 1px solid white;
|
||||||
|
cursor: pointer;
|
||||||
|
text-decoration: none;
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.shiny {
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.shiny::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: -110%;
|
||||||
|
width: 110%;
|
||||||
|
height: 100%;
|
||||||
|
background: rgba(255, 255, 255, 0.5);
|
||||||
|
transform: skewX(-30deg);
|
||||||
|
animation: shine 5s infinite;
|
||||||
|
animation-delay: 5s;
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes shine {
|
||||||
|
0% {
|
||||||
|
left: -110%;
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
10% {
|
||||||
|
visibility: visible;
|
||||||
|
left: 110%;
|
||||||
|
}
|
||||||
|
|
||||||
|
100% {
|
||||||
|
left: 110%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
div.buttons {
|
div.buttons {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
@@ -120,8 +168,7 @@
|
|||||||
'who are you',
|
'who are you',
|
||||||
'lorem ipsum dolor sit amet',
|
'lorem ipsum dolor sit amet',
|
||||||
'hot garfields in your area',
|
'hot garfields in your area',
|
||||||
'don\'t forget to drink water',
|
'remember to drink water',
|
||||||
'do you like hurting other people?',
|
|
||||||
];
|
];
|
||||||
function setRandomText() {
|
function setRandomText() {
|
||||||
document.querySelector('#quote').textContent = texts[Math.floor(Math.random() * texts.length)];
|
document.querySelector('#quote').textContent = texts[Math.floor(Math.random() * texts.length)];
|
||||||
@@ -129,7 +176,7 @@
|
|||||||
document.addEventListener('DOMContentLoaded', setRandomText);
|
document.addEventListener('DOMContentLoaded', setRandomText);
|
||||||
</script>
|
</script>
|
||||||
<script>
|
<script>
|
||||||
const characters = ['♙', '♟'];
|
const characters = ['◇', '◆'];
|
||||||
let currentIndex = 0;
|
let currentIndex = 0;
|
||||||
function cycleText() {
|
function cycleText() {
|
||||||
document.querySelector('#bullet').textContent = characters[currentIndex];
|
document.querySelector('#bullet').textContent = characters[currentIndex];
|
||||||
@@ -147,8 +194,9 @@
|
|||||||
</div>
|
</div>
|
||||||
<hr class="separator">
|
<hr class="separator">
|
||||||
<div class="box">
|
<div class="box">
|
||||||
|
<script>let hire_me_message = "hey!\ncould use a second pair of hands with something? programming, sys administration, or otherwise technical?\n\ni would love to work with/for you! reach out to me via email [me@futile.eu] (even just to exchange info for another platform)! paying me is optional, just be upfront with what you wish to do."</script>
|
||||||
<p class="content">
|
<p class="content">
|
||||||
hello, my name is futile. i am a weird concept from the internet (or a person from europe, depending on who you ask).<br><br>i like programming (mostly rust), computers, linux, malicious software like game hacks and malware, and any vehicle whether it drives or flies.<br><br>if you want to contact me, email <a class="click" href="mailto:me@futile.eu">me@futile.eu</a>
|
hello, my name is futile. i am a weird concept from the internet (or a person from europe, depending on who you ask).<br><br>i like programming (mostly rust), computers, linux, malicious software like game hacks and malware, and any vehicle whether it drives or flies.<br><br>everything i know about the aforementioned things is self-taught. i also speak both english and russian fluently.<br><br>if you want to contact me, email <a class="click" href="mailto:me@futile.eu">me@futile.eu</a><br><br><a class="button shiny" onclick="alert(hire_me_message)">hire me!</a>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div style="position: absolute; bottom: 0; left: 0; right: 0;">
|
<div style="position: absolute; bottom: 0; left: 0; right: 0;">
|
||||||
@@ -156,7 +204,7 @@
|
|||||||
<ul class="buttons">
|
<ul class="buttons">
|
||||||
<li><a href="https://futile.eu"><img src="buttons/futile.png" width="88px" height="31px" alt="button that says 'futile' in white, grotesque font, on a black background, with a white outline | by futile"></a></li>
|
<li><a href="https://futile.eu"><img src="buttons/futile.png" width="88px" height="31px" alt="button that says 'futile' in white, grotesque font, on a black background, with a white outline | by futile"></a></li>
|
||||||
<li><a href="https://xenia.blahaj.land/"><img src="buttons/rose_88x31.png" width="88px" height="31px" alt="button that says 'rose' with a rose growing out of the 'o', with milk-chan to the right of the text | by rose"></a></li>
|
<li><a href="https://xenia.blahaj.land/"><img src="buttons/rose_88x31.png" width="88px" height="31px" alt="button that says 'rose' with a rose growing out of the 'o', with milk-chan to the right of the text | by rose"></a></li>
|
||||||
<li><iframe src="//incr.easrng.net/badge?key=futile" style="background: url(https://incr.easrng.net/bg.gif)" title="increment badge" width="88" height="31" frameborder="0"></iframe></li>
|
<li><iframe src="https://incr.easrng.net/badge?key=futile" style="background: url(https://incr.easrng.net/bg.gif)" title="increment badge" width="88" height="31" frameborder="0"></iframe></li>
|
||||||
<li><a href="https://fedoraproject.org/spins/kde"><img src="buttons/fedora.png" width="88px" height="31px" alt="button that says 'powered by fedora' in white and blue, with the fedora logo to the left | by unknown; retouched by futile"></a></li>
|
<li><a href="https://fedoraproject.org/spins/kde"><img src="buttons/fedora.png" width="88px" height="31px" alt="button that says 'powered by fedora' in white and blue, with the fedora logo to the left | by unknown; retouched by futile"></a></li>
|
||||||
<li><a href="https://mozilla.org/firef x"><img src="buttons/firefox4.gif" width="88px" height="31px" alt="button that flashes between the texts 'tested on' and 'firefox' in firefox's orange, yellow, and purple scheme, with the firefox logo to the left | by unknown"></a></li>
|
<li><a href="https://mozilla.org/firef x"><img src="buttons/firefox4.gif" width="88px" height="31px" alt="button that flashes between the texts 'tested on' and 'firefox' in firefox's orange, yellow, and purple scheme, with the firefox logo to the left | by unknown"></a></li>
|
||||||
<li><a href="https://vscodium.com"><img src="buttons/vscodium.com.png" width="88px" height="31px" alt="button that says 'made with vscodium' in light blue, with the vscodium logo to the right | by unknown"></a></li>
|
<li><a href="https://vscodium.com"><img src="buttons/vscodium.com.png" width="88px" height="31px" alt="button that says 'made with vscodium' in light blue, with the vscodium logo to the right | by unknown"></a></li>
|
||||||
@@ -168,7 +216,7 @@
|
|||||||
<div class="footer">
|
<div class="footer">
|
||||||
<p id="quote">who are you</p>
|
<p id="quote">who are you</p>
|
||||||
<p id="bullet" style="user-select: none;">◇</p>
|
<p id="bullet" style="user-select: none;">◇</p>
|
||||||
<p><a class="click" target="_blank" href="https://codeberg.org/futile">codeberg</a></p>
|
<p><a class="click" target="_blank" href="https://codeberg.org/futile">git</a></p>
|
||||||
<p><a class="click" target="_blank" href="https://steamcommunity.com/id/elituf">steam</a></p>
|
<p><a class="click" target="_blank" href="https://steamcommunity.com/id/elituf">steam</a></p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user