84 lines
4.0 KiB
HTML
84 lines
4.0 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}New Instance - OPNsense Backup Manager{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="max-w-3xl mx-auto">
|
|
<div class="mb-8">
|
|
<h1 class="text-3xl font-bold text-neutral-100 mb-2">Add New OPNsense Instance</h1>
|
|
<p class="text-neutral-400">Create a new instance to start receiving backups</p>
|
|
</div>
|
|
|
|
<div class="bg-neutral-800 rounded-lg border border-neutral-700 p-6">
|
|
<form method="POST" action="{{ url_for('new_instance') }}" class="space-y-6">
|
|
<div>
|
|
<label for="name" class="block text-sm font-medium text-neutral-300 mb-2">
|
|
Instance Name <span class="text-red-400">*</span>
|
|
</label>
|
|
<input
|
|
type="text"
|
|
id="name"
|
|
name="name"
|
|
required
|
|
class="w-full px-4 py-2 bg-neutral-700 border border-neutral-600 rounded-md text-neutral-100 placeholder-neutral-400 focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent"
|
|
placeholder="e.g., Main Router, Office Firewall"
|
|
>
|
|
<p class="mt-1 text-sm text-neutral-400">A friendly name for this instance</p>
|
|
</div>
|
|
|
|
<div>
|
|
<label for="identifier" class="block text-sm font-medium text-neutral-300 mb-2">
|
|
Identifier <span class="text-red-400">*</span>
|
|
</label>
|
|
<input
|
|
type="text"
|
|
id="identifier"
|
|
name="identifier"
|
|
required
|
|
pattern="[a-z0-9-_]+"
|
|
class="w-full px-4 py-2 bg-neutral-700 border border-neutral-600 rounded-md text-neutral-100 placeholder-neutral-400 focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent"
|
|
placeholder="e.g., main-router, office-fw"
|
|
>
|
|
<p class="mt-1 text-sm text-neutral-400">Unique identifier (lowercase, alphanumeric, dashes, underscores only). This will be used as the SFTP username.</p>
|
|
</div>
|
|
|
|
<div>
|
|
<label for="description" class="block text-sm font-medium text-neutral-300 mb-2">
|
|
Description
|
|
</label>
|
|
<textarea
|
|
id="description"
|
|
name="description"
|
|
rows="3"
|
|
class="w-full px-4 py-2 bg-neutral-700 border border-neutral-600 rounded-md text-neutral-100 placeholder-neutral-400 focus:outline-none focus:ring-2 focus:ring-orange-500 focus:border-transparent"
|
|
placeholder="Optional description for this instance"
|
|
></textarea>
|
|
</div>
|
|
|
|
<div class="flex justify-end space-x-4 pt-4">
|
|
<a href="{{ url_for('instances') }}" class="px-4 py-2 bg-neutral-700 hover:bg-neutral-600 text-white font-medium rounded-md transition-colors duration-200">
|
|
Cancel
|
|
</a>
|
|
<button
|
|
type="submit"
|
|
class="px-4 py-2 bg-orange-500 hover:bg-orange-600 text-white font-medium rounded-md transition-colors duration-200"
|
|
>
|
|
Create Instance
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="mt-6 bg-neutral-800 rounded-lg border border-neutral-700 p-6">
|
|
<h3 class="text-lg font-semibold text-neutral-100 mb-4">What happens next?</h3>
|
|
<ol class="list-decimal list-inside space-y-2 text-neutral-300">
|
|
<li>An SSH key pair will be automatically generated for this instance</li>
|
|
<li>You'll be provided with the public key to add to your OPNsense configuration</li>
|
|
<li>Use the instance identifier as the SFTP username when configuring OPNsense</li>
|
|
<li>Backups will be automatically stored and tracked</li>
|
|
</ol>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|