155 lines
4.9 KiB
HTML
155 lines
4.9 KiB
HTML
<!doctype html>
|
|
<html lang="en" data-bs-theme="dark">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Xalir.net</title>
|
|
|
|
<!-- Bootstrap CSS -->
|
|
<link rel="stylesheet" href="css/bootstrap.min.css" />
|
|
<link rel="stylesheet" href="css/overwrites.css" />
|
|
|
|
<!-- Font Awesome Icons (for social buttons) -->
|
|
<link
|
|
rel="stylesheet"
|
|
href="css/fontawesome-free-7.1.0-web/css/all.min.css"
|
|
/>
|
|
</head>
|
|
<body>
|
|
<!-- Main Container -->
|
|
<div class="container text-center">
|
|
<div class="row justify-content-center">
|
|
<div class="col-md-6">
|
|
<!-- Card for Centered Content -->
|
|
<div class="card">
|
|
<h1 class="card-title">Xalir</h1>
|
|
<p class="lead">
|
|
NixOS enjoyer
|
|
<img
|
|
src="assets/flake.png"
|
|
alt="Flake"
|
|
style="width: 24px; height: 24px; vertical-align: middle"
|
|
/>
|
|
</p>
|
|
<!-- Centered Social Links with Icons -->
|
|
<div class="d-flex flex-column align-items-center">
|
|
<a
|
|
rel="me"
|
|
href="https://tech.lgbt/@xalir"
|
|
class="btn btn-custom social-button mb-3"
|
|
><i class="fab fa-mastodon"></i>Mastodon</a
|
|
>
|
|
<a
|
|
href="mailto:contact@xalir.net"
|
|
class="btn btn-outline-custom social-button mb-3"
|
|
><i class="fas fa-envelope"></i>Email</a
|
|
>
|
|
<a
|
|
href="https://git.xalir.net/xalir"
|
|
class="btn btn-outline-custom social-button mb-3"
|
|
><i class="fab fa-github"></i>Git</a
|
|
>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- About Me Section -->
|
|
<div class="row justify-content-center">
|
|
<div class="col-md-8">
|
|
<div class="card mt-5">
|
|
<h2 class="section-title">About Me</h2>
|
|
<p>
|
|
Hi, I'm Xalir. I'm passionate about software development,
|
|
open-source contributions, and sharing knowledge with the
|
|
community. I love learning new things and building cool projects.
|
|
I want to get into embedded stuff and start fun little
|
|
microcontroller projects.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Lost+Found Section -->
|
|
<div class="row justify-content-center">
|
|
<div class="col-md-8">
|
|
<div class="card mt-5">
|
|
<h2 class="section-title">Lost+Found</h2>
|
|
<p class="lead">
|
|
Found something that belongs to me? Please send me a message!
|
|
</p>
|
|
<form id="lostFoundForm">
|
|
<div class="form-group">
|
|
<label for="item" class="form-label">Item Found</label>
|
|
<input
|
|
type="text"
|
|
class="form-control"
|
|
id="item"
|
|
name="item"
|
|
placeholder="What did you find?"
|
|
required
|
|
/>
|
|
</div>
|
|
<div class="form-group">
|
|
<label for="message" class="form-label">Your Message</label>
|
|
<textarea
|
|
class="form-control"
|
|
id="message"
|
|
name="message"
|
|
rows="4"
|
|
placeholder="Additional details..."
|
|
required
|
|
></textarea>
|
|
</div>
|
|
<button type="submit" class="btn btn-custom mt-3">
|
|
Send Message
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
// Handle form submission
|
|
document
|
|
.getElementById("lostFoundForm")
|
|
.addEventListener("submit", function (event) {
|
|
event.preventDefault();
|
|
|
|
var itemName = document.getElementById("item").value.trim();
|
|
var messageContent = document
|
|
.getElementById("message")
|
|
.value.trim();
|
|
|
|
if (itemName && messageContent) {
|
|
var subject = "Item found: " + itemName;
|
|
var body = messageContent;
|
|
|
|
var mailtoLink =
|
|
"mailto:gefunden@xalir.net?subject=" +
|
|
encodeURIComponent(subject) +
|
|
"&body=" +
|
|
encodeURIComponent(body);
|
|
|
|
window.location.href = mailtoLink;
|
|
} else {
|
|
alert("Please fill out both fields.");
|
|
}
|
|
});
|
|
</script>
|
|
</div>
|
|
|
|
<!-- Footer Section -->
|
|
<div class="footer">
|
|
<p>
|
|
© 2025 Xalir.net. All rights reserved. |
|
|
<a href="https://git.xalir.net/xalir" target="_blank">Git</a> |
|
|
<a href="mailto:contact@xalir.net">Email</a>
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Local Bootstrap JS -->
|
|
<script src="js/bootstrap.bundle.min.js"></script>
|
|
</body>
|
|
</html>
|