fix: add delay for CSS loading to ensure floating button styles are applied
- Added 100ms delay when CSS needs to be loaded for floating button - This ensures CSS rules are parsed before button is displayed - Fixes issue where button appeared unstyled in top-left corner
This commit is contained in:
parent
a1a53fcf07
commit
675b8fefd1
1 changed files with 12 additions and 2 deletions
14
src/ui.js
14
src/ui.js
|
|
@ -328,12 +328,14 @@ export function createFloatingAIButton() {
|
|||
const hasPicoCSS = document.querySelector('link[href*="pico"]') !== null;
|
||||
const cssFile = hasPicoCSS ? 'uncloseai-modal-pico.css' : 'uncloseai-modal-builtin.css';
|
||||
|
||||
let cssLoaded = false;
|
||||
if (!document.querySelector(`link[href*="${cssFile}"]`)) {
|
||||
const link = document.createElement('link');
|
||||
link.rel = 'stylesheet';
|
||||
link.href = `https://uncloseai.com/src/${cssFile}`;
|
||||
document.head.appendChild(link);
|
||||
console.log(`uncloseai.js: Loaded ${cssFile} for floating button styles.`);
|
||||
cssLoaded = true;
|
||||
}
|
||||
|
||||
// Remove any existing floating button first
|
||||
|
|
@ -388,8 +390,16 @@ export function createFloatingAIButton() {
|
|||
// Set up self-contained click handler
|
||||
setupFloatingButtonHandler(floatingButton);
|
||||
|
||||
document.body.appendChild(floatingButton);
|
||||
console.log("uncloseai.js: Appended floating button to document.body.");
|
||||
// If we just loaded CSS, wait a bit before showing button
|
||||
if (cssLoaded) {
|
||||
setTimeout(() => {
|
||||
document.body.appendChild(floatingButton);
|
||||
console.log("uncloseai.js: Appended floating button to document.body after CSS load delay.");
|
||||
}, 100);
|
||||
} else {
|
||||
document.body.appendChild(floatingButton);
|
||||
console.log("uncloseai.js: Appended floating button to document.body.");
|
||||
}
|
||||
}
|
||||
|
||||
// Set up click handler for floating button (self-contained)
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue