fix(ui): remove unwanted model dropdowns and standardize hermes modal

- Remove automatic model dropdown creation that was breaking blog layout
- Update Hermes modal to use 95vw sizing like other modals
- Add showModal() and backdrop click handling for consistency
- Use transform-based centering for proper mobile positioning
- All modals now have consistent sizing and behavior
This commit is contained in:
Russell Ballestrini 2025-07-01 22:04:21 -04:00
parent 525a4317b8
commit ec9853be45
2 changed files with 30 additions and 24 deletions

View file

@ -484,38 +484,34 @@ export async function openHermesModal() {
// Create modal using dialog element like TTS modal
const modal = document.createElement("dialog");
modal.id = "hermes-modal";
modal.open = true;
modal.style.position = "fixed";
modal.style.zIndex = "2000";
if (USE_CUSTOM_STYLING) {
modal.style.cssText = `
position: fixed;
top: 0;
left: 0;
width: 90%;
modal.style.cssText += `
width: 95vw;
max-width: 800px;
height: 90%;
max-height: 700px;
max-height: 95vh;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
border: none;
border-radius: 16px;
box-shadow: 0 20px 40px rgba(0,0,0,0.3);
background: white;
z-index: 2000;
margin: auto;
margin: 0;
overflow: auto;
`;
} else {
modal.style.cssText = `
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
height: 100dvh;
min-width: 0;
border: none;
background: transparent;
z-index: 2000;
modal.style.cssText += `
width: 95vw;
max-width: 800px;
max-height: 95vh;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
margin: 0;
padding: 0;
overflow: auto;
`;
}
@ -1172,6 +1168,18 @@ Format: Start with "Greetings! I'm Hermes..." and make it sound natural and enga
// Show the modal first, then load intro asynchronously
document.body.appendChild(modal);
// Use showModal() for proper mobile support and backdrop
modal.showModal();
// Close modal when clicking backdrop
modal.addEventListener('click', (e) => {
if (e.target === modal) {
modal.close();
document.body.removeChild(modal);
hermesModalOpen = false;
}
});
// Load Hermes introduction asynchronously after modal is shown
addHermesIntroduction().catch((error) => {

View file

@ -132,8 +132,6 @@ window.addEventListener("load", () => {
}
UI.initializeSystem();
Models.createModelSelectionDropdown();
Models.addRefreshModelsButton();
});
// Export helper functions for class-based integrations