c48cd87d16
Some checks failed
Build Multi-Arch Container Image / test (push) Has been cancelled
Build Multi-Arch Container Image / build-and-push (push) Has been cancelled
Build Multi-Arch Container Image / security-scan (push) Has been cancelled
Build Multi-Arch Container Image / deploy-staging (push) Has been cancelled
Build Multi-Arch Container Image / deploy-production (push) Has been cancelled
Nightly Build / notify-results (push) Has been cancelled
Nightly Build / check-changes (push) Has been cancelled
Nightly Build / nightly-tests (3.10) (push) Has been cancelled
Nightly Build / nightly-tests (3.11) (push) Has been cancelled
Nightly Build / nightly-tests (3.12) (push) Has been cancelled
Nightly Build / nightly-tests (3.8) (push) Has been cancelled
Nightly Build / nightly-tests (3.9) (push) Has been cancelled
Nightly Build / build-nightly (push) Has been cancelled
Nightly Build / performance-test (push) Has been cancelled
Nightly Build / security-scan-nightly (push) Has been cancelled
Nightly Build / cleanup-old-nightlies (push) Has been cancelled
509 lines
23 KiB
HTML
509 lines
23 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta name="description" content="{{ app_name }} — Systemd unit file creator with templates, validation, and a visual editor." />
|
|
<title>{{ app_name }} - Systemd Unit File Creator</title>
|
|
<link rel="icon" type="image/svg+xml" href="/static/img/favicon.svg" />
|
|
<link
|
|
rel="icon"
|
|
type="image/svg+xml"
|
|
sizes="16x16"
|
|
href="/static/img/favicon-16x16.svg"
|
|
/>
|
|
<link rel="alternate icon" href="/static/img/favicon.svg" />
|
|
<link rel="apple-touch-icon" href="/static/img/icon-192x192.svg" />
|
|
<link rel="manifest" href="/static/img/site.webmanifest" />
|
|
<meta name="theme-color" content="#0d6efd" />
|
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
|
<meta name="mobile-web-app-capable" content="yes" />
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
|
|
<meta name="apple-mobile-web-app-title" content="{{ app_name }}" />
|
|
<script>
|
|
(function () {
|
|
const storageKey = 'unitforge-theme';
|
|
try {
|
|
const stored = localStorage.getItem(storageKey);
|
|
const theme = stored === 'light' || stored === 'dark' ? stored : 'system';
|
|
const root = document.documentElement;
|
|
root.setAttribute('data-theme-preference', theme);
|
|
|
|
if (theme === 'light' || theme === 'dark') {
|
|
root.setAttribute('data-theme', theme);
|
|
} else {
|
|
root.removeAttribute('data-theme');
|
|
}
|
|
|
|
const meta = document.querySelector('meta[name="theme-color"]');
|
|
if (meta) {
|
|
const prefersDark = typeof window !== 'undefined' &&
|
|
window.matchMedia &&
|
|
window.matchMedia('(prefers-color-scheme: dark)').matches;
|
|
const appliedTheme = theme === 'system' ? (prefersDark ? 'dark' : 'light') : theme;
|
|
meta.setAttribute('content', appliedTheme === 'dark' ? '#0b1120' : '#0d6efd');
|
|
}
|
|
} catch (error) {
|
|
console.warn('Theme bootstrap failed:', error);
|
|
}
|
|
})();
|
|
</script>
|
|
<link href="/static/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
|
|
<link rel="stylesheet" href="/static/vendor/fontawesome/css/all.min.css" />
|
|
<link href="/static/css/style.css" rel="stylesheet" />
|
|
</head>
|
|
<body>
|
|
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
|
|
<div class="container">
|
|
<a class="navbar-brand" href="/">
|
|
<i class="fas fa-cogs me-2"></i>{{ app_name }}
|
|
</a>
|
|
<button
|
|
class="navbar-toggler"
|
|
type="button"
|
|
data-bs-toggle="collapse"
|
|
data-bs-target="#navbarNav"
|
|
>
|
|
<span class="navbar-toggler-icon"></span>
|
|
</button>
|
|
<div class="collapse navbar-collapse" id="navbarNav">
|
|
<ul class="navbar-nav me-auto">
|
|
<li class="nav-item">
|
|
<a class="nav-link active" href="/">Home</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="/editor">Editor</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="/templates">Templates</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="/cli">CLI</a>
|
|
</li>
|
|
</ul>
|
|
<ul class="navbar-nav align-items-lg-center gap-2 mt-3 mt-lg-0 ms-lg-3">
|
|
<li class="nav-item dropdown">
|
|
<button
|
|
class="btn btn-outline-light dropdown-toggle w-100 w-lg-auto"
|
|
id="themeDropdown"
|
|
type="button"
|
|
data-bs-toggle="dropdown"
|
|
aria-expanded="false"
|
|
data-theme-toggle
|
|
>
|
|
<i class="fas fa-circle-half-stroke me-2" data-theme-icon></i>
|
|
<span data-theme-label>System</span>
|
|
</button>
|
|
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="themeDropdown">
|
|
<li>
|
|
<button
|
|
class="dropdown-item d-flex align-items-center"
|
|
type="button"
|
|
data-theme-option="light"
|
|
role="menuitemradio"
|
|
aria-checked="false"
|
|
>
|
|
<i class="fas fa-sun me-2 text-warning"></i>
|
|
Light
|
|
</button>
|
|
</li>
|
|
<li>
|
|
<button
|
|
class="dropdown-item d-flex align-items-center"
|
|
type="button"
|
|
data-theme-option="dark"
|
|
role="menuitemradio"
|
|
aria-checked="false"
|
|
>
|
|
<i class="fas fa-moon me-2 text-info"></i>
|
|
Dark
|
|
</button>
|
|
</li>
|
|
<li>
|
|
<button
|
|
class="dropdown-item d-flex align-items-center"
|
|
type="button"
|
|
data-theme-option="system"
|
|
role="menuitemradio"
|
|
aria-checked="true"
|
|
>
|
|
<i class="fas fa-circle-half-stroke me-2 text-secondary"></i>
|
|
System
|
|
</button>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a
|
|
class="nav-link"
|
|
href="{{ api_docs_url }}"
|
|
target="_blank"
|
|
>
|
|
<i class="fas fa-book me-1"></i>API Docs
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<div class="hero-section bg-light py-5">
|
|
<div class="container">
|
|
<div class="row align-items-center">
|
|
<div class="col-lg-6">
|
|
<h1 class="display-4 fw-bold mb-3">{{ app_name }}</h1>
|
|
<p class="lead mb-4">
|
|
{{ app_description }}. Whether you're deploying web
|
|
services, scheduling tasks, or managing containers,
|
|
{{ app_name }} provides the tools you need.
|
|
</p>
|
|
<div class="d-flex gap-3">
|
|
<a href="/editor" class="btn btn-primary btn-lg">
|
|
<i class="fas fa-edit me-2"></i>Start Creating
|
|
</a>
|
|
<a
|
|
href="/templates"
|
|
class="btn btn-outline-primary btn-lg"
|
|
>
|
|
<i class="fas fa-templates me-2"></i>Browse
|
|
Templates
|
|
</a>
|
|
<a href="/cli" class="btn btn-outline-secondary btn-sm">
|
|
<i class="fas fa-terminal me-1"></i>Try the CLI
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<div
|
|
class="code-preview bg-dark text-light p-4 rounded"
|
|
>
|
|
<div class="d-flex align-items-center mb-3">
|
|
<i class="fas fa-file-code me-2"></i>
|
|
<span class="fw-bold">myapp.service</span>
|
|
</div>
|
|
<pre class="mb-0"><code>[Unit]
|
|
Description=My Web Application
|
|
After=network.target
|
|
|
|
[Service]
|
|
Type=simple
|
|
ExecStart=/usr/bin/node /opt/myapp/server.js
|
|
User=myapp
|
|
Group=myapp
|
|
Restart=on-failure
|
|
WorkingDirectory=/opt/myapp
|
|
|
|
[Install]
|
|
WantedBy=multi-user.target</code></pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container my-5">
|
|
<div class="row">
|
|
<div class="col-lg-8 mx-auto text-center mb-5">
|
|
<h2 class="h1 mb-3">Choose Your Approach</h2>
|
|
<p class="lead">
|
|
{{ app_name }} offers multiple ways to create systemd
|
|
unit files, from quick templates to detailed manual
|
|
editing.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row g-4 mb-5">
|
|
<div class="col-md-6 col-lg-3">
|
|
<div class="card h-100 border-0 shadow-sm hover-lift">
|
|
<div class="card-body text-center">
|
|
<div
|
|
class="feature-icon bg-primary bg-gradient rounded-circle mx-auto mb-3"
|
|
>
|
|
<i class="fas fa-magic text-white"></i>
|
|
</div>
|
|
<h3 class="card-title h5">Quick Templates</h3>
|
|
<p class="card-text text-muted">
|
|
Use pre-built templates for common services like
|
|
web apps, databases, and containers.
|
|
</p>
|
|
<a
|
|
href="/templates"
|
|
class="btn btn-outline-primary"
|
|
>
|
|
Browse Templates
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-6 col-lg-3">
|
|
<div class="card h-100 border-0 shadow-sm hover-lift">
|
|
<div class="card-body text-center">
|
|
<div
|
|
class="feature-icon bg-success bg-gradient rounded-circle mx-auto mb-3"
|
|
>
|
|
<i class="fas fa-edit text-white"></i>
|
|
</div>
|
|
<h3 class="card-title h5">Visual Editor</h3>
|
|
<p class="card-text text-muted">
|
|
Create and edit unit files with our intuitive
|
|
form-based editor with real-time validation.
|
|
</p>
|
|
<a href="/editor" class="btn btn-success">
|
|
Open Editor
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-6 col-lg-3">
|
|
<div class="card h-100 border-0 shadow-sm hover-lift">
|
|
<div class="card-body text-center">
|
|
<div
|
|
class="feature-icon bg-warning bg-gradient rounded-circle mx-auto mb-3"
|
|
>
|
|
<i class="fas fa-check-circle text-white"></i>
|
|
</div>
|
|
<h3 class="card-title h5">Validation</h3>
|
|
<p class="card-text text-muted">
|
|
Validate existing unit files and get detailed
|
|
feedback on syntax and best practices.
|
|
</p>
|
|
<button
|
|
class="btn btn-outline-warning"
|
|
onclick="showUploadModal()"
|
|
>
|
|
Validate File
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-6 col-lg-3">
|
|
<div class="card h-100 border-0 shadow-sm hover-lift">
|
|
<div class="card-body text-center">
|
|
<div
|
|
class="feature-icon bg-info bg-gradient rounded-circle mx-auto mb-3"
|
|
>
|
|
<i class="fas fa-terminal text-white"></i>
|
|
</div>
|
|
<h3 class="card-title h5">CLI Tool</h3>
|
|
<p class="card-text text-muted">
|
|
Use the command-line interface for automation
|
|
and integration with your development workflow.
|
|
</p>
|
|
<button
|
|
class="btn btn-outline-info"
|
|
onclick="showCliModal()"
|
|
>
|
|
View CLI
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-lg-8 mx-auto">
|
|
<div class="text-center mb-4">
|
|
<h3>Supported Unit Types</h3>
|
|
<p>
|
|
{{ app_name }} supports all major systemd unit types
|
|
</p>
|
|
</div>
|
|
|
|
<div class="row g-3">
|
|
<div class="col-6 col-md-4">
|
|
<div class="unit-type-badge">
|
|
<i class="fas fa-play-circle me-2"></i>Service
|
|
</div>
|
|
</div>
|
|
<div class="col-6 col-md-4">
|
|
<div class="unit-type-badge">
|
|
<i class="fas fa-clock me-2"></i>Timer
|
|
</div>
|
|
</div>
|
|
<div class="col-6 col-md-4">
|
|
<div class="unit-type-badge">
|
|
<i class="fas fa-plug me-2"></i>Socket
|
|
</div>
|
|
</div>
|
|
<div class="col-6 col-md-4">
|
|
<div class="unit-type-badge">
|
|
<i class="fas fa-hdd me-2"></i>Mount
|
|
</div>
|
|
</div>
|
|
<div class="col-6 col-md-4">
|
|
<div class="unit-type-badge">
|
|
<i class="fas fa-bullseye me-2"></i>Target
|
|
</div>
|
|
</div>
|
|
<div class="col-6 col-md-4">
|
|
<div class="unit-type-badge">
|
|
<i class="fas fa-folder me-2"></i>Path
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Upload Modal -->
|
|
<div class="modal fade" id="uploadModal" tabindex="-1">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">
|
|
<i class="fas fa-upload me-2"></i>Validate Unit File
|
|
</h5>
|
|
<button
|
|
type="button"
|
|
class="btn-close"
|
|
data-bs-dismiss="modal"
|
|
></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="mb-3">
|
|
<label for="fileInput" class="form-label"
|
|
>Select unit file to validate:</label
|
|
>
|
|
<input
|
|
type="file"
|
|
class="form-control"
|
|
id="fileInput"
|
|
accept=".service,.timer,.socket,.mount,.target,.path"
|
|
/>
|
|
</div>
|
|
<div id="uploadResults" class="d-none">
|
|
<h6>Validation Results:</h6>
|
|
<div id="validationOutput"></div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button
|
|
type="button"
|
|
class="btn btn-secondary"
|
|
data-bs-dismiss="modal"
|
|
>
|
|
Close
|
|
</button>
|
|
<button
|
|
type="button"
|
|
class="btn btn-primary"
|
|
onclick="validateFile()"
|
|
>
|
|
<i class="fas fa-check me-2"></i>Validate
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- CLI Modal -->
|
|
<div class="modal fade" id="cliModal" tabindex="-1">
|
|
<div class="modal-dialog modal-lg">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">
|
|
<i class="fas fa-terminal me-2"></i>CLI Usage
|
|
</h5>
|
|
<button
|
|
type="button"
|
|
class="btn-close"
|
|
data-bs-dismiss="modal"
|
|
></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<h6>Installation:</h6>
|
|
<pre
|
|
class="bg-dark text-light p-3 rounded"
|
|
><code>pip install -e .</code></pre>
|
|
|
|
<h6 class="mt-4">Common Commands:</h6>
|
|
<pre
|
|
class="bg-dark text-light p-3 rounded"
|
|
><code># Create a new service
|
|
unitforge create --type service --name myapp --exec-start "/usr/bin/myapp"
|
|
|
|
# Validate a unit file
|
|
unitforge validate /etc/systemd/system/myapp.service
|
|
|
|
# Generate from template
|
|
unitforge template generate webapp --interactive
|
|
|
|
# List available templates
|
|
unitforge template list</code></pre>
|
|
|
|
<h6 class="mt-4">Template Usage:</h6>
|
|
<pre
|
|
class="bg-dark text-light p-3 rounded"
|
|
><code># Generate web app service
|
|
unitforge template generate webapp \
|
|
--param name=mywebapp \
|
|
--param exec_start="/usr/bin/node server.js" \
|
|
--param user=www-data \
|
|
--param working_directory=/opt/mywebapp</code></pre>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button
|
|
type="button"
|
|
class="btn btn-secondary"
|
|
data-bs-dismiss="modal"
|
|
>
|
|
Close
|
|
</button>
|
|
<a
|
|
href="{{ api_docs_url }}"
|
|
class="btn btn-primary"
|
|
target="_blank"
|
|
>
|
|
<i class="fas fa-book me-2"></i>Full Documentation
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<footer class="bg-dark text-light py-4 mt-5">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-6">
|
|
<p class="fw-bold mb-0"><i class="fas fa-cogs me-2"></i>{{ app_name }}</p>
|
|
<p class="text-muted small">{{ app_description }}.</p>
|
|
</div>
|
|
<div class="col-md-6 text-md-end">
|
|
<div class="d-flex justify-content-md-end gap-3">
|
|
<a
|
|
href="{{ api_docs_url }}"
|
|
class="text-light text-decoration-none"
|
|
>
|
|
<i class="fas fa-book me-1"></i>API Docs
|
|
</a>
|
|
<a
|
|
href="{{ github_url }}"
|
|
class="text-light text-decoration-none"
|
|
>
|
|
<i class="fab fa-github me-1"></i>GitHub
|
|
</a>
|
|
</div>
|
|
<div class="mt-2 small">
|
|
<span class="me-2">
|
|
<i class="fas fa-code-branch me-1"></i>Open Source
|
|
<span class="badge bg-success ms-2">OSI</span>
|
|
</span>
|
|
<span>
|
|
Licensed under
|
|
<a href="https://www.gnu.org/licenses/gpl-3.0.en.html" target="_blank" rel="noopener" class="text-decoration-underline text-light">GPL-3.0-or-later</a>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<script src="/static/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
|
|
<script src="/static/js/main.js"></script>
|
|
</body>
|
|
</html>
|