version 1 with webshell and docs
This commit is contained in:
124
docs.html
Normal file
124
docs.html
Normal file
@@ -0,0 +1,124 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Documentation - Terminal Portfolio</title>
|
||||
<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=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet">
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<div class="header">
|
||||
<a href="/" class="back-link">$ cd ..</a>
|
||||
<h1>Documentation</h1>
|
||||
<p class="subtitle">The who, what, when, where, why</p>
|
||||
</div>
|
||||
|
||||
<div class="command-reference">
|
||||
<div class="command-box">
|
||||
<code id="sshCommand">ssh portfolio@keshavanand.net</code>
|
||||
<button class="copy-btn" id="copyBtn" aria-label="Copy command">
|
||||
<svg class="copy-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect>
|
||||
<path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path>
|
||||
</svg>
|
||||
<svg class="check-icon" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<polyline points="20 6 9 17 4 12"></polyline>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sections">
|
||||
<section class="section">
|
||||
<h2>What is it?</h2>
|
||||
<p>
|
||||
When executed in your terminal, this command renders a fully interactive shell portfolio experience.
|
||||
Much like a digital resume or personal site, it allows you to explore my work and background through
|
||||
a safe, <strong>secure</strong>, and purely text-based interface.
|
||||
<strong>It is completely harmless to your system.</strong>
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<h2>Command Breakdown</h2>
|
||||
<div class="breakdown-grid">
|
||||
<div class="breakdown-item">
|
||||
<h3>ssh →</h3>
|
||||
<p><strong>Secure Shell:</strong> The standard terminal protocol for logging into and controlling remote computers safely.</p>
|
||||
</div>
|
||||
<div class="breakdown-item">
|
||||
<h3>portfolio →</h3>
|
||||
<p><strong>User:</strong> A passwordless, restricted user on my homeserver meant for public access.</p>
|
||||
</div>
|
||||
<div class="breakdown-item">
|
||||
<h3>keshavanand.net →</h3>
|
||||
<p><strong>Domain:</strong> Points to a web record that directs your request to my server's public IP (gateway).</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<h2>How to Run</h2>
|
||||
<ol class="steps">
|
||||
<li>Copy the command above using the clipboard tool.</li>
|
||||
<li>Open your native terminal (Terminal on Mac/Linux, PowerShell on Windows).</li>
|
||||
<li>Paste the command and accept the host identity by typing 'yes' if prompted.</li>
|
||||
<li>Press Enter to launch the interactive environment.</li>
|
||||
<li>Terminate the process at any time by pressing <kbd>Ctrl + C</kbd>.</li>
|
||||
</ol>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<h2>Code Logic</h2>
|
||||
<p>
|
||||
This command gives authenticated access to the <strong>'portfolio'</strong> user account on my private home server.
|
||||
</p>
|
||||
<p>
|
||||
Instead of a standard bash or zsh shell, the user session triggers a custom-coded <strong>C++ executable</strong>.
|
||||
This binary utilizes <strong>FTXUI</strong>—a sophisticated functional terminal user interface library—to handle
|
||||
real-time rendering and input.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<h2>Resources</h2>
|
||||
<div class="resources-grid">
|
||||
<a href="https://git.keshavanand.net/KeshavAnandCode/terminal-portfolio" target="_blank" rel="noopener noreferrer" class="resource-card">
|
||||
<div class="resource-content">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"></path>
|
||||
</svg>
|
||||
<span>View Source Code</span>
|
||||
</div>
|
||||
<svg class="external-icon" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"></path>
|
||||
<polyline points="15 3 21 3 21 9"></polyline>
|
||||
<line x1="10" y1="14" x2="21" y2="3"></line>
|
||||
</svg>
|
||||
</a>
|
||||
|
||||
<a href="/webshell" class="resource-card">
|
||||
<div class="resource-content">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<polyline points="4 17 10 11 4 5"></polyline>
|
||||
<line x1="12" y1="19" x2="20" y2="19"></line>
|
||||
</svg>
|
||||
<span>Run Web Shell</span>
|
||||
</div>
|
||||
<svg class="arrow-icon" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<line x1="5" y1="12" x2="19" y2="12"></line>
|
||||
<polyline points="12 5 19 12 12 19"></polyline>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
<p class="note">Note: Web shell is a simulated environment, and native terminal is recommended</p>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="module" src="/src/docs.ts"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user