Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>CyberPenguin Linux Hub</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <style> | |
| @import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700&family=Press+Start+2P&display=swap'); | |
| :root { | |
| --neon-pink: #ff2ced; | |
| --neon-blue: #00f7ff; | |
| --neon-green: #00ff7f; | |
| --neon-purple: #9d00ff; | |
| } | |
| body { | |
| font-family: 'Orbitron', sans-serif; | |
| background-color: #0a0a1a; | |
| color: white; | |
| overflow-x: hidden; | |
| perspective: 1000px; | |
| } | |
| .cyber-text { | |
| text-shadow: 0 0 5px var(--neon-blue), 0 0 10px var(--neon-blue); | |
| } | |
| .cyber-border { | |
| border: 2px solid var(--neon-pink); | |
| box-shadow: 0 0 10px var(--neon-pink), inset 0 0 10px var(--neon-pink); | |
| } | |
| .cyber-button { | |
| transition: all 0.2s; | |
| position: relative; | |
| overflow: hidden; | |
| } | |
| .cyber-button:hover { | |
| transform: translateY(-3px); | |
| box-shadow: 0 0 15px var(--neon-blue); | |
| } | |
| .cyber-button:active { | |
| transform: translateY(0); | |
| } | |
| .cyber-button::before { | |
| content: ''; | |
| position: absolute; | |
| top: 0; | |
| left: -100%; | |
| width: 100%; | |
| height: 100%; | |
| background: linear-gradient(90deg, transparent, rgba(0, 247, 255, 0.4), transparent); | |
| transition: 0.5s; | |
| } | |
| .cyber-button:hover::before { | |
| left: 100%; | |
| } | |
| .penguin { | |
| position: absolute; | |
| width: 60px; | |
| height: 80px; | |
| background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path fill="%23000" d="M50 20c-15 0-25 10-25 25s10 25 25 25 25-10 25-25-10-25-25-25zm-10 40c-5 0-10-5-10-10s5-10 10-10 10 5 10 10-5 10-10 10zm20 0c-5 0-10-5-10-10s5-10 10-10 10 5 10 10-5 10-10 10z"/><path fill="%23fff" d="M45 30c-5 0-10 5-10 10s5 10 10 10 10-5 10-10-5-10-10-10zm10 0c-5 0-10 5-10 10s5 10 10 10 10-5 10-10-5-10-10-10z"/><path fill="%23ff9900" d="M50 70c-5 0-10-5-10-10h20c0 5-5 10-10 10z"/></svg>'); | |
| background-size: contain; | |
| background-repeat: no-repeat; | |
| filter: drop-shadow(0 0 5px var(--neon-blue)) drop-shadow(0 0 10px var(--neon-pink)); | |
| z-index: 100; | |
| transition: transform 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275); | |
| } | |
| .grid-line { | |
| position: absolute; | |
| background: linear-gradient(90deg, rgba(0, 247, 255, 0.1), rgba(0, 247, 255, 0.3), rgba(0, 247, 255, 0.1)); | |
| z-index: -1; | |
| } | |
| .grid-line.horizontal { | |
| width: 100%; | |
| height: 1px; | |
| } | |
| .grid-line.vertical { | |
| width: 1px; | |
| height: 100%; | |
| } | |
| .page { | |
| position: absolute; | |
| width: 100%; | |
| height: 100%; | |
| top: 0; | |
| left: 0; | |
| opacity: 0; | |
| pointer-events: none; | |
| transition: all 0.6s cubic-bezier(0.77, 0, 0.175, 1); | |
| transform: translateX(100%); | |
| padding: 20px; | |
| overflow-y: auto; | |
| } | |
| .page.active { | |
| opacity: 1; | |
| pointer-events: all; | |
| transform: translateX(0); | |
| } | |
| .page.exit { | |
| transform: translateX(-100%); | |
| } | |
| .link-card { | |
| transition: all 0.3s; | |
| background: rgba(10, 10, 30, 0.7); | |
| backdrop-filter: blur(5px); | |
| } | |
| .link-card:hover { | |
| transform: translateY(-5px) scale(1.02); | |
| box-shadow: 0 0 20px var(--neon-purple); | |
| } | |
| .rgb-border { | |
| border: 2px solid; | |
| border-image: linear-gradient(45deg, var(--neon-pink), var(--neon-blue), var(--neon-green)) 1; | |
| animation: rgb-border-animation 5s linear infinite; | |
| } | |
| @keyframes rgb-border-animation { | |
| 0% { border-image-source: linear-gradient(45deg, var(--neon-pink), var(--neon-blue), var(--neon-green)); } | |
| 33% { border-image-source: linear-gradient(45deg, var(--neon-blue), var(--neon-green), var(--neon-pink)); } | |
| 66% { border-image-source: linear-gradient(45deg, var(--neon-green), var(--neon-pink), var(--neon-blue)); } | |
| 100% { border-image-source: linear-gradient(45deg, var(--neon-pink), var(--neon-blue), var(--neon-green)); } | |
| } | |
| .rgb-text { | |
| background: linear-gradient(45deg, var(--neon-pink), var(--neon-blue), var(--neon-green)); | |
| -webkit-background-clip: text; | |
| background-clip: text; | |
| color: transparent; | |
| animation: rgb-text-animation 5s linear infinite; | |
| } | |
| @keyframes rgb-text-animation { | |
| 0% { background-position: 0% 50%; } | |
| 100% { background-position: 100% 50%; } | |
| } | |
| .scanlines { | |
| position: fixed; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| background: linear-gradient(rgba(0, 247, 255, 0.03) 1px, transparent 1px); | |
| background-size: 100% 3px; | |
| pointer-events: none; | |
| z-index: 999; | |
| } | |
| .glitch { | |
| position: relative; | |
| } | |
| .glitch::before, .glitch::after { | |
| content: attr(data-text); | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| background: #0a0a1a; | |
| } | |
| .glitch::before { | |
| left: 2px; | |
| text-shadow: -2px 0 var(--neon-pink); | |
| clip: rect(44px, 450px, 56px, 0); | |
| animation: glitch-anim 5s infinite linear alternate-reverse; | |
| } | |
| .glitch::after { | |
| left: -2px; | |
| text-shadow: -2px 0 var(--neon-blue); | |
| clip: rect(44px, 450px, 56px, 0); | |
| animation: glitch-anim2 5s infinite linear alternate-reverse; | |
| } | |
| @keyframes glitch-anim { | |
| 0% { clip: rect(31px, 9999px, 94px, 0); } | |
| 10% { clip: rect(112px, 9999px, 76px, 0); } | |
| 20% { clip: rect(85px, 9999px, 77px, 0); } | |
| 30% { clip: rect(27px, 9999px, 97px, 0); } | |
| 40% { clip: rect(64px, 9999px, 98px, 0); } | |
| 50% { clip: rect(61px, 9999px, 85px, 0); } | |
| 60% { clip: rect(99px, 9999px, 114px, 0); } | |
| 70% { clip: rect(34px, 9999px, 115px, 0); } | |
| 80% { clip: rect(98px, 9999px, 129px, 0); } | |
| 90% { clip: rect(43px, 9999px, 96px, 0); } | |
| 100% { clip: rect(82px, 9999px, 64px, 0); } | |
| } | |
| @keyframes glitch-anim2 { | |
| 0% { clip: rect(65px, 9999px, 119px, 0); } | |
| 10% { clip: rect(79px, 9999px, 66px, 0); } | |
| 20% { clip: rect(75px, 9999px, 87px, 0); } | |
| 30% { clip: rect(48px, 9999px, 137px, 0); } | |
| 40% { clip: rect(54px, 9999px, 61px, 0); } | |
| 50% { clip: rect(22px, 9999px, 118px, 0); } | |
| 60% { clip: rect(73px, 9999px, 104px, 0); } | |
| 70% { clip: rect(72px, 9999px, 132px, 0); } | |
| 80% { clip: rect(105px, 9999px, 57px, 0); } | |
| 90% { clip: rect(20px, 9999px, 92px, 0); } | |
| 100% { clip: rect(64px, 9999px, 98px, 0); } | |
| } | |
| .pulse { | |
| animation: pulse 2s infinite; | |
| } | |
| @keyframes pulse { | |
| 0% { box-shadow: 0 0 0 0 rgba(0, 247, 255, 0.7); } | |
| 70% { box-shadow: 0 0 0 15px rgba(0, 247, 255, 0); } | |
| 100% { box-shadow: 0 0 0 0 rgba(0, 247, 255, 0); } | |
| } | |
| </style> | |
| </head> | |
| <body class="relative overflow-hidden"> | |
| <!-- Background grid --> | |
| <div id="grid-container" class="fixed inset-0 z-0"></div> | |
| <!-- Scanlines effect --> | |
| <div class="scanlines"></div> | |
| <!-- Main container --> | |
| <div class="container mx-auto px-4 relative z-10 min-h-screen"> | |
| <!-- Header --> | |
| <header class="py-6 flex flex-col items-center"> | |
| <h1 class="glitch text-5xl md:text-6xl font-bold mb-4 text-center" data-text="CYBERPENGUIN"> | |
| <span class="rgb-text">CYBERPENGUIN</span> | |
| </h1> | |
| <h2 class="text-xl md:text-2xl cyber-text text-center">Linux Administration Hub</h2> | |
| </header> | |
| <!-- Navigation --> | |
| <nav class="flex flex-wrap justify-center gap-4 mb-8"> | |
| <button onclick="switchPage('home')" class="cyber-button bg-black text-white px-6 py-2 rounded-md border border-neon-pink font-bold cyber-text"> | |
| <i class="fas fa-home mr-2"></i> Home | |
| </button> | |
| <button onclick="switchPage('basics')" class="cyber-button bg-black text-white px-6 py-2 rounded-md border border-neon-blue font-bold cyber-text"> | |
| <i class="fas fa-terminal mr-2"></i> Basics | |
| </button> | |
| <button onclick="switchPage('networking')" class="cyber-button bg-black text-white px-6 py-2 rounded-md border border-neon-green font-bold cyber-text"> | |
| <i class="fas fa-network-wired mr-2"></i> Networking | |
| </button> | |
| <button onclick="switchPage('security')" class="cyber-button bg-black text-white px-6 py-2 rounded-md border border-neon-purple font-bold cyber-text"> | |
| <i class="fas fa-shield-alt mr-2"></i> Security | |
| </button> | |
| <button onclick="switchPage('monitoring')" class="cyber-button bg-black text-white px-6 py-2 rounded-md border border-neon-pink font-bold cyber-text"> | |
| <i class="fas fa-chart-line mr-2"></i> Monitoring | |
| </button> | |
| <button onclick="switchPage('advanced')" class="cyber-button bg-black text-white px-6 py-2 rounded-md border border-neon-blue font-bold cyber-text"> | |
| <i class="fas fa-cogs mr-2"></i> Advanced | |
| </button> | |
| </nav> | |
| <!-- Pages --> | |
| <div class="relative min-h-[70vh]"> | |
| <!-- Home Page --> | |
| <div id="home" class="page active"> | |
| <div class="text-center mb-8"> | |
| <h2 class="text-3xl md:text-4xl font-bold mb-4 cyber-text">Welcome to CyberPenguin</h2> | |
| <p class="text-lg mb-6 max-w-3xl mx-auto">Your ultimate cyberpunk-style resource hub for Linux system administration. Jump between sections using the neon navigation above.</p> | |
| <div class="rgb-border p-4 max-w-2xl mx-auto mb-8"> | |
| <h3 class="text-2xl font-bold mb-3 rgb-text">Quick Tips</h3> | |
| <ul class="text-left space-y-2"> | |
| <li><i class="fas fa-chevron-right text-neon-green mr-2"></i> Always check logs when troubleshooting: <code class="bg-gray-900 px-2 py-1 rounded">journalctl -xe</code></li> | |
| <li><i class="fas fa-chevron-right text-neon-green mr-2"></i> Know your system: <code class="bg-gray-900 px-2 py-1 rounded">uname -a</code></li> | |
| <li><i class="fas fa-chevron-right text-neon-green mr-2"></i> Monitor resources: <code class="bg-gray-900 px-2 py-1 rounded">htop</code></li> | |
| <li><i class="fas fa-chevron-right text-neon-green mr-2"></i> Secure your SSH: <code class="bg-gray-900 px-2 py-1 rounded">sudo nano /etc/ssh/sshd_config</code></li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> | |
| <div class="link-card rgb-border p-6 rounded-lg" onclick="switchPage('basics')"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">Basics</h3> | |
| <p>Essential commands and concepts every Linux admin should know.</p> | |
| <div class="mt-4 text-neon-blue"> | |
| <i class="fas fa-arrow-right"></i> | |
| </div> | |
| </div> | |
| <div class="link-card rgb-border p-6 rounded-lg" onclick="switchPage('networking')"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">Networking</h3> | |
| <p>Network configuration, troubleshooting, and optimization.</p> | |
| <div class="mt-4 text-neon-blue"> | |
| <i class="fas fa-arrow-right"></i> | |
| </div> | |
| </div> | |
| <div class="link-card rgb-border p-6 rounded-lg" onclick="switchPage('security')"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">Security</h3> | |
| <p>Hardening your system and protecting against threats.</p> | |
| <div class="mt-4 text-neon-blue"> | |
| <i class="fas fa-arrow-right"></i> | |
| </div> | |
| </div> | |
| <div class="link-card rgb-border p-6 rounded-lg" onclick="switchPage('monitoring')"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">Monitoring</h3> | |
| <p>Tools and techniques for keeping an eye on your systems.</p> | |
| <div class="mt-4 text-neon-blue"> | |
| <i class="fas fa-arrow-right"></i> | |
| </div> | |
| </div> | |
| <div class="link-card rgb-border p-6 rounded-lg" onclick="switchPage('advanced')"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">Advanced</h3> | |
| <p>Expert-level techniques and niche tools for power users.</p> | |
| <div class="mt-4 text-neon-blue"> | |
| <i class="fas fa-arrow-right"></i> | |
| </div> | |
| </div> | |
| <div class="link-card rgb-border p-6 rounded-lg"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">Community</h3> | |
| <p>Join the CyberPenguin community for support and collaboration.</p> | |
| <div class="mt-4 text-neon-blue"> | |
| <i class="fas fa-arrow-right"></i> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Basics Page --> | |
| <div id="basics" class="page"> | |
| <h2 class="text-3xl font-bold mb-6 cyber-text"><i class="fas fa-terminal mr-3"></i> Linux Basics</h2> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-6"> | |
| <div class="link-card rgb-border p-6 rounded-lg"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">File System</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="https://linuxjourney.com/" target="_blank" class="text-neon-blue hover:underline">Linux Journey</a> - Interactive learning</li> | |
| <li><a href="https://www.tecmint.com/linux-commands-cheat-sheet/" target="_blank" class="text-neon-blue hover:underline">Command Cheat Sheet</a></li> | |
| <li><a href="https://explainshell.com/" target="_blank" class="text-neon-blue hover:underline">Explain Shell</a> - Command breakdown</li> | |
| <li><a href="https://linux.die.net/man/" target="_blank" class="text-neon-blue hover:underline">Linux Man Pages</a></li> | |
| </ul> | |
| </div> | |
| <div class="link-card rgb-border p-6 rounded-lg"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">Package Management</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="https://wiki.debian.org/Apt" target="_blank" class="text-neon-blue hover:underline">APT Guide (Debian/Ubuntu)</a></li> | |
| <li><a href="https://wiki.archlinux.org/title/Pacman" target="_blank" class="text-neon-blue hover:underline">Pacman Guide (Arch)</a></li> | |
| <li><a href="https://rpm.org/documentation.html" target="_blank" class="text-neon-blue hover:underline">RPM Documentation</a></li> | |
| <li><a href="https://flatpak.org/setup/" target="_blank" class="text-neon-blue hover:underline">Flatpak Setup</a></li> | |
| </ul> | |
| </div> | |
| <div class="link-card rgb-border p-6 rounded-lg"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">Process Management</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="https://linuxize.com/post/ps-command-in-linux/" target="_blank" class="text-neon-blue hover:underline">ps command guide</a></li> | |
| <li><a href="https://htop.dev/" target="_blank" class="text-neon-blue hover:underline">htop - Interactive process viewer</a></li> | |
| <li><a href="https://www.digitalocean.com/community/tutorials/how-to-use-bash-s-job-control-to-manage-foreground-and-background-processes" target="_blank" class="text-neon-blue hover:underline">Job Control</a></li> | |
| <li><a href="https://www.tecmint.com/linux-process-management/" target="_blank" class="text-neon-blue hover:underline">Process Management Guide</a></li> | |
| </ul> | |
| </div> | |
| <div class="link-card rgb-border p-6 rounded-lg"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">User Management</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="https://www.cyberciti.biz/faq/create-a-user-account-on-ubuntu-linux/" target="_blank" class="text-neon-blue hover:underline">User Account Creation</a></li> | |
| <li><a href="https://www.tecmint.com/manage-users-and-groups-in-linux/" target="_blank" class="text-neon-blue hover:underline">Users & Groups Guide</a></li> | |
| <li><a href="https://wiki.archlinux.org/title/Sudo" target="_blank" class="text-neon-blue hover:underline">Sudo Configuration</a></li> | |
| <li><a href="https://www.digitalocean.com/community/tutorials/how-to-use-pam-to-configure-authentication-on-ubuntu-18-04" target="_blank" class="text-neon-blue hover:underline">PAM Authentication</a></li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div class="mt-8 rgb-border p-6 rounded-lg"> | |
| <h3 class="text-2xl font-bold mb-4 rgb-text">Essential Commands</h3> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4"> | |
| <div class="bg-gray-900 p-4 rounded"> | |
| <h4 class="font-bold text-neon-pink mb-2">File Operations</h4> | |
| <code class="block mb-1">ls -la</code> | |
| <code class="block mb-1">cp -r source dest</code> | |
| <code class="block mb-1">mv oldname newname</code> | |
| <code class="block">find / -name "filename"</code> | |
| </div> | |
| <div class="bg-gray-900 p-4 rounded"> | |
| <h4 class="font-bold text-neon-blue mb-2">System Info</h4> | |
| <code class="block mb-1">uname -a</code> | |
| <code class="block mb-1">df -h</code> | |
| <code class="block mb-1">free -m</code> | |
| <code class="block">lscpu</code> | |
| </div> | |
| <div class="bg-gray-900 p-4 rounded"> | |
| <h4 class="font-bold text-neon-green mb-2">Networking</h4> | |
| <code class="block mb-1">ip a</code> | |
| <code class="block mb-1">ss -tulnp</code> | |
| <code class="block mb-1">ping example.com</code> | |
| <code class="block">traceroute example.com</code> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Networking Page --> | |
| <div id="networking" class="page"> | |
| <h2 class="text-3xl font-bold mb-6 cyber-text"><i class="fas fa-network-wired mr-3"></i> Networking</h2> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-6"> | |
| <div class="link-card rgb-border p-6 rounded-lg"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">Network Configuration</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="https://netplan.io/examples" target="_blank" class="text-neon-blue hover:underline">Netplan Examples</a></li> | |
| <li><a href="https://wiki.archlinux.org/title/Network_configuration" target="_blank" class="text-neon-blue hover:underline">Arch Network Config</a></li> | |
| <li><a href="https://access.redhat.com/documentation/en-us/red_hat_enterprise_linux/8/html/configuring_and_managing_networking/index" target="_blank" class="text-neon-blue hover:underline">RHEL Networking</a></li> | |
| <li><a href="https://www.cyberciti.biz/faq/linux-ip-command-examples-usage-syntax/" target="_blank" class="text-neon-blue hover:underline">ip command guide</a></li> | |
| </ul> | |
| </div> | |
| <div class="link-card rgb-border p-6 rounded-lg"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">Firewalls</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="https://www.digitalocean.com/community/tutorials/how-to-set-up-a-firewall-with-ufw-on-ubuntu-20-04" target="_blank" class="text-neon-blue hover:underline">UFW Guide</a></li> | |
| <li><a href="https://wiki.archlinux.org/title/iptables" target="_blank" class="text-neon-blue hover:underline">iptables Guide</a></li> | |
| <li><a href="https://www.linode.com/docs/guides/introduction-to-nftables/" target="_blank" class="text-neon-blue hover:underline">nftables Guide</a></li> | |
| <li><a href="https://www.firewalld.org/documentation.html" target="_blank" class="text-neon-blue hover:underline">firewalld Docs</a></li> | |
| </ul> | |
| </div> | |
| <div class="link-card rgb-border p-6 rounded-lg"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">DNS & DHCP</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="https://www.digitalocean.com/community/tutorials/an-introduction-to-dns-terminology-components-and-concepts" target="_blank" class="text-neon-blue hover:underline">DNS Concepts</a></li> | |
| <li><a href="https://wiki.archlinux.org/title/Dnsmasq" target="_blank" class="text-neon-blue hover:underline">dnsmasq Guide</a></li> | |
| <li><a href="https://www.isc.org/bind/" target="_blank" class="text-neon-blue hover:underline">BIND DNS</a></li> | |
| <li><a href="https://wiki.debian.org/DHCP_Server" target="_blank" class="text-neon-blue hover:underline">DHCP Server Setup</a></li> | |
| </ul> | |
| </div> | |
| <div class="link-card rgb-border p-6 rounded-lg"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">VPN & Tunneling</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="https://www.wireguard.com/quickstart/" target="_blank" class="text-neon-blue hover:underline">WireGuard Quickstart</a></li> | |
| <li><a href="https://openvpn.net/community-resources/how-to/" target="_blank" class="text-neon-blue hover:underline">OpenVPN How-To</a></li> | |
| <li><a href="https://wiki.archlinux.org/title/OpenSSH" target="_blank" class="text-neon-blue hover:underline">SSH Tunneling</a></li> | |
| <li><a href="https://www.nginx.com/blog/ipv4-ipv6-proxy-nginx/" target="_blank" class="text-neon-blue hover:underline">IPv4/IPv6 Proxy</a></li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div class="mt-8 rgb-border p-6 rounded-lg"> | |
| <h3 class="text-2xl font-bold mb-4 rgb-text">Network Troubleshooting</h3> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-4"> | |
| <div class="bg-gray-900 p-4 rounded"> | |
| <h4 class="font-bold text-neon-pink mb-2">Connectivity</h4> | |
| <code class="block mb-1">ping -c 4 example.com</code> | |
| <code class="block mb-1">traceroute example.com</code> | |
| <code class="block mb-1">mtr example.com</code> | |
| <code class="block">curl -I example.com</code> | |
| </div> | |
| <div class="bg-gray-900 p-4 rounded"> | |
| <h4 class="font-bold text-neon-blue mb-2">Ports & Services</h4> | |
| <code class="block mb-1">ss -tulnp</code> | |
| <code class="block mb-1">netstat -tulnp</code> | |
| <code class="block mb-1">nmap -sV localhost</code> | |
| <code class="block">telnet example.com 80</code> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Security Page --> | |
| <div id="security" class="page"> | |
| <h2 class="text-3xl font-bold mb-6 cyber-text"><i class="fas fa-shield-alt mr-3"></i> Security</h2> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-6"> | |
| <div class="link-card rgb-border p-6 rounded-lg"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">System Hardening</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="https://www.cisecurity.org/cis-benchmarks/" target="_blank" class="text-neon-blue hover:underline">CIS Benchmarks</a></li> | |
| <li><a href="https://wiki.archlinux.org/title/Security" target="_blank" class="text-neon-blue hover:underline">Arch Security Guide</a></li> | |
| <li><a href="https://ubuntu.com/security/certifications/docs/usg" target="_blank" class="text-neon-blue hover:underline">Ubuntu Security Guide</a></li> | |
| <li><a href="https://linux-audit.com/" target="_blank" class="text-neon-blue hover:underline">Linux Audit</a></li> | |
| </ul> | |
| </div> | |
| <div class="link-card rgb-border p-6 rounded-lg"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">SSH Security</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="https://www.ssh.com/academy/ssh/hardening" target="_blank" class="text-neon-blue hover:underline">SSH Hardening</a></li> | |
| <li><a href="https://www.digitalocean.com/community/tutorials/how-to-configure-ssh-key-based-authentication-on-a-linux-server" target="_blank" class="text-neon-blue hover:underline">SSH Key Auth</a></li> | |
| <li><a href="https://www.tecmint.com/restrict-ssh-access-to-specific-ip-addresses/" target="_blank" class="text-neon-blue hover:underline">Restrict SSH by IP</a></li> | |
| <li><a href="https://www.cyberciti.biz/faq/how-to-disable-ssh-password-login-on-linux/" target="_blank" class="text-neon-blue hover:underline">Disable Password Login</a></li> | |
| </ul> | |
| </div> | |
| <div class="link-card rgb-border p-6 rounded-lg"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">SELinux & AppArmor</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="https://www.redhat.com/en/topics/linux/what-is-selinux" target="_blank" class="text-neon-blue hover:underline">SELinux Explained</a></li> | |
| <li><a href="https://wiki.archlinux.org/title/SELinux" target="_blank" class="text-neon-blue hover:underline">Arch SELinux Guide</a></li> | |
| <li><a href="https://ubuntu.com/tutorials/beginning-apparmor-profile-development" target="_blank" class="text-neon-blue hover:underline">AppArmor Guide</a></li> | |
| <li><a href="https://wiki.debian.org/AppArmor" target="_blank" class="text-neon-blue hover:underline">Debian AppArmor</a></li> | |
| </ul> | |
| </div> | |
| <div class="link-card rgb-border p-6 rounded-lg"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">Security Tools</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="https://www.openvas.org/" target="_blank" class="text-neon-blue hover:underline">OpenVAS</a></li> | |
| <li><a href="https://www.tenable.com/products/nessus" target="_blank" class="text-neon-blue hover:underline">Nessus</a></li> | |
| <li><a href="https://www.fail2ban.org/wiki/index.php/Main_Page" target="_blank" class="text-neon-blue hover:underline">Fail2Ban</a></li> | |
| <li><a href="https://aide.github.io/" target="_blank" class="text-neon-blue hover:underline">AIDE (File Integrity)</a></li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div class="mt-8 rgb-border p-6 rounded-lg"> | |
| <h3 class="text-2xl font-bold mb-4 rgb-text">Security Commands</h3> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-4"> | |
| <div class="bg-gray-900 p-4 rounded"> | |
| <h4 class="font-bold text-neon-pink mb-2">Auditing</h4> | |
| <code class="block mb-1">sudo lynis audit system</code> | |
| <code class="block mb-1">sudo chkrootkit</code> | |
| <code class="block mb-1">sudo rkhunter --check</code> | |
| <code class="block">sudo aide --check</code> | |
| </div> | |
| <div class="bg-gray-900 p-4 rounded"> | |
| <h4 class="font-bold text-neon-blue mb-2">Permissions</h4> | |
| <code class="block mb-1">sudo find / -perm -4000</code> | |
| <code class="block mb-1">sudo find / -type f -perm -o+w</code> | |
| <code class="block mb-1">sudo chmod -R 750 /path</code> | |
| <code class="block">sudo chown -R user:group /path</code> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Monitoring Page --> | |
| <div id="monitoring" class="page"> | |
| <h2 class="text-3xl font-bold mb-6 cyber-text"><i class="fas fa-chart-line mr-3"></i> Monitoring</h2> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-6"> | |
| <div class="link-card rgb-border p-6 rounded-lg"> | |
| <h3 class="text-xl font-bold mb-3 rgb-text">System Monitoring</h3> | |
| <ul class="space-y-2"> | |
| <li><a href="https://htop.dev/" target="_blank" class="text-neon-blue hover:underline">htop</a></li> | |
| <li><a href="https://github.com/aristocratos/bpytop" target="_blank" class="text-neon-blue hover:underline">bpytop</a></li> | |
| <li><a href="https://github.com/nicolargo/glances" target="_blank" class="text-neon-blue hover:underline">Glances</a></li> | |
| <li><a href="https://github.com/aksakalli/gtop" target="_blank" class="text-neon-blue hover:underline"> | |
| </html> |