Improve color of the popup close button #6

This commit is contained in:
Aljaž Grilc 2025-05-21 09:14:06 +02:00
parent 9bc8dfbdfc
commit be08136a31

View File

@ -2786,11 +2786,14 @@ class BesPopup extends HTMLElement {
.bes-close-btn svg { .bes-close-btn svg {
width: 100%; width: 100%;
height: 100%; height: 100%;
fill: #333;
} }
:host{
--bes-close-icon: #485362;
--hover-bg-clr: #dee3ed;
}
.bes-close-btn:hover { .bes-close-btn:hover {
background: #dee3ed; background: var(--hover-bg-clr);
border-radius: 8px border-radius: 4px
} }
:host(.show) .bes-popup-container { :host(.show) .bes-popup-container {
visibility: visible; visibility: visible;
@ -2819,13 +2822,17 @@ class BesPopup extends HTMLElement {
background-color: #111213; background-color: #111213;
border: 1px solid #2e3036; border: 1px solid #2e3036;
} }
:host{
--bes-close-icon: #a4b5c7;
--hover-bg-clr:rgba(189, 189, 189, 0.28);
}
} }
</style> </style>
<div class="bes-popup-container"> <div class="bes-popup-container">
<div class="bes-toolbar"> <div class="bes-toolbar">
<div class="bes-popup-title">Besana</div> <div class="bes-popup-title">Besana</div>
<button class="bes-close-btn" onclick="BesPopup.dismiss()"> <button class="bes-close-btn" onclick="BesPopup.dismiss()">
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M13.46 12L19 17.54V19h-1.46L12 13.46L6.46 19H5v-1.46L10.54 12L5 6.46V5h1.46L12 10.54L17.54 5H19v1.46z"/></svg> <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="var(--bes-close-icon)" d="M13.46 12L19 17.54V19h-1.46L12 13.46L6.46 19H5v-1.46L10.54 12L5 6.46V5h1.46L12 10.54L17.54 5H19v1.46z"/></svg>
</button> </button>
</div> </div>
</div> </div>