503 lines
12 KiB
HTML
503 lines
12 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<title>Ghaymah CLI Docs</title>
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify/themes/vue.css">
|
||
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
|
||
<style>
|
||
:root {
|
||
--primary-bg: #0a0f1a;
|
||
--secondary-bg: #0d1421;
|
||
--tertiary-bg: #111827;
|
||
--accent-bg: #1e293b;
|
||
--surface-bg: #1f2937;
|
||
--primary-text: #f8fafc;
|
||
--secondary-text: #e2e8f0;
|
||
--muted-text: #94a3b8;
|
||
--primary-accent: #06b6d4;
|
||
--secondary-accent: #0ea5e9;
|
||
--tertiary-accent: #22d3ee;
|
||
--success: #10b981;
|
||
--warning: #f59e0b;
|
||
--border-color: rgba(148, 163, 184, 0.1);
|
||
--shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3);
|
||
--glow: 0 0 20px rgba(6, 182, 212, 0.15);
|
||
}
|
||
|
||
* {
|
||
scrollbar-width: thin;
|
||
scrollbar-color: var(--primary-accent) var(--tertiary-bg);
|
||
}
|
||
|
||
*::-webkit-scrollbar {
|
||
width: 8px;
|
||
}
|
||
|
||
*::-webkit-scrollbar-track {
|
||
background: var(--tertiary-bg);
|
||
}
|
||
|
||
*::-webkit-scrollbar-thumb {
|
||
background: var(--primary-accent);
|
||
border-radius: 4px;
|
||
}
|
||
|
||
*::-webkit-scrollbar-thumb:hover {
|
||
background: var(--secondary-accent);
|
||
}
|
||
|
||
body {
|
||
background: linear-gradient(135deg, var(--primary-bg) 0%, var(--secondary-bg) 100%);
|
||
color: var(--primary-text);
|
||
font-family: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
|
||
line-height: 1.7;
|
||
overflow-x: hidden;
|
||
}
|
||
|
||
body::before {
|
||
content: '';
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
bottom: 0;
|
||
background:
|
||
radial-gradient(circle at 20% 80%, rgba(6, 182, 212, 0.05) 0%, transparent 50%),
|
||
radial-gradient(circle at 80% 20%, rgba(34, 211, 238, 0.05) 0%, transparent 50%),
|
||
radial-gradient(circle at 40% 40%, rgba(14, 165, 233, 0.03) 0%, transparent 50%);
|
||
pointer-events: none;
|
||
z-index: -1;
|
||
}
|
||
|
||
.app-name-link {
|
||
background: linear-gradient(135deg, var(--primary-accent), var(--tertiary-accent));
|
||
-webkit-background-clip: text;
|
||
-webkit-text-fill-color: transparent;
|
||
background-clip: text;
|
||
font-size: 24px;
|
||
font-weight: 800;
|
||
letter-spacing: -0.5px;
|
||
transition: all 0.3s ease;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8px;
|
||
}
|
||
|
||
.app-name-link::before {
|
||
content: '⚡';
|
||
font-size: 20px;
|
||
-webkit-text-fill-color: var(--primary-accent);
|
||
}
|
||
|
||
.app-name-link:hover {
|
||
transform: translateY(-1px);
|
||
filter: brightness(1.1);
|
||
}
|
||
|
||
h1, h2, h3, h4, h5, h6 {
|
||
background: linear-gradient(135deg, var(--primary-accent), var(--tertiary-accent));
|
||
-webkit-background-clip: text;
|
||
-webkit-text-fill-color: transparent;
|
||
background-clip: text;
|
||
font-weight: 700;
|
||
margin-top: 2em;
|
||
margin-bottom: 1em;
|
||
position: relative;
|
||
}
|
||
|
||
h1 {
|
||
font-size: 2.5em;
|
||
margin-top: 0;
|
||
}
|
||
|
||
h2 {
|
||
font-size: 2em;
|
||
border-bottom: 2px solid var(--border-color);
|
||
padding-bottom: 0.5em;
|
||
}
|
||
|
||
h3 {
|
||
font-size: 1.5em;
|
||
}
|
||
|
||
h4 {
|
||
font-size: 1.25em;
|
||
}
|
||
|
||
p {
|
||
color: var(--secondary-text);
|
||
margin: 1.2em 0;
|
||
}
|
||
|
||
a {
|
||
color: var(--secondary-accent);
|
||
text-decoration: none;
|
||
transition: all 0.2s ease;
|
||
position: relative;
|
||
}
|
||
|
||
a:hover {
|
||
color: var(--tertiary-accent);
|
||
transform: translateY(-1px);
|
||
}
|
||
|
||
a:not(.app-name-link):hover::after {
|
||
content: '';
|
||
position: absolute;
|
||
bottom: -2px;
|
||
left: 0;
|
||
right: 0;
|
||
height: 2px;
|
||
background: linear-gradient(90deg, var(--secondary-accent), var(--tertiary-accent));
|
||
border-radius: 1px;
|
||
}
|
||
|
||
.sidebar {
|
||
background: var(--secondary-bg);
|
||
border-right: 1px solid var(--border-color);
|
||
backdrop-filter: blur(10px);
|
||
box-shadow: var(--shadow);
|
||
}
|
||
|
||
.sidebar > h1 {
|
||
background: var(--tertiary-bg);
|
||
border-bottom: 1px solid var(--border-color);
|
||
padding: 20px;
|
||
margin: 0;
|
||
}
|
||
|
||
.sidebar-nav {
|
||
padding: 1rem;
|
||
}
|
||
|
||
.sidebar ul {
|
||
margin: 0;
|
||
padding: 0;
|
||
}
|
||
|
||
.sidebar ul li {
|
||
list-style: none;
|
||
margin: 0;
|
||
}
|
||
|
||
.sidebar ul li a {
|
||
color: var(--muted-text);
|
||
display: block;
|
||
padding: 12px 16px;
|
||
border-radius: 8px;
|
||
margin: 4px 0;
|
||
transition: all 0.3s ease;
|
||
position: relative;
|
||
font-weight: 500;
|
||
}
|
||
|
||
.sidebar ul li a:hover {
|
||
color: var(--primary-text);
|
||
background: rgba(6, 182, 212, 0.1);
|
||
transform: translateX(4px);
|
||
box-shadow: 0 2px 8px rgba(6, 182, 212, 0.15);
|
||
}
|
||
|
||
.sidebar ul li.active > a {
|
||
color: var(--primary-text);
|
||
background: linear-gradient(135deg, rgba(6, 182, 212, 0.2), rgba(34, 211, 238, 0.1));
|
||
border-left: 3px solid var(--primary-accent);
|
||
font-weight: 600;
|
||
box-shadow: var(--glow);
|
||
}
|
||
|
||
.sidebar ul li.active > a::before {
|
||
content: '→';
|
||
position: absolute;
|
||
left: -8px;
|
||
color: var(--primary-accent);
|
||
font-weight: bold;
|
||
}
|
||
|
||
.content {
|
||
background: rgba(17, 24, 39, 0.3);
|
||
backdrop-filter: blur(10px);
|
||
border-radius: 16px;
|
||
margin: 20px;
|
||
padding: 40px;
|
||
box-shadow: var(--shadow);
|
||
border: 1px solid var(--border-color);
|
||
}
|
||
|
||
pre {
|
||
background: var(--accent-bg);
|
||
border: 1px solid var(--border-color);
|
||
border-radius: 12px;
|
||
overflow: hidden;
|
||
margin: 1.5em 0;
|
||
box-shadow: var(--shadow);
|
||
}
|
||
|
||
pre code {
|
||
background: transparent;
|
||
color: var(--primary-text);
|
||
padding: 20px;
|
||
font-size: 14px;
|
||
font-family: "JetBrains Mono", "Fira Code", Consolas, monospace;
|
||
line-height: 1.6;
|
||
display: block;
|
||
overflow-x: auto;
|
||
}
|
||
|
||
code:not(pre code) {
|
||
background: rgba(6, 182, 212, 0.1);
|
||
color: var(--tertiary-accent);
|
||
padding: 2px 6px;
|
||
border-radius: 4px;
|
||
font-size: 0.9em;
|
||
font-family: "JetBrains Mono", "Fira Code", Consolas, monospace;
|
||
border: 1px solid rgba(6, 182, 212, 0.2);
|
||
}
|
||
|
||
blockquote {
|
||
border-left: 4px solid var(--primary-accent);
|
||
padding: 16px 20px;
|
||
color: var(--secondary-text);
|
||
background: linear-gradient(135deg, rgba(6, 182, 212, 0.05), rgba(17, 24, 39, 0.8));
|
||
border-radius: 8px;
|
||
margin: 2em 0;
|
||
position: relative;
|
||
box-shadow: var(--shadow);
|
||
backdrop-filter: blur(5px);
|
||
}
|
||
|
||
blockquote::before {
|
||
content: 'ℹ️';
|
||
position: absolute;
|
||
top: 16px;
|
||
right: 20px;
|
||
font-size: 18px;
|
||
}
|
||
|
||
blockquote p {
|
||
margin: 0;
|
||
font-style: italic;
|
||
}
|
||
|
||
table {
|
||
width: 100%;
|
||
border-collapse: collapse;
|
||
margin: 2em 0;
|
||
background: var(--surface-bg);
|
||
border-radius: 12px;
|
||
overflow: hidden;
|
||
box-shadow: var(--shadow);
|
||
}
|
||
|
||
th, td {
|
||
padding: 16px;
|
||
text-align: left;
|
||
border-bottom: 1px solid var(--border-color);
|
||
}
|
||
|
||
th {
|
||
background: var(--accent-bg);
|
||
color: var(--primary-accent);
|
||
font-weight: 600;
|
||
text-transform: uppercase;
|
||
font-size: 0.85em;
|
||
letter-spacing: 0.5px;
|
||
}
|
||
|
||
tr:hover {
|
||
background: rgba(6, 182, 212, 0.05);
|
||
}
|
||
|
||
ul, ol {
|
||
color: var(--secondary-text);
|
||
padding-left: 1.5em;
|
||
}
|
||
|
||
li {
|
||
margin: 0.5em 0;
|
||
position: relative;
|
||
}
|
||
|
||
ul li::marker {
|
||
color: var(--primary-accent);
|
||
}
|
||
|
||
ol li::marker {
|
||
color: var(--primary-accent);
|
||
font-weight: bold;
|
||
}
|
||
|
||
.search {
|
||
border: 2px solid var(--border-color);
|
||
background: var(--tertiary-bg);
|
||
border-radius: 12px;
|
||
margin: 20px;
|
||
overflow: hidden;
|
||
transition: all 0.3s ease;
|
||
}
|
||
|
||
.search:focus-within {
|
||
border-color: var(--primary-accent);
|
||
box-shadow: var(--glow);
|
||
}
|
||
|
||
.search input {
|
||
background: transparent;
|
||
border: none;
|
||
color: var(--primary-text);
|
||
padding: 16px 20px;
|
||
font-size: 16px;
|
||
width: 100%;
|
||
outline: none;
|
||
}
|
||
|
||
.search input::placeholder {
|
||
color: var(--muted-text);
|
||
}
|
||
|
||
/* Loading animation */
|
||
@keyframes pulse {
|
||
0%, 100% { opacity: 0.4; }
|
||
50% { opacity: 1; }
|
||
}
|
||
|
||
.loading {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
height: 200px;
|
||
font-size: 18px;
|
||
color: var(--muted-text);
|
||
animation: pulse 2s infinite;
|
||
}
|
||
|
||
/* Responsive design */
|
||
@media (max-width: 768px) {
|
||
.content {
|
||
margin: 10px;
|
||
padding: 20px;
|
||
border-radius: 12px;
|
||
}
|
||
|
||
h1 { font-size: 2em; }
|
||
h2 { font-size: 1.75em; }
|
||
|
||
.sidebar {
|
||
transform: translateX(-100%);
|
||
transition: transform 0.3s ease;
|
||
}
|
||
|
||
.sidebar.open {
|
||
transform: translateX(0);
|
||
}
|
||
}
|
||
|
||
/* Smooth scrolling */
|
||
html {
|
||
scroll-behavior: smooth;
|
||
}
|
||
|
||
/* Focus styles for accessibility */
|
||
*:focus {
|
||
outline: 2px solid var(--primary-accent);
|
||
outline-offset: 2px;
|
||
}
|
||
|
||
/* Selection styles */
|
||
::selection {
|
||
background: rgba(6, 182, 212, 0.3);
|
||
color: var(--primary-text);
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div id="app">
|
||
<div class="loading">
|
||
<i class="fas fa-terminal" style="margin-right: 10px;"></i>
|
||
Loading Ghaymah CLI Documentation...
|
||
</div>
|
||
</div>
|
||
<script>
|
||
window.$docsify = {
|
||
name: 'Ghaymah CLI',
|
||
loadSidebar: true,
|
||
subMaxLevel: 3,
|
||
sidebarDisplayLevel: 1,
|
||
search: 'auto',
|
||
themeColor: '#06b6d4',
|
||
coverpage: false,
|
||
executeScript: true,
|
||
loadNavbar: false,
|
||
mergeNavbar: true,
|
||
maxLevel: 4,
|
||
auto2top: true,
|
||
notFoundPage: true,
|
||
relativePath: false,
|
||
alias: {
|
||
'/.*/_sidebar.md': '/_sidebar.md',
|
||
},
|
||
plugins: [
|
||
function(hook, vm) {
|
||
hook.doneEach(function() {
|
||
// Add smooth scroll behavior to anchor links
|
||
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
||
anchor.addEventListener('click', function(e) {
|
||
e.preventDefault();
|
||
const target = document.querySelector(this.getAttribute('href'));
|
||
if (target) {
|
||
target.scrollIntoView({ behavior: 'smooth' });
|
||
}
|
||
});
|
||
});
|
||
|
||
// Add copy button to code blocks
|
||
document.querySelectorAll('pre').forEach(pre => {
|
||
if (!pre.querySelector('.copy-btn')) {
|
||
const button = document.createElement('button');
|
||
button.className = 'copy-btn';
|
||
button.innerHTML = '<i class="fas fa-copy"></i>';
|
||
button.style.cssText = `
|
||
position: absolute;
|
||
top: 10px;
|
||
right: 10px;
|
||
background: rgba(6, 182, 212, 0.1);
|
||
border: 1px solid rgba(6, 182, 212, 0.3);
|
||
color: var(--primary-accent);
|
||
padding: 6px 8px;
|
||
border-radius: 6px;
|
||
cursor: pointer;
|
||
font-size: 12px;
|
||
transition: all 0.2s ease;
|
||
`;
|
||
|
||
button.addEventListener('click', () => {
|
||
const code = pre.querySelector('code');
|
||
navigator.clipboard.writeText(code.textContent).then(() => {
|
||
button.innerHTML = '<i class="fas fa-check"></i>';
|
||
button.style.color = 'var(--success)';
|
||
setTimeout(() => {
|
||
button.innerHTML = '<i class="fas fa-copy"></i>';
|
||
button.style.color = 'var(--primary-accent)';
|
||
}, 2000);
|
||
});
|
||
});
|
||
|
||
pre.style.position = 'relative';
|
||
pre.appendChild(button);
|
||
}
|
||
});
|
||
});
|
||
}
|
||
]
|
||
}
|
||
</script>
|
||
<script src="//cdn.jsdelivr.net/npm/docsify/lib/docsify.min.js"></script>
|
||
<script src="//cdn.jsdelivr.net/npm/docsify/lib/plugins/search.min.js"></script>
|
||
<script src="//cdn.jsdelivr.net/npm/docsify-sidebar-collapse/dist/docsify-sidebar-collapse.min.js"></script>
|
||
<script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-bash.min.js"></script>
|
||
<script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-json.min.js"></script>
|
||
</body>
|
||
</html>
|