Css selector with attribute not working

[DavidHenri008]

Hi,
I am using the React-Toolbox and I understood that it uses the react-css-themr behind the scene.
I am trying to use a simple css selector with an attribute and it is not working.

My react code:

import React from 'react';
import PropTypes from 'prop-types';
import { AppBar } from 'react-toolbox/lib/app_bar';
import theme from './AppBar.css';

const PurpleAppBar = props => (

App Example

);
export default PurpleAppBar;

My css file:

.appBar {
background-color: blue;
}
.appBar[disabled] {
background-color: gray;
}
.appBar:hover {
opacity: 0.5;
}

The AppBar is blue and the hover is working. However since the disabled attribute/property is present I would expect the color to be gray.

Thanks.