41 lines
3.9 KiB
HTML
41 lines
3.9 KiB
HTML
<!doctype html><html lang=en>
|
|
<meta charset=UTF-8>
|
|
<meta http-equiv=X-UA-Compatible content="IE=edge">
|
|
<meta name=viewport content="width=device-width,initial-scale=1">
|
|
<title>caileb.com</title>
|
|
<meta name=description content="Public-facing services hosted on caileb.com">
|
|
<link rel=icon href=/images/favi.png type=image/png>
|
|
<link rel=apple-touch-icon href=/images/favi.png>
|
|
<link rel="shortcut icon" href=/images/favi.png>
|
|
<link rel=preload href=/webfonts/Poppins-Regular.woff2 as=font type=font/woff2 crossorigin>
|
|
<link rel=preload href=/webfonts/Poppins-SemiBold.woff2 as=font type=font/woff2 crossorigin>
|
|
<link rel=preload href=/js/u.js as=script>
|
|
<link rel=preload as=image href=/images/logos/immich.svg>
|
|
<link rel=preload as=image href=/images/logos/jellyfin.svg>
|
|
<link rel=preload as=image type=image/webp href=/images/logos/linkwarden.webp>
|
|
<link rel=preload as=image href=/images/logos/navidrome.svg>
|
|
<link rel=manifest href=/manifest.json>
|
|
<link rel=stylesheet href=/css/u.css>
|
|
<style>:root{--background-color:#121212;--card-gradient-start:#1e1e1e;--card-gradient-end:#333;--header-background:#262626;--text-color:#fff;--accent-color:#9B59B6;--subtext-color:#ccc}*{margin:0;padding:0;box-sizing:border-box}body{background:#1c1c1c;color:var(--text-color);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;margin:0;padding:20px 20px 0}@media(min-width:1024px){body{height:100vh;justify-content:center;padding:20px 20px 60px}footer{position:fixed;bottom:0;left:0;width:100%}}footer{font-size:1.2rem}.container{max-width:1200px;width:100%}header{text-align:center;background:var(--header-background);padding:2rem;border-radius:10px;margin-bottom:2rem;box-shadow:0 4px 10px rgba(0,0,0,.3)}header h1{font-size:3rem;margin-bottom:.5rem;color:var(--accent-color)}header p{font-size:1.25rem;color:var(--subtext-color)}.grid{display:flex;flex-wrap:wrap;gap:1.5rem;justify-content:center}.card{flex-basis:280px;border-radius:12px;padding:1.5rem;text-decoration:none;color:inherit;display:flex;flex-direction:column;align-items:center}.card:hover{transform:translateY(-5px);box-shadow:0 10px 20px rgba(0,0,0,.25)}.card .icon{width:112px;height:112px;margin-bottom:1rem;object-fit:contain}.card h2{font-size:1.5rem;margin-bottom:.5rem}.card p{font-size:1rem;text-align:center}footer{text-align:center;padding:10px 0;background-color:initial;color:#c3c3c3;font-size:1.2rem}footer a{color:#cf7bf1;text-decoration:none}footer a:hover{text-decoration:underline}.no-hover .card{transition:none!important}.no-hover .card:hover{transform:none!important;box-shadow:none!important}@keyframes waveColor{0%{color:grey}50%{color:#fff}100%{color:grey}}.highlight-letter{display:inline-block;animation-name:waveColor;animation-duration:1.2s;animation-iteration-count:infinite;animation-timing-function:linear}</style>
|
|
<script src=/js/u.js async></script>
|
|
<div class=container>
|
|
<section class=grid>
|
|
<a class="card eel" href=https://gallery.caileb.com style=background:linear-gradient(135deg,rgba(252,87,94,.55),rgba(247,180,44,.55))>
|
|
<img alt="Immich Logo" class=icon src=/images/logos/immich.svg sizes=112x112>
|
|
<h1>Immich</h1>
|
|
</a>
|
|
<a class="card eel" href=https://jellyfin.caileb.com style=background:linear-gradient(135deg,rgba(99,49,148,.55),rgba(43,131,237,.55))>
|
|
<img alt="Jellyfin Logo" class=icon src=/images/logos/jellyfin.svg sizes=112x112>
|
|
<h1>Jellyfin</h1>
|
|
</a>
|
|
<a class="card eel" href=https://archive.caileb.com style=background:linear-gradient(135deg,rgba(15,76,129,.55),rgba(22,191,253,.55))>
|
|
<img alt="Linkwarden Logo" class=icon src=/images/logos/linkwarden.webp sizes=112x112>
|
|
<h1>Linkwarden</h1>
|
|
</a>
|
|
<a class="card eel" href=https://music.caileb.com style=background:linear-gradient(135deg,rgba(33,150,243,.55),rgba(3,218,197,.55))>
|
|
<img alt="Navidrome Logo" class=icon src=/images/logos/navidrome.svg sizes=112x112>
|
|
<h1>Navidrome</h1>
|
|
</a>
|
|
</section>
|
|
</div>
|
|
<footer id=email-footer>Email: <a href=mailto:a@caileb.com>a@caileb.com</a></footer>
|