anobre/openshift-resource-governance
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve modal design: remove gradient, fix kubectl to oc, add YAML note

Browse Source
This commit is contained in:
Anderson
2025-10-02 08:53:52 -03:00
parent 22385af77e
commit 086b42dd6c
1 changed files with 8 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
app/static/index.html
View File

@@ -1602,7 +1602,7 @@
${rec.kubectl_commands && rec.kubectl_commands.length > 0 ? ` ${rec.kubectl_commands && rec.kubectl_commands.length > 0 ? `
<div style="margin-bottom: 1rem;"> <div style="margin-bottom: 1rem;">
<h4 style="color: #2c3e50; margin-bottom: 0.5rem; font-size: 1rem;">Kubectl Commands:</h4> <h4 style="color: #2c3e50; margin-bottom: 0.5rem; font-size: 1rem;">OpenShift Commands:</h4>
<div style="background: #f8f9fa; border: 1px solid #dee2e6; border-radius: 4px; padding: 0.75rem; font-family: 'Courier New', monospace; font-size: 0.9rem;"> <div style="background: #f8f9fa; border: 1px solid #dee2e6; border-radius: 4px; padding: 0.75rem; font-family: 'Courier New', monospace; font-size: 0.9rem;">
${rec.kubectl_commands.map(cmd => `<div style="margin-bottom: 0.5rem;">${cmd}</div>`).join('')} ${rec.kubectl_commands.map(cmd => `<div style="margin-bottom: 0.5rem;">${cmd}</div>`).join('')}
</div> </div>
@@ -2041,7 +2041,7 @@
if (!rec) return; if (!rec) return;
let modalContent = ` let modalContent = `
<div class="modal-header" style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; padding: 2rem; position: relative;"> <div class="modal-header" style="background: #f8f9fa; color: #2c3e50; padding: 2rem; position: relative; border-bottom: 1px solid #dee2e6;">
<h2 style="margin: 0; font-size: 1.5rem; font-weight: 600;">📋 Recommendation Details</h2> <h2 style="margin: 0; font-size: 1.5rem; font-weight: 600;">📋 Recommendation Details</h2>
<span class="close" onclick="closeModal()">&times;</span> <span class="close" onclick="closeModal()">&times;</span>
</div> </div>
@@ -2067,10 +2067,15 @@
` : ''} ` : ''}
${rec.kubectl_commands && rec.kubectl_commands.length > 0 ? ` ${rec.kubectl_commands && rec.kubectl_commands.length > 0 ? `
<h4 style="color: #2c3e50; margin-bottom: 1rem;">Kubectl Commands</h4> <h4 style="color: #2c3e50; margin-bottom: 1rem;">OpenShift Commands</h4>
<div style="background: #f8f9fa; border: 1px solid #dee2e6; border-radius: 4px; padding: 1rem; margin-bottom: 2rem; font-family: 'Courier New', monospace; font-size: 0.9rem;"> <div style="background: #f8f9fa; border: 1px solid #dee2e6; border-radius: 4px; padding: 1rem; margin-bottom: 2rem; font-family: 'Courier New', monospace; font-size: 0.9rem;">
${rec.kubectl_commands.map(cmd => `<div style="margin-bottom: 0.5rem;">${cmd}</div>`).join('')} ${rec.kubectl_commands.map(cmd => `<div style="margin-bottom: 0.5rem;">${cmd}</div>`).join('')}
</div> </div>
<div style="background: #e3f2fd; border: 1px solid #2196f3; border-radius: 4px; padding: 1rem; margin-bottom: 2rem;">
<p style="margin: 0; color: #1565c0; font-size: 0.9rem;">
<strong>💡 Note:</strong> To get the VPA YAML file, click the "📄 VPA YAML" button in the recommendation card.
</p>
</div>
` : ''} ` : ''}
<div style="text-align: center; margin-top: 2rem;"> <div style="text-align: center; margin-top: 2rem;">