You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
358 lines
19 KiB
HTML
358 lines
19 KiB
HTML
<!DOCTYPE HTML>
|
|
<html lang="en">
|
|
<head>
|
|
<title>ADB</title>
|
|
<meta charset="utf-8"/>
|
|
<meta content="Alban David Becker" name="author">
|
|
<meta content="Alban David Becker" name="publisher">
|
|
<meta content="Alban David Becker" name="copyright">
|
|
<meta content="Alban David Becker - Media / Programming" name="description">
|
|
<meta content="Alban, David, Becker, Media, Photography, Programming, Engineering, Development" name="keywords">
|
|
<meta content="Private Homepage" name="page-type">
|
|
<meta content="en" http-equiv="content-language">
|
|
<meta content="index, follow" name="robots">
|
|
|
|
<style>
|
|
@import 'https://fonts.googleapis.com/css?family=Roboto+Mono:100';
|
|
|
|
html, body {
|
|
font-family: Roboto Mono, monospace;
|
|
height: 100%;
|
|
width: auto;
|
|
margin: 0;
|
|
background-color: #1f262b;
|
|
}
|
|
|
|
h1, h2, h3 {
|
|
color: #fff;
|
|
text-align: center;
|
|
}
|
|
|
|
table {
|
|
position: relative;
|
|
margin: auto;
|
|
width: calc(100% - 50px);
|
|
max-width: 600px;
|
|
background-color: #1f262b;
|
|
box-shadow: 3px 3px 10px #333;
|
|
border: 2px solid #fff;
|
|
border-collapse: separate;
|
|
border-spacing: 2px;
|
|
border-radius: 10px;
|
|
color: #fff;
|
|
font-size: 15pt;
|
|
font-family: "Roboto", regular, sans-serif;
|
|
}
|
|
|
|
tr {
|
|
margin: auto;
|
|
border: 1px solid #fff;
|
|
}
|
|
|
|
th {
|
|
margin: auto;
|
|
border: 0px solid #aaa;
|
|
background-color: #546E7A;
|
|
padding: 20px;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
td {
|
|
margin: auto;
|
|
border: 0px solid #aaa;
|
|
background-color: #37474F;
|
|
padding: 10px;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
td.left, th.left {
|
|
border-radius: 8px 0px 0px 8px;
|
|
}
|
|
|
|
td.right, th.right {
|
|
border-radius: 0px 8px 8px 0px;
|
|
}
|
|
|
|
td.mid, th.mid {
|
|
border-radius: 0px 0px 0px 0px;
|
|
}
|
|
|
|
.footer {
|
|
margin: 5rem 0 1rem 1rem;
|
|
bottom: 5px;
|
|
word-break: break-word;
|
|
font-size: 1em;
|
|
color: #fafafa;
|
|
}
|
|
|
|
.logo-img {
|
|
fill: #fafafa;
|
|
}
|
|
|
|
.matrix {
|
|
font-family: Helvetica, monospace;
|
|
display: inline-block;
|
|
height: 50px;
|
|
padding-bottom: 10px;
|
|
}
|
|
|
|
.social_icons {
|
|
position: absolute;
|
|
top: 10rem;
|
|
user-select: none;
|
|
width: 90%;
|
|
left: 5%;
|
|
}
|
|
|
|
.social_icons > div {
|
|
position: relative;
|
|
display: inline-block;
|
|
height: min-content;
|
|
cursor: pointer;
|
|
}
|
|
|
|
a {
|
|
color: inherit;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.top {
|
|
height: 100%;
|
|
}
|
|
|
|
.social {
|
|
position: absolute;
|
|
font-size: 3em;
|
|
color: #fafafa;
|
|
height: 16rem;
|
|
width: 100%;
|
|
top: calc(50% - 8rem);
|
|
text-align: center;
|
|
}
|
|
|
|
.logo-img {
|
|
fill: #fafafa;
|
|
height: 50px;
|
|
width: 50px;
|
|
}
|
|
|
|
@media (max-width: 1100px) and (min-height: 1100px) {
|
|
.middle {
|
|
width: 80%;
|
|
margin-left: 10%;
|
|
font-size: 8em;
|
|
color: #fafafa;
|
|
position: fixed;
|
|
bottom: 30%;
|
|
text-align: center;
|
|
}
|
|
|
|
.social {
|
|
position: relative;
|
|
top: 100px;
|
|
}
|
|
|
|
.logo-img {
|
|
fill: #fafafa;
|
|
height: 120px;
|
|
width: 120px;
|
|
}
|
|
}
|
|
|
|
</style>
|
|
|
|
</head>
|
|
<body>
|
|
<div class="top">
|
|
<div class="social">
|
|
<div class="text">
|
|
<noscript>Please activate JavaScript to see the text animation. There are no trackers on this site! :)
|
|
</noscript>
|
|
</div>
|
|
|
|
<div class="social_icons">
|
|
<div onclick="location.href='https://www.twitter.com/albanbecker'">
|
|
<svg class="logo-img" viewBox="0 -47 512.00004 512" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="m512 55.964844c-32.207031 1.484375-31.503906 1.363281-35.144531 1.667968l19.074219-54.472656s-59.539063 21.902344-74.632813 25.820313c-39.640625-35.628907-98.5625-37.203125-140.6875-11.3125-34.496094 21.207031-53.011719 57.625-46.835937 100.191406-67.136719-9.316406-123.703126-41.140625-168.363282-94.789063l-14.125-16.964843-10.554687 19.382812c-13.339844 24.492188-17.769531 52.496094-12.476563 78.851563 2.171875 10.8125 5.863282 21.125 10.976563 30.78125l-12.117188-4.695313-1.4375 20.246094c-1.457031 20.566406 5.390625 44.574219 18.320313 64.214844 3.640625 5.53125 8.328125 11.605469 14.269531 17.597656l-6.261719-.960937 7.640625 23.199218c10.042969 30.480469 30.902344 54.0625 57.972657 67.171875-27.035157 11.472657-48.875 18.792969-84.773438 30.601563l-32.84375 10.796875 30.335938 16.585937c11.566406 6.324219 52.4375 27.445313 92.820312 33.78125 89.765625 14.078125 190.832031 2.613282 258.871094-58.664062 57.308594-51.613282 76.113281-125.03125 72.207031-201.433594-.589844-11.566406 2.578125-22.605469 8.921875-31.078125 12.707031-16.964844 48.765625-66.40625 48.84375-66.519531zm-72.832031 48.550781c-10.535157 14.066406-15.8125 32.03125-14.867188 50.578125 3.941407 77.066406-17.027343 136.832031-62.328125 177.628906-52.917968 47.660156-138.273437 66.367188-234.171875 51.324219-17.367187-2.722656-35.316406-8.820313-50.171875-14.910156 30.097656-10.355469 53.339844-19.585938 90.875-37.351563l52.398438-24.800781-57.851563-3.703125c-27.710937-1.773438-50.785156-15.203125-64.96875-37.007812 7.53125-.4375 14.792969-1.65625 22.023438-3.671876l55.175781-15.367187-55.636719-13.625c-27.035156-6.621094-42.445312-22.796875-50.613281-35.203125-5.363281-8.152344-8.867188-16.503906-10.96875-24.203125 5.578125 1.496094 12.082031 2.5625 22.570312 3.601563l51.496094 5.09375-40.800781-31.828126c-29.398437-22.929687-41.179687-57.378906-32.542969-90.496093 91.75 95.164062 199.476563 88.011719 210.320313 90.527343-2.386719-23.183593-2.449219-23.238281-3.074219-25.445312-13.886719-49.089844 16.546875-74.015625 30.273438-82.453125 28.671874-17.621094 74.183593-20.277344 105.707031 8.753906 6.808593 6.265625 16.015625 8.730469 24.632812 6.589844 7.734375-1.921875 14.082031-3.957031 20.296875-6.171875l-12.9375 36.945312 16.515625.011719c-3.117187 4.179688-6.855469 9.183594-11.351562 15.183594zm0 0"/>
|
|
</svg>
|
|
</div>
|
|
<div onclick="location.href='https://www.instagram.com/alban.da'">
|
|
<svg class="logo-img" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="m75 512h362c41.355469 0 75-33.644531 75-75v-362c0-41.355469-33.644531-75-75-75h-362c-41.355469 0-75 33.644531-75 75v362c0 41.355469 33.644531 75 75 75zm-45-437c0-24.8125 20.1875-45 45-45h362c24.8125 0 45 20.1875 45 45v362c0 24.8125-20.1875 45-45 45h-362c-24.8125 0-45-20.1875-45-45zm0 0"/>
|
|
<path d="m256 391c74.4375 0 135-60.5625 135-135s-60.5625-135-135-135-135 60.5625-135 135 60.5625 135 135 135zm0-240c57.898438 0 105 47.101562 105 105s-47.101562 105-105 105-105-47.101562-105-105 47.101562-105 105-105zm0 0"/>
|
|
<path d="m406 151c24.8125 0 45-20.1875 45-45s-20.1875-45-45-45-45 20.1875-45 45 20.1875 45 45 45zm0-60c8.269531 0 15 6.730469 15 15s-6.730469 15-15 15-15-6.730469-15-15 6.730469-15 15-15zm0 0"/>
|
|
</svg>
|
|
</div>
|
|
<div onclick="location.href='https://open.spotify.com/user/op3q884heqao7laioz05ebaoz'">
|
|
<svg class="logo-img" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="m256 0c-140.960938 0-256 115.050781-256 256 0 140.960938 115.050781 256 256 256 140.960938 0 256-115.050781 256-256 0-140.960938-115.050781-256-256-256zm0 482c-124.617188 0-226-101.382812-226-226s101.382812-226 226-226 226 101.382812 226 226-101.382812 226-226 226zm0 0"/>
|
|
<path d="m99.066406 148.667969 5.195313 29.546875c109.394531-19.234375 220.378906-4.640625 317.398437 37.136718l11.863282-27.550781c-102.253907-44.035156-219.179688-59.402343-334.457032-39.132812zm0 0"/>
|
|
<path d="m103.832031 239.34375-.765625.152344 5.890625 29.417968.757813-.152343c95.839844-19.128907 197.550781-7.15625 286.394531 33.710937l12.535156-27.253906c-94.550781-43.496094-202.796875-56.238281-304.8125-35.875zm0 0"/>
|
|
<path d="m129.703125 326.050781 5.277344 29.53125c73.082031-13.058593 147.707031-4.347656 215.808593 25.203125l11.941407-27.523437c-73.539063-31.902344-154.121094-41.3125-233.027344-27.210938zm0 0"/>
|
|
</svg>
|
|
</div>
|
|
<div onclick="location.href='https://soundcloud.com/alban-david-becker'">
|
|
<svg class="logo-img" viewBox="0 -121 512 512" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="m180 0h30v270h-30zm0 0"/>
|
|
<path d="m120 90h30v180h-30zm0 0"/>
|
|
<path d="m60 60h30v210h-30zm0 0"/>
|
|
<path d="m0 150h30v120h-30zm0 0"/>
|
|
<path d="m512 180c0-49.625-40.375-90-90-90-2.542969 0-5.082031.105469-7.605469.320312-18.867187-53.082031-71.167969-90.320312-129.394531-90.320312-11.421875 0-22.773438 1.429688-33.738281 4.253906l-11.261719 2.898438v262.847656h182c49.625 0 90-40.375 90-90zm-242-148.9375c4.949219-.707031 9.964844-1.0625 15-1.0625 49.285156 0 93.097656 33.933594 104.175781 80.6875l3.5 14.773438c11.894531-2.664063 18.164063-5.460938 29.324219-5.460938 33.085938 0 60 26.914062 60 60s-26.914062 60-60 60h-152zm0 0"/>
|
|
</svg>
|
|
</div>
|
|
<div onclick="location.href='https://git.adb.sh/adb/'">
|
|
<svg class="logo-img" viewBox="0 0 919 919" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="M 901.543,500.352 500.352,901.527 c -23.094,23.11 -60.567,23.11 -83.692,0 L 333.359,818.211 439.031,712.535 c 24.563,8.293 52.727,2.727 72.297,-16.847 19.688,-19.696 25.203,-48.102 16.699,-72.75 L 629.883,521.094 c 24.648,8.496 53.066,3.004 72.754,-16.711 27.5,-27.492 27.5,-72.059 0,-99.574 -27.52,-27.516 -72.078,-27.516 -99.61,0 -20.683,20.703 -25.8,51.097 -15.312,76.582 l -95,94.992 V 326.414 c 6.699,-3.32 13.027,-7.742 18.613,-13.312 27.5,-27.497 27.5,-72.059 0,-99.598 -27.5,-27.488 -72.09,-27.488 -99.57,0 -27.5,27.539 -27.5,72.101 0,99.598 6.797,6.789 14.668,11.925 23.066,15.363 v 252.281 c -8.398,3.438 -16.25,8.531 -23.066,15.367 -20.828,20.821 -25.84,51.395 -15.156,76.977 L 292.422,777.285 17.3242,502.211 c -23.10545,-23.129 -23.10545,-60.602 0,-83.711 L 418.535,17.3242 c 23.098,-23.10545 60.559,-23.10545 83.692,0 L 901.543,416.641 c 23.113,23.113 23.113,60.605 0,83.711"
|
|
transform="scale(1,-1) translate(0, -919)"/>
|
|
</svg>
|
|
</div>
|
|
<div onclick="location.href='https://github.com/adb-sh/'">
|
|
<svg class="logo-img" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="m256 0c-140.699219 0-256 116.300781-256 257 0 139.882812 114.25 255 256 255 141.574219 0 256-114.945312 256-255 0-140.699219-115.300781-257-256-257zm45 477.5c-14.398438 3-29.699219 4.5-45 4.5s-30.601562-1.5-45-4.5v-70.199219c0-16.800781 4.5-22.800781 10.5-30.902343 3.054688-3.492188 4.898438-6.625 18.597656-27.296876l-23.097656-3.601562c-59.402344-8.699219-82.800781-39.601562-92.101562-63.601562-12-32.097657-5.699219-72.300782 15.902343-97.796876 3.300781-3.902343 6-10.503906 3.601563-17.402343-4.503906-13.800781-3.902344-35.699219-.902344-44.101563 15.90625 2.273438 32.261719 13.667969 45.902344 21.902344 6.285156 3.667969 9.582031 2.699219 12.597656 3 10.960938-2.28125 28.058594-7.800781 54.300781-7.800781 16.199219 0 33.300781 2.398437 50.101563 7.199219 3.003906-.070313 7.832031 2.484374 16.199218-2.398438 14.257813-8.6875 30.058594-19.691406 45.898438-21.902344 3 8.402344 3.601562 30.300782-.898438 44.101563-2.402343 6.898437.296876 13.5 3.601563 17.402343 21.597656 25.5 27.898437 65.699219 15.898437 97.796876-9.300781 24-32.699218 54.902343-92.101562 63.601562l-23.097656 3.601562c14.160156 21.367188 15.652344 23.929688 18.601562 27.296876 5.996094 8.101562 10.496094 14.101562 10.496094 30.902343zm30-8.699219v-61.5c0-17.101562-3.601562-28.5-8.402344-36.902343 45.601563-12.296876 78.003906-39.300782 92.402344-78 15.300781-40.796876 8.402344-89.398438-17.101562-123 4.503906-20.097657 4.503906-52.199219-6.296876-67.199219-4.800781-6.597657-11.402343-10.199219-19.800781-10.199219-.300781 0-.300781 0-.300781 0-23.261719 1.257812-41.570312 12.972656-61.199219 24.898438-18-4.800782-36.300781-7.199219-54.601562-7.199219-18.597657 0-37.199219 2.699219-53.695313 7.199219-20.664062-12.460938-38.796875-23.671876-62.703125-24.898438-7.5 0-14.101562 3.601562-18.902343 10.199219-10.796876 15-10.796876 47.101562-6.296876 67.199219-25.503906 33.601562-32.402343 82.5-17.101562 123 14.398438 38.699218 46.800781 65.703124 92.402344 78-3.722656 6.511718-6.667969 14.914062-7.828125 26.285156-9.210938 3.175781-17.199219 4.210937-24.628907 2.027344-7.835937-2.316407-13.941406-7.546876-19.246093-16.46875-11.914063-20.015626-32.207031-36.355469-55.3125-34.230469l2.636719 29.882812c10.699218-.980469 21.347656 10.339844 26.878906 19.671875 9.125 15.367188 21.417968 25.445313 36.546875 29.914063 11.230469 3.308593 21.496093 3.230469 32.550781.871093v40.449219c-87.300781-30.601562-151-114-151-211.800781 0-124.199219 101.800781-227 226-227s226 102.800781 226 227c0 97.800781-63.699219 181.199219-151 211.800781zm0 0"/>
|
|
</svg>
|
|
</div>
|
|
<div onclick="location.href='https://t.me/ADBac'">
|
|
<svg class="logo-img" viewBox="1 -35 511.99993 511" xmlns="http://www.w3.org/2000/svg">
|
|
<path d="m121.453125 253.171875 63.554687 158.886719 82.75-82.753906 141.535157 112.503906 102.707031-441.308594-512 205.480469zm-39.933594-47.640625 244.046875-97.945312-194.074218 117.363281zm287.535157-89.25-161.980469 148.1875-19.484375 73.425781-36.035156-90.085937zm-149.851563 219.230469 9.816406-36.996094 15.144531 12.035156zm171.65625 53.394531-147.386719-117.152344 221.902344-203.007812zm0 0"/>
|
|
</svg>
|
|
</div>
|
|
<div onclick="location.href='https://matrix.to/#/@adb:adb.sh'">
|
|
<div class="matrix">[m]</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<h1>services I'm hosting:</h1>
|
|
<table>
|
|
<tr>
|
|
<th class="left">service</th>
|
|
<th class="right">url</th>
|
|
</tr>
|
|
<tr>
|
|
<td class="left">git</td>
|
|
<td class="right"><a href="https://git.adb.sh">git.adb.sh</a></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left">Nextcloud</td>
|
|
<td class="right"><a href="https://cloud.adb.sh">cloud.adb.sh</a></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left">Matrix</td>
|
|
<td class="right"><a href="https://chat.adb.sh">chat.adb.sh</a></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left">Element</td>
|
|
<td class="right"><a href="https://element.adb.sh">element.adb.sh</a></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left">Mastodon</td>
|
|
<td class="right"><a href="https://social.adb.sh">social.adb.sh</a></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left">email</td>
|
|
<td class="right"><a href="https://mail.adb.sh">mail.adb.sh</a></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left">short url</td>
|
|
<td class="right"><a href="https://s.adb.sh">s.adb.sh</a></td>
|
|
</tr>
|
|
<tr>
|
|
<td class="left">searx</td>
|
|
<td class="right"><a href="https://searx.adb.sh">searx.adb.sh</a></td>
|
|
</tr>
|
|
|
|
</table>
|
|
|
|
<div class="footer">
|
|
<div>© 2020 Alban David Becker</div>
|
|
<div>Icons made by <a href="https://www.flaticon.com/authors/freepik" title="Freepik">Freepik</a> from
|
|
<a href="https://www.flaticon.com/" title="Flaticon">www.flaticon.com</a> is licensed by
|
|
<a href="http://creativecommons.org/licenses/by/3.0/" target="_blank" title="Creative Commons BY 3.0">CC 3.0
|
|
BY</a></div>
|
|
<a href="http://bpzvci77gdvrn4grh2slh5dmz5lxrzmg7nkij7ltxht4gv4weamc4dad.onion">
|
|
more privacy?: http://bpzvci77gdvrn4grh2slh5dmz5lxrzmg7nkij7ltxht4gv4weamc4dad.onion
|
|
</a>
|
|
</div>
|
|
|
|
<script>
|
|
// TextScramble
|
|
class TextScramble {
|
|
constructor(el) {
|
|
this.el = el
|
|
this.chars = '!<>-_\\/[]{}—=+*^?#________'
|
|
this.update = this.update.bind(this)
|
|
}
|
|
|
|
setText(newText) {
|
|
const oldText = this.el.innerText
|
|
const length = Math.max(oldText.length, newText.length)
|
|
const promise = new Promise((resolve) => this.resolve = resolve)
|
|
this.queue = []
|
|
for (let i = 0; i < length; i++) {
|
|
const from = oldText[i] || ''
|
|
const to = newText[i] || ''
|
|
const start = Math.floor(Math.random() * 40)
|
|
const end = start + Math.floor(Math.random() * 40)
|
|
this.queue.push({from, to, start, end})
|
|
}
|
|
cancelAnimationFrame(this.frameRequest)
|
|
this.frame = 0
|
|
this.update()
|
|
return promise
|
|
}
|
|
|
|
update() {
|
|
let output = ''
|
|
let complete = 0
|
|
for (let i = 0, n = this.queue.length; i < n; i++) {
|
|
let {from, to, start, end, char} = this.queue[i]
|
|
if (this.frame >= end) {
|
|
complete++
|
|
output += to
|
|
} else if (this.frame >= start) {
|
|
if (!char || Math.random() < 0.28) {
|
|
char = this.randomChar()
|
|
this.queue[i].char = char
|
|
}
|
|
output += `<span class="dud">${char}</span>`
|
|
} else {
|
|
output += from
|
|
}
|
|
}
|
|
this.el.innerHTML = output
|
|
if (complete === this.queue.length) {
|
|
this.resolve()
|
|
} else {
|
|
this.frameRequest = requestAnimationFrame(this.update)
|
|
this.frame++
|
|
}
|
|
}
|
|
|
|
randomChar() {
|
|
return this.chars[Math.floor(Math.random() * this.chars.length)]
|
|
}
|
|
}
|
|
|
|
const phrases = [
|
|
"Hey!",
|
|
"That's my page!",
|
|
"if you like", "check out", "my social media", "below :D"
|
|
]
|
|
|
|
const el = document.querySelector('.text')
|
|
const fx = new TextScramble(el)
|
|
|
|
let counter = 0
|
|
const next = () => {
|
|
fx.setText(phrases[counter]).then(() => {
|
|
setTimeout(next, 600)
|
|
})
|
|
counter = (counter + 1) % phrases.length
|
|
}
|
|
|
|
next()
|
|
</script>
|
|
</body>
|
|
</html>
|