Files
Homepage/index.html
2026-02-12 22:18:40 +01:00

308 lines
12 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Intranet - Local Services</title>
<meta name="description" content="Local network services portal">
<!-- Favicons -->
<link rel="icon" href="assets/img/favicon.png">
<link rel="apple-touch-icon" href="assets/img/apple-touch-icon.png">
<link rel="manifest" href="site.webmanifest">
<!-- Inter Font -->
<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=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
<!-- Remix Icon CDN -->
<link href="https://cdn.jsdelivr.net/npm/remixicon@4.6.0/fonts/remixicon.min.css" rel="stylesheet">
<!-- Main CSS -->
<link rel="stylesheet" href="assets/css/style.css">
</head>
<body>
<!-- Header -->
<header id="header">
<div class="header-inner">
<a href="index.html" class="logo">Intranet<span>.</span>local</a>
<nav id="nav" class="nav-links">
<a href="#infrastructure">Infra</a>
<a href="#monitoring">Monitoring</a>
<a href="#development">Dev</a>
<a href="#media-streaming">Media</a>
<a href="#tesla">Tesla</a>
</nav>
<button id="nav-toggle" class="nav-toggle" aria-label="Toggle navigation" aria-expanded="false">
<i class="ri-menu-line"></i>
</button>
</div>
</header>
<main>
<!-- Hero -->
<section id="hero">
<div class="hero-content">
<h1>Welcome!</h1>
<p>Your local network services portal.</p>
</div>
</section>
<!-- Server Status Bar -->
<section id="status-bar">
<div class="container">
<h2 class="section-title"><i class="ri-pulse-line"></i> System Status</h2>
<div class="status-grid">
<a href="http://192.168.1.13:3010" class="status-card" id="status-uptime">
<div class="status-dot loading"></div>
<div class="status-info">
<span class="status-label">Uptime Kuma</span>
<span class="status-value">Checking...</span>
</div>
</a>
<a href="http://192.168.1.13:61208" class="status-card" id="status-glances">
<div class="status-dot loading"></div>
<div class="status-info">
<span class="status-label">Glances</span>
<span class="status-value">Checking...</span>
</div>
</a>
<a href="http://192.168.1.13:8084" class="status-card" id="status-cadvisor">
<div class="status-dot loading"></div>
<div class="status-info">
<span class="status-label">cAdvisor</span>
<span class="status-value">Checking...</span>
</div>
</a>
</div>
</div>
</section>
<!-- Infrastructure & Security -->
<section id="infrastructure" class="category">
<div class="container">
<h2 class="section-title"><i class="ri-shield-check-line"></i> Infrastructure & Security</h2>
<div class="card-grid">
<a href="http://adguard.local" class="service-card">
<i class="ri-shield-check-line"></i>
<span class="card-name">AdGuard Home</span>
</a>
<a href="http://omada.local" class="service-card">
<i class="ri-wifi-line"></i>
<span class="card-name">Omada Controller</span>
</a>
<a href="https://auth.hasanbasic.dk" class="service-card">
<i class="ri-login-box-fill"></i>
<span class="card-name">Authentik</span>
</a>
<a href="http://longhorn.local" class="service-card">
<i class="ri-storage-line"></i>
<span class="card-name">Longhorn</span>
</a>
<a href="http://rancher.local" class="service-card">
<i class="ri-dashboard-line"></i>
<span class="card-name">Rancher</span>
</a>
<a href="http://nas.local" class="service-card">
<i class="ri-server-line"></i>
<span class="card-name">Synology NAS</span>
</a>
</div>
</div>
</section>
<!-- Monitoring & Analytics -->
<section id="monitoring" class="category">
<div class="container">
<h2 class="section-title"><i class="ri-pulse-line"></i> Monitoring & Analytics</h2>
<div class="card-grid">
<a href="http://192.168.1.13:3010" class="service-card">
<i class="ri-heart-pulse-line"></i>
<span class="card-name">Uptime Kuma</span>
<span class="card-sub">192.168.1.13:3010</span>
</a>
<a href="http://192.168.1.13:61208" class="service-card">
<i class="ri-eye-line"></i>
<span class="card-name">Glances</span>
<span class="card-sub">192.168.1.13:61208</span>
</a>
<a href="http://192.168.1.13:8084" class="service-card">
<i class="ri-container-line"></i>
<span class="card-name">cAdvisor</span>
<span class="card-sub">192.168.1.13:8084</span>
</a>
<a href="https://umami.hasanbasic.dk" class="service-card">
<i class="ri-bar-chart-box-line"></i>
<span class="card-name">Umami</span>
<span class="card-sub">umami.hasanbasic.dk</span>
</a>
</div>
</div>
</section>
<!-- Development & Tools -->
<section id="development" class="category">
<div class="container">
<h2 class="section-title"><i class="ri-code-s-slash-line"></i> Development & Tools</h2>
<div class="card-grid">
<a href="https://code.mirzahasanbasic.dk" class="service-card">
<i class="ri-code-s-slash-line"></i>
<span class="card-name">Code Server</span>
</a>
<a href="https://git.mirzahasanbasic.dk" class="service-card">
<i class="ri-git-repository-line"></i>
<span class="card-name">Gitea</span>
</a>
<a href="http://pgadmin.local" class="service-card">
<i class="ri-database-2-line"></i>
<span class="card-name">pgAdmin</span>
</a>
<a href="http://portainer.local" class="service-card">
<i class="ri-ship-line"></i>
<span class="card-name">Portainer</span>
</a>
<a href="http://minio.local" class="service-card">
<i class="ri-database-line"></i>
<span class="card-name">MinIO</span>
</a>
<a href="https://histogram.hasanbasic.dk" class="service-card">
<i class="ri-database-2-line"></i>
<span class="card-name">Histogram</span>
</a>
<a href="http://192.168.1.13:3080" class="service-card">
<i class="ri-chat-smile-ai-line"></i>
<span class="card-name">LibreChat</span>
<span class="card-sub">192.168.1.13:3080</span>
</a>
</div>
</div>
</section>
<!-- Media Streaming -->
<section id="media-streaming" class="category">
<div class="container">
<h2 class="section-title"><i class="ri-film-line"></i> Media Streaming</h2>
<div class="card-grid">
<a href="https://plex.mirzahasanbasic.dk" class="service-card">
<i class="ri-film-line"></i>
<span class="card-name">Plex</span>
</a>
<a href="https://overseer.hasanbasic.dk" class="service-card">
<i class="ri-movie-2-line"></i>
<span class="card-name">Overseerr</span>
</a>
<a href="https://immich.hasanbasic.dk" class="service-card">
<i class="ri-image-line"></i>
<span class="card-name">Immich</span>
</a>
<a href="http://ombi.local" class="service-card">
<i class="ri-hand-heart-fill"></i>
<span class="card-name">Ombi</span>
</a>
</div>
</div>
</section>
<!-- Media Automation -->
<section id="media-automation" class="category">
<div class="container">
<h2 class="section-title"><i class="ri-robot-line"></i> Media Automation</h2>
<div class="card-grid">
<a href="http://sonarr.local" class="service-card">
<i class="ri-tv-line"></i>
<span class="card-name">Sonarr</span>
</a>
<a href="http://radarr.local" class="service-card">
<i class="ri-movie-line"></i>
<span class="card-name">Radarr</span>
</a>
<a href="http://prowlarr.local" class="service-card">
<i class="ri-search-line"></i>
<span class="card-name">Prowlarr</span>
</a>
<a href="http://lidarr.local" class="service-card">
<i class="ri-music-line"></i>
<span class="card-name">Lidarr</span>
</a>
<a href="http://readarr.local" class="service-card">
<i class="ri-book-read-line"></i>
<span class="card-name">Readarr</span>
</a>
<a href="http://bazarr.local" class="service-card">
<i class="ri-translate"></i>
<span class="card-name">Bazarr</span>
</a>
</div>
</div>
</section>
<!-- Tesla -->
<section id="tesla" class="category">
<div class="container">
<h2 class="section-title"><i class="ri-car-line"></i> Tesla</h2>
<div class="card-grid">
<a href="http://teslamate.local" class="service-card">
<i class="ri-car-line"></i>
<span class="card-name">TeslaMate</span>
</a>
<a href="http://tesla-grafana.local" class="service-card">
<i class="ri-line-chart-line"></i>
<span class="card-name">Tesla Charts</span>
</a>
<a href="http://tesla-pgadmin.local" class="service-card">
<i class="ri-database-line"></i>
<span class="card-name">Tesla DB</span>
</a>
</div>
</div>
</section>
<!-- Productivity & Utilities -->
<section id="productivity" class="category">
<div class="container">
<h2 class="section-title"><i class="ri-tools-line"></i> Productivity & Utilities</h2>
<div class="card-grid">
<a href="http://stirling-pdf.local" class="service-card">
<i class="ri-file-pdf-2-line"></i>
<span class="card-name">PDF Tools</span>
</a>
<a href="https://bookstack.hasanbasic.dk" class="service-card">
<i class="ri-book-line"></i>
<span class="card-name">BookStack</span>
</a>
<a href="http://192.168.1.13:8089" class="service-card">
<i class="ri-restaurant-line"></i>
<span class="card-name">Tandoor</span>
<span class="card-sub">192.168.1.13:8089</span>
</a>
<a href="http://192.168.1.13:8000" class="service-card">
<i class="ri-file-paper-2-line"></i>
<span class="card-name">Paperless</span>
<span class="card-sub">192.168.1.13:8000</span>
</a>
</div>
</div>
</section>
</main>
<!-- Footer -->
<footer id="footer">
<blockquote>
<p>"I don't know half of you half as well as I should like; and I like less than half of you half as well as you deserve."</p>
<cite>― J.R.R. Tolkien, The Fellowship of the Ring</cite>
</blockquote>
</footer>
<!-- Main JS -->
<script src="assets/js/main.js"></script>
</body>
</html>