webapp: reskin to shopdb-flask design system
Adopt the shopdb-flask visual language across the PXE webapp (presentation only, Flask/Jinja logic unchanged): - New static/pxe-theme.css: GE Aerospace palette (atmosphere-blue sidebar, sky-blue primary, avionics-green), Inter font stack, light/dark theming via data-theme + localStorage (key pxe-theme) with system-pref fallback, and card/button/table/form/badge/alert component styles layered over Bootstrap. - base.html: shopdb-style sidebar (logo + title, nav sections, footer light/dark toggle) + theme boot script. - All 13 content templates restyled to the new page-header + card/table/badge vocabulary; unattend_editor grouped per unattend-UX research. - Fixed a pre-existing CRITICAL bug found during review: nested <form>s in image_config.html made Adopt submit the delete form and Delete-selected post every orphan filename regardless of checkboxes; split into standalone forms wired via the form= attribute. Built by a Fable-orchestrated Opus workflow (17 agents). All 14 templates parse clean under Jinja2.
This commit is contained in:
cproudlock
@@ -1,129 +1,151 @@
|
||||
{% extends "base.html" %}
|
||||
{% block title %}startnet.cmd Editor - PXE Server Manager{% endblock %}
|
||||
|
||||
{% block extra_head %}
|
||||
<style>
|
||||
.cmd-editor {
|
||||
font-family: 'Consolas', 'Courier New', monospace;
|
||||
font-size: 0.9rem;
|
||||
min-height: 600px;
|
||||
height: 70vh;
|
||||
resize: vertical;
|
||||
background-color: #1e1e1e;
|
||||
color: #d4d4d4;
|
||||
border: 1px solid #333;
|
||||
padding: 1rem;
|
||||
tab-size: 4;
|
||||
white-space: pre;
|
||||
line-height: 1.5;
|
||||
}
|
||||
.cmd-editor:focus {
|
||||
outline: none;
|
||||
border-color: #0d6efd;
|
||||
box-shadow: 0 0 0 0.15rem rgba(13,110,253,.25);
|
||||
}
|
||||
.wim-info dt {
|
||||
font-weight: 600;
|
||||
color: #6c757d;
|
||||
}
|
||||
.wim-info dd {
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
</style>
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<h2 class="mb-0">startnet.cmd Editor</h2>
|
||||
</div>
|
||||
|
||||
{% if not wim_exists %}
|
||||
<div class="alert alert-warning">
|
||||
<strong>boot.wim not found</strong> at <code>{{ wim_path }}</code>.
|
||||
Run the PXE server setup playbook and import WinPE boot files first.
|
||||
</div>
|
||||
{% else %}
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-9">
|
||||
<div class="card">
|
||||
<div class="card-header d-flex justify-content-between align-items-center">
|
||||
<span>Windows\System32\startnet.cmd</span>
|
||||
<span class="badge bg-secondary">boot.wim</span>
|
||||
</div>
|
||||
<div class="card-body p-0">
|
||||
<form action="{{ url_for('startnet_save') }}" method="post" id="startnetForm">
|
||||
<input type="hidden" name="_csrf_token" value="{{ csrf_token() }}">
|
||||
<textarea name="content" class="form-control cmd-editor" id="cmdEditor"
|
||||
spellcheck="false">{{ content }}</textarea>
|
||||
</form>
|
||||
</div>
|
||||
<div class="card-footer d-flex justify-content-between align-items-center">
|
||||
<small class="text-muted">
|
||||
Editing the startnet.cmd inside <code>{{ wim_path }}</code>
|
||||
</small>
|
||||
<button type="submit" form="startnetForm" class="btn btn-primary">
|
||||
Save to boot.wim
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card mt-3">
|
||||
<div class="card-body">
|
||||
<h6 class="card-title">Common startnet.cmd Commands</h6>
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<code class="d-block mb-1">wpeinit</code>
|
||||
<small class="text-muted d-block mb-2">Initialize WinPE networking</small>
|
||||
<code class="d-block mb-1">net use Z: \\172.16.9.1\winpeapps</code>
|
||||
<small class="text-muted d-block mb-2">Map Samba share for deployment</small>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<code class="d-block mb-1">wpeutil WaitForNetwork</code>
|
||||
<small class="text-muted d-block mb-2">Wait for network to be ready</small>
|
||||
<code class="d-block mb-1">Z:\gea-standard\Deploy\Tools\deploy.cmd</code>
|
||||
<small class="text-muted d-block mb-2">Launch deployment script</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-3">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
WIM Info
|
||||
</div>
|
||||
<div class="card-body wim-info">
|
||||
<dl class="mb-0">
|
||||
{% for key, val in wim_info.items() %}
|
||||
{% if key in ['Image Count', 'Compression', 'Total Bytes', 'Image Name', 'Image Description'] %}
|
||||
<dt>{{ key }}</dt>
|
||||
<dd>{{ val }}</dd>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% if not wim_info %}
|
||||
<p class="text-muted mb-0">Could not read WIM info.</p>
|
||||
{% endif %}
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
{% block extra_scripts %}
|
||||
<script>
|
||||
// Tab key inserts a tab in the editor instead of moving focus
|
||||
document.getElementById('cmdEditor')?.addEventListener('keydown', function(e) {
|
||||
if (e.key === 'Tab') {
|
||||
e.preventDefault();
|
||||
var start = this.selectionStart;
|
||||
var end = this.selectionEnd;
|
||||
this.value = this.value.substring(0, start) + '\t' + this.value.substring(end);
|
||||
this.selectionStart = this.selectionEnd = start + 1;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
{% endblock %}
|
||||
{% extends "base.html" %}
|
||||
{% block title %}startnet.cmd Editor - PXE Server Manager{% endblock %}
|
||||
|
||||
{% block extra_head %}
|
||||
<style>
|
||||
.cmd-editor {
|
||||
font-family: 'Consolas', 'Courier New', monospace;
|
||||
font-size: 0.9rem;
|
||||
min-height: 600px;
|
||||
height: 70vh;
|
||||
resize: vertical;
|
||||
width: 100%;
|
||||
display: block;
|
||||
background-color: #1e1e1e;
|
||||
color: #d4d4d4;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 0.25rem;
|
||||
padding: 1rem;
|
||||
tab-size: 4;
|
||||
white-space: pre;
|
||||
line-height: 1.5;
|
||||
}
|
||||
.cmd-editor:focus {
|
||||
outline: none;
|
||||
border-color: var(--primary);
|
||||
box-shadow: 0 0 0 0.15rem rgba(65, 129, 255, 0.25);
|
||||
}
|
||||
.wim-info dl { margin: 0; }
|
||||
.wim-info dt {
|
||||
font-weight: 600;
|
||||
color: var(--text-light);
|
||||
font-size: 11px;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.04em;
|
||||
}
|
||||
.wim-info dd {
|
||||
margin: 0 0 0.65rem 0;
|
||||
color: var(--text);
|
||||
}
|
||||
.cmd-ref-item { margin-bottom: 0.85rem; }
|
||||
.cmd-ref-item code {
|
||||
display: block;
|
||||
margin-bottom: 0.2rem;
|
||||
word-break: break-all;
|
||||
}
|
||||
.cmd-ref-item small { color: var(--text-light); }
|
||||
</style>
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="page-header">
|
||||
<h2>startnet.cmd Editor</h2>
|
||||
{% if wim_exists %}
|
||||
<div class="header-actions">
|
||||
<button type="submit" form="startnetForm" class="pxe-btn pxe-btn-primary">
|
||||
<i class="bi bi-save"></i> Save to boot.wim
|
||||
</button>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{% if not wim_exists %}
|
||||
<div class="alert alert-warning">
|
||||
<strong>boot.wim not found</strong> at <code>{{ wim_path }}</code>.
|
||||
Run the PXE server setup playbook and import WinPE boot files first.
|
||||
</div>
|
||||
{% else %}
|
||||
|
||||
<div class="row">
|
||||
<div class="col-lg-9">
|
||||
<div class="pxe-card">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<span class="mono"><i class="bi bi-terminal"></i> Windows\System32\startnet.cmd</span>
|
||||
<span class="badge badge-secondary">boot.wim</span>
|
||||
</div>
|
||||
<form action="{{ url_for('startnet_save') }}" method="post" id="startnetForm">
|
||||
<input type="hidden" name="_csrf_token" value="{{ csrf_token() }}">
|
||||
<textarea name="content" class="cmd-editor" id="cmdEditor"
|
||||
spellcheck="false">{{ content }}</textarea>
|
||||
</form>
|
||||
<div class="d-flex justify-content-between align-items-center mt-3">
|
||||
<small class="text-muted">
|
||||
Editing the startnet.cmd inside <code>{{ wim_path }}</code>
|
||||
</small>
|
||||
<button type="submit" form="startnetForm" class="pxe-btn pxe-btn-primary">
|
||||
<i class="bi bi-save"></i> Save to boot.wim
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section-card">
|
||||
<div class="section-title">Common startnet.cmd Commands</div>
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="cmd-ref-item">
|
||||
<code>wpeinit</code>
|
||||
<small>Initialize WinPE networking</small>
|
||||
</div>
|
||||
<div class="cmd-ref-item">
|
||||
<code>net use Z: \\172.16.9.1\winpeapps</code>
|
||||
<small>Map Samba share for deployment</small>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="cmd-ref-item">
|
||||
<code>wpeutil WaitForNetwork</code>
|
||||
<small>Wait for network to be ready</small>
|
||||
</div>
|
||||
<div class="cmd-ref-item">
|
||||
<code>Z:\gea-standard\Deploy\Tools\deploy.cmd</code>
|
||||
<small>Launch deployment script</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-3">
|
||||
<div class="section-card wim-info">
|
||||
<div class="section-title">WIM Info</div>
|
||||
<dl>
|
||||
{% for key, val in wim_info.items() %}
|
||||
{% if key in ['Image Count', 'Compression', 'Total Bytes', 'Image Name', 'Image Description'] %}
|
||||
<dt>{{ key }}</dt>
|
||||
<dd>{{ val }}</dd>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
{% if not wim_info %}
|
||||
<p class="text-muted mb-0">Could not read WIM info.</p>
|
||||
{% endif %}
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
{% block extra_scripts %}
|
||||
<script>
|
||||
// Tab key inserts a tab in the editor instead of moving focus
|
||||
document.getElementById('cmdEditor')?.addEventListener('keydown', function(e) {
|
||||
if (e.key === 'Tab') {
|
||||
e.preventDefault();
|
||||
var start = this.selectionStart;
|
||||
var end = this.selectionEnd;
|
||||
this.value = this.value.substring(0, start) + '\t' + this.value.substring(end);
|
||||
this.selectionStart = this.selectionEnd = start + 1;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
||||
Reference in New Issue
Block a user