From 21599f6097f595ccea1c2a779f828eb4a16d1d54 Mon Sep 17 00:00:00 2001 From: nathan Date: Thu, 2 Feb 2023 10:46:51 -0700 Subject: [PATCH] Make all toolbar toggle button icons gray when off --- api/js/etemplate/et2_widget_toolbar.ts | 1 + api/templates/default/etemplate2.css | 7 +++++-- 2 files changed, 6 insertions(+), 2 deletions(-) diff --git a/api/js/etemplate/et2_widget_toolbar.ts b/api/js/etemplate/et2_widget_toolbar.ts index 8fc3d44e01..d39c4fc779 100644 --- a/api/js/etemplate/et2_widget_toolbar.ts +++ b/api/js/etemplate/et2_widget_toolbar.ts @@ -646,6 +646,7 @@ export class et2_toolbar extends et2_DOMWidget implements et2_IInput }, this); if (isCheckbox) { + widget.classList.add('toolbar_toggle'); if (this.checkbox(action.id)) widget.classList.add('toolbar_toggled'+ (typeof action.toggledClass != 'undefined'?" "+action.toggledClass:'')); } widget.onclick = actionHandler; diff --git a/api/templates/default/etemplate2.css b/api/templates/default/etemplate2.css index 0b04601e7b..f5c456293c 100644 --- a/api/templates/default/etemplate2.css +++ b/api/templates/default/etemplate2.css @@ -3004,8 +3004,11 @@ et2-button.transparent-button::part(container) { } .et2_toolbar et2-button.toolbar_toggled::part(base), .et2_searchbox button.et2_button.toolbar_toggled { - background-color: lightgray; - box-shadow: inset 1px 1px 1px 1px gray !important; + box-shadow: inset 1px 1px 1px 1px gray !important; +} + +.et2_toolbar et2-button.toolbar_toggle:not(.toolbar_toggled) img { + filter: brightness(0) contrast(0.3) opacity(0.7); } .ui-toolbar-menulist et2-button.toolbar_toggled::part(base) {