feat: AR
This commit is contained in:
8
.zshrc
8
.zshrc
@@ -120,3 +120,11 @@ source $ZSH/oh-my-zsh.sh
|
||||
# _home_pull
|
||||
|
||||
cd "$HOME/$(cat $HOME/.last_pwd)" &>/dev/null
|
||||
|
||||
# pnpm
|
||||
export PNPM_HOME="/home/valknar/.local/share/pnpm"
|
||||
case ":$PATH:" in
|
||||
*":$PNPM_HOME:"*) ;;
|
||||
*) export PATH="$PNPM_HOME:$PATH" ;;
|
||||
esac
|
||||
# pnpm end
|
||||
|
||||
37
Projects/kompose/docs/.gitignore
vendored
37
Projects/kompose/docs/.gitignore
vendored
@@ -1,27 +1,24 @@
|
||||
# Nuxt
|
||||
.nuxt
|
||||
# Nuxt dev/build outputs
|
||||
.output
|
||||
.env
|
||||
.data
|
||||
.nuxt
|
||||
.nitro
|
||||
.cache
|
||||
dist
|
||||
|
||||
# Node
|
||||
# Node dependencies
|
||||
node_modules
|
||||
*.log*
|
||||
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
|
||||
# Misc
|
||||
.DS_Store
|
||||
.vscode
|
||||
.fleet
|
||||
.idea
|
||||
|
||||
# Build
|
||||
.output
|
||||
.nuxt
|
||||
|
||||
# Cache
|
||||
.cache
|
||||
|
||||
# Temp
|
||||
*.tmp
|
||||
*.bak
|
||||
*.swp
|
||||
|
||||
# pnpm
|
||||
pnpm-lock.yaml
|
||||
# Local env files
|
||||
.env
|
||||
.env.*
|
||||
!.env.example
|
||||
|
||||
1
Projects/kompose/docs/.npmrc
Normal file
1
Projects/kompose/docs/.npmrc
Normal file
@@ -0,0 +1 @@
|
||||
hoist=true
|
||||
@@ -1,257 +1,75 @@
|
||||
# Kompose Documentation
|
||||
# Nuxt Minimal Starter
|
||||
|
||||
Modern, stylish documentation site for Kompose built with Nuxt Content and featuring a funky dark theme with orange and purple gradients.
|
||||
Look at the [Nuxt documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
|
||||
|
||||
## 🎨 Features
|
||||
## Setup
|
||||
|
||||
- ✨ **Modern Dark Theme** - Funky design with orange and purple gradients
|
||||
- 📝 **Markdown Support** - Write documentation in Markdown
|
||||
- 🔍 **Full-Text Search** - Search through all documentation
|
||||
- 📱 **Responsive Design** - Works perfectly on all devices
|
||||
- 🎯 **Table of Contents** - Auto-generated navigation
|
||||
- 🎨 **Syntax Highlighting** - Beautiful code blocks with multiple language support
|
||||
- 🚀 **Static Generation** - Fast, SEO-friendly static site
|
||||
- 📊 **PWA Ready** - Progressive Web App capabilities
|
||||
|
||||
## 🚀 Quick Start
|
||||
|
||||
### Development
|
||||
Make sure to install dependencies:
|
||||
|
||||
```bash
|
||||
# Install dependencies
|
||||
# npm
|
||||
npm install
|
||||
|
||||
# pnpm
|
||||
pnpm install
|
||||
|
||||
# Start development server
|
||||
pnpm run dev
|
||||
# yarn
|
||||
yarn install
|
||||
|
||||
# Open http://localhost:3000
|
||||
# bun
|
||||
bun install
|
||||
```
|
||||
|
||||
### Production Build
|
||||
## Development Server
|
||||
|
||||
Start the development server on `http://localhost:3000`:
|
||||
|
||||
```bash
|
||||
# Generate static site
|
||||
pnpm run generate
|
||||
# npm
|
||||
npm run dev
|
||||
|
||||
# Preview production build
|
||||
pnpm run preview
|
||||
# pnpm
|
||||
pnpm dev
|
||||
|
||||
# yarn
|
||||
yarn dev
|
||||
|
||||
# bun
|
||||
bun run dev
|
||||
```
|
||||
|
||||
### Docker Deployment
|
||||
## Production
|
||||
|
||||
Build the application for production:
|
||||
|
||||
```bash
|
||||
# Build and start the docs container
|
||||
cd /path/to/kompose
|
||||
./kompose.sh docs up -d --build
|
||||
# npm
|
||||
npm run build
|
||||
|
||||
# View logs
|
||||
./kompose.sh docs logs -f
|
||||
# pnpm
|
||||
pnpm build
|
||||
|
||||
# yarn
|
||||
yarn build
|
||||
|
||||
# bun
|
||||
bun run build
|
||||
```
|
||||
|
||||
## 📁 Project Structure
|
||||
|
||||
```
|
||||
docs/
|
||||
├── assets/ # Static assets and global CSS
|
||||
│ └── css/
|
||||
│ └── main.css # Custom Tailwind styles
|
||||
├── components/ # Vue components
|
||||
├── content/ # Markdown documentation
|
||||
│ └── docs/ # Documentation pages
|
||||
│ └── index.md
|
||||
├── layouts/ # Page layouts
|
||||
│ └── default.vue # Main layout with sidebar
|
||||
├── pages/ # Application pages
|
||||
│ ├── index.vue # Homepage
|
||||
│ └── docs/
|
||||
│ └── [...slug].vue # Documentation pages
|
||||
├── public/ # Static files
|
||||
├── app.vue # App entry point
|
||||
├── nuxt.config.ts # Nuxt configuration
|
||||
├── tailwind.config.js # Tailwind configuration
|
||||
├── package.json # Dependencies
|
||||
├── Dockerfile # Docker build configuration
|
||||
├── nginx.conf # Nginx configuration
|
||||
└── compose.yaml # Docker Compose configuration
|
||||
```
|
||||
|
||||
## 📝 Writing Documentation
|
||||
|
||||
Documentation files are stored in `content/docs/` directory as Markdown files.
|
||||
|
||||
### Creating a New Page
|
||||
|
||||
1. Create a new `.md` file in `content/docs/`:
|
||||
|
||||
```markdown
|
||||
---
|
||||
title: Your Page Title
|
||||
description: Brief description of the page
|
||||
---
|
||||
|
||||
# Your Page Title
|
||||
|
||||
Your content goes here...
|
||||
```
|
||||
|
||||
2. The page will be automatically available at `/docs/your-file-name`
|
||||
|
||||
### Frontmatter Options
|
||||
|
||||
```yaml
|
||||
---
|
||||
title: Page Title # Required: Page title
|
||||
description: Description # Optional: Meta description
|
||||
---
|
||||
```
|
||||
|
||||
### Markdown Features
|
||||
|
||||
#### Code Blocks
|
||||
|
||||
\`\`\`bash
|
||||
./kompose.sh "*" up -d
|
||||
\`\`\`
|
||||
|
||||
#### Alerts
|
||||
|
||||
> 💡 **Tip:** This is a helpful tip!
|
||||
|
||||
#### Tables
|
||||
|
||||
| Column 1 | Column 2 |
|
||||
|----------|----------|
|
||||
| Value 1 | Value 2 |
|
||||
|
||||
#### Links
|
||||
|
||||
[Link Text](/docs/page)
|
||||
|
||||
## 🎨 Customizing the Theme
|
||||
|
||||
### Colors
|
||||
|
||||
Edit `tailwind.config.js` to customize colors:
|
||||
|
||||
```js
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
primary: {
|
||||
500: '#f97316', // Orange
|
||||
// ... other shades
|
||||
},
|
||||
accent: {
|
||||
500: '#a855f7', // Purple
|
||||
// ... other shades
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### Styles
|
||||
|
||||
Global styles are in `assets/css/main.css`. You can modify:
|
||||
- Gradient effects
|
||||
- Typography
|
||||
- Component styles
|
||||
- Animations
|
||||
|
||||
## 🔍 Search Configuration
|
||||
|
||||
Search is powered by Nuxt Content's built-in search. To customize:
|
||||
|
||||
```ts
|
||||
// nuxt.config.ts
|
||||
content: {
|
||||
experimental: {
|
||||
search: {
|
||||
indexed: true,
|
||||
// Add search configuration
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## 🌐 Deployment
|
||||
|
||||
The site is automatically built and deployed via Docker when using Kompose:
|
||||
Locally preview production build:
|
||||
|
||||
```bash
|
||||
# Rebuild and redeploy
|
||||
./kompose.sh docs down
|
||||
./kompose.sh docs up -d --build
|
||||
# npm
|
||||
npm run preview
|
||||
|
||||
# pnpm
|
||||
pnpm preview
|
||||
|
||||
# yarn
|
||||
yarn preview
|
||||
|
||||
# bun
|
||||
bun run preview
|
||||
```
|
||||
|
||||
### Environment Variables
|
||||
|
||||
Configure in `docs/.env`:
|
||||
|
||||
```env
|
||||
COMPOSE_PROJECT_NAME=docs
|
||||
TRAEFIK_HOST=docs.example.com
|
||||
APP_PORT=80
|
||||
```
|
||||
|
||||
## 📦 Dependencies
|
||||
|
||||
- **Nuxt 3** - Vue framework
|
||||
- **Nuxt Content** - File-based CMS
|
||||
- **Tailwind CSS** - Utility-first CSS framework
|
||||
- **@nuxt/icon** - Icon component
|
||||
- **@vueuse/nuxt** - Vue composition utilities
|
||||
|
||||
## 🛠️ Development Tips
|
||||
|
||||
### Hot Reload
|
||||
|
||||
The development server supports hot module replacement. Changes to components, pages, and markdown files will be reflected immediately.
|
||||
|
||||
### TypeScript
|
||||
|
||||
The project uses TypeScript. Type definitions are automatically generated by Nuxt.
|
||||
|
||||
### Adding Components
|
||||
|
||||
Create components in `components/` directory. They'll be auto-imported:
|
||||
|
||||
```vue
|
||||
<!-- components/MyComponent.vue -->
|
||||
<template>
|
||||
<div>My Component</div>
|
||||
</template>
|
||||
```
|
||||
|
||||
Use in pages:
|
||||
|
||||
```vue
|
||||
<template>
|
||||
<MyComponent />
|
||||
</template>
|
||||
```
|
||||
|
||||
## 🎯 Features Roadmap
|
||||
|
||||
- [ ] Advanced search with filters
|
||||
- [ ] Dark/light mode toggle
|
||||
- [ ] API documentation generator
|
||||
- [ ] Interactive code examples
|
||||
- [ ] Version selector
|
||||
- [ ] Multi-language support
|
||||
|
||||
## 📄 License
|
||||
|
||||
MIT License - see the main Kompose repository for details.
|
||||
|
||||
## 🤝 Contributing
|
||||
|
||||
1. Fork the repository
|
||||
2. Create your feature branch: `git checkout -b feature/amazing-feature`
|
||||
3. Commit your changes: `git commit -m 'Add amazing feature'`
|
||||
4. Push to the branch: `git push origin feature/amazing-feature`
|
||||
5. Open a Pull Request
|
||||
|
||||
---
|
||||
|
||||
Made with ❤️ and ☕ by the Kompose Community
|
||||
Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.
|
||||
|
||||
@@ -1,46 +0,0 @@
|
||||
<template>
|
||||
<div class="min-h-screen bg-dark-950 text-gray-100">
|
||||
<NuxtLayout>
|
||||
<NuxtPage />
|
||||
</NuxtLayout>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
useHead({
|
||||
htmlAttrs: {
|
||||
class: 'dark'
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@import '@/assets/css/main.css';
|
||||
|
||||
/* Custom scrollbar */
|
||||
::-webkit-scrollbar {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
@apply bg-dark-900;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
@apply bg-gradient-to-b from-primary-500 to-accent-500 rounded-full;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
@apply from-primary-400 to-accent-400;
|
||||
}
|
||||
|
||||
/* Selection */
|
||||
::selection {
|
||||
@apply bg-primary-500/30 text-white;
|
||||
}
|
||||
|
||||
::-moz-selection {
|
||||
@apply bg-primary-500/30 text-white;
|
||||
}
|
||||
</style>
|
||||
6
Projects/kompose/docs/app/app.vue
Normal file
6
Projects/kompose/docs/app/app.vue
Normal file
@@ -0,0 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<NuxtRouteAnnouncer />
|
||||
<NuxtWelcome />
|
||||
</div>
|
||||
</template>
|
||||
@@ -1,214 +0,0 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
@layer base {
|
||||
html {
|
||||
@apply scroll-smooth;
|
||||
}
|
||||
|
||||
body {
|
||||
@apply bg-dark-950 text-gray-100 antialiased;
|
||||
}
|
||||
|
||||
/* Typography improvements */
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
@apply font-bold tracking-tight;
|
||||
}
|
||||
|
||||
h1 {
|
||||
@apply text-5xl md:text-6xl lg:text-7xl;
|
||||
}
|
||||
|
||||
h2 {
|
||||
@apply text-4xl md:text-5xl;
|
||||
}
|
||||
|
||||
h3 {
|
||||
@apply text-3xl md:text-4xl;
|
||||
}
|
||||
}
|
||||
|
||||
@layer components {
|
||||
/* Gradient text */
|
||||
.gradient-text {
|
||||
@apply bg-gradient-to-r from-primary-400 via-accent-400 to-primary-500 bg-clip-text text-transparent;
|
||||
}
|
||||
|
||||
.gradient-text-hero {
|
||||
@apply bg-gradient-hero bg-clip-text text-transparent animate-gradient-xy;
|
||||
}
|
||||
|
||||
/* Glass morphism */
|
||||
.glass {
|
||||
@apply backdrop-blur-lg bg-white/5 border border-white/10;
|
||||
}
|
||||
|
||||
.glass-dark {
|
||||
@apply backdrop-blur-lg bg-black/30 border border-white/5;
|
||||
}
|
||||
|
||||
/* Glow effects */
|
||||
.glow-box {
|
||||
@apply shadow-glow-cyber;
|
||||
}
|
||||
|
||||
.glow-text {
|
||||
@apply animate-glow;
|
||||
}
|
||||
|
||||
/* Button styles */
|
||||
.btn {
|
||||
@apply px-6 py-3 rounded-lg font-semibold transition-all duration-300 transform hover:scale-105 active:scale-95;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
@apply btn bg-gradient-primary text-white shadow-glow-orange hover:shadow-lg;
|
||||
}
|
||||
|
||||
.btn-accent {
|
||||
@apply btn bg-gradient-accent text-white shadow-glow-purple hover:shadow-lg;
|
||||
}
|
||||
|
||||
.btn-ghost {
|
||||
@apply btn border-2 border-primary-500/50 text-primary-400 hover:bg-primary-500/10 hover:border-primary-400;
|
||||
}
|
||||
|
||||
/* Card styles */
|
||||
.card {
|
||||
@apply rounded-xl p-6 transition-all duration-300;
|
||||
}
|
||||
|
||||
.card-glass {
|
||||
@apply card glass hover:bg-white/10;
|
||||
}
|
||||
|
||||
.card-glow {
|
||||
@apply card bg-dark-900 border border-primary-500/20 hover:border-primary-500/40 hover:shadow-glow-cyber;
|
||||
}
|
||||
|
||||
/* Code block improvements */
|
||||
.prose pre {
|
||||
@apply relative overflow-hidden;
|
||||
}
|
||||
|
||||
.prose pre::before {
|
||||
content: '';
|
||||
@apply absolute inset-0 bg-gradient-shine opacity-0 hover:opacity-100 transition-opacity duration-500 pointer-events-none;
|
||||
animation: shimmer 2s linear infinite;
|
||||
}
|
||||
|
||||
/* Link styles */
|
||||
.link-fancy {
|
||||
@apply relative inline-block text-primary-400 hover:text-primary-300 transition-colors;
|
||||
}
|
||||
|
||||
.link-fancy::after {
|
||||
content: '';
|
||||
@apply absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-primary transition-all duration-300;
|
||||
}
|
||||
|
||||
.link-fancy:hover::after {
|
||||
@apply w-full;
|
||||
}
|
||||
|
||||
/* Sidebar */
|
||||
.sidebar-link {
|
||||
@apply block px-4 py-2 rounded-lg text-gray-400 hover:text-white hover:bg-white/5 transition-all duration-200;
|
||||
}
|
||||
|
||||
.sidebar-link.active {
|
||||
@apply text-white bg-gradient-to-r from-primary-500/20 to-accent-500/20 border-l-4 border-primary-500;
|
||||
}
|
||||
|
||||
/* Search box */
|
||||
.search-box {
|
||||
@apply w-full px-4 py-3 bg-dark-900 border border-dark-700 rounded-lg text-white placeholder-gray-500 focus:outline-none focus:border-primary-500 focus:ring-2 focus:ring-primary-500/20 transition-all;
|
||||
}
|
||||
|
||||
/* Table of contents */
|
||||
.toc-link {
|
||||
@apply text-sm text-gray-400 hover:text-primary-400 transition-colors py-1 border-l-2 border-dark-700 pl-4 hover:border-primary-500;
|
||||
}
|
||||
|
||||
.toc-link.active {
|
||||
@apply text-primary-400 border-primary-500;
|
||||
}
|
||||
}
|
||||
|
||||
@layer utilities {
|
||||
/* Gradient animations */
|
||||
.animate-gradient {
|
||||
background-size: 200% 200%;
|
||||
animation: gradient 8s ease infinite;
|
||||
}
|
||||
|
||||
/* Perspective utilities */
|
||||
.perspective-1000 {
|
||||
perspective: 1000px;
|
||||
}
|
||||
|
||||
.transform-style-3d {
|
||||
transform-style: preserve-3d;
|
||||
}
|
||||
|
||||
/* Shimmer effect */
|
||||
.shimmer {
|
||||
@apply relative overflow-hidden;
|
||||
}
|
||||
|
||||
.shimmer::after {
|
||||
content: '';
|
||||
@apply absolute inset-0 bg-gradient-shine;
|
||||
animation: shimmer 2s infinite;
|
||||
}
|
||||
}
|
||||
|
||||
/* Markdown content improvements */
|
||||
.prose {
|
||||
@apply max-w-none;
|
||||
}
|
||||
|
||||
.prose img {
|
||||
@apply rounded-lg shadow-lg;
|
||||
}
|
||||
|
||||
.prose table {
|
||||
@apply w-full border-collapse;
|
||||
}
|
||||
|
||||
.prose th {
|
||||
@apply bg-dark-800 text-primary-400 font-semibold py-3 px-4 text-left border-b-2 border-primary-500/30;
|
||||
}
|
||||
|
||||
.prose td {
|
||||
@apply py-3 px-4 border-b border-dark-700;
|
||||
}
|
||||
|
||||
.prose tr:hover {
|
||||
@apply bg-white/5;
|
||||
}
|
||||
|
||||
/* Copy button for code blocks */
|
||||
.copy-button {
|
||||
@apply absolute top-2 right-2 p-2 rounded-md bg-dark-800 text-gray-400 hover:text-white hover:bg-dark-700 transition-all opacity-0 group-hover:opacity-100;
|
||||
}
|
||||
|
||||
/* Loading states */
|
||||
.loading-dots {
|
||||
@apply inline-flex space-x-1;
|
||||
}
|
||||
|
||||
.loading-dots span {
|
||||
@apply w-2 h-2 bg-primary-500 rounded-full animate-pulse;
|
||||
animation-delay: calc(var(--i) * 150ms);
|
||||
}
|
||||
|
||||
/* Hero section decorations */
|
||||
.hero-decoration {
|
||||
@apply absolute pointer-events-none;
|
||||
}
|
||||
|
||||
.hero-blob {
|
||||
@apply absolute w-96 h-96 bg-gradient-radial from-primary-500/30 to-transparent rounded-full blur-3xl animate-pulse-slow;
|
||||
}
|
||||
@@ -1,31 +0,0 @@
|
||||
#!/bin/bash
|
||||
|
||||
# Build script for Kompose documentation
|
||||
set -e
|
||||
|
||||
echo "🎨 Building Kompose Documentation..."
|
||||
echo ""
|
||||
|
||||
# Check if pnpm is installed
|
||||
if ! command -v pnpm &> /dev/null; then
|
||||
echo "❌ pnpm is not installed. Installing pnpm..."
|
||||
npm install -g pnpm@9.0.0
|
||||
fi
|
||||
|
||||
# Install dependencies
|
||||
echo "📦 Installing dependencies..."
|
||||
pnpm install
|
||||
|
||||
# Generate static site
|
||||
echo "🔨 Generating static site..."
|
||||
pnpm run generate
|
||||
|
||||
echo ""
|
||||
echo "✅ Build complete!"
|
||||
echo "📁 Output directory: .output/public"
|
||||
echo ""
|
||||
echo "To preview locally:"
|
||||
echo " pnpm run preview"
|
||||
echo ""
|
||||
echo "To deploy with Docker:"
|
||||
echo " ./kompose.sh docs up -d --build"
|
||||
@@ -1,38 +0,0 @@
|
||||
<template>
|
||||
<div class="relative group">
|
||||
<slot />
|
||||
<button
|
||||
@click="copyCode"
|
||||
class="absolute top-2 right-2 p-2 rounded-md bg-dark-800 text-gray-400 hover:text-white hover:bg-dark-700 transition-all opacity-0 group-hover:opacity-100"
|
||||
:class="{ '!opacity-100': copied }"
|
||||
>
|
||||
<Icon v-if="!copied" name="lucide:copy" class="w-4 h-4" />
|
||||
<Icon v-else name="lucide:check" class="w-4 h-4 text-green-500" />
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
|
||||
const props = defineProps({
|
||||
code: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
})
|
||||
|
||||
const copied = ref(false)
|
||||
|
||||
const copyCode = async () => {
|
||||
try {
|
||||
await navigator.clipboard.writeText(props.code)
|
||||
copied.value = true
|
||||
setTimeout(() => {
|
||||
copied.value = false
|
||||
}, 2000)
|
||||
} catch (err) {
|
||||
console.error('Failed to copy code:', err)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
62
Projects/kompose/docs/content/docs/guide/configuration.md
Normal file
62
Projects/kompose/docs/content/docs/guide/configuration.md
Normal file
@@ -0,0 +1,62 @@
|
||||
---
|
||||
title: Configuration
|
||||
description: Configure Kompose and your stacks
|
||||
---
|
||||
|
||||
# Configuration
|
||||
|
||||
### Root Configuration (`.env`)
|
||||
|
||||
Global settings shared across all stacks:
|
||||
|
||||
```bash
|
||||
# Network Configuration
|
||||
NETWORK_NAME=kompose
|
||||
|
||||
# Database Connection (default values)
|
||||
DB_USER=dbuser
|
||||
DB_PASSWORD=secretpassword
|
||||
DB_PORT=5432
|
||||
DB_HOST=postgres
|
||||
|
||||
# Admin Settings
|
||||
ADMIN_EMAIL=admin@example.com
|
||||
|
||||
# Email/SMTP Settings
|
||||
EMAIL_TRANSPORT=smtp
|
||||
EMAIL_FROM=noreply@example.com
|
||||
EMAIL_SMTP_HOST=smtp.example.com
|
||||
EMAIL_SMTP_PORT=465
|
||||
EMAIL_SMTP_USER=smtp@example.com
|
||||
EMAIL_SMTP_PASSWORD=smtppassword
|
||||
```
|
||||
|
||||
### Stack Configuration (`<stack>/.env`)
|
||||
|
||||
Stack-specific settings:
|
||||
|
||||
```bash
|
||||
# Stack Identification
|
||||
COMPOSE_PROJECT_NAME=blog
|
||||
|
||||
# Docker Image
|
||||
DOCKER_IMAGE=joseluisq/static-web-server:latest
|
||||
|
||||
# Traefik Configuration
|
||||
TRAEFIK_HOST=example.com
|
||||
|
||||
# Application Settings
|
||||
APP_PORT=80
|
||||
```
|
||||
|
||||
### Configuration Precedence
|
||||
|
||||
```
|
||||
CLI Overrides (-e flag)
|
||||
↓
|
||||
Stack .env
|
||||
↓
|
||||
Root .env
|
||||
↓
|
||||
Compose defaults
|
||||
```
|
||||
30
Projects/kompose/docs/content/docs/guide/database.md
Normal file
30
Projects/kompose/docs/content/docs/guide/database.md
Normal file
@@ -0,0 +1,30 @@
|
||||
---
|
||||
title: Database Operations
|
||||
description: Export, import, and manage PostgreSQL databases
|
||||
---
|
||||
|
||||
# Database Operations
|
||||
|
||||
- **Automated backups**: Export PostgreSQL databases with timestamped dumps
|
||||
- **Smart imports**: Auto-detect latest dumps or specify exact files
|
||||
- **Drop & recreate**: Safe database import with connection termination
|
||||
- **Cleanup utilities**: Keep only the latest dumps, remove old backups
|
||||
- **Hook integration**: Custom pre/post operations for each database action
|
||||
|
||||
### 🪝 Extensibility
|
||||
- **Custom hooks**: Define `pre_db_export`, `post_db_export`, `pre_db_import`, `post_db_import`
|
||||
- **Stack-specific logic**: Each stack can have unique operational requirements
|
||||
- **Environment access**: Hooks inherit all environment variables
|
||||
- **Dry-run aware**: Test hook execution without side effects
|
||||
|
||||
### 🌐 Network Management
|
||||
- **Unified network**: All stacks communicate on a single Docker network
|
||||
- **CLI overrides**: Change network on-the-fly without editing configs
|
||||
- **Traefik integration**: Seamless reverse proxy setup with proper network awareness
|
||||
- **Multi-network support**: Special stacks can have additional internal networks
|
||||
|
||||
### 🔧 Environment Control
|
||||
- **Global overrides**: Set environment variables via CLI flags
|
||||
- **Layered configs**: Root `.env` + stack `.env` + CLI overrides
|
||||
- **Precedence rules**: CLI > Stack > Root configuration hierarchy
|
||||
- **Real-time changes**: No need to edit files for temporary overrides
|
||||
91
Projects/kompose/docs/content/docs/guide/hooks.md
Normal file
91
Projects/kompose/docs/content/docs/guide/hooks.md
Normal file
@@ -0,0 +1,91 @@
|
||||
---
|
||||
title: Hooks System
|
||||
description: Extend Kompose with custom hooks
|
||||
---
|
||||
|
||||
# Hooks System
|
||||
|
||||
Extend Kompose functionality with custom hooks for each stack.
|
||||
|
||||
### Available Hooks
|
||||
|
||||
| Hook | Timing | Arguments | Use Case |
|
||||
|------|--------|-----------|----------|
|
||||
| `hook_pre_db_export` | Before DB export | None | Prepare data, export schemas |
|
||||
| `hook_post_db_export` | After DB export | `$1` = dump file path | Cleanup, notifications |
|
||||
| `hook_pre_db_import` | Before DB import | `$1` = dump file path | Prepare environment, schema setup |
|
||||
| `hook_post_db_import` | After DB import | `$1` = dump file path | Restart services, clear caches |
|
||||
|
||||
### Creating Hooks
|
||||
|
||||
Create `<stack>/hooks.sh`:
|
||||
|
||||
```bash
|
||||
#!/usr/bin/env bash
|
||||
|
||||
# Export schema before database export
|
||||
hook_pre_db_export() {
|
||||
echo " Exporting application schema..."
|
||||
docker exec sexy_api npx directus schema snapshot --yes ./schema.yaml
|
||||
return 0 # 0 = success, 1 = failure
|
||||
}
|
||||
|
||||
# Apply schema before database import
|
||||
hook_pre_db_import() {
|
||||
local dump_file="$1"
|
||||
echo " Applying schema snapshot..."
|
||||
docker exec sexy_api npx directus schema apply --yes ./schema.yaml
|
||||
return 0
|
||||
}
|
||||
|
||||
# Restart service after import
|
||||
hook_post_db_import() {
|
||||
local dump_file="$1"
|
||||
echo " Restarting application..."
|
||||
docker restart sexy_api
|
||||
return 0
|
||||
}
|
||||
```
|
||||
|
||||
### Real-World Example: Directus (sexy stack)
|
||||
|
||||
The `sexy` stack uses hooks for Directus schema management:
|
||||
|
||||
**Export Flow:**
|
||||
1. `pre_db_export`: Export Directus schema snapshot
|
||||
2. Database export creates SQL dump
|
||||
3. Result: Both database dump + schema snapshot
|
||||
|
||||
**Import Flow:**
|
||||
1. `pre_db_import`: Apply Directus schema from snapshot
|
||||
2. Database import loads SQL dump
|
||||
3. `post_db_import`: Restart Directus container
|
||||
4. Result: Fully synchronized schema + data
|
||||
|
||||
### Testing Hooks
|
||||
|
||||
```bash
|
||||
# Preview hook execution
|
||||
./kompose.sh sexy db:export --dry-run
|
||||
|
||||
# Execute with hooks
|
||||
./kompose.sh sexy db:export
|
||||
|
||||
# Import with hooks
|
||||
./kompose.sh sexy db:import
|
||||
```
|
||||
|
||||
### Hook Best Practices
|
||||
|
||||
✅ **DO:**
|
||||
- Return 0 for success, 1 for failure
|
||||
- Use indented output: `echo " Message"`
|
||||
- Make non-critical operations return 0
|
||||
- Check container status before `docker exec`
|
||||
- Test in dry-run mode first
|
||||
|
||||
❌ **DON'T:**
|
||||
- Assume containers are running
|
||||
- Use blocking operations without timeouts
|
||||
- Forget error handling
|
||||
- Hardcode paths or credentials
|
||||
29
Projects/kompose/docs/content/docs/guide/index.md
Normal file
29
Projects/kompose/docs/content/docs/guide/index.md
Normal file
@@ -0,0 +1,29 @@
|
||||
---
|
||||
title: User Guide
|
||||
description: Comprehensive guide to using Kompose
|
||||
---
|
||||
|
||||
# User Guide
|
||||
|
||||
Learn everything you need to know about using Kompose effectively.
|
||||
|
||||
## Getting Started
|
||||
|
||||
- [Quick Start](/docs/guide/quick-start) - Get up and running in minutes
|
||||
- [Installation](/docs/installation) - Detailed installation instructions
|
||||
|
||||
## Core Concepts
|
||||
|
||||
- [Stack Management](/docs/guide/stack-management) - Managing multiple Docker Compose stacks
|
||||
- [Database Operations](/docs/guide/database) - Backup, restore, and maintain databases
|
||||
- [Hooks System](/docs/guide/hooks) - Extend functionality with custom hooks
|
||||
- [Network Architecture](/docs/guide/network) - Understanding networking in Kompose
|
||||
|
||||
## Configuration
|
||||
|
||||
- [Configuration Guide](/docs/guide/configuration) - Configure Kompose and stacks
|
||||
- [Environment Variables](/docs/reference/environment) - All available environment variables
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
- [Common Issues](/docs/guide/troubleshooting) - Solutions to common problems
|
||||
52
Projects/kompose/docs/content/docs/guide/network.md
Normal file
52
Projects/kompose/docs/content/docs/guide/network.md
Normal file
@@ -0,0 +1,52 @@
|
||||
---
|
||||
title: Network Architecture
|
||||
description: Understanding Kompose network design
|
||||
---
|
||||
|
||||
# Network Architecture
|
||||
|
||||
### Single Network Design
|
||||
|
||||
All stacks communicate through a unified Docker network:
|
||||
|
||||
```
|
||||
┌─────────────────────────────────────────────────┐
|
||||
│ kompose Network (Bridge) │
|
||||
│ │
|
||||
│ ┌───────┐ ┌───────┐ ┌──────┐ ┌──────┐ │
|
||||
│ │ Blog │ │ News │ │ Auth │ │ Data │ │
|
||||
│ └───────┘ └───────┘ └──────┘ └──────┘ │
|
||||
│ │ │ │ │ │
|
||||
│ ┌───────────────────────────────────────┐ │
|
||||
│ │ Traefik (Reverse Proxy) │ │
|
||||
│ └───────────────────────────────────────┘ │
|
||||
│ │ │
|
||||
└────────────────────┼────────────────────────────┘
|
||||
│
|
||||
┌──────┴──────┐
|
||||
│ Internet │
|
||||
└─────────────┘
|
||||
```
|
||||
|
||||
### Network Configuration
|
||||
|
||||
**Default network:** `kompose` (defined in root `.env`)
|
||||
|
||||
**Override network:**
|
||||
```bash
|
||||
# Temporary override
|
||||
./kompose.sh --network staging "*" up -d
|
||||
|
||||
# Permanent override
|
||||
echo "NETWORK_NAME=production" >> .env
|
||||
```
|
||||
|
||||
### Special Network Cases
|
||||
|
||||
**trace stack** - Dual network setup:
|
||||
- `kompose` - External access via Traefik
|
||||
- `signoz` - Internal component communication
|
||||
|
||||
**vpn stack** - Dual network setup:
|
||||
- `kompose` - Web UI access
|
||||
- `wg` - WireGuard tunnel network
|
||||
29
Projects/kompose/docs/content/docs/guide/quick-start.md
Normal file
29
Projects/kompose/docs/content/docs/guide/quick-start.md
Normal file
@@ -0,0 +1,29 @@
|
||||
---
|
||||
title: Quick Start
|
||||
description: Get started with Kompose in minutes
|
||||
---
|
||||
|
||||
# Quick Start
|
||||
|
||||
```bash
|
||||
# Clone the repository
|
||||
git clone https://github.com/yourusername/kompose.git
|
||||
cd kompose
|
||||
|
||||
# Make kompose executable
|
||||
chmod +x kompose.sh
|
||||
|
||||
# List all stacks
|
||||
./kompose.sh --list
|
||||
|
||||
# Start everything
|
||||
./kompose.sh "*" up -d
|
||||
|
||||
# View logs from specific stacks
|
||||
./kompose.sh "blog,news" logs -f
|
||||
|
||||
# Export all databases
|
||||
./kompose.sh "*" db:export
|
||||
|
||||
# That's it! 🎉
|
||||
```
|
||||
26
Projects/kompose/docs/content/docs/guide/stack-management.md
Normal file
26
Projects/kompose/docs/content/docs/guide/stack-management.md
Normal file
@@ -0,0 +1,26 @@
|
||||
---
|
||||
title: Stack Management
|
||||
description: Learn how to manage multiple Docker Compose stacks
|
||||
---
|
||||
|
||||
# Stack Management
|
||||
|
||||
```bash
|
||||
# Start stacks
|
||||
./kompose.sh <pattern> up -d
|
||||
|
||||
# Stop stacks
|
||||
./kompose.sh <pattern> down
|
||||
|
||||
# View logs
|
||||
./kompose.sh <pattern> logs -f
|
||||
|
||||
# Restart stacks
|
||||
./kompose.sh <pattern> restart
|
||||
|
||||
# Check status
|
||||
./kompose.sh <pattern> ps
|
||||
|
||||
# Pull latest images
|
||||
./kompose.sh <pattern> pull
|
||||
```
|
||||
115
Projects/kompose/docs/content/docs/guide/troubleshooting.md
Normal file
115
Projects/kompose/docs/content/docs/guide/troubleshooting.md
Normal file
@@ -0,0 +1,115 @@
|
||||
---
|
||||
title: Troubleshooting
|
||||
description: Common issues and solutions
|
||||
---
|
||||
|
||||
# Troubleshooting
|
||||
|
||||
### Common Issues
|
||||
|
||||
#### 🚫 404 Error from Traefik
|
||||
|
||||
**Problem:** Websites return 404 even though containers are running
|
||||
|
||||
**Solution:**
|
||||
```bash
|
||||
# Check Traefik logs
|
||||
docker logs proxy_app
|
||||
|
||||
# Verify network configuration
|
||||
docker network inspect kompose
|
||||
|
||||
# Restart proxy and affected stacks
|
||||
./kompose.sh proxy down && ./kompose.sh proxy up -d
|
||||
./kompose.sh blog restart
|
||||
```
|
||||
|
||||
**Debug:**
|
||||
```bash
|
||||
# Check Traefik dashboard
|
||||
http://your-server:8080
|
||||
|
||||
# Verify container labels
|
||||
docker inspect blog_app | grep traefik
|
||||
```
|
||||
|
||||
#### 💾 Database Import Fails
|
||||
|
||||
**Problem:** `db:import` command fails
|
||||
|
||||
**Common causes:**
|
||||
1. **Active connections** - Solved automatically (kompose terminates connections)
|
||||
2. **Missing dump file** - Check file path
|
||||
3. **Insufficient permissions** - Check DB_USER permissions
|
||||
4. **Wrong database** - Verify DB_NAME in stack `.env`
|
||||
|
||||
**Solution:**
|
||||
```bash
|
||||
# Check database connectivity
|
||||
docker exec data_postgres psql -U $DB_USER -l
|
||||
|
||||
# Verify dump file exists
|
||||
ls -lh news/*.sql
|
||||
|
||||
# Check logs for detailed error
|
||||
./kompose.sh news db:import 2>&1 | tee import.log
|
||||
```
|
||||
|
||||
#### 🔌 Container Won't Connect to Network
|
||||
|
||||
**Problem:** Container fails to join kompose network
|
||||
|
||||
**Solution:**
|
||||
```bash
|
||||
# Recreate network
|
||||
docker network rm kompose
|
||||
docker network create kompose
|
||||
|
||||
# Restart all stacks
|
||||
./kompose.sh "*" down
|
||||
./kompose.sh "*" up -d
|
||||
```
|
||||
|
||||
#### 🪝 Hooks Not Executing
|
||||
|
||||
**Problem:** Custom hooks aren't running
|
||||
|
||||
**Checklist:**
|
||||
- [ ] `hooks.sh` file exists in stack directory
|
||||
- [ ] `hooks.sh` is executable: `chmod +x <stack>/hooks.sh`
|
||||
- [ ] Function names match: `hook_pre_db_export`, etc.
|
||||
- [ ] Functions return 0 (success) or 1 (failure)
|
||||
|
||||
**Test:**
|
||||
```bash
|
||||
# Dry-run shows hook execution
|
||||
./kompose.sh sexy db:export --dry-run
|
||||
|
||||
# Check if hooks.sh exists
|
||||
./kompose.sh --list | grep hooks
|
||||
```
|
||||
|
||||
### Debug Mode
|
||||
|
||||
Enable verbose logging:
|
||||
|
||||
```bash
|
||||
# View Traefik debug logs
|
||||
docker logs -f proxy_app
|
||||
|
||||
# Check environment variables
|
||||
./kompose.sh news ps
|
||||
docker exec news_backend env
|
||||
|
||||
# Inspect running containers
|
||||
docker ps -a
|
||||
docker inspect <container_name>
|
||||
```
|
||||
|
||||
### Getting Help
|
||||
|
||||
1. **Check logs:** `./kompose.sh <stack> logs`
|
||||
2. **Use dry-run:** `./kompose.sh --dry-run <pattern> <command>`
|
||||
3. **List stacks:** `./kompose.sh --list`
|
||||
4. **Read help:** `./kompose.sh --help`
|
||||
5. **Open an issue:** [GitHub Issues](https://github.com/yourusername/kompose/issues)
|
||||
@@ -7,23 +7,50 @@ description: Learn about Kompose, your Docker Compose Symphony Conductor for man
|
||||
|
||||
**Kompose** is a powerful Bash orchestration tool for managing multiple Docker Compose stacks with style and grace. Think of it as a conductor for your Docker symphony - each stack plays its part, and Kompose makes sure they're all in harmony.
|
||||
|
||||
## Why Kompose?
|
||||
**Kompose** is a powerful Bash orchestration tool for managing multiple Docker Compose stacks with style and grace. Think of it as a conductor for your Docker symphony - each stack plays its part, and Kompose makes sure they're all in harmony.
|
||||
|
||||
### Why Kompose?
|
||||
|
||||
🎯 **One Command to Rule Them All** - Manage dozens of stacks with a single command
|
||||
|
||||
🔄 **Database Wizardry** - Export, import, and clean up PostgreSQL databases like a boss
|
||||
|
||||
🎪 **Hook System** - Extend functionality with custom pre/post operation hooks
|
||||
|
||||
🌐 **Network Maestro** - Smart network management with CLI overrides
|
||||
|
||||
🔐 **Environment Juggler** - Override any environment variable on the fly
|
||||
|
||||
🎨 **Beautiful Output** - Color-coded logs and status indicators
|
||||
|
||||
🧪 **Dry-Run Mode** - Test changes before applying them
|
||||
|
||||
## Quick Example
|
||||
### 🎼 Stack Management
|
||||
- **Pattern-based selection**: Target stacks with globs, comma-separated lists, or wildcards
|
||||
- **Bulk operations**: Execute commands across multiple stacks simultaneously
|
||||
- **Status monitoring**: Visual feedback with color-coded success/failure indicators
|
||||
- **Smart filtering**: Include/exclude stacks with flexible pattern matching
|
||||
|
||||
### 💾 Database Operations
|
||||
- **Automated backups**: Export PostgreSQL databases with timestamped dumps
|
||||
- **Smart imports**: Auto-detect latest dumps or specify exact files
|
||||
- **Drop & recreate**: Safe database import with connection termination
|
||||
- **Cleanup utilities**: Keep only the latest dumps, remove old backups
|
||||
- **Hook integration**: Custom pre/post operations for each database action
|
||||
|
||||
### 🪝 Extensibility
|
||||
- **Custom hooks**: Define `pre_db_export`, `post_db_export`, `pre_db_import`, `post_db_import`
|
||||
- **Stack-specific logic**: Each stack can have unique operational requirements
|
||||
- **Environment access**: Hooks inherit all environment variables
|
||||
- **Dry-run aware**: Test hook execution without side effects
|
||||
|
||||
### 🌐 Network Management
|
||||
- **Unified network**: All stacks communicate on a single Docker network
|
||||
- **CLI overrides**: Change network on-the-fly without editing configs
|
||||
- **Traefik integration**: Seamless reverse proxy setup with proper network awareness
|
||||
- **Multi-network support**: Special stacks can have additional internal networks
|
||||
|
||||
### 🔧 Environment Control
|
||||
- **Global overrides**: Set environment variables via CLI flags
|
||||
- **Layered configs**: Root `.env` + stack `.env` + CLI overrides
|
||||
- **Precedence rules**: CLI > Stack > Root configuration hierarchy
|
||||
- **Real-time changes**: No need to edit files for temporary overrides
|
||||
|
||||
## Quick Start
|
||||
|
||||
```bash
|
||||
# Start all stacks
|
||||
@@ -39,27 +66,23 @@ description: Learn about Kompose, your Docker Compose Symphony Conductor for man
|
||||
./kompose.sh --network staging "*" up -d
|
||||
```
|
||||
|
||||
## Key Features
|
||||
## Documentation Sections
|
||||
|
||||
### Stack Management
|
||||
### Getting Started
|
||||
- [Installation Guide](/docs/installation) - Set up Kompose on your system
|
||||
- [Quick Start](/docs/guide/quick-start) - Get up and running in minutes
|
||||
|
||||
Pattern-based selection allows you to target stacks with globs, comma-separated lists, or wildcards. Execute commands across multiple stacks simultaneously with visual feedback and color-coded success/failure indicators.
|
||||
### User Guide
|
||||
- [Stack Management](/docs/guide/stack-management) - Managing multiple stacks
|
||||
- [Database Operations](/docs/guide/database) - Backup and restore databases
|
||||
- [Hooks System](/docs/guide/hooks) - Extend with custom hooks
|
||||
- [Configuration](/docs/guide/configuration) - Configure Kompose and stacks
|
||||
- [Network Architecture](/docs/guide/network) - Understanding networking
|
||||
- [Troubleshooting](/docs/guide/troubleshooting) - Common issues and solutions
|
||||
|
||||
### Database Operations
|
||||
### Stack Reference
|
||||
- [All Stacks](/docs/stacks) - Detailed documentation for each stack
|
||||
|
||||
Automated backups with timestamped dumps, smart imports that auto-detect latest dumps, and safe database operations with connection termination. Keep your storage clean with cleanup utilities.
|
||||
|
||||
### Hooks System
|
||||
|
||||
Extend Kompose with custom hooks for each stack. Define `pre_db_export`, `post_db_export`, `pre_db_import`, and `post_db_import` hooks to add stack-specific logic.
|
||||
|
||||
### Network Management
|
||||
|
||||
All stacks communicate through a unified Docker network. Override the network on-the-fly via CLI without editing configs, with seamless Traefik integration.
|
||||
|
||||
## Next Steps
|
||||
|
||||
- [Installation Guide](/docs/installation)
|
||||
- [Quick Start Tutorial](/docs/quick-start)
|
||||
- [Stack Management](/docs/guide/stack-management)
|
||||
- [Database Operations](/docs/guide/database)
|
||||
### Reference
|
||||
- [CLI Reference](/docs/reference/cli) - Complete command reference
|
||||
- [Environment Variables](/docs/reference/environment) - All configuration options
|
||||
|
||||
@@ -237,7 +237,7 @@ sudo systemctl enable docker
|
||||
|
||||
Now that Kompose is installed, you can:
|
||||
|
||||
1. [Start with the Quick Start Guide](/docs/quick-start)
|
||||
1. [Start with the Quick Start Guide](/docs/guide/quick-start)
|
||||
2. [Learn about Stack Management](/docs/guide/stack-management)
|
||||
3. [Explore Database Operations](/docs/guide/database)
|
||||
4. [Set up Custom Hooks](/docs/guide/hooks)
|
||||
@@ -277,4 +277,4 @@ rm -rf /path/to/kompose
|
||||
|
||||
---
|
||||
|
||||
**Need Help?** Check out the [Troubleshooting Guide](/docs/troubleshooting) or [open an issue](https://github.com/yourusername/kompose/issues) on GitHub.
|
||||
**Need Help?** Check out the [Troubleshooting Guide](/docs/guide/troubleshooting) or [open an issue](https://github.com/yourusername/kompose/issues) on GitHub.
|
||||
|
||||
202
Projects/kompose/docs/content/docs/reference/cli.md
Normal file
202
Projects/kompose/docs/content/docs/reference/cli.md
Normal file
@@ -0,0 +1,202 @@
|
||||
---
|
||||
title: CLI Reference
|
||||
description: Complete command-line interface reference
|
||||
---
|
||||
|
||||
# CLI Reference
|
||||
|
||||
Complete reference for all Kompose CLI commands and options.
|
||||
|
||||
## Synopsis
|
||||
|
||||
```bash
|
||||
./kompose.sh [OPTIONS] <PATTERN> <COMMAND> [ARGS...]
|
||||
```
|
||||
|
||||
## Options
|
||||
|
||||
### Global Options
|
||||
|
||||
| Option | Short | Description |
|
||||
|--------|-------|-------------|
|
||||
| `--help` | `-h` | Show help message |
|
||||
| `--list` | `-l` | List all available stacks |
|
||||
| `--dry-run` | `-n` | Preview actions without executing |
|
||||
| `--network <n>` | | Override network name |
|
||||
| `-e <KEY=VALUE>` | | Set environment variable |
|
||||
|
||||
### Examples
|
||||
|
||||
```bash
|
||||
# Show help
|
||||
./kompose.sh --help
|
||||
|
||||
# List all stacks
|
||||
./kompose.sh --list
|
||||
|
||||
# Dry run mode
|
||||
./kompose.sh --dry-run "*" up -d
|
||||
|
||||
# Override network
|
||||
./kompose.sh --network staging "*" up -d
|
||||
|
||||
# Set environment variable
|
||||
./kompose.sh -e DB_HOST=localhost news up -d
|
||||
```
|
||||
|
||||
## Stack Patterns
|
||||
|
||||
### Pattern Syntax
|
||||
|
||||
- `*` - All stacks
|
||||
- `stack1,stack2,stack3` - Specific stacks (comma-separated)
|
||||
- `stack` - Single stack
|
||||
|
||||
### Examples
|
||||
|
||||
```bash
|
||||
# All stacks
|
||||
./kompose.sh "*" up -d
|
||||
|
||||
# Multiple specific stacks
|
||||
./kompose.sh "auth,blog,news" logs -f
|
||||
|
||||
# Single stack
|
||||
./kompose.sh proxy restart
|
||||
```
|
||||
|
||||
## Docker Compose Commands
|
||||
|
||||
Any Docker Compose command can be passed through:
|
||||
|
||||
```bash
|
||||
# Start services
|
||||
./kompose.sh <pattern> up -d
|
||||
|
||||
# Stop services
|
||||
./kompose.sh <pattern> down
|
||||
|
||||
# View logs
|
||||
./kompose.sh <pattern> logs -f
|
||||
|
||||
# Restart services
|
||||
./kompose.sh <pattern> restart
|
||||
|
||||
# Pull images
|
||||
./kompose.sh <pattern> pull
|
||||
|
||||
# Check status
|
||||
./kompose.sh <pattern> ps
|
||||
|
||||
# Execute commands
|
||||
./kompose.sh <pattern> exec <service> <command>
|
||||
```
|
||||
|
||||
## Database Commands
|
||||
|
||||
### db:export
|
||||
|
||||
Export PostgreSQL database to SQL dump file.
|
||||
|
||||
```bash
|
||||
./kompose.sh <pattern> db:export
|
||||
```
|
||||
|
||||
**Output:** `<stack-dir>/<db-name>_YYYYMMDD_HHMMSS.sql`
|
||||
|
||||
### db:import
|
||||
|
||||
Import PostgreSQL database from SQL dump file.
|
||||
|
||||
```bash
|
||||
# Import latest dump (auto-detected)
|
||||
./kompose.sh <stack> db:import
|
||||
|
||||
# Import specific dump file
|
||||
./kompose.sh <stack> db:import path/to/dump.sql
|
||||
```
|
||||
|
||||
**⚠️ WARNING:** Drops and recreates the database!
|
||||
|
||||
### db:cleanup
|
||||
|
||||
Remove old database dump files (keeps only the latest).
|
||||
|
||||
```bash
|
||||
./kompose.sh <pattern> db:cleanup
|
||||
```
|
||||
|
||||
## Exit Codes
|
||||
|
||||
| Code | Meaning |
|
||||
|------|---------|
|
||||
| 0 | Success |
|
||||
| 1 | General error |
|
||||
| 2 | Missing required arguments |
|
||||
| 3 | No matching stacks |
|
||||
|
||||
## Environment Variables
|
||||
|
||||
Environment variables can be set via:
|
||||
|
||||
1. Root `.env` file
|
||||
2. Stack `.env` file
|
||||
3. CLI `-e` flag (highest priority)
|
||||
|
||||
### Precedence
|
||||
|
||||
```
|
||||
CLI (-e flag) > Stack .env > Root .env > Compose defaults
|
||||
```
|
||||
|
||||
## Examples
|
||||
|
||||
### Daily Workflow
|
||||
|
||||
```bash
|
||||
# Morning: Start everything
|
||||
./kompose.sh "*" up -d
|
||||
|
||||
# Check status
|
||||
./kompose.sh "*" ps
|
||||
|
||||
# View logs
|
||||
./kompose.sh "*" logs --tail=50
|
||||
|
||||
# Evening: Backup databases
|
||||
./kompose.sh "*" db:export
|
||||
./kompose.sh "*" db:cleanup
|
||||
```
|
||||
|
||||
### Deployment
|
||||
|
||||
```bash
|
||||
# Pull latest images
|
||||
./kompose.sh "*" pull
|
||||
|
||||
# Backup before update
|
||||
./kompose.sh "*" db:export
|
||||
|
||||
# Restart with new images
|
||||
./kompose.sh "*" down
|
||||
./kompose.sh "*" up -d
|
||||
|
||||
# Verify health
|
||||
./kompose.sh "*" ps
|
||||
```
|
||||
|
||||
### Development
|
||||
|
||||
```bash
|
||||
# Start dev environment
|
||||
./kompose.sh "data,proxy,news" up -d
|
||||
|
||||
# Override for testing
|
||||
./kompose.sh -e DB_NAME=test_db news up -d
|
||||
|
||||
# Watch logs
|
||||
./kompose.sh news logs -f
|
||||
|
||||
# Clean up
|
||||
./kompose.sh news down
|
||||
```
|
||||
147
Projects/kompose/docs/content/docs/reference/environment.md
Normal file
147
Projects/kompose/docs/content/docs/reference/environment.md
Normal file
@@ -0,0 +1,147 @@
|
||||
---
|
||||
title: Environment Variables
|
||||
description: Complete reference for all environment variables
|
||||
---
|
||||
|
||||
# Environment Variables
|
||||
|
||||
Complete reference for all environment variables used in Kompose.
|
||||
|
||||
## Global Variables
|
||||
|
||||
These are set in the root `.env` file and available to all stacks.
|
||||
|
||||
### Network Configuration
|
||||
|
||||
| Variable | Default | Description |
|
||||
|----------|---------|-------------|
|
||||
| `NETWORK_NAME` | `kompose` | Docker network name |
|
||||
|
||||
### Database Configuration
|
||||
|
||||
| Variable | Default | Description |
|
||||
|----------|---------|-------------|
|
||||
| `DB_USER` | - | PostgreSQL username |
|
||||
| `DB_PASSWORD` | - | PostgreSQL password |
|
||||
| `DB_PORT` | `5432` | PostgreSQL port |
|
||||
| `DB_HOST` | `postgres` | PostgreSQL host |
|
||||
|
||||
### Admin Settings
|
||||
|
||||
| Variable | Default | Description |
|
||||
|----------|---------|-------------|
|
||||
| `ADMIN_EMAIL` | - | Administrator email |
|
||||
| `ADMIN_PASSWORD` | - | Administrator password |
|
||||
|
||||
### Email/SMTP Settings
|
||||
|
||||
| Variable | Default | Description |
|
||||
|----------|---------|-------------|
|
||||
| `EMAIL_TRANSPORT` | `smtp` | Email transport method |
|
||||
| `EMAIL_FROM` | - | Default sender address |
|
||||
| `EMAIL_SMTP_HOST` | - | SMTP server hostname |
|
||||
| `EMAIL_SMTP_PORT` | `465` | SMTP server port |
|
||||
| `EMAIL_SMTP_USER` | - | SMTP username |
|
||||
| `EMAIL_SMTP_PASSWORD` | - | SMTP password |
|
||||
|
||||
## Stack-Specific Variables
|
||||
|
||||
These are set in individual stack `.env` files.
|
||||
|
||||
### Common Stack Variables
|
||||
|
||||
| Variable | Description |
|
||||
|----------|-------------|
|
||||
| `COMPOSE_PROJECT_NAME` | Stack project name |
|
||||
| `TRAEFIK_HOST` | Domain for Traefik routing |
|
||||
| `APP_PORT` | Internal application port |
|
||||
|
||||
### Auth Stack (Keycloak)
|
||||
|
||||
| Variable | Description |
|
||||
|----------|-------------|
|
||||
| `KC_ADMIN_USERNAME` | Keycloak admin username |
|
||||
| `KC_ADMIN_PASSWORD` | Keycloak admin password |
|
||||
| `KC_DB_NAME` | Keycloak database name |
|
||||
|
||||
### News Stack (Letterspace)
|
||||
|
||||
| Variable | Description |
|
||||
|----------|-------------|
|
||||
| `JWT_SECRET` | JWT signing secret |
|
||||
| `DB_NAME` | Newsletter database name |
|
||||
| `NODE_ENV` | Node environment (production/development) |
|
||||
|
||||
### Sexy Stack (Directus)
|
||||
|
||||
| Variable | Description |
|
||||
|----------|-------------|
|
||||
| `KEY` | Directus encryption key |
|
||||
| `SECRET` | Directus secret key |
|
||||
| `ADMIN_EMAIL` | Directus admin email |
|
||||
| `ADMIN_PASSWORD` | Directus admin password |
|
||||
|
||||
## Configuration Precedence
|
||||
|
||||
Environment variables follow this priority order:
|
||||
|
||||
1. **CLI Override** (`-e` flag) - Highest priority
|
||||
2. **Stack .env** - Stack-specific settings
|
||||
3. **Root .env** - Global defaults
|
||||
4. **Compose File** - Docker Compose defaults
|
||||
|
||||
### Example
|
||||
|
||||
```bash
|
||||
# Root .env
|
||||
DB_HOST=postgres
|
||||
|
||||
# news/.env
|
||||
DB_HOST=news-postgres # Overrides root
|
||||
|
||||
# CLI
|
||||
./kompose.sh -e DB_HOST=localhost news up -d # Overrides both
|
||||
```
|
||||
|
||||
## Best Practices
|
||||
|
||||
### Security
|
||||
|
||||
- ✅ Use strong, random passwords
|
||||
- ✅ Never commit `.env` files to version control
|
||||
- ✅ Use `.env.example` as template
|
||||
- ✅ Rotate secrets regularly
|
||||
|
||||
### Organization
|
||||
|
||||
- ✅ Document custom variables
|
||||
- ✅ Group related variables
|
||||
- ✅ Use consistent naming
|
||||
- ✅ Keep defaults in root `.env`
|
||||
|
||||
## Generating Secrets
|
||||
|
||||
### Random Passwords
|
||||
|
||||
```bash
|
||||
# OpenSSL
|
||||
openssl rand -hex 32
|
||||
|
||||
# UUID
|
||||
uuidgen
|
||||
|
||||
# Base64
|
||||
openssl rand -base64 32
|
||||
```
|
||||
|
||||
### JWT Secrets
|
||||
|
||||
```bash
|
||||
openssl rand -hex 64
|
||||
```
|
||||
|
||||
### Encryption Keys
|
||||
|
||||
```bash
|
||||
openssl rand -base64 32
|
||||
```
|
||||
28
Projects/kompose/docs/content/docs/reference/index.md
Normal file
28
Projects/kompose/docs/content/docs/reference/index.md
Normal file
@@ -0,0 +1,28 @@
|
||||
---
|
||||
title: Reference Documentation
|
||||
description: Complete reference documentation for Kompose
|
||||
---
|
||||
|
||||
# Reference Documentation
|
||||
|
||||
Complete reference documentation for all aspects of Kompose.
|
||||
|
||||
## Command Line
|
||||
|
||||
- [CLI Reference](/docs/reference/cli) - All commands and options
|
||||
- [Stack Patterns](/docs/reference/cli#stack-patterns) - Pattern matching syntax
|
||||
|
||||
## Configuration
|
||||
|
||||
- [Environment Variables](/docs/reference/environment) - All environment variables
|
||||
- [Configuration Files](/docs/guide/configuration) - File structure and precedence
|
||||
|
||||
## Stack Reference
|
||||
|
||||
- [Stack Documentation](/docs/stacks) - Detailed docs for each stack
|
||||
|
||||
## Advanced Topics
|
||||
|
||||
- [Network Architecture](/docs/guide/network) - Network design and configuration
|
||||
- [Hook System](/docs/guide/hooks) - Writing custom hooks
|
||||
- [Database Operations](/docs/guide/database) - Advanced database management
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: Auth Stack - The Bouncer at Your Digital Club
|
||||
description: "You shall not pass... without proper credentials!"
|
||||
---
|
||||
|
||||
# 🔐 Auth Stack - The Bouncer at Your Digital Club
|
||||
|
||||
> *"You shall not pass... without proper credentials!"* - Keycloak, probably
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: <20> Auto Stack - Your Ansible Automation Wingman
|
||||
description: "Automating the boring stuff since... well, today!"
|
||||
---
|
||||
|
||||
# 🤖 Auto Stack - Your Ansible Automation Wingman
|
||||
|
||||
> *"Automating the boring stuff since... well, today!"* - Semaphore UI
|
||||
@@ -80,7 +85,7 @@ Three volumes keep your data safe:
|
||||
|
||||
## Health Checks
|
||||
|
||||
### Semaphore UI
|
||||
### Semaphore API Ping
|
||||
Every 30 seconds: "Hey, you still awake?"
|
||||
```bash
|
||||
curl -f http://localhost:3000/api/ping
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: Blog Stack - Your Lightning-Fast Static Site Delivery
|
||||
description: "Speed is my middle name"
|
||||
---
|
||||
|
||||
# 📝 Blog Stack - Your Lightning-Fast Static Site Delivery
|
||||
|
||||
> *"Speed is my middle name"* - Static Web Server
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: ⛓ Chain Stack - Workflow Automation Powerhouse
|
||||
description: "If you can dream it, you can automate it!"
|
||||
---
|
||||
|
||||
# ⛓️ Chain Stack - Workflow Automation Powerhouse
|
||||
|
||||
> *"If you can dream it, you can automate it!"* - n8n philosophy
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: <20> Chat Stack - Your Personal Notification HQ
|
||||
description: "Ding! You've got... pretty much everything"
|
||||
---
|
||||
|
||||
# 💬 Chat Stack - Your Personal Notification HQ
|
||||
|
||||
> *"Ding! You've got... pretty much everything"* - Gotify
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: <20> Code Stack - Your Private GitHub Alternative
|
||||
description: "Give them Git, make them great!"
|
||||
---
|
||||
|
||||
# 🦊 Code Stack - Your Private GitHub Alternative
|
||||
|
||||
> *"Give them Git, make them great!"* - Some wise developer
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: Homepage Dashboard (Dash)
|
||||
description: Documentation for the dash stack
|
||||
---
|
||||
|
||||
# Homepage Dashboard (Dash)
|
||||
|
||||
This directory contains the configuration for the [Homepage](https://gethomepage.dev) dashboard service, which provides a centralized view of all kompose.sh services.
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: Data Stack - The Memory Palace of Your Infrastructure
|
||||
description: "In data we trust... and backup, and replicate, and backup again"
|
||||
---
|
||||
|
||||
# 🗄️ Data Stack - The Memory Palace of Your Infrastructure
|
||||
|
||||
> *"In data we trust... and backup, and replicate, and backup again"* - Every DBA Ever
|
||||
@@ -116,7 +121,7 @@ ADMIN_PASSWORD=your_password
|
||||
|
||||
## First Time Setup 🚀
|
||||
|
||||
### PostgreSQL
|
||||
### Postgres
|
||||
|
||||
1. **Create a new database**:
|
||||
```bash
|
||||
@@ -132,7 +137,7 @@ ADMIN_PASSWORD=your_password
|
||||
- Login with admin credentials
|
||||
- Right-click "Databases" → Create → Database
|
||||
|
||||
### Redis
|
||||
### Redis cache
|
||||
|
||||
Redis works out of the box! No setup needed. Just start using it:
|
||||
```bash
|
||||
@@ -279,7 +284,7 @@ Your pgAdmin settings and configurations.
|
||||
|
||||
## Performance Tips 💡
|
||||
|
||||
### PostgreSQL
|
||||
### PostgresSQL Server
|
||||
|
||||
1. **Indexes**: Create them on frequently queried columns
|
||||
```sql
|
||||
@@ -296,7 +301,7 @@ Your pgAdmin settings and configurations.
|
||||
VACUUM ANALYZE;
|
||||
```
|
||||
|
||||
### Redis
|
||||
### Redis Service
|
||||
|
||||
1. **Use Appropriate Data Structures**: Lists, Sets, Hashes, etc.
|
||||
2. **Set Expiration**: Don't let cache grow forever
|
||||
@@ -351,13 +356,13 @@ pgbouncer:
|
||||
|
||||
## Monitoring & Metrics
|
||||
|
||||
### PostgreSQL
|
||||
### PostgreSQL Server
|
||||
|
||||
- **pg_stat_statements**: Track slow queries
|
||||
- **pg_stat_user_tables**: Table statistics
|
||||
- **pg_stat_database**: Database-level stats
|
||||
|
||||
### Redis
|
||||
### Redis System
|
||||
|
||||
- **INFO** command: Comprehensive stats
|
||||
- **SLOWLOG**: Track slow commands
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: <20> Dock Stack - Your Docker Compose Command Center
|
||||
description: "Making Docker Compose actually fun since 2023"
|
||||
---
|
||||
|
||||
# 🐳 Dock Stack - Your Docker Compose Command Center
|
||||
|
||||
> *"Making Docker Compose actually fun since 2023"* - Dockge
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: <20> Home Stack - Your Smart Home Command Center
|
||||
description: "Home is where the automation is!"
|
||||
---
|
||||
|
||||
# 🏠 Home Stack - Your Smart Home Command Center
|
||||
|
||||
> *"Home is where the automation is!"* - Every Home Assistant user
|
||||
53
Projects/kompose/docs/content/docs/stacks/index.md
Normal file
53
Projects/kompose/docs/content/docs/stacks/index.md
Normal file
@@ -0,0 +1,53 @@
|
||||
---
|
||||
title: Stack Reference
|
||||
description: Detailed documentation for all Kompose stacks
|
||||
---
|
||||
|
||||
# Stack Reference
|
||||
|
||||
This section contains detailed documentation for each stack in the Kompose ecosystem.
|
||||
|
||||
## Available Stacks
|
||||
|
||||
- [Auth](/docs/stacks/auth)
|
||||
- [Auto](/docs/stacks/auto)
|
||||
- [Blog](/docs/stacks/blog)
|
||||
- [Chain](/docs/stacks/chain)
|
||||
- [Chat](/docs/stacks/chat)
|
||||
- [Code](/docs/stacks/code)
|
||||
- [Dash](/docs/stacks/dash)
|
||||
- [Data](/docs/stacks/data)
|
||||
- [Dock](/docs/stacks/dock)
|
||||
- [Home](/docs/stacks/home)
|
||||
- [Link](/docs/stacks/link)
|
||||
- [News](/docs/stacks/news)
|
||||
- [Proxy](/docs/stacks/proxy)
|
||||
- [Sexy](/docs/stacks/sexy)
|
||||
- [Trace](/docs/stacks/trace)
|
||||
- [Track](/docs/stacks/track)
|
||||
- [Vault](/docs/stacks/vault)
|
||||
- [Vpn](/docs/stacks/vpn)
|
||||
|
||||
## Stack Categories
|
||||
|
||||
### Infrastructure Stacks
|
||||
Core infrastructure services that other stacks depend on:
|
||||
- [Data](/docs/stacks/data) - PostgreSQL & Redis databases
|
||||
- [Proxy](/docs/stacks/proxy) - Traefik reverse proxy
|
||||
- [Trace](/docs/stacks/trace) - SigNoz observability
|
||||
- [Vault](/docs/stacks/vault) - Vaultwarden password manager
|
||||
- [VPN](/docs/stacks/vpn) - WireGuard VPN
|
||||
|
||||
### Application Stacks
|
||||
Production application services:
|
||||
- [Auth](/docs/stacks/auth) - Keycloak authentication
|
||||
- [Blog](/docs/stacks/blog) - Static website server
|
||||
- [News](/docs/stacks/news) - Letterspace newsletter platform
|
||||
- [Sexy](/docs/stacks/sexy) - Directus CMS
|
||||
|
||||
### Utility Stacks
|
||||
Management and monitoring tools:
|
||||
- [Dock](/docs/stacks/dock) - Dockge Docker UI
|
||||
- [Chat](/docs/stacks/chat) - Gotify notifications
|
||||
- [Track](/docs/stacks/track) - Umami analytics
|
||||
- [Auto](/docs/stacks/auto) - Semaphore CI/CD
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: <20> Link Stack - Bookmark Manager
|
||||
description: Documentation for the link stack
|
||||
---
|
||||
|
||||
# 🔗 Link Stack - Bookmark Manager
|
||||
|
||||
Complete documentation for Linkwarden is available in the artifacts.
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: News Stack - Your Self-Hosted Newsletter Empire
|
||||
description: "Forget MailChimp, we're going full indie!"
|
||||
---
|
||||
|
||||
# 📰 News Stack - Your Self-Hosted Newsletter Empire
|
||||
|
||||
> *"Forget MailChimp, we're going full indie!"* - Letterspace
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: Proxy Stack - The Traffic Cop of Your Infrastructure
|
||||
description: "Beep beep! Make way for HTTPS traffic!"
|
||||
---
|
||||
|
||||
# 🚦 Proxy Stack - The Traffic Cop of Your Infrastructure
|
||||
|
||||
> *"Beep beep! Make way for HTTPS traffic!"* - Traefik
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: <20> Sexy Stack - Your Headless CMS Runway
|
||||
description: "We make content management look good!"
|
||||
---
|
||||
|
||||
# 💅 Sexy Stack - Your Headless CMS Runway
|
||||
|
||||
> *"We make content management look good!"* - Directus + SvelteKit
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: <20> Trace Stack - Your Observability Command Center
|
||||
description: "When your app goes boom, we tell you why!"
|
||||
---
|
||||
|
||||
# 🔍 Trace Stack - Your Observability Command Center
|
||||
|
||||
> *"When your app goes boom, we tell you why!"* - SigNoz
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: <20> Track Stack - Your Privacy-First Analytics HQ
|
||||
description: "We count visitors, not cookies!"
|
||||
---
|
||||
|
||||
# 📊 Track Stack - Your Privacy-First Analytics HQ
|
||||
|
||||
> *"We count visitors, not cookies!"* - Umami Analytics
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: Vault Stack - Your Password Fort Knox
|
||||
description: "One password to rule them all!"
|
||||
---
|
||||
|
||||
# 🔐 Vault Stack - Your Password Fort Knox
|
||||
|
||||
> *"One password to rule them all!"* - Vaultwarden
|
||||
@@ -1,3 +1,8 @@
|
||||
---
|
||||
title: <20> VPN Stack - Your Encrypted Tunnel to Freedom
|
||||
description: "The internet, but make it private!"
|
||||
---
|
||||
|
||||
# 🔌 VPN Stack - Your Encrypted Tunnel to Freedom
|
||||
|
||||
> *"The internet, but make it private!"* - WireGuard
|
||||
0
Projects/kompose/docs/content/index.md
Normal file
0
Projects/kompose/docs/content/index.md
Normal file
@@ -1,222 +0,0 @@
|
||||
<template>
|
||||
<div class="flex flex-col min-h-screen">
|
||||
<!-- Header -->
|
||||
<header class="sticky top-0 z-50 w-full border-b border-dark-800 glass-dark">
|
||||
<div class="container mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<div class="flex h-16 items-center justify-between">
|
||||
<!-- Logo -->
|
||||
<NuxtLink to="/" class="flex items-center space-x-3 group">
|
||||
<div class="text-3xl font-bold gradient-text group-hover:scale-110 transition-transform">
|
||||
KOMPOSE
|
||||
</div>
|
||||
</NuxtLink>
|
||||
|
||||
<!-- Navigation -->
|
||||
<nav class="hidden md:flex items-center space-x-6">
|
||||
<NuxtLink to="/docs" class="link-fancy text-sm font-medium">
|
||||
Documentation
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/api" class="link-fancy text-sm font-medium">
|
||||
API Reference
|
||||
</NuxtLink>
|
||||
<NuxtLink to="/examples" class="link-fancy text-sm font-medium">
|
||||
Examples
|
||||
</NuxtLink>
|
||||
<a href="https://github.com/yourusername/kompose" target="_blank"
|
||||
class="text-gray-400 hover:text-white transition-colors">
|
||||
<Icon name="lucide:github" class="w-5 h-5" />
|
||||
</a>
|
||||
</nav>
|
||||
|
||||
<!-- Mobile menu button -->
|
||||
<button @click="mobileMenuOpen = !mobileMenuOpen" class="md:hidden text-gray-400 hover:text-white">
|
||||
<Icon :name="mobileMenuOpen ? 'lucide:x' : 'lucide:menu'" class="w-6 h-6" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Mobile menu -->
|
||||
<Transition
|
||||
enter-active-class="transition duration-200 ease-out"
|
||||
enter-from-class="opacity-0 scale-95"
|
||||
enter-to-class="opacity-100 scale-100"
|
||||
leave-active-class="transition duration-100 ease-in"
|
||||
leave-from-class="opacity-100 scale-100"
|
||||
leave-to-class="opacity-0 scale-95"
|
||||
>
|
||||
<div v-show="mobileMenuOpen" class="md:hidden border-t border-dark-800 bg-dark-900 p-4">
|
||||
<nav class="flex flex-col space-y-3">
|
||||
<NuxtLink @click="mobileMenuOpen = false" to="/docs" class="text-gray-300 hover:text-white">
|
||||
Documentation
|
||||
</NuxtLink>
|
||||
<NuxtLink @click="mobileMenuOpen = false" to="/api" class="text-gray-300 hover:text-white">
|
||||
API Reference
|
||||
</NuxtLink>
|
||||
<NuxtLink @click="mobileMenuOpen = false" to="/examples" class="text-gray-300 hover:text-white">
|
||||
Examples
|
||||
</NuxtLink>
|
||||
</nav>
|
||||
</div>
|
||||
</Transition>
|
||||
</header>
|
||||
|
||||
<div class="flex-1 flex">
|
||||
<!-- Sidebar -->
|
||||
<aside class="hidden lg:block w-64 border-r border-dark-800 overflow-y-auto sticky top-16 h-[calc(100vh-4rem)]">
|
||||
<div class="p-6 space-y-6">
|
||||
<!-- Search -->
|
||||
<div class="relative">
|
||||
<Icon name="lucide:search" class="absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-gray-500" />
|
||||
<input
|
||||
type="search"
|
||||
placeholder="Search docs..."
|
||||
class="w-full pl-10 pr-4 py-2 bg-dark-900 border border-dark-700 rounded-lg text-sm focus:outline-none focus:border-primary-500 focus:ring-2 focus:ring-primary-500/20"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- Navigation sections -->
|
||||
<nav class="space-y-6">
|
||||
<div v-for="section in navigation" :key="section.title">
|
||||
<h3 class="text-xs font-semibold text-gray-500 uppercase tracking-wider mb-3">
|
||||
{{ section.title }}
|
||||
</h3>
|
||||
<ul class="space-y-1">
|
||||
<li v-for="item in section.items" :key="item.to">
|
||||
<NuxtLink :to="item.to" class="sidebar-link">
|
||||
{{ item.label }}
|
||||
</NuxtLink>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<!-- Main content -->
|
||||
<main class="flex-1 overflow-x-hidden">
|
||||
<div class="container mx-auto px-4 sm:px-6 lg:px-8 py-8 max-w-5xl">
|
||||
<slot />
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<!-- Table of contents -->
|
||||
<aside class="hidden xl:block w-64 border-l border-dark-800 overflow-y-auto sticky top-16 h-[calc(100vh-4rem)]">
|
||||
<div class="p-6">
|
||||
<h3 class="text-sm font-semibold text-gray-400 uppercase tracking-wider mb-4">
|
||||
On This Page
|
||||
</h3>
|
||||
<nav class="space-y-2">
|
||||
<a
|
||||
v-for="link in toc"
|
||||
:key="link.id"
|
||||
:href="`#${link.id}`"
|
||||
class="toc-link"
|
||||
:class="{ active: activeId === link.id }"
|
||||
:style="{ paddingLeft: `${(link.depth - 2) * 12 + 16}px` }"
|
||||
>
|
||||
{{ link.text }}
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="border-t border-dark-800 bg-dark-950">
|
||||
<div class="container mx-auto px-4 sm:px-6 lg:px-8 py-12">
|
||||
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
|
||||
<div class="col-span-1 md:col-span-2">
|
||||
<div class="text-2xl font-bold gradient-text mb-4">KOMPOSE</div>
|
||||
<p class="text-gray-400 text-sm mb-4">
|
||||
Your Docker Compose Symphony Conductor
|
||||
</p>
|
||||
<div class="flex space-x-4">
|
||||
<a href="#" class="text-gray-400 hover:text-primary-400 transition-colors">
|
||||
<Icon name="lucide:github" class="w-5 h-5" />
|
||||
</a>
|
||||
<a href="#" class="text-gray-400 hover:text-primary-400 transition-colors">
|
||||
<Icon name="lucide:twitter" class="w-5 h-5" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h4 class="text-sm font-semibold text-white mb-4">Documentation</h4>
|
||||
<ul class="space-y-2 text-sm">
|
||||
<li><NuxtLink to="/docs" class="text-gray-400 hover:text-white">Getting Started</NuxtLink></li>
|
||||
<li><NuxtLink to="/docs/guide" class="text-gray-400 hover:text-white">Guide</NuxtLink></li>
|
||||
<li><NuxtLink to="/api" class="text-gray-400 hover:text-white">API Reference</NuxtLink></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h4 class="text-sm font-semibold text-white mb-4">Community</h4>
|
||||
<ul class="space-y-2 text-sm">
|
||||
<li><a href="#" class="text-gray-400 hover:text-white">GitHub</a></li>
|
||||
<li><a href="#" class="text-gray-400 hover:text-white">Discord</a></li>
|
||||
<li><a href="#" class="text-gray-400 hover:text-white">Twitter</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="border-t border-dark-800 mt-8 pt-8 text-center text-sm text-gray-400">
|
||||
<p>© 2025 Kompose. Made with ❤️ and ☕</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted } from 'vue'
|
||||
|
||||
const mobileMenuOpen = ref(false)
|
||||
const activeId = ref('')
|
||||
const toc = ref([])
|
||||
|
||||
const navigation = [
|
||||
{
|
||||
title: 'Getting Started',
|
||||
items: [
|
||||
{ label: 'Introduction', to: '/docs' },
|
||||
{ label: 'Installation', to: '/docs/installation' },
|
||||
{ label: 'Quick Start', to: '/docs/quick-start' },
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'Guide',
|
||||
items: [
|
||||
{ label: 'Stack Management', to: '/docs/guide/stack-management' },
|
||||
{ label: 'Database Operations', to: '/docs/guide/database' },
|
||||
{ label: 'Hooks System', to: '/docs/guide/hooks' },
|
||||
{ label: 'Network Architecture', to: '/docs/guide/network' },
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'Reference',
|
||||
items: [
|
||||
{ label: 'Configuration', to: '/docs/reference/configuration' },
|
||||
{ label: 'CLI Commands', to: '/docs/reference/cli' },
|
||||
{ label: 'Environment Variables', to: '/docs/reference/env' },
|
||||
]
|
||||
}
|
||||
]
|
||||
|
||||
// Table of contents intersection observer
|
||||
onMounted(() => {
|
||||
const observer = new IntersectionObserver(
|
||||
(entries) => {
|
||||
entries.forEach((entry) => {
|
||||
if (entry.isIntersecting) {
|
||||
activeId.value = entry.target.id
|
||||
}
|
||||
})
|
||||
},
|
||||
{ rootMargin: '-80px 0px -80% 0px' }
|
||||
)
|
||||
|
||||
document.querySelectorAll('h2, h3').forEach((heading) => {
|
||||
observer.observe(heading)
|
||||
})
|
||||
})
|
||||
</script>
|
||||
@@ -1,115 +1,38 @@
|
||||
// https://nuxt.com/docs/api/configuration/nuxt-config
|
||||
export default defineNuxtConfig({
|
||||
compatibilityDate: '2024-04-03',
|
||||
compatibilityDate: '2025-07-15',
|
||||
devtools: { enabled: true },
|
||||
|
||||
modules: [
|
||||
'@nuxt/content',
|
||||
'@nuxtjs/tailwindcss',
|
||||
'@nuxtjs/color-mode',
|
||||
'@nuxt/icon',
|
||||
'@vueuse/nuxt'
|
||||
],
|
||||
|
||||
// Content module configuration
|
||||
content: {
|
||||
documentDriven: true,
|
||||
highlight: {
|
||||
theme: {
|
||||
default: 'github-dark',
|
||||
dark: 'github-dark'
|
||||
},
|
||||
preload: [
|
||||
'bash',
|
||||
'shell',
|
||||
'yaml',
|
||||
'json',
|
||||
'markdown',
|
||||
'javascript',
|
||||
'typescript',
|
||||
'vue',
|
||||
'docker',
|
||||
'sql'
|
||||
]
|
||||
},
|
||||
markdown: {
|
||||
toc: {
|
||||
depth: 3,
|
||||
searchDepth: 3
|
||||
},
|
||||
anchorLinks: true
|
||||
},
|
||||
// Search configuration
|
||||
experimental: {
|
||||
search: {
|
||||
indexed: true
|
||||
experimental: { nativeSqlite: true },
|
||||
build: {
|
||||
markdown: {
|
||||
// Object syntax can be used to override default options
|
||||
remarkPlugins: {
|
||||
// Override remark-emoji options
|
||||
'remark-emoji': {
|
||||
options: {
|
||||
emoticon: true
|
||||
}
|
||||
},
|
||||
// Disable remark-gfm
|
||||
'remark-gfm': false,
|
||||
// Add remark-oembed
|
||||
'remark-oembed': {
|
||||
// Options
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// Color mode configuration
|
||||
colorMode: {
|
||||
classSuffix: '',
|
||||
preference: 'dark',
|
||||
fallback: 'dark'
|
||||
},
|
||||
|
||||
// Tailwind configuration
|
||||
tailwindcss: {
|
||||
exposeConfig: true,
|
||||
viewer: true,
|
||||
config: {
|
||||
darkMode: 'class',
|
||||
content: [
|
||||
'./components/**/*.{js,vue,ts}',
|
||||
'./layouts/**/*.vue',
|
||||
'./pages/**/*.vue',
|
||||
'./plugins/**/*.{js,ts}',
|
||||
'./app.vue'
|
||||
]
|
||||
}
|
||||
},
|
||||
|
||||
// App configuration
|
||||
app: {
|
||||
head: {
|
||||
charset: 'utf-8',
|
||||
viewport: 'width=device-width, initial-scale=1',
|
||||
title: 'Kompose Documentation',
|
||||
meta: [
|
||||
{ name: 'description', content: 'Complete documentation for Kompose - Your Docker Compose Symphony Conductor' },
|
||||
{ name: 'og:title', content: 'Kompose Documentation' },
|
||||
{ name: 'og:description', content: 'Complete documentation for Kompose - Your Docker Compose Symphony Conductor' },
|
||||
{ name: 'og:type', content: 'website' },
|
||||
{ name: 'twitter:card', content: 'summary_large_image' }
|
||||
],
|
||||
link: [
|
||||
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
|
||||
]
|
||||
}
|
||||
},
|
||||
|
||||
// Nitro configuration for static generation
|
||||
nitro: {
|
||||
prerender: {
|
||||
crawlLinks: true,
|
||||
routes: ['/']
|
||||
}
|
||||
},
|
||||
|
||||
// Build configuration
|
||||
build: {
|
||||
transpile: []
|
||||
},
|
||||
|
||||
// PWA configuration
|
||||
pwa: {
|
||||
manifest: {
|
||||
name: 'Kompose Docs',
|
||||
short_name: 'Kompose',
|
||||
description: 'Kompose Documentation',
|
||||
theme_color: '#f97316',
|
||||
background_color: '#0a0a0a'
|
||||
}
|
||||
}
|
||||
modules: [
|
||||
'@nuxt/content',
|
||||
'@nuxt/eslint',
|
||||
'@nuxt/image',
|
||||
'@nuxt/icon',
|
||||
'@nuxt/fonts',
|
||||
'@nuxt/scripts',
|
||||
'nuxt-zod-i18n',
|
||||
'@nuxtjs/i18n'
|
||||
],
|
||||
extends: ['docus']
|
||||
})
|
||||
|
||||
@@ -1,31 +1,40 @@
|
||||
{
|
||||
"name": "kompose-docs",
|
||||
"version": "1.0.0",
|
||||
"description": "Kompose Documentation Site",
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "nuxt dev",
|
||||
"build": "nuxt build",
|
||||
"build": "nuxt build --extend docus",
|
||||
"dev": "nuxt dev --extend docus",
|
||||
"generate": "nuxt generate",
|
||||
"preview": "nuxt preview",
|
||||
"postinstall": "nuxt prepare"
|
||||
},
|
||||
"dependencies": {
|
||||
"@nuxt/content": "^2.13.2",
|
||||
"@nuxtjs/color-mode": "^3.4.2",
|
||||
"@nuxtjs/tailwindcss": "^6.12.1",
|
||||
"nuxt": "^3.13.2",
|
||||
"vue": "^3.5.4",
|
||||
"vue-router": "^4.4.5"
|
||||
"@googlemaps/markerclusterer": "^2.6.2",
|
||||
"@nuxt/content": "3.7.1",
|
||||
"@nuxt/eslint": "1.9.0",
|
||||
"@nuxt/fonts": "0.11.4",
|
||||
"@nuxt/icon": "2.0.0",
|
||||
"@nuxt/image": "1.11.0",
|
||||
"@nuxt/scripts": "0.12.1",
|
||||
"@nuxtjs/i18n": "^10.1.0",
|
||||
"@unhead/vue": "^2.0.18",
|
||||
"docus": "^5.2.0",
|
||||
"eslint": "^9.37.0",
|
||||
"nuxt": "^4.1.3",
|
||||
"nuxt-zod-i18n": "^1.12.1",
|
||||
"remark-oembed": "^1.2.2",
|
||||
"vue": "^3.5.22",
|
||||
"vue-router": "^4.5.1",
|
||||
"zod": "^3.25.76",
|
||||
"zod-to-json-schema": "3.24.6"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@iconify-json/heroicons": "^1.2.0",
|
||||
"@iconify-json/lucide": "^1.2.4",
|
||||
"@nuxt/icon": "^1.5.2",
|
||||
"@tailwindcss/typography": "^0.5.15",
|
||||
"@vueuse/core": "^11.1.0",
|
||||
"@vueuse/nuxt": "^11.1.0"
|
||||
},
|
||||
"packageManager": "pnpm@9.0.0"
|
||||
"packageManager": "pnpm@10.13.1",
|
||||
"pnpm": {
|
||||
"onlyBuiltDependencies": [
|
||||
"@tailwindcss/oxide",
|
||||
"better-sqlite3",
|
||||
"vue-demi"
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,143 +0,0 @@
|
||||
<template>
|
||||
<div class="docs-page">
|
||||
<article class="prose prose-lg max-w-none">
|
||||
<ContentDoc v-slot="{ doc }">
|
||||
<div>
|
||||
<!-- Page header -->
|
||||
<div class="mb-8 pb-8 border-b border-dark-800">
|
||||
<h1 class="text-5xl font-bold gradient-text mb-4">
|
||||
{{ doc.title }}
|
||||
</h1>
|
||||
<p v-if="doc.description" class="text-xl text-gray-400">
|
||||
{{ doc.description }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- Content -->
|
||||
<ContentRenderer :value="doc" class="markdown-content" />
|
||||
|
||||
<!-- Navigation -->
|
||||
<div class="mt-16 pt-8 border-t border-dark-800 flex justify-between items-center">
|
||||
<NuxtLink
|
||||
v-if="doc.prev"
|
||||
:to="doc.prev.path"
|
||||
class="flex items-center gap-2 text-primary-400 hover:text-primary-300 transition-colors"
|
||||
>
|
||||
<Icon name="lucide:arrow-left" class="w-5 h-5" />
|
||||
<span>{{ doc.prev.title }}</span>
|
||||
</NuxtLink>
|
||||
<div v-else></div>
|
||||
|
||||
<NuxtLink
|
||||
v-if="doc.next"
|
||||
:to="doc.next.path"
|
||||
class="flex items-center gap-2 text-primary-400 hover:text-primary-300 transition-colors"
|
||||
>
|
||||
<span>{{ doc.next.title }}</span>
|
||||
<Icon name="lucide:arrow-right" class="w-5 h-5" />
|
||||
</NuxtLink>
|
||||
<div v-else></div>
|
||||
</div>
|
||||
</div>
|
||||
</ContentDoc>
|
||||
</article>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
definePageMeta({
|
||||
layout: 'default'
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.markdown-content :deep(h2) {
|
||||
@apply text-3xl font-bold text-white mt-12 mb-6 flex items-center gap-3;
|
||||
}
|
||||
|
||||
.markdown-content :deep(h2::before) {
|
||||
content: '';
|
||||
@apply w-1 h-8 bg-gradient-primary rounded;
|
||||
}
|
||||
|
||||
.markdown-content :deep(h3) {
|
||||
@apply text-2xl font-semibold text-white mt-8 mb-4;
|
||||
}
|
||||
|
||||
.markdown-content :deep(p) {
|
||||
@apply text-gray-300 leading-relaxed mb-6;
|
||||
}
|
||||
|
||||
.markdown-content :deep(ul),
|
||||
.markdown-content :deep(ol) {
|
||||
@apply space-y-2 mb-6;
|
||||
}
|
||||
|
||||
.markdown-content :deep(li) {
|
||||
@apply text-gray-300;
|
||||
}
|
||||
|
||||
.markdown-content :deep(code) {
|
||||
@apply bg-dark-800 text-primary-300 px-2 py-1 rounded text-sm font-mono;
|
||||
}
|
||||
|
||||
.markdown-content :deep(pre) {
|
||||
@apply bg-dark-900 border border-dark-700 rounded-lg p-6 overflow-x-auto mb-6 relative group;
|
||||
}
|
||||
|
||||
.markdown-content :deep(pre code) {
|
||||
@apply bg-transparent text-gray-300 p-0;
|
||||
}
|
||||
|
||||
.markdown-content :deep(blockquote) {
|
||||
@apply border-l-4 border-primary-500 pl-6 py-2 my-6 bg-dark-900/50 rounded-r-lg;
|
||||
}
|
||||
|
||||
.markdown-content :deep(blockquote p) {
|
||||
@apply text-gray-400 italic;
|
||||
}
|
||||
|
||||
.markdown-content :deep(a) {
|
||||
@apply text-primary-400 hover:text-primary-300 underline decoration-primary-500/30 hover:decoration-primary-400 transition-colors;
|
||||
}
|
||||
|
||||
.markdown-content :deep(table) {
|
||||
@apply w-full border-collapse mb-6;
|
||||
}
|
||||
|
||||
.markdown-content :deep(th) {
|
||||
@apply bg-dark-800 text-primary-400 font-semibold py-3 px-4 text-left border-b-2 border-primary-500/30;
|
||||
}
|
||||
|
||||
.markdown-content :deep(td) {
|
||||
@apply py-3 px-4 border-b border-dark-700;
|
||||
}
|
||||
|
||||
.markdown-content :deep(tr:hover) {
|
||||
@apply bg-white/5;
|
||||
}
|
||||
|
||||
.markdown-content :deep(img) {
|
||||
@apply rounded-lg shadow-glow-cyber my-6;
|
||||
}
|
||||
|
||||
.markdown-content :deep(.alert) {
|
||||
@apply p-4 rounded-lg mb-6 border-l-4;
|
||||
}
|
||||
|
||||
.markdown-content :deep(.alert-info) {
|
||||
@apply bg-blue-500/10 border-blue-500;
|
||||
}
|
||||
|
||||
.markdown-content :deep(.alert-warning) {
|
||||
@apply bg-yellow-500/10 border-yellow-500;
|
||||
}
|
||||
|
||||
.markdown-content :deep(.alert-danger) {
|
||||
@apply bg-red-500/10 border-red-500;
|
||||
}
|
||||
|
||||
.markdown-content :deep(.alert-success) {
|
||||
@apply bg-green-500/10 border-green-500;
|
||||
}
|
||||
</style>
|
||||
@@ -1,234 +0,0 @@
|
||||
<template>
|
||||
<div class="relative overflow-hidden">
|
||||
<!-- Hero section -->
|
||||
<section class="relative py-20 lg:py-32">
|
||||
<!-- Background decorations -->
|
||||
<div class="absolute top-0 left-1/4 hero-blob bg-primary-500/20 animate-float" style="animation-delay: 0s"></div>
|
||||
<div class="absolute bottom-0 right-1/4 hero-blob bg-accent-500/20 animate-float" style="animation-delay: 2s"></div>
|
||||
|
||||
<div class="container mx-auto px-4 relative z-10">
|
||||
<div class="max-w-4xl mx-auto text-center">
|
||||
<!-- Main heading with gradient -->
|
||||
<h1 class="text-6xl md:text-8xl font-black mb-6 gradient-text-hero">
|
||||
KOMPOSE
|
||||
</h1>
|
||||
|
||||
<p class="text-2xl md:text-3xl text-gray-300 mb-8 font-light">
|
||||
Your Docker Compose Symphony Conductor
|
||||
</p>
|
||||
|
||||
<p class="text-lg text-gray-400 mb-12 max-w-2xl mx-auto">
|
||||
Manage multiple Docker Compose stacks with style and grace.
|
||||
One command to rule them all, with beautiful output and powerful features.
|
||||
</p>
|
||||
|
||||
<!-- CTA Buttons -->
|
||||
<div class="flex flex-col sm:flex-row gap-4 justify-center items-center">
|
||||
<NuxtLink to="/docs" class="btn-primary text-lg px-8 py-4">
|
||||
<span class="flex items-center gap-2">
|
||||
<Icon name="lucide:book-open" class="w-5 h-5" />
|
||||
Get Started
|
||||
</span>
|
||||
</NuxtLink>
|
||||
|
||||
<NuxtLink to="/docs/quick-start" class="btn-ghost text-lg px-8 py-4">
|
||||
<span class="flex items-center gap-2">
|
||||
<Icon name="lucide:zap" class="w-5 h-5" />
|
||||
Quick Start
|
||||
</span>
|
||||
</NuxtLink>
|
||||
</div>
|
||||
|
||||
<!-- Installation command -->
|
||||
<div class="mt-12 glass-dark rounded-xl p-6 inline-block">
|
||||
<div class="flex items-center justify-between gap-4">
|
||||
<code class="text-primary-400 text-sm font-mono">
|
||||
git clone https://github.com/yourusername/kompose.git
|
||||
</code>
|
||||
<button @click="copyCommand" class="text-gray-400 hover:text-white transition-colors">
|
||||
<Icon :name="copied ? 'lucide:check' : 'lucide:copy'" class="w-5 h-5" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Features section -->
|
||||
<section class="py-20 relative">
|
||||
<div class="container mx-auto px-4">
|
||||
<div class="text-center mb-16">
|
||||
<h2 class="text-4xl md:text-5xl font-bold mb-4 gradient-text">
|
||||
Powerful Features
|
||||
</h2>
|
||||
<p class="text-xl text-gray-400">
|
||||
Everything you need to manage your Docker infrastructure
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
|
||||
<div v-for="feature in features" :key="feature.title"
|
||||
class="card-glow group hover:-translate-y-2">
|
||||
<div class="mb-4">
|
||||
<div class="w-12 h-12 rounded-lg bg-gradient-primary flex items-center justify-center">
|
||||
<Icon :name="feature.icon" class="w-6 h-6 text-white" />
|
||||
</div>
|
||||
</div>
|
||||
<h3 class="text-xl font-semibold text-white mb-3">
|
||||
{{ feature.title }}
|
||||
</h3>
|
||||
<p class="text-gray-400">
|
||||
{{ feature.description }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Code example section -->
|
||||
<section class="py-20 bg-dark-900/50">
|
||||
<div class="container mx-auto px-4">
|
||||
<div class="max-w-4xl mx-auto">
|
||||
<div class="text-center mb-12">
|
||||
<h2 class="text-4xl md:text-5xl font-bold mb-4 gradient-text">
|
||||
Simple Yet Powerful
|
||||
</h2>
|
||||
<p class="text-xl text-gray-400">
|
||||
Manage all your stacks with intuitive commands
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
|
||||
<div v-for="example in examples" :key="example.title" class="card-glass">
|
||||
<h3 class="text-lg font-semibold text-white mb-4 flex items-center gap-2">
|
||||
<Icon name="lucide:terminal" class="w-5 h-5 text-primary-400" />
|
||||
{{ example.title }}
|
||||
</h3>
|
||||
<pre class="bg-dark-950 p-4 rounded-lg overflow-x-auto">
|
||||
<code class="text-sm text-gray-300">{{ example.code }}</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="text-center mt-12">
|
||||
<NuxtLink to="/docs" class="btn-accent px-8 py-4">
|
||||
<span class="flex items-center gap-2">
|
||||
Explore Full Documentation
|
||||
<Icon name="lucide:arrow-right" class="w-5 h-5" />
|
||||
</span>
|
||||
</NuxtLink>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Stats section -->
|
||||
<section class="py-20">
|
||||
<div class="container mx-auto px-4">
|
||||
<div class="max-w-5xl mx-auto grid grid-cols-1 md:grid-cols-3 gap-8">
|
||||
<div v-for="stat in stats" :key="stat.label"
|
||||
class="text-center card-glass">
|
||||
<div class="text-5xl font-bold gradient-text mb-2">
|
||||
{{ stat.value }}
|
||||
</div>
|
||||
<div class="text-gray-400">
|
||||
{{ stat.label }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- CTA section -->
|
||||
<section class="py-20 relative">
|
||||
<div class="absolute inset-0 bg-gradient-hero opacity-10"></div>
|
||||
<div class="container mx-auto px-4 relative z-10">
|
||||
<div class="max-w-3xl mx-auto text-center">
|
||||
<h2 class="text-4xl md:text-5xl font-bold mb-6 text-white">
|
||||
Ready to Conduct Your Docker Symphony?
|
||||
</h2>
|
||||
<p class="text-xl text-gray-300 mb-8">
|
||||
Get started with Kompose today and simplify your Docker workflow
|
||||
</p>
|
||||
<NuxtLink to="/docs/installation" class="btn-primary text-lg px-8 py-4">
|
||||
<span class="flex items-center gap-2">
|
||||
<Icon name="lucide:download" class="w-5 h-5" />
|
||||
Install Now
|
||||
</span>
|
||||
</NuxtLink>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
|
||||
const copied = ref(false)
|
||||
|
||||
const features = [
|
||||
{
|
||||
title: 'Stack Management',
|
||||
icon: 'lucide:layers',
|
||||
description: 'Manage multiple Docker Compose stacks with pattern-based selection and bulk operations.'
|
||||
},
|
||||
{
|
||||
title: 'Database Operations',
|
||||
icon: 'lucide:database',
|
||||
description: 'Automated backups, smart imports, and database cleanup with PostgreSQL support.'
|
||||
},
|
||||
{
|
||||
title: 'Hooks System',
|
||||
icon: 'lucide:git-branch',
|
||||
description: 'Extend functionality with custom pre/post operation hooks for each stack.'
|
||||
},
|
||||
{
|
||||
title: 'Network Maestro',
|
||||
icon: 'lucide:network',
|
||||
description: 'Smart network management with CLI overrides and seamless Traefik integration.'
|
||||
},
|
||||
{
|
||||
title: 'Environment Control',
|
||||
icon: 'lucide:settings',
|
||||
description: 'Override environment variables on-the-fly without editing configuration files.'
|
||||
},
|
||||
{
|
||||
title: 'Beautiful Output',
|
||||
icon: 'lucide:sparkles',
|
||||
description: 'Color-coded logs, status indicators, and intuitive command-line interface.'
|
||||
}
|
||||
]
|
||||
|
||||
const examples = [
|
||||
{
|
||||
title: 'Start Everything',
|
||||
code: './kompose.sh "*" up -d'
|
||||
},
|
||||
{
|
||||
title: 'Export Databases',
|
||||
code: './kompose.sh "*" db:export'
|
||||
},
|
||||
{
|
||||
title: 'View Logs',
|
||||
code: './kompose.sh "blog,news" logs -f'
|
||||
},
|
||||
{
|
||||
title: 'Override Network',
|
||||
code: './kompose.sh --network staging "*" up'
|
||||
}
|
||||
]
|
||||
|
||||
const stats = [
|
||||
{ value: '10+', label: 'Production Stacks' },
|
||||
{ value: '100%', label: 'Bash Powered' },
|
||||
{ value: '1', label: 'Command to Rule Them All' }
|
||||
]
|
||||
|
||||
const copyCommand = () => {
|
||||
navigator.clipboard.writeText('git clone https://github.com/yourusername/kompose.git')
|
||||
copied.value = true
|
||||
setTimeout(() => {
|
||||
copied.value = false
|
||||
}, 2000)
|
||||
}
|
||||
</script>
|
||||
13416
Projects/kompose/docs/pnpm-lock.yaml
generated
Normal file
13416
Projects/kompose/docs/pnpm-lock.yaml
generated
Normal file
File diff suppressed because it is too large
Load Diff
3
Projects/kompose/docs/pnpm-workspace.yaml
Normal file
3
Projects/kompose/docs/pnpm-workspace.yaml
Normal file
@@ -0,0 +1,3 @@
|
||||
onlyBuiltDependencies:
|
||||
- '@tailwindcss/oxide'
|
||||
- vue-demi
|
||||
2
Projects/kompose/docs/public/_robots.txt
Normal file
2
Projects/kompose/docs/public/_robots.txt
Normal file
@@ -0,0 +1,2 @@
|
||||
User-Agent: *
|
||||
Disallow:
|
||||
BIN
Projects/kompose/docs/public/favicon.ico
Normal file
BIN
Projects/kompose/docs/public/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
@@ -1,168 +0,0 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
export default {
|
||||
darkMode: 'class',
|
||||
content: [
|
||||
'./components/**/*.{js,vue,ts}',
|
||||
'./layouts/**/*.vue',
|
||||
'./pages/**/*.vue',
|
||||
'./plugins/**/*.{js,ts}',
|
||||
'./app.vue',
|
||||
'./content/**/*.md'
|
||||
],
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
// Dark base colors
|
||||
dark: {
|
||||
50: '#f5f5f5',
|
||||
100: '#e7e7e7',
|
||||
200: '#d1d1d1',
|
||||
300: '#b0b0b0',
|
||||
400: '#888888',
|
||||
500: '#6d6d6d',
|
||||
600: '#5d5d5d',
|
||||
700: '#4f4f4f',
|
||||
800: '#454545',
|
||||
900: '#3d3d3d',
|
||||
950: '#0a0a0a',
|
||||
},
|
||||
// Orange primary colors (funky modern)
|
||||
primary: {
|
||||
50: '#fff7ed',
|
||||
100: '#ffedd5',
|
||||
200: '#fed7aa',
|
||||
300: '#fdba74',
|
||||
400: '#fb923c',
|
||||
500: '#f97316', // Main orange
|
||||
600: '#ea580c',
|
||||
700: '#c2410c',
|
||||
800: '#9a3412',
|
||||
900: '#7c2d12',
|
||||
950: '#431407',
|
||||
},
|
||||
// Purple accent colors
|
||||
accent: {
|
||||
50: '#faf5ff',
|
||||
100: '#f3e8ff',
|
||||
200: '#e9d5ff',
|
||||
300: '#d8b4fe',
|
||||
400: '#c084fc',
|
||||
500: '#a855f7', // Main purple
|
||||
600: '#9333ea',
|
||||
700: '#7e22ce',
|
||||
800: '#6b21a8',
|
||||
900: '#581c87',
|
||||
950: '#3b0764',
|
||||
},
|
||||
// Complementary colors
|
||||
cyber: {
|
||||
pink: '#ff0080',
|
||||
cyan: '#00f5ff',
|
||||
lime: '#39ff14'
|
||||
}
|
||||
},
|
||||
backgroundImage: {
|
||||
'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))',
|
||||
'gradient-conic': 'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))',
|
||||
'gradient-primary': 'linear-gradient(135deg, #f97316 0%, #fb923c 100%)',
|
||||
'gradient-accent': 'linear-gradient(135deg, #a855f7 0%, #c084fc 100%)',
|
||||
'gradient-hero': 'linear-gradient(135deg, #f97316 0%, #a855f7 50%, #7e22ce 100%)',
|
||||
'gradient-cyber': 'linear-gradient(135deg, #f97316 0%, #ff0080 50%, #a855f7 100%)',
|
||||
'gradient-dark': 'linear-gradient(180deg, #0a0a0a 0%, #1a1a1a 100%)',
|
||||
'gradient-shine': 'linear-gradient(90deg, transparent, rgba(249, 115, 22, 0.3), transparent)',
|
||||
},
|
||||
animation: {
|
||||
'gradient': 'gradient 8s linear infinite',
|
||||
'gradient-xy': 'gradient-xy 15s ease infinite',
|
||||
'shimmer': 'shimmer 2s linear infinite',
|
||||
'glow': 'glow 2s ease-in-out infinite alternate',
|
||||
'float': 'float 6s ease-in-out infinite',
|
||||
'pulse-slow': 'pulse 4s cubic-bezier(0.4, 0, 0.6, 1) infinite',
|
||||
},
|
||||
keyframes: {
|
||||
gradient: {
|
||||
'0%, 100%': {
|
||||
'background-size': '200% 200%',
|
||||
'background-position': 'left center'
|
||||
},
|
||||
'50%': {
|
||||
'background-size': '200% 200%',
|
||||
'background-position': 'right center'
|
||||
},
|
||||
},
|
||||
'gradient-xy': {
|
||||
'0%, 100%': {
|
||||
'background-size': '400% 400%',
|
||||
'background-position': 'left center'
|
||||
},
|
||||
'50%': {
|
||||
'background-size': '200% 200%',
|
||||
'background-position': 'right center'
|
||||
},
|
||||
},
|
||||
shimmer: {
|
||||
'0%': { transform: 'translateX(-100%)' },
|
||||
'100%': { transform: 'translateX(100%)' }
|
||||
},
|
||||
glow: {
|
||||
'from': {
|
||||
'text-shadow': '0 0 10px #f97316, 0 0 20px #f97316, 0 0 30px #f97316',
|
||||
},
|
||||
'to': {
|
||||
'text-shadow': '0 0 20px #a855f7, 0 0 30px #a855f7, 0 0 40px #a855f7',
|
||||
}
|
||||
},
|
||||
float: {
|
||||
'0%, 100%': { transform: 'translateY(0px)' },
|
||||
'50%': { transform: 'translateY(-20px)' }
|
||||
}
|
||||
},
|
||||
boxShadow: {
|
||||
'glow-orange': '0 0 20px rgba(249, 115, 22, 0.5)',
|
||||
'glow-purple': '0 0 20px rgba(168, 85, 247, 0.5)',
|
||||
'glow-cyber': '0 0 30px rgba(249, 115, 22, 0.3), 0 0 60px rgba(168, 85, 247, 0.3)',
|
||||
'inner-glow': 'inset 0 0 20px rgba(249, 115, 22, 0.2)',
|
||||
},
|
||||
typography: (theme) => ({
|
||||
DEFAULT: {
|
||||
css: {
|
||||
'--tw-prose-body': theme('colors.gray[300]'),
|
||||
'--tw-prose-headings': theme('colors.white'),
|
||||
'--tw-prose-links': theme('colors.primary[400]'),
|
||||
'--tw-prose-bold': theme('colors.white'),
|
||||
'--tw-prose-code': theme('colors.primary[300]'),
|
||||
'--tw-prose-pre-bg': theme('colors.dark[900]'),
|
||||
maxWidth: 'none',
|
||||
color: theme('colors.gray[300]'),
|
||||
a: {
|
||||
color: theme('colors.primary[400]'),
|
||||
'&:hover': {
|
||||
color: theme('colors.primary[500]'),
|
||||
},
|
||||
},
|
||||
'code::before': {
|
||||
content: '""'
|
||||
},
|
||||
'code::after': {
|
||||
content: '""'
|
||||
},
|
||||
code: {
|
||||
color: theme('colors.primary[300]'),
|
||||
backgroundColor: theme('colors.dark[800]'),
|
||||
padding: '0.25rem 0.5rem',
|
||||
borderRadius: '0.25rem',
|
||||
fontWeight: '500',
|
||||
},
|
||||
pre: {
|
||||
backgroundColor: theme('colors.dark[900]'),
|
||||
border: `1px solid ${theme('colors.dark[700]')}`,
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
plugins: [
|
||||
require('@tailwindcss/typography'),
|
||||
],
|
||||
}
|
||||
@@ -1,3 +1,18 @@
|
||||
{
|
||||
"extends": "./.nuxt/tsconfig.json"
|
||||
// https://nuxt.com/docs/guide/concepts/typescript
|
||||
"files": [],
|
||||
"references": [
|
||||
{
|
||||
"path": "./.nuxt/tsconfig.app.json"
|
||||
},
|
||||
{
|
||||
"path": "./.nuxt/tsconfig.server.json"
|
||||
},
|
||||
{
|
||||
"path": "./.nuxt/tsconfig.shared.json"
|
||||
},
|
||||
{
|
||||
"path": "./.nuxt/tsconfig.node.json"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user