fix: make settings gear icon white with text-shadow for better visibility

This commit is contained in:
Russell Ballestrini 2025-07-09 20:29:07 -04:00
parent 99856600c0
commit a49c9973ae
3 changed files with 45 additions and 19 deletions

View file

@ -277,25 +277,7 @@ async function openUncloseaiEmbeddedModalNew() {
// Add settings/menu button
const menuBtn = document.createElement("button");
menuBtn.textContent = "⚙️";
menuBtn.style.cssText = `
background: rgba(255,255,255,0.2);
border: none;
color: white;
font-size: 18px;
width: 36px;
height: 36px;
border-radius: 50%;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: background 0.2s;
margin-right: 8px;
`;
menuBtn.onmouseover = () =>
(menuBtn.style.background = "rgba(255,255,255,0.3)");
menuBtn.onmouseout = () =>
(menuBtn.style.background = "rgba(255,255,255,0.2)");
menuBtn.className = "uncloseai-modal-settings-btn";
const headerRight = document.createElement("div");
headerRight.style.cssText = "display: flex; gap: 8px; align-items: center;";

View file

@ -66,6 +66,28 @@ dialog#uncloseai-embedded-modal[data-theme="light"] {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
/* Settings button */
.uncloseai-modal-settings-btn {
background: rgba(255, 255, 255, 0.2);
border: none;
color: white !important;
font-size: 18px;
width: 36px;
height: 36px;
border-radius: 50%;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: background 0.2s;
margin-right: 8px;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}
.uncloseai-modal-settings-btn:hover {
background: rgba(255, 255, 255, 0.3);
}
/* Chat area */
.uncloseai-modal-chat-area {
flex: 1;

View file

@ -82,6 +82,28 @@ dialog#uncloseai-embedded-modal[data-theme="light"] {
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
/* Settings button */
.uncloseai-modal-settings-btn {
background: rgba(255, 255, 255, 0.2);
border: none;
color: white !important;
font-size: 18px;
width: 36px;
height: 36px;
border-radius: 50%;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: background 0.2s;
margin-right: 8px;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}
.uncloseai-modal-settings-btn:hover {
background: rgba(255, 255, 255, 0.3);
}
/* Chat area */
.uncloseai-modal-chat-area {
flex: 1;