Author: Phenix

    /** Active/tag-based color classes. */
    get colorClass() {
        return {
            active: this.action.isActive,
            "o-odooControlPanelSwitchStyle": this.props.odooControlPanelSwitchStyle,
            "o-hasBtnBg": this.hasBtnBg,
            "bg-secondary":
                this.action.isActive &&
                !this.action.tags.includes("PRIMARY") &&
                !this.action.tags.includes("DANGER") &&
                !this.action.tags.includes("SUCCESS"),
            "btn-secondary":
                !this.action.tags.includes("PRIMARY") &&
                !this.action.tags.includes("DANGER") &&
                !this.action.tags.includes("SUCCESS"),
            "btn-primary": this.action.tags.includes("PRIMARY"),
            "btn-danger": this.action.tags.includes("DANGER"),
            "btn-success": this.action.tags.includes("SUCCESS"),
        };
    }

Code language: JavaScript (javascript)

That is one way to check if it’s the only element, being the first and last child at the same time…

.o-inline {
    &:where(:has(i:first-child:last-child)) {
        opacity: var(--o-mail-ActionList-Button-opacity);
    }
}
Code language: SCSS (scss)

    & button.o-simulateDarkTheme.o-hasBtnBg:not(.o-tag-DANGER):not(.o-tag-SUCCESS):not(.o-tag-PRIMARY) {
        background-color: #{$gray-800};
        border: 1px solid rgba(white, 0.1);

        &.active {
            // Same colors than dark theme since dark theme is simulated for call view.
            background-color: #17373b !important;
            border-color: #03f9e3 !important;
        }
    }
Code language: SCSS (scss)