Skip to content

Commit

Permalink
Update index.html
Browse files Browse the repository at this point in the history
  • Loading branch information
@d4tis
d4tis authored Feb 12, 2024
1 parent e4e7301 commit 26e44dd
Showing 1 changed file with 43 additions and 110 deletions.
153 changes: 43 additions & 110 deletions index.html
View file
Original file line number Diff line number Diff line change
@@ -1,117 +1,50 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>d4tis.me</title>
<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=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap" rel="stylesheet">
<style>
body{font-family:'Ubuntu',Arial,sans-serif;margin:0;padding:0;background-color:#000;text-align:center;color:#fff;}
.header{background-color:#333;color:#fff;padding:5px;font-weight:bold;}
.profile-picture{border-radius:50%;width:130px;height:130px;margin:20px auto 1px auto;background-color:#333;border:6px solid #333;overflow:hidden;}
.profile-picture img{width:100%;height:100%;object-fit:cover;}
.container{padding:20px;margin-bottom:20px;}
h1,h2,p,a{color:#fff;font-weight:bold;text-decoration:none;}
a:hover{text-decoration:none;}
.cta-button{display:inline-block;padding:10px 20px;background-color:#333;color:#000;text-decoration:none;border-radius:20px;transition:background-color 0.3s ease,color 0.3s ease;margin:10px;font-size:16px;}
.cta-button:hover{background-color:#666;}
.footer{background-color:#000;padding:10px;font-size:13px;position:fixed;bottom:40px;right:20px;width:calc(100% - 40px);margin-top:-40px;text-align:center;}
.footer a{color:#fff;text-decoration:none;}
.footer a:hover{text-decoration:underline;}
.ping-button{display:block;width:40px;height:40px;background-image:url('bitcoin-btc-logo.png');background-size:cover;background-repeat:no-repeat;position:fixed;bottom:80px;left:50%;transform:translateX(-50%);z-index:999;animation:flash 3s infinite;}
@keyframes flash{0%{opacity:1;}50%{opacity:0;}100%{opacity:1;}}

/* QR code popup styles */
.popup {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(51, 51, 51, 0.9); /* Dark gray with some transparency */
z-index: 1000;
overflow: auto;
display: flex;
justify-content: center;
align-items: center;
}

.popup-content {
background-color: #333; /* Dark gray */
border: 2px solid #333;
padding: 20px;
max-width: 80%;
max-height: 80%;
overflow: auto;
position: relative; /* Ensure relative positioning for the close button */
}

.popup img {
max-width: 100%;
max-height: 100%;
}

.popup-close {
position: absolute;
top: 5px;
right: 10px;
cursor: pointer;
color: #fff; /* White color for the close button */
}
</style>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>d4tis.me</title>
<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=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap" rel="stylesheet">
<style>
body{font-family:'Ubuntu',Arial,sans-serif;margin:0;padding:0;background-color:#000;text-align:center;color:#fff;}
.header{background-color:#333;color:#fff;padding:5px;font-weight:bold;}
.profile-picture{border-radius:50%;width:130px;height:130px;margin:20px auto 1px auto;background-color:#333;border:6px solid #333;overflow:hidden;}
.profile-picture img{width:100%;height:100%;object-fit:cover;}
.container{padding:20px;margin-bottom:20px;}
h1,h2,p,a{color:#fff;font-weight:bold;text-decoration:none;}
a:hover{text-decoration:none;}
.cta-button{display:inline-block;padding:10px 20px;background-color:#333;color:#000;text-decoration:none;border-radius:20px;transition:background-color 0.3s ease,color 0.3s ease;margin:10px;font-size:16px;}
.cta-button:hover{background-color:#666;}
.footer{background-color:#000;padding:10px;font-size:13px;position:fixed;bottom:40px;right:20px;width:calc(100% - 40px);margin-top:-40px;text-align:center;}
.footer a{color:#fff;text-decoration:none;}
.footer a:hover{text-decoration:underline;}
.ping-button{display:block;width:40px;height:40px;background-image:url('bitcoin-btc-logo.png');background-size:cover;background-repeat:no-repeat;position:fixed;bottom:80px;left:50%;transform:translateX(-50%);z-index:999;animation:flash 3s infinite;}
@keyframes flash{0%{opacity:1;}50%{opacity:0;}100%{opacity:1;}}
.small-text{font-size:19px;}
</style>
</head>
<body>
<div class="header">
<h1>Daniel Fortis</h1>
</div>
<div class="profile-picture">
<img src="profile.jpg" alt="Profile Picture">
</div>
<div class="container">
<h2><a href="lightning:zap@d4tis.me" style="text-decoration:none;color:inherit;" class="small-text">⚡ zap@d4tis.me ⚡</a></h2>
<br>
<a href="https://x.com/d4tis_" class="cta-button">X</a>
<a href="https://primal.net/p/npub1cx2wtu40pu4xzu0qmcz0mkfup3uk86pztnkyjkq3nfr9ghvxe9xsafsp6k" class="cta-button">nostr</a>
<a href="https://www.linkedin.com/in/d4tis" class="cta-button">in</a>
<br/>
<a href="https://revolut.me/d4tis" class="cta-button">£££</a>
<!-- Added id for LNURL button -->
<a href="#lnurl" class="cta-button lnurl-button" onclick="openPopup()">lnurl</a>
</div>
<div class="footer" style="bottom: 15px;">
<p><a href="https://m.youtube.com/shorts/WnjLUG1bgH4" target="_blank">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Inflation=Theft</a></p>
</div>

<!-- QR code popup -->
<div class="popup" id="qr-popup">
<div class="popup-content">
<span class="popup-close" id="popup-close">&times;</span>
<img src="qr_code.png" alt="QR Code">
<p><a href="lightning:lnurl1dp68gurn8ghj7ampd3kx2ar0veekzar0wd5xjtnrdakj7tnhv4kxctttdehhwm30d3h82unvwqhkgdr5d9eszvfds0">Scan or Click</a></p>
</div>
</div>

<script>
document.addEventListener("DOMContentLoaded", function() {
// JavaScript to handle LNURL button click
var lnurlButton = document.querySelector('.lnurl-button');

if (lnurlButton) {
lnurlButton.addEventListener('click', openPopup);
}

// Close popup when close button is clicked
document.getElementById('popup-close').addEventListener('click', function() {
document.getElementById('qr-popup').style.display = 'none';
});
});

function openPopup() {
document.getElementById('qr-popup').style.display = 'flex';
}
</script>
<div class="header">
<h1>Daniel Fortis</h1>
</div>
<div class="profile-picture">
<img src="profile.jpg" alt="Profile Picture">
</div>
<div class="container">
<h2><a href="lightning:zap@d4tis.me" style="text-decoration:none;color:inherit;" class="small-text">⚡ zap@d4tis.me ⚡</a></h2>
<br>
<a href="https://x.com/d4tis_" class="cta-button">X</a>
<a href="https://primal.net/p/npub1cx2wtu40pu4xzu0qmcz0mkfup3uk86pztnkyjkq3nfr9ghvxe9xsafsp6k" class="cta-button">nostr</a>
<a href="https://www.linkedin.com/in/d4tis" class="cta-button">in</a>
<br/>
<a href="https://revolut.me/d4tis" class="cta-button">£££</a>
<a href="lightning:lnurl1dp68gurn8ghj7ampd3kx2ar0veekzar0wd5xjtnrdakj7tnhv4kxctttdehhwm30d3h82unvwqhkgdr5d9eszvfds0" class="cta-button">lnurl</a>
</div>
<div class="footer" style="bottom: 15px;">
<p><a href="https://m.youtube.com/shorts/WnjLUG1bgH4" target="_blank">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Inflation=Theft</a></p>
</div>
<a href="https://bitcoin.rocks" class="ping-button" target="_blank"></a>
</body>
</html>

0 comments on commit 26e44dd

Please sign in to comment.