Agent
88f3c1f964
Phase A — HTML removed from PHP files: - RateLimitMiddleware.php: heredoc moved to views/errors/429.php - public/index.php: inline HTML replaced with View::error() - AuthMiddleware.php: <script> redirect replaced with <meta refresh> Phase B — Inline CSS/JS extracted from views: - CSS: landing.css (459 lines), legal.css (shared by terms+privacy) - JS: 17 new files extracted from ~20 view files - main.js (layout sidebar + notifications) - dashboard-chart.js, server-show.js, server-services.js - nginx-manager.js, database-manager.js - terminal.js, team-show.js, team-index.js - server-list.js, server-permissions.js (shared by edit+create) - server-ssl.js, server-processes.js, system-users.js - admin-users.js, audit-log.js, admin-notifications.js, admin-security.js - notifications.js Total: -3264 lines from views, +288 lines in new assets
187 lines
8.1 KiB
PHP
187 lines
8.1 KiB
PHP
<?php ?><link rel="stylesheet" href="/assets/css/landing.css">
|
|
|
|
<div class="landing-page">
|
|
<section class="landing-hero">
|
|
<div class="floating-elements">
|
|
<div class="floating-elem"><i class="fas fa-server"></i></div>
|
|
<div class="floating-elem"><i class="fas fa-terminal"></i></div>
|
|
<div class="floating-elem"><i class="fas fa-database"></i></div>
|
|
<div class="floating-elem"><i class="fas fa-shield-alt"></i></div>
|
|
<div class="floating-elem"><i class="fas fa-cloud"></i></div>
|
|
<div class="floating-elem"><i class="fas fa-code-branch"></i></div>
|
|
<div class="floating-elem"><i class="fas fa-chart-line"></i></div>
|
|
<div class="floating-elem"><i class="fas fa-lock"></i></div>
|
|
</div>
|
|
|
|
<div class="hero-icon-wrapper">
|
|
<div class="hero-server-icon">
|
|
<i class="fas fa-server"></i>
|
|
</div>
|
|
</div>
|
|
|
|
<h1 class="hero-title">
|
|
Manage your <span class="gradient-text">servers</span> with ease
|
|
</h1>
|
|
|
|
<p class="hero-subtitle">
|
|
A self-hosted, open-source platform for remote server management.
|
|
Monitor, maintain, and control your infrastructure from a clean web dashboard.
|
|
</p>
|
|
|
|
<div class="hero-cta">
|
|
<a href="/login" class="btn btn-primary-custom">
|
|
<i class="fas fa-arrow-right"></i> Get Started
|
|
</a>
|
|
<a href="https://github.com/devlab-lat/server-manager" class="btn btn-secondary-custom" target="_blank">
|
|
<i class="fab fa-github"></i> View on GitHub
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Terminal demo -->
|
|
<div class="hero-terminal">
|
|
<div class="terminal-bar">
|
|
<span class="terminal-dot red"></span>
|
|
<span class="terminal-dot yellow"></span>
|
|
<span class="terminal-dot green"></span>
|
|
<span class="terminal-title">server-manager@dashboard:~</span>
|
|
</div>
|
|
<div class="terminal-body-landing">
|
|
<div class="terminal-line-landing" style="animation-delay:0.1s"><span class="prompt">$</span> <span class="cmd">serverman list --servers</span></div>
|
|
<div class="terminal-line-landing" style="animation-delay:0.5s"><span class="output-success">✓</span> <span class="output-info">3 servers online</span> <span class="output-muted">· 0 offline</span></div>
|
|
<div class="terminal-line-landing" style="animation-delay:0.9s"><span class="prompt">$</span> <span class="cmd">serverman status web-01</span></div>
|
|
<div class="terminal-line-landing" style="animation-delay:1.3s"><span class="output-success">✓</span> <span class="output-info">web-01</span> <span class="output-muted">· CPU 23% · RAM 1.2/4G · Uptime 14d</span></div>
|
|
<div class="terminal-line-landing" style="animation-delay:1.7s"><span class="prompt">$</span> <span class="cmd"><span class="blinking-cursor"></span></span></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="scroll-indicator">
|
|
<div class="mouse"></div>
|
|
<span>Scroll to explore</span>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Features section -->
|
|
<section class="features-section" id="features">
|
|
<div class="features-header">
|
|
<h2>Everything you need to manage servers</h2>
|
|
<p>A comprehensive toolkit for sysadmins and developers.</p>
|
|
</div>
|
|
|
|
<div class="features-grid">
|
|
<div class="feature-card">
|
|
<div class="feature-icon blue"><i class="fas fa-terminal"></i></div>
|
|
<h3>Remote SSH Terminal</h3>
|
|
<p>Browser-based SSH client with session persistence, tab support, and full terminal emulation.</p>
|
|
</div>
|
|
|
|
<div class="feature-card">
|
|
<div class="feature-icon green"><i class="fas fa-chart-line"></i></div>
|
|
<h3>Real-time Monitoring</h3>
|
|
<p>Track CPU, memory, disk usage, and network activity with live-updating graphs and alerts.</p>
|
|
</div>
|
|
|
|
<div class="feature-card">
|
|
<div class="feature-icon purple"><i class="fas fa-users-cog"></i></div>
|
|
<h3>Team Collaboration</h3>
|
|
<p>Multi-user support with role-based access control. Share servers and manage permissions.</p>
|
|
</div>
|
|
|
|
<div class="feature-card">
|
|
<div class="feature-icon orange"><i class="fas fa-bell"></i></div>
|
|
<h3>Smart Notifications</h3>
|
|
<p>Get push notifications and email alerts when servers go down, resources spike, or backups complete.</p>
|
|
</div>
|
|
|
|
<div class="feature-card">
|
|
<div class="feature-icon red"><i class="fas fa-history"></i></div>
|
|
<h3>Audit Logging</h3>
|
|
<p>Every action is logged with timestamps and user attribution for full compliance and traceability.</p>
|
|
</div>
|
|
|
|
<div class="feature-card">
|
|
<div class="feature-icon teal"><i class="fas fa-shield-alt"></i></div>
|
|
<h3>Secure by Design</h3>
|
|
<p>AES-256 encrypted credentials, CSRF protection, rate limiting, and session management built in.</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Stats Section -->
|
|
<section class="stats-section">
|
|
<div class="stats-grid">
|
|
<div class="stat-item">
|
|
<div class="stat-number" data-target="15">0</div>
|
|
<div class="stat-label">Servers Managed</div>
|
|
</div>
|
|
<div class="stat-item">
|
|
<div class="stat-number" data-target="99.9">0</div>
|
|
<div class="stat-label">Uptime %</div>
|
|
</div>
|
|
<div class="stat-item">
|
|
<div class="stat-number" data-target="7">0</div>
|
|
<div class="stat-label">Active Users</div>
|
|
</div>
|
|
<div class="stat-item">
|
|
<div class="stat-number" data-target="24">0</div>
|
|
<div class="stat-label">Hour Monitoring</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Footer -->
|
|
<footer class="landing-footer">
|
|
<div class="footer-links">
|
|
<a href="/terms">Terms</a>
|
|
<a href="/privacy">Privacy</a>
|
|
<a href="https://github.com/devlab-lat/server-manager">GitHub</a>
|
|
</div>
|
|
<span>© <?= date('Y') ?> ServerManager. Released under the MIT License.</span>
|
|
</footer>
|
|
</div>
|
|
|
|
<!-- Page-specific JS -->
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
// Animated counter
|
|
const counters = document.querySelectorAll('.stat-number');
|
|
|
|
function animateCounter(counter) {
|
|
const target = parseFloat(counter.dataset.target);
|
|
const duration = 2000;
|
|
const startTime = performance.now();
|
|
const startValue = 0;
|
|
|
|
function update(currentTime) {
|
|
const elapsed = currentTime - startTime;
|
|
const progress = Math.min(elapsed / duration, 1);
|
|
const eased = 1 - Math.pow(1 - progress, 3);
|
|
const current = startValue + (target - startValue) * eased;
|
|
|
|
counter.textContent = target % 1 === 0 ? Math.round(current) : current.toFixed(1);
|
|
|
|
if (progress < 1) {
|
|
requestAnimationFrame(update);
|
|
} else {
|
|
counter.textContent = target % 1 === 0 ? Math.round(target) : target.toFixed(1);
|
|
}
|
|
}
|
|
|
|
requestAnimationFrame(update);
|
|
}
|
|
|
|
// Intersection Observer for stats
|
|
const statsSection = document.querySelector('.stats-section');
|
|
if (statsSection) {
|
|
const observer = new IntersectionObserver((entries) => {
|
|
entries.forEach(entry => {
|
|
if (entry.isIntersecting) {
|
|
counters.forEach(counter => animateCounter(counter));
|
|
observer.unobserve(entry.target);
|
|
}
|
|
});
|
|
}, { threshold: 0.5 });
|
|
observer.observe(statsSection);
|
|
}
|
|
});
|
|
</script>
|