Init
This commit is contained in:
1
.gitignore
vendored
Normal file
1
.gitignore
vendored
Normal file
@@ -0,0 +1 @@
|
|||||||
|
/certbot
|
||||||
10
api/Dockerfile
Normal file
10
api/Dockerfile
Normal file
@@ -0,0 +1,10 @@
|
|||||||
|
FROM python:3.9-slim
|
||||||
|
|
||||||
|
WORKDIR /app
|
||||||
|
|
||||||
|
COPY requirements.txt .
|
||||||
|
RUN pip install --no-cache-dir -r requirements.txt
|
||||||
|
|
||||||
|
COPY server.py .
|
||||||
|
|
||||||
|
CMD ["uvicorn", "server:app", "--host", "0.0.0.0", "--port", "8000"]
|
||||||
2
api/requirements.txt
Normal file
2
api/requirements.txt
Normal file
@@ -0,0 +1,2 @@
|
|||||||
|
fastapi>=0.68.0
|
||||||
|
uvicorn>=0.15.0
|
||||||
38
api/server.py
Normal file
38
api/server.py
Normal file
@@ -0,0 +1,38 @@
|
|||||||
|
from fastapi import FastAPI, HTTPException
|
||||||
|
from fastapi.middleware.cors import CORSMiddleware
|
||||||
|
import socket
|
||||||
|
import asyncio
|
||||||
|
|
||||||
|
app = FastAPI()
|
||||||
|
|
||||||
|
# Configure CORS
|
||||||
|
app.add_middleware(
|
||||||
|
CORSMiddleware,
|
||||||
|
allow_origins=["*"],
|
||||||
|
allow_methods=["*"],
|
||||||
|
allow_headers=["*"],
|
||||||
|
)
|
||||||
|
|
||||||
|
async def check_port(host: str, port: int, timeout: float = 2.0) -> bool:
|
||||||
|
try:
|
||||||
|
# Create async socket connection
|
||||||
|
reader, writer = await asyncio.wait_for(
|
||||||
|
asyncio.open_connection(host, port),
|
||||||
|
timeout=timeout
|
||||||
|
)
|
||||||
|
writer.close()
|
||||||
|
await writer.wait_closed()
|
||||||
|
return True
|
||||||
|
except (socket.gaierror, ConnectionRefusedError, asyncio.TimeoutError):
|
||||||
|
return False
|
||||||
|
except Exception:
|
||||||
|
return False
|
||||||
|
|
||||||
|
@app.get("/check-port")
|
||||||
|
async def port_check(host: str, port: int):
|
||||||
|
is_alive = await check_port(host, port)
|
||||||
|
return {"status": "online" if is_alive else "offline"}
|
||||||
|
|
||||||
|
@app.get("/health")
|
||||||
|
async def health_check():
|
||||||
|
return {"status": "ok"}
|
||||||
41
compose.yml
Normal file
41
compose.yml
Normal file
@@ -0,0 +1,41 @@
|
|||||||
|
services:
|
||||||
|
nginx:
|
||||||
|
image: nginx:alpine
|
||||||
|
container_name: nginx
|
||||||
|
restart: unless-stopped
|
||||||
|
ports:
|
||||||
|
- "80:80"
|
||||||
|
- "443:443"
|
||||||
|
volumes:
|
||||||
|
- ./nginx/conf.d:/etc/nginx/conf.d
|
||||||
|
- ./html:/usr/share/nginx/html
|
||||||
|
- ./certbot/www:/var/www/certbot
|
||||||
|
- ./certbot/conf:/etc/letsencrypt
|
||||||
|
networks:
|
||||||
|
- web-network
|
||||||
|
depends_on:
|
||||||
|
- certbot
|
||||||
|
- port-checker
|
||||||
|
|
||||||
|
certbot:
|
||||||
|
image: certbot/certbot
|
||||||
|
container_name: certbot
|
||||||
|
volumes:
|
||||||
|
- ./certbot/www:/var/www/certbot
|
||||||
|
- ./certbot/conf:/etc/letsencrypt
|
||||||
|
networks:
|
||||||
|
- web-network
|
||||||
|
command: certonly --webroot --webroot-path=/var/www/certbot --email p.keier@beyerstedt-it.de --agree-tos --no-eff-email --force-renewal -d garde-studios.de -d www.garde-studios.de
|
||||||
|
|
||||||
|
port-checker:
|
||||||
|
container_name: port-checker
|
||||||
|
build: ./api
|
||||||
|
ports:
|
||||||
|
- "8000:8000"
|
||||||
|
networks:
|
||||||
|
- web-network
|
||||||
|
restart: unless-stopped
|
||||||
|
|
||||||
|
networks:
|
||||||
|
web-network:
|
||||||
|
driver: bridge
|
||||||
145
html/css/catppuccin.css
Normal file
145
html/css/catppuccin.css
Normal file
@@ -0,0 +1,145 @@
|
|||||||
|
[data-theme="latte"] {
|
||||||
|
--theme-rosewater: #dc8a78;
|
||||||
|
--theme-flamingo: #dd7878;
|
||||||
|
--theme-pink: #ea76cb;
|
||||||
|
--theme-mauve: #8839ef;
|
||||||
|
--theme-red: #d20f39;
|
||||||
|
--theme-maroon: #e64553;
|
||||||
|
--theme-peach: #fe640b;
|
||||||
|
--theme-yellow: #df8e1d;
|
||||||
|
--theme-green: #40a02b;
|
||||||
|
--theme-teal: #179299;
|
||||||
|
--theme-sky: #04a5e5;
|
||||||
|
--theme-sapphire: #209fb5;
|
||||||
|
--theme-blue: #1e66f5;
|
||||||
|
--theme-lavender: #7287fd;
|
||||||
|
--theme-text: #4c4f69;
|
||||||
|
--theme-subtext1: #5c5f77;
|
||||||
|
--theme-subtext0: #6c6f85;
|
||||||
|
--theme-overlay2: #7c7f93;
|
||||||
|
--theme-overlay1: #8c8fa1;
|
||||||
|
--theme-overlay0: #9ca0b0;
|
||||||
|
--theme-surface2: #acb0be;
|
||||||
|
--theme-surface1: #bcc0cc;
|
||||||
|
--theme-surface0: #ccd0da;
|
||||||
|
--theme-base: #eff1f5;
|
||||||
|
--theme-mantle: #e6e9ef;
|
||||||
|
--theme-crust: #dce0e8;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme="frappe"] {
|
||||||
|
--theme-rosewater: #f2d5cf;
|
||||||
|
--theme-flamingo: #eebebe;
|
||||||
|
--theme-pink: #f4b8e4;
|
||||||
|
--theme-mauve: #ca9ee6;
|
||||||
|
--theme-red: #e78284;
|
||||||
|
--theme-maroon: #ea999c;
|
||||||
|
--theme-peach: #ef9f76;
|
||||||
|
--theme-yellow: #e5c890;
|
||||||
|
--theme-green: #a6d189;
|
||||||
|
--theme-teal: #81c8be;
|
||||||
|
--theme-sky: #99d1db;
|
||||||
|
--theme-sapphire: #85c1dc;
|
||||||
|
--theme-blue: #8caaee;
|
||||||
|
--theme-lavender: #babbf1;
|
||||||
|
--theme-text: #c6d0f5;
|
||||||
|
--theme-subtext1: #b5bfe2;
|
||||||
|
--theme-subtext0: #a5adce;
|
||||||
|
--theme-overlay2: #949cbb;
|
||||||
|
--theme-overlay1: #838ba7;
|
||||||
|
--theme-overlay0: #737994;
|
||||||
|
--theme-surface2: #626880;
|
||||||
|
--theme-surface1: #51576d;
|
||||||
|
--theme-surface0: #414559;
|
||||||
|
--theme-base: #303446;
|
||||||
|
--theme-mantle: #292c3c;
|
||||||
|
--theme-crust: #232634;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme="macchiato"] {
|
||||||
|
--theme-rosewater: #f4dbd6;
|
||||||
|
--theme-flamingo: #f0c6c6;
|
||||||
|
--theme-pink: #f5bde6;
|
||||||
|
--theme-mauve: #c6a0f6;
|
||||||
|
--theme-red: #ed8796;
|
||||||
|
--theme-maroon: #ee99a0;
|
||||||
|
--theme-peach: #f5a97f;
|
||||||
|
--theme-yellow: #eed49f;
|
||||||
|
--theme-green: #a6da95;
|
||||||
|
--theme-teal: #8bd5ca;
|
||||||
|
--theme-sky: #91d7e3;
|
||||||
|
--theme-sapphire: #7dc4e4;
|
||||||
|
--theme-blue: #8aadf4;
|
||||||
|
--theme-lavender: #b7bdf8;
|
||||||
|
--theme-text: #cad3f5;
|
||||||
|
--theme-subtext1: #b8c0e0;
|
||||||
|
--theme-subtext0: #a5adcb;
|
||||||
|
--theme-overlay2: #939ab7;
|
||||||
|
--theme-overlay1: #8087a2;
|
||||||
|
--theme-overlay0: #6e738d;
|
||||||
|
--theme-surface2: #5b6078;
|
||||||
|
--theme-surface1: #494d64;
|
||||||
|
--theme-surface0: #363a4f;
|
||||||
|
--theme-base: #24273a;
|
||||||
|
--theme-mantle: #1e2030;
|
||||||
|
--theme-crust: #181926;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme="mocha"] {
|
||||||
|
--theme-rosewater: #f5e0dc;
|
||||||
|
--theme-flamingo: #f2cdcd;
|
||||||
|
--theme-pink: #f5c2e7;
|
||||||
|
--theme-mauve: #cba6f7;
|
||||||
|
--theme-red: #f38ba8;
|
||||||
|
--theme-maroon: #eba0ac;
|
||||||
|
--theme-peach: #fab387;
|
||||||
|
--theme-yellow: #f9e2af;
|
||||||
|
--theme-green: #a6e3a1;
|
||||||
|
--theme-teal: #94e2d5;
|
||||||
|
--theme-sky: #89dceb;
|
||||||
|
--theme-sapphire: #74c7ec;
|
||||||
|
--theme-blue: #89b4fa;
|
||||||
|
--theme-lavender: #b4befe;
|
||||||
|
--theme-text: #cdd6f4;
|
||||||
|
--theme-subtext1: #bac2de;
|
||||||
|
--theme-subtext0: #a6adc8;
|
||||||
|
--theme-overlay2: #9399b2;
|
||||||
|
--theme-overlay1: #7f849c;
|
||||||
|
--theme-overlay0: #6c7086;
|
||||||
|
--theme-surface2: #585b70;
|
||||||
|
--theme-surface1: #45475a;
|
||||||
|
--theme-surface0: #313244;
|
||||||
|
--theme-base: #1e1e2e;
|
||||||
|
--theme-mantle: #181825;
|
||||||
|
--theme-crust: #11111b;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Color indicators for each theme */
|
||||||
|
[data-theme-color="latte"] { background: var(--theme-red); }
|
||||||
|
[data-theme-color="frappe"] { background: var(--theme-yellow); }
|
||||||
|
[data-theme-color="macchiato"] { background: var(--theme-green); }
|
||||||
|
[data-theme-color="mocha"] { background: var(--theme-blue); }
|
||||||
|
|
||||||
|
/* Theme Switcher Styles */
|
||||||
|
.theme-switcher {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.theme-option {
|
||||||
|
width: 24px;
|
||||||
|
height: 24px;
|
||||||
|
border-radius: 50%;
|
||||||
|
cursor: pointer;
|
||||||
|
border: 2px solid transparent;
|
||||||
|
transition: transform 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.theme-option:hover {
|
||||||
|
transform: scale(1.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.theme-option .active {
|
||||||
|
border-color: var(--theme-text);
|
||||||
|
}
|
||||||
224
html/css/style.css
Normal file
224
html/css/style.css
Normal file
@@ -0,0 +1,224 @@
|
|||||||
|
@charset "UTF-8";
|
||||||
|
|
||||||
|
* {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: 'Helvetica Neue', Arial, sans-serif;
|
||||||
|
line-height: 1.6;
|
||||||
|
padding-top: 80px; /* Offset for fixed navbar */
|
||||||
|
background-color: var(--theme-base);
|
||||||
|
color: var(--theme-text);
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: var(--theme-red);
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:hover {
|
||||||
|
color: var(--theme-peach);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Navbar Styles */
|
||||||
|
.navbar {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
background-color: var(--theme-base);
|
||||||
|
box-shadow: 0 2px 10px var(--theme-blue);
|
||||||
|
z-index: 1000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
width: 90%;
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 1rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
font-weight: 700;
|
||||||
|
color: var(--theme-text);
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo:hover {
|
||||||
|
color: var(--theme-text);
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-links ul {
|
||||||
|
display: flex;
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-links li {
|
||||||
|
margin-left: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-links a {
|
||||||
|
color: var(--theme-sky);
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: 500;
|
||||||
|
transition: color 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-links a:hover {
|
||||||
|
color: var(--theme-lavender);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Mobile Menu */
|
||||||
|
.hamburger {
|
||||||
|
display: none;
|
||||||
|
background: none;
|
||||||
|
border: none;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hamburger span {
|
||||||
|
display: block;
|
||||||
|
width: 25px;
|
||||||
|
height: 2px;
|
||||||
|
background: var(--theme-blue);
|
||||||
|
margin: 5px 0;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Hero Section */
|
||||||
|
.hero {
|
||||||
|
height: 80vh;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
text-align: center;
|
||||||
|
padding: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Responsive Design */
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.nav-links {
|
||||||
|
position: fixed;
|
||||||
|
top: 80px;
|
||||||
|
left: -100%;
|
||||||
|
width: 100%;
|
||||||
|
height: calc(100vh - 80px);
|
||||||
|
background-color: var(--theme-base);
|
||||||
|
transition: left 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-links.active {
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-links ul {
|
||||||
|
flex-direction: column;
|
||||||
|
padding: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-links li {
|
||||||
|
margin: 1rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hamburger {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hamburger.active span:nth-child(1) {
|
||||||
|
transform: rotate(45deg) translate(5px, 5px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.hamburger.active span:nth-child(2) {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hamburger.active span:nth-child(3) {
|
||||||
|
transform: rotate(-45deg) translate(5px, -5px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Section Styles */
|
||||||
|
.section {
|
||||||
|
padding: 5rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
width: 90%;
|
||||||
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: 2.5rem;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Section Styling */
|
||||||
|
#games .container {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Server Card Styling */
|
||||||
|
.server-card {
|
||||||
|
width: 100%;
|
||||||
|
padding: 1.5rem;
|
||||||
|
background: var(--theme-base);
|
||||||
|
border-radius: 8px;
|
||||||
|
box-shadow: 0 2px 10px var(--theme-blue);
|
||||||
|
}
|
||||||
|
|
||||||
|
.server-card h3 {
|
||||||
|
color: var(--theme-text);
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
font-size: 1.3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Server Info Styling (keep your existing styles) */
|
||||||
|
.server-info {
|
||||||
|
font-family: 'Courier New', monospace;
|
||||||
|
line-height: 1.8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.server-info p {
|
||||||
|
margin: 0.2rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.arrow {
|
||||||
|
margin: 0.3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.highlight {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-description {
|
||||||
|
margin: 12px 0;
|
||||||
|
color: var(--theme-subtext0);
|
||||||
|
font-size: 0.9rem;
|
||||||
|
line-height: 1.4;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Status indicators (keep your existing styles) */
|
||||||
|
.status.online {
|
||||||
|
color: var(--theme-green);
|
||||||
|
}
|
||||||
|
|
||||||
|
.status.offline {
|
||||||
|
color: var(--theme-red);
|
||||||
|
}
|
||||||
|
|
||||||
|
.status.unknown {
|
||||||
|
color: var(--theme-yellow);
|
||||||
|
}
|
||||||
151
html/index.html
Normal file
151
html/index.html
Normal file
@@ -0,0 +1,151 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Garde Studios</title>
|
||||||
|
<link rel="stylesheet" href="css/catppuccin.css">
|
||||||
|
<link rel="stylesheet" href="css/style.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="navbar">
|
||||||
|
<div class="container">
|
||||||
|
<a href="/" class="logo">Garde Studios</a>
|
||||||
|
<nav class="nav-links">
|
||||||
|
<ul>
|
||||||
|
<li><a href="#games">Games</a></li>
|
||||||
|
<li>
|
||||||
|
<div class="theme-switcher">
|
||||||
|
<div class="theme-option active" data-theme-color="latte" data-theme="latte"></div>
|
||||||
|
<div class="theme-option" data-theme-color="frappe" data-theme="frappe"></div>
|
||||||
|
<div class="theme-option" data-theme-color="macchiato" data-theme="macchiato"></div>
|
||||||
|
<div class="theme-option" data-theme-color="mocha" data-theme="mocha"></div>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
<button class="hamburger" aria-label="Menu">
|
||||||
|
<span></span>
|
||||||
|
<span></span>
|
||||||
|
<span></span>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<!-- Previous content remains until <main> -->
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<!--<section class="hero">
|
||||||
|
<h1>Garde Studios</h1>
|
||||||
|
<p>Digital experiences reimagined</p>
|
||||||
|
</section>-->
|
||||||
|
|
||||||
|
<section id="games" class="section">
|
||||||
|
<div class="container">
|
||||||
|
<h2>Games @ Garde Studios</h2>
|
||||||
|
<div class="server-card" data-ip="garde-studios.de" data-port="1234">
|
||||||
|
<h3>OpenRA - Red Alert</h3>
|
||||||
|
<div class="card-description">
|
||||||
|
<p>Die Alliierten vertrauen auf fortschrittliche Technologie und schnelle Aufklärung, während die Sowjets mit roher Gewalt und überwältigenden Zahlen dominieren – in diesem zeitlosen Konflikt entscheiden Taktik und Ressourcenkontrolle über den Sieg.</p>
|
||||||
|
</div>
|
||||||
|
<div class="server-info">
|
||||||
|
|
||||||
|
<p><span class="arrow">>></span> Link: <span class="highlight"><a href="https://www.openra.net/">openra.net</a></span></p>
|
||||||
|
<p><span class="arrow">>></span> Domain/IP: <span class="highlight">garde-studios.de</span></p>
|
||||||
|
<p><span class="arrow">>></span> Port: <span class="highlight">1234</span></p>
|
||||||
|
|
||||||
|
<p><span class="arrow">>></span> Password: <span class="highlight">garde-studios</span></p>
|
||||||
|
<div class="server-info">
|
||||||
|
<p><span class="arrow">>></span> Status: <span class="status unknown">Unknown</span></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="server-card" data-ip="garde-studios.de" data-port="1235">
|
||||||
|
<h3>OpenRA - Command & Conquer: Tiberian Dawn</h3>
|
||||||
|
<div class="card-description">
|
||||||
|
<p>Die GDI setzen auf hochwertige Technologie und schwere Panzerung, während die Bruderschaft von Nod mit Guerilla-Taktik und Tiberium-Waffen kämpft – doch beide Fraktionen müssen sich gegen die tödliche Verseuchung des Tiberiums behaupten.</p>
|
||||||
|
</div>
|
||||||
|
<div class="server-info">
|
||||||
|
<p><span class="arrow">>></span> Link: <span class="highlight"><a href="https://www.openra.net/">openra.net</a></span></p>
|
||||||
|
<p><span class="arrow">>></span> Domain/IP: <span class="highlight">garde-studios.de</span></p>
|
||||||
|
<p><span class="arrow">>></span> Port: <span class="highlight">1235</span></p>
|
||||||
|
|
||||||
|
<p><span class="arrow">>></span> Password: <span class="highlight">garde-studios</span></p>
|
||||||
|
<div class="server-info">
|
||||||
|
<p><span class="arrow">>></span> Status: <span class="status unknown">Unknown</span></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="server-card" data-ip="garde-studios.de" data-port="1236">
|
||||||
|
<h3>OpenRA - Dune 2000</h3>
|
||||||
|
<div class="card-description">
|
||||||
|
<p>Die Atreides setzen auf Elite-Truppen und Präzision, die Harkonnen überrollen Feinde mit brutaler Feuerkraft, und die Ordos kämpfen mit hinterhältigen Söldnertaktiken – doch alle müssen um das Melange kämpfen, die Quelle der Macht auf Arrakis.</p>
|
||||||
|
</div>
|
||||||
|
<div class="server-info">
|
||||||
|
<p><span class="arrow">>></span> Link: <span class="highlight"><a href="https://www.openra.net/">openra.net</a></span></p>
|
||||||
|
<p><span class="arrow">>></span> Domain/IP: <span class="highlight">garde-studios.de</span></p>
|
||||||
|
<p><span class="arrow">>></span> Port: <span class="highlight">1236</span></p>
|
||||||
|
|
||||||
|
<p><span class="arrow">>></span> Password: <span class="highlight">garde-studios</span></p>
|
||||||
|
<div class="server-info">
|
||||||
|
<p><span class="arrow">>></span> Status: <span class="status unknown">Unknown</span></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="server-card" data-ip="garde-studios.de" data-port="14004">
|
||||||
|
<h3>Veloren</h3>
|
||||||
|
<div class="card-description">
|
||||||
|
<p>Die Abenteurer erkunden eine pixelige Fantasy-Welt mit komplexen Kämpfen und tiefen Handwerkssystemen, während dunkele Kreaturen und tödliche Höhlen auf unvorsichtige Helden lauern – doch der größte Feind ist oft die eigene Gier nach legendärer Beute.</p>
|
||||||
|
</div>
|
||||||
|
<div class="server-info">
|
||||||
|
|
||||||
|
<p><span class="arrow">>></span> Link: <span class="highlight"><a href="https://www.veloren.net/">veloren.net</a></span></p>
|
||||||
|
<p><span class="arrow">>></span> Domain/IP: <span class="highlight">garde-studios.de</span></p>
|
||||||
|
<p><span class="arrow">>></span> Port: <span class="highlight">14004</span></p>
|
||||||
|
<div class="server-info">
|
||||||
|
<p><span class="arrow">>></span> Status: <span class="status unknown">Unknown</span></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="server-card" data-ip="garde-studios.de" data-port="34197">
|
||||||
|
<h3>Factorio (No Space Age DLC)</h3>
|
||||||
|
<div class="card-description">
|
||||||
|
<p>Die Ingenieure optimieren Fabriken mit Präzision und Logistik, während die Biters mit schierer Zahl und evolutionärer Anpassung drohen – doch das wahre Chaos entsteht, wenn die Produktionsketten ins Stolpern geraten.</p>
|
||||||
|
</div>
|
||||||
|
<div class="server-info">
|
||||||
|
<p><span class="arrow">>></span> Link: <span class="highlight"><a href="https://factorio.com/">factorio.com</a></span></p>
|
||||||
|
<p><span class="arrow">>></span> Domain/IP: <span class="highlight">garde-studios.de</span></p>
|
||||||
|
<p><span class="arrow">>></span> Port: <span class="highlight">34197</span></p>
|
||||||
|
<p><span class="arrow">>></span> Password: <span class="highlight">garde-studios</span></p>
|
||||||
|
<div class="server-info">
|
||||||
|
<p><span class="arrow">>></span> Status: <span class="status unknown">Unknown</span></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="server-card" data-ip="garde-studios.de" data-port="16261">
|
||||||
|
<h3>Project Zomboid</h3>
|
||||||
|
<div class="card-description">
|
||||||
|
<p>Die Überlebenden horten Vorräte und planen Fluchtwege, während die Horden durch Geräusche und Blutgeruch angelockt werden – doch der gefährlichste Feind bleibt die eigene Unvorsichtigkeit.</p>
|
||||||
|
</div>
|
||||||
|
<div class="server-info">
|
||||||
|
<p><span class="arrow">>></span> Link: <span class="highlight"><a href="https://projectzomboid.com/">projectzomboid.com</a></span></p>
|
||||||
|
<p><span class="arrow">>></span> Domain/IP: <span class="highlight">garde-studios.de</span></p>
|
||||||
|
<p><span class="arrow">>></span> Port: <span class="highlight">16261</span></p>
|
||||||
|
<div class="server-info">
|
||||||
|
<p><span class="arrow">>></span> Status: <span class="status unknown">Unknown</span></p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<script src="js/main.js"></script>
|
||||||
|
<script src="js/theme-switcher.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
74
html/js/main.js
Normal file
74
html/js/main.js
Normal file
@@ -0,0 +1,74 @@
|
|||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
// Mobile menu toggle
|
||||||
|
const hamburger = document.querySelector('.hamburger');
|
||||||
|
const navLinks = document.querySelector('.nav-links');
|
||||||
|
|
||||||
|
hamburger.addEventListener('click', function() {
|
||||||
|
this.classList.toggle('active');
|
||||||
|
navLinks.classList.toggle('active');
|
||||||
|
});
|
||||||
|
|
||||||
|
// Close menu when clicking a link (mobile)
|
||||||
|
document.querySelectorAll('.nav-links a').forEach(link => {
|
||||||
|
link.addEventListener('click', () => {
|
||||||
|
hamburger.classList.remove('active');
|
||||||
|
navLinks.classList.remove('active');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Smooth scrolling for anchor links
|
||||||
|
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
||||||
|
anchor.addEventListener('click', function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
|
||||||
|
const targetId = this.getAttribute('href');
|
||||||
|
if (targetId === '#') return;
|
||||||
|
|
||||||
|
const targetElement = document.querySelector(targetId);
|
||||||
|
if (targetElement) {
|
||||||
|
window.scrollTo({
|
||||||
|
top: targetElement.offsetTop - 80, // Adjusted for fixed header
|
||||||
|
behavior: 'smooth'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
const serverCards = document.querySelectorAll('.server-card');
|
||||||
|
const API_URL = '/api/check-port'; // Change in production
|
||||||
|
|
||||||
|
async function checkServerStatus(card) {
|
||||||
|
const ip = card.dataset.ip;
|
||||||
|
const port = card.dataset.port;
|
||||||
|
const statusElement = card.querySelector('.status');
|
||||||
|
|
||||||
|
if (!ip || !port || !statusElement) return;
|
||||||
|
|
||||||
|
statusElement.textContent = 'Checking...';
|
||||||
|
statusElement.className = 'status unknown';
|
||||||
|
|
||||||
|
try {
|
||||||
|
const response = await fetch(`${API_URL}?host=${encodeURIComponent(ip)}&port=${port}`);
|
||||||
|
const data = await response.json();
|
||||||
|
|
||||||
|
statusElement.textContent = data.status.charAt(0).toUpperCase() + data.status.slice(1);
|
||||||
|
statusElement.className = `status ${data.status}`;
|
||||||
|
} catch (e) {
|
||||||
|
statusElement.textContent = 'Error';
|
||||||
|
statusElement.className = 'status unknown';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initial check
|
||||||
|
serverCards.forEach(checkServerStatus);
|
||||||
|
|
||||||
|
// Click handler for manual refresh
|
||||||
|
serverCards.forEach(card => {
|
||||||
|
card.addEventListener('click', () => checkServerStatus(card));
|
||||||
|
});
|
||||||
|
|
||||||
|
// Periodic checks every 5 minutes
|
||||||
|
setInterval(() => serverCards.forEach(checkServerStatus), 5 * 60 * 1000);
|
||||||
|
});
|
||||||
34
html/js/theme-switcher.js
Normal file
34
html/js/theme-switcher.js
Normal file
@@ -0,0 +1,34 @@
|
|||||||
|
document.addEventListener('DOMContentLoaded', () => {
|
||||||
|
const themeOptions = document.querySelectorAll('.theme-option');
|
||||||
|
const html = document.documentElement;
|
||||||
|
|
||||||
|
// Set initial theme from localStorage or default to latte
|
||||||
|
const savedTheme = localStorage.getItem('catppuccin-theme') || 'latte';
|
||||||
|
html.setAttribute('data-theme', savedTheme);
|
||||||
|
updateActiveTheme(savedTheme);
|
||||||
|
|
||||||
|
// Theme switcher functionality
|
||||||
|
themeOptions.forEach(option => {
|
||||||
|
option.addEventListener('click', () => {
|
||||||
|
const theme = option.dataset.theme;
|
||||||
|
html.setAttribute('data-theme', theme);
|
||||||
|
localStorage.setItem('catppuccin-theme', theme);
|
||||||
|
updateActiveTheme(theme);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Update active theme indicator
|
||||||
|
function updateActiveTheme(theme) {
|
||||||
|
themeOptions.forEach(opt => {
|
||||||
|
const isActive = opt.dataset.theme === theme;
|
||||||
|
opt.classList.toggle('active', isActive);
|
||||||
|
|
||||||
|
// Update border color immediately
|
||||||
|
if (isActive) {
|
||||||
|
opt.style.borderColor = `var(--theme-mantle)`;
|
||||||
|
} else {
|
||||||
|
opt.style.borderColor = 'transparent';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
58
nginx/conf.d/default.conf
Normal file
58
nginx/conf.d/default.conf
Normal file
@@ -0,0 +1,58 @@
|
|||||||
|
server {
|
||||||
|
listen 80;
|
||||||
|
server_name garde-studios.de www.garde-studios.de;
|
||||||
|
|
||||||
|
charset utf-8;
|
||||||
|
charset_types text/html text/css application/javascript text/plain text/xml;
|
||||||
|
|
||||||
|
location /.well-known/acme-challenge/ {
|
||||||
|
root /var/www/certbot;
|
||||||
|
}
|
||||||
|
location / {
|
||||||
|
return 301 https://$host$request_uri;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
server {
|
||||||
|
listen 443 ssl http2;
|
||||||
|
server_name garde-studios.de www.garde-studios.de;
|
||||||
|
|
||||||
|
charset utf-8;
|
||||||
|
charset_types text/html text/css application/javascript text/plain text/xml;
|
||||||
|
|
||||||
|
ssl_certificate /etc/letsencrypt/live/garde-studios.de/fullchain.pem;
|
||||||
|
ssl_certificate_key /etc/letsencrypt/live/garde-studios.de/privkey.pem;
|
||||||
|
|
||||||
|
# SSL configuration
|
||||||
|
ssl_protocols TLSv1.2 TLSv1.3;
|
||||||
|
ssl_prefer_server_ciphers on;
|
||||||
|
ssl_ciphers EECDH+AESGCM:EDH+AESGCM;
|
||||||
|
ssl_ecdh_curve secp384r1;
|
||||||
|
ssl_session_timeout 10m;
|
||||||
|
ssl_session_cache shared:SSL:10m;
|
||||||
|
ssl_session_tickets off;
|
||||||
|
ssl_stapling on;
|
||||||
|
ssl_stapling_verify on;
|
||||||
|
|
||||||
|
root /usr/share/nginx/html;
|
||||||
|
index index.html;
|
||||||
|
|
||||||
|
# API reverse proxy
|
||||||
|
location /api/ {
|
||||||
|
proxy_pass http://port-checker:8000/;
|
||||||
|
proxy_set_header Host $host;
|
||||||
|
proxy_set_header X-Real-IP $remote_addr;
|
||||||
|
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
|
||||||
|
proxy_set_header X-Forwarded-Proto $scheme;
|
||||||
|
|
||||||
|
# WebSocket support (if needed in future)
|
||||||
|
proxy_http_version 1.1;
|
||||||
|
proxy_set_header Upgrade $http_upgrade;
|
||||||
|
proxy_set_header Connection "upgrade";
|
||||||
|
}
|
||||||
|
|
||||||
|
# Frontend static files
|
||||||
|
location / {
|
||||||
|
try_files $uri $uri/ /index.html;
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user