Enhance visual appearance of popup element

This commit is contained in:
Aljaž Grilc 2024-05-30 09:03:54 +02:00
parent e8b1ab94d9
commit a23dea067c

View File

@ -1365,6 +1365,7 @@ class BesPopup extends HTMLElement {
display: block; display: block;
} }
.popup-text { .popup-text {
font-size: 0.93rem;
max-width: 160px; max-width: 160px;
color: black; color: black;
text-align: center; text-align: center;
@ -1372,9 +1373,10 @@ class BesPopup extends HTMLElement {
z-index: 1; z-index: 1;
} }
.bes-popup-container { .bes-popup-container {
font-family: Arial, sans-serif;
visibility: hidden; visibility: hidden;
min-width: 200px; min-width: 200px;
max-width: 300px; max-width: 350px;
background-color: rgb(241, 243, 249); background-color: rgb(241, 243, 249);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
border-radius: 5px; border-radius: 5px;
@ -1410,6 +1412,9 @@ class BesPopup extends HTMLElement {
.bes-replacement-btn:hover{ .bes-replacement-btn:hover{
background-color: #1976f0; background-color: #1976f0;
} }
.bes-replacement-div{
margin-top: 4px;
}
:host(.show) .bes-popup-container { :host(.show) .bes-popup-container {
visibility: visible; visibility: visible;
animation: fadeIn 1s; animation: fadeIn 1s;
@ -1507,7 +1512,7 @@ class BesPopup extends HTMLElement {
*/ */
changeMessage(text) { changeMessage(text) {
this.clearReplacements() this.clearReplacements()
this.shadowRoot.querySelector('.popup-text').textContent = text this.shadowRoot.querySelector('.popup-text').innerText = text
} }
/** /**