initial commit of v1
This commit is contained in:
Binary file not shown.
|
After Width: | Height: | Size: 2.7 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.8 MiB |
Binary file not shown.
|
After Width: | Height: | Size: 101 KiB |
@@ -0,0 +1,9 @@
|
||||
<?php
|
||||
$discordInvite = "SHPuNjJwhR";
|
||||
|
||||
$discordBase = "https://discord.gg/";
|
||||
$link = $discordBase . $discordInvite;
|
||||
|
||||
header("Location: " . $link);
|
||||
die();
|
||||
?>
|
||||
@@ -0,0 +1,383 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<link rel="shortcut icon" href="/assets/logo.ico" type="image/x-icon">
|
||||
|
||||
<script src="https://kit.fontawesome.com/d335d28046.js" crossorigin="anonymous"></script>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
||||
|
||||
<meta property="og:title" content="SiskelDev's Linktree">
|
||||
<meta property="og:description" content="See what i do, on what platform.">
|
||||
<meta property="og:image" content="https://siskel.dev/assets/img/profile-pic-transparent.png">
|
||||
<meta property="og:url" content="https://siskel.dev/">
|
||||
<meta property="og:site_name" content="Siskel.Dev">
|
||||
<meta property="og:type" content="website" />
|
||||
|
||||
<!-- Twitter Meta Data -->
|
||||
<meta name="twitter:title" content="SiskelDev's Linktree">
|
||||
<meta name="twitter:description" content="See what i do, on what platform.">
|
||||
<meta name="twitter:image" content="https://siskel.dev/assets/img/profile-pic-transparent.png">
|
||||
<meta name="twitter:card" content="summary">
|
||||
<meta name="twitter:site" content="@siskeldev">
|
||||
<meta name="twitter:creator" content="@siskeldev" />
|
||||
|
||||
<!-- Discord Meta Data -->
|
||||
<meta name="theme-color" content="#4c566a">
|
||||
|
||||
<title>SiskelDev's Linktree</title>
|
||||
|
||||
<meta name="robots" content="index, nofollow">
|
||||
|
||||
<meta name="description" content="See what i do, on what platform.">
|
||||
<meta name="keywords" content="SiskelDev siskel">
|
||||
<meta name="author" content="© SiskelDev 2023">
|
||||
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
|
||||
<style>
|
||||
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;700&display=swap");
|
||||
|
||||
*,
|
||||
*::before,
|
||||
::after {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
* {
|
||||
transition: 0.2s;
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 100%;
|
||||
box-sizing: border-box;
|
||||
scroll-behavior: smooth;
|
||||
/*background: linear-gradient(-150deg, rgb(118, 205, 231) 0%, rgb(112, 112, 240) 100%);*/
|
||||
}
|
||||
|
||||
body {
|
||||
font-size: 0.94rem;
|
||||
font-family: Poppins, Noto Sans, sans-serif;
|
||||
text-align: center;
|
||||
line-height: 1.5;
|
||||
background: #2e3440;
|
||||
color: lightgrey;
|
||||
}
|
||||
|
||||
main {
|
||||
padding: 12vh 0;
|
||||
}
|
||||
|
||||
img[alt="Linktree photo"] {
|
||||
--scale: 190px;
|
||||
width: var(--scale);
|
||||
height: var(--scale);
|
||||
border-radius: 24px;
|
||||
}
|
||||
|
||||
img[alt="Linktree photo"] + h3 {
|
||||
margin: 16px 0 0px;
|
||||
}
|
||||
|
||||
.linktree-nav {
|
||||
margin: 40px auto 0;
|
||||
width: 95%;
|
||||
max-width: 700px;
|
||||
}
|
||||
|
||||
.linktree-nav ul {
|
||||
display: grid;
|
||||
gap: 1rem;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
#notmine {
|
||||
display: grid;
|
||||
gap: 1rem;
|
||||
list-style: none;
|
||||
grid-template-columns: repeat(1, 1fr) !important;
|
||||
}
|
||||
|
||||
.linktree-nav a {
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.linktree-nav li:hover {
|
||||
box-shadow: 0px 0px 10px #606a81;
|
||||
}
|
||||
|
||||
.linktree-nav li:hover .icon-box {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
.linktree-nav li {
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.linktree-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-align: start;
|
||||
padding: 12px 12px;
|
||||
/*border: 1px solid #ebebeb;*/
|
||||
border-radius: 8px;
|
||||
background: #4c566a;
|
||||
}
|
||||
|
||||
.linktree-box .icon-box {
|
||||
--scale: 56px;
|
||||
width: var(--scale);
|
||||
height: var(--scale);
|
||||
font-size: 1.75rem;
|
||||
background: hsl(var(--color), 30%);
|
||||
color: hsl(var(--color));
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 8px;
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
.linktree-box .icon-box:hover {
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
header {
|
||||
color: lightgrey;
|
||||
}
|
||||
|
||||
@media (min-width: 600px) {
|
||||
.linktree-nav ul {
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<main>
|
||||
<header>
|
||||
<img src="/assets/img/profile-pic-transparent.png"" alt="Linktree photo" />
|
||||
<h3>SiskelDev</h3>
|
||||
<span>Virtual Content Creator and Back-/Frontend Developer</span>
|
||||
</header>
|
||||
<nav class="linktree-nav">
|
||||
<ul id="notmine">
|
||||
<li>
|
||||
<a href="https://shop.siskel.dev">
|
||||
<div class="linktree-box" style="--color: 128, 100%, 70%">
|
||||
<div class="icon-box"><i class="fa-solid fa-basket-shopping"></i></div>
|
||||
<div>
|
||||
<h5>Merch-Shop</h5>
|
||||
<span>Buy my Merch</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<br>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="https://twitch.tv/siskeldev">
|
||||
<div class="linktree-box" style="--color: 269, 100%, 70%">
|
||||
<div class="icon-box"><i class="fa-brands fa-twitch"></i></div>
|
||||
<div>
|
||||
<h5>Twitch</h5>
|
||||
<span>See me Live<br> </span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://twitter.com/siskeldev">
|
||||
<div class="linktree-box">
|
||||
<div class="icon-box" style="--color: 0, 100%, 70%"><i class="fa-brands fa-twitter"></i></div>
|
||||
<div>
|
||||
<h5>Twitter</h5>
|
||||
<span>Connect with me<br>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://siskel.dev/discord">
|
||||
<div class="linktree-box">
|
||||
<div class="icon-box" style="--color: 594, 100%, 70%"><i class="fa-brands fa-discord"></i></div>
|
||||
<div>
|
||||
<h5>Discord</h5>
|
||||
<span>Get on my Discord-Server (German)</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://soundcloud.com/siskeldev">
|
||||
<div class="linktree-box">
|
||||
<div class="icon-box" style="--color: 35, 100%, 70%"><i class="fa-brands fa-soundcloud"></i></div>
|
||||
<div>
|
||||
<h5>Soundcloud</h5>
|
||||
<span>See my silly Music.<br> </span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://bsky.app/profile/siskel.dev">
|
||||
<div class="linktree-box">
|
||||
<div class="icon-box" style="--color: 200, 100%, 70%"><i class="fa-solid fa-cloud"></i></div>
|
||||
<div>
|
||||
<h5>Bluesky</h5>
|
||||
<span>See what I do<br> </span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://siskeldev.gumroad.com">
|
||||
<div class="linktree-box" style="--color: 378, 100%, 70%">
|
||||
<div class="icon-box"><i class="fa-solid fa-g"></i></div>
|
||||
<div>
|
||||
<h5>Gumroad</h5>
|
||||
<span>See or Buy my Creations<br> </span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://ko-fi.com/siskeldev">
|
||||
<div class="linktree-box" style="--color: 110, 100%, 70%">
|
||||
<div class="icon-box"><i class="fa-solid fa-mug-hot"></i></div>
|
||||
<div>
|
||||
<h5>KoFi</h5>
|
||||
<span>Buy me a Coffee<br> </span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://www.patreon.com/SiskelDev">
|
||||
<div class="linktree-box" style="--color: 350, 100%, 70%">
|
||||
<div class="icon-box"><i class="fa-brands fa-patreon"></i></div>
|
||||
<div>
|
||||
<h5>Patreon</h5>
|
||||
<span>Support my Work (if i have any)<br> </span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://vrchat.com/home/user/usr_2e4f4b25-e01f-44e9-9399-79b9d6f3c24c">
|
||||
<div class="linktree-box" style="--color: 186, 0%, 70%">
|
||||
<div class="icon-box"><i class="fa-solid fa-vr-cardboard"></i></div>
|
||||
<div>
|
||||
<h5>VRChat</h5>
|
||||
<span>Find me Online in VR<br> </span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://tiktok.com/@siskeldev">
|
||||
<div class="linktree-box" style="--color: 200, 100%, 70%">
|
||||
<div class="icon-box"><i class="fa-brands fa-tiktok"></i></div>
|
||||
<div>
|
||||
<h5>TikTok</h5>
|
||||
<span>See my TikTok's<br> </span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<br>
|
||||
<!--ul id="notmine">
|
||||
<li>
|
||||
<a href="https://vrchat.com/home/user/usr_2e4f4b25-e01f-44e9-9399-79b9d6f3c24c">
|
||||
<div class="linktree-box" style="--color: 186, 0%, 70%">
|
||||
<div class="icon-box"><i class="fa-solid fa-vr-cardboard"></i></div>
|
||||
<div>
|
||||
<h5>VRChat</h5>
|
||||
<span>Find me Online in VR<br> </span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
</ul-->
|
||||
<br>
|
||||
<br>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="https://www.youtube.com/channel/UC096YSkDSUClsl4kDaPIvNw">
|
||||
<div class="linktree-box" style="--color: 0, 100%, 70%">
|
||||
<div class="icon-box"><i class="fa-brands fa-youtube"></i></div>
|
||||
<div>
|
||||
<h5>Youtube Main Channel</h5>
|
||||
<span>Here is nothing... So here is my Clips Channel</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://www.youtube.com/@SiskelDev-VODs">
|
||||
<div class="linktree-box" style="--color: 0, 100%, 70%">
|
||||
<div class="icon-box"><i class="fa-solid fa-clock-rotate-left"></i></div>
|
||||
<div>
|
||||
<h5>Youtube-VODs</h5>
|
||||
<span>See my VODs here<br> </span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<br>
|
||||
<ul id="notmine">
|
||||
<li>
|
||||
<a href="https://www.youtube.com/@SiskelDev-Clips">
|
||||
<div class="linktree-box" style="--color: 0, 100%, 70%">
|
||||
<div class="icon-box"><i class="fa-solid fa-clapperboard"></i></div>
|
||||
<div>
|
||||
<h5>Youtube-Clips</h5>
|
||||
<span>See my Twitch-Clips here</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<br>
|
||||
<br>
|
||||
<ul id="notmine">
|
||||
<li>
|
||||
<a href="https://furatalog.xyz">
|
||||
<div class="linktree-box" style="--color: 186, 100%, 100%">
|
||||
<div class="icon-box"><i class="fa-solid fa-basket-shopping"></i></div>
|
||||
<div>
|
||||
<h5>Furatalog</h5>
|
||||
<span>See my VR-Asset catalog</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<br>
|
||||
<br>
|
||||
<ul id="notmine">
|
||||
<li>
|
||||
<a href="https://discord.gg/9AvCC8wksJ">
|
||||
<div class="linktree-box" style="--color: 594, 100%, 70%">
|
||||
<div class="icon-box"><i class="fa-brands fa-discord"></i></div>
|
||||
<div>
|
||||
<h5>Furry Fur Fur - Discord Server</h5>
|
||||
<span>Join my NEW Community - (English only)</span>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li style="height: 500px;">
|
||||
<iframe style="border-radius: 8px;" src="https://discord.com/widget?id=1364894253024546816&theme=dark" width="100%" height="500" allowtransparency="true" frameborder="0" sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts"></iframe>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
</main>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user