GE-Enforce is a large operational surface (manifest authoring + fleet compliance), not a setting, and it was squished in the settings two-pane shell. Promote it to a dedicated full-width top-level section: - New sidebar entry "GE-Enforce" (plugin get_navigation_items, shield icon, auto-gated to the enabled plugin) instead of two Settings > Integrations cards. - Tabbed shell GeEnforceLayout.vue (Manifests | Enforcement Reports) with full-width children under AppLayout, not the narrow settings rail. - Views moved settings/ -> geenforce/ (ManifestEditor.vue, EnforcementReports.vue). Theming + overflow fixes (the "chaotic / cut off / different inputs" report): - Inputs/selects/textareas now match the stock settings look (border, radius, --bg, focus color) instead of browser defaults. - No horizontal overflow: editor grid uses minmax(0,1fr) + min-width:0 on children, collapses to one column under 1000px; entry table and reports table scroll inside their own overflow-x containers; detail actions wrap. Verified at 1280px: no page overflow, detail pane + tables fit. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
44 lines
1.3 KiB
Vue
44 lines
1.3 KiB
Vue
<template>
|
|
<div class="geenforce-section">
|
|
<div class="section-header">
|
|
<h1>GE-Enforce</h1>
|
|
<p class="section-sub">Desired-state install manifests for imaging PC types, and the fleet's reported results.</p>
|
|
</div>
|
|
<nav class="section-tabs">
|
|
<router-link to="/geenforce/manifests" class="tab">Manifests</router-link>
|
|
<router-link to="/geenforce/reports" class="tab">Enforcement Reports</router-link>
|
|
</nav>
|
|
<router-view />
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
// Tabbed shell for the GE-Enforce section. Children render the manifest editor
|
|
// and the fleet-compliance reports full-width (not squeezed into the settings rail).
|
|
</script>
|
|
|
|
<style scoped>
|
|
.geenforce-section { max-width: 1400px; }
|
|
.section-header { margin-bottom: 0.5rem; }
|
|
.section-header h1 { margin: 0; }
|
|
.section-sub { color: var(--text-light); margin: 0.25rem 0 0; }
|
|
.section-tabs {
|
|
display: flex;
|
|
gap: 0.25rem;
|
|
border-bottom: 1px solid var(--border);
|
|
margin: 1rem 0 1.25rem;
|
|
}
|
|
.tab {
|
|
padding: 0.5rem 0.9rem;
|
|
text-decoration: none;
|
|
color: var(--text-light);
|
|
border-bottom: 2px solid transparent;
|
|
font-weight: 500;
|
|
}
|
|
.tab:hover { color: var(--text); }
|
|
.tab.router-link-active {
|
|
color: var(--primary);
|
|
border-bottom-color: var(--primary);
|
|
}
|
|
</style>
|