Add custom properties for easier color styling.

This commit is contained in:
trading_peter 2024-08-16 14:22:10 +02:00
parent 6ab1920ce3
commit 4d7e5e6364
2 changed files with 7 additions and 5 deletions

View File

@ -1,6 +1,6 @@
{ {
"name": "@tp/tp-dropdown", "name": "@tp/tp-dropdown",
"version": "1.3.4", "version": "1.4.0",
"description": "", "description": "",
"main": "tp-dropdown.js", "main": "tp-dropdown.js",
"scripts": { "scripts": {

View File

@ -148,17 +148,19 @@ class TpDropdown extends BaseElement {
} }
div[role="option"]:hover { div[role="option"]:hover {
background: #E0F7FA; background: var(--tp-dropdown-hovered-item-bg, #E0F7FA);
color: var(--tp-dropdown-hovered-item-color, inherit);
} }
div[role="option"]:focus { div[role="option"]:focus {
background: #EEEEEE; background: var(--tp-dropdown-focused-item-bg, #EEEEEE);
color: var(--tp-dropdown-focused-item-color, inherit);
outline: none; outline: none;
} }
div[role="option"][selected] { div[role="option"][selected] {
background: #4FC3F7; background: var(--tp-dropdown-selected-item-bg, #4FC3F7);
color: #FFFFFF; color: var(--tp-dropdown-selected-item-color, #FFFFFF);
} }
div[role="option"]:first-of-type { div[role="option"]:first-of-type {