Interesting. It looks to me like a bug.
The theme CSS compiles into this:
Button {
border: 1px solid #808080;
padding: 4px;
background-color: #f8f8f8;
margin: 0px;
border-radius: 2px;
}
Button:hover {
border: 1px solid #808080;
padding: 4px;
background-color: #e8e8e8;
}
Button:active {
border: 1px solid #808080;
padding: 4px;
background-color: #d8d8d8;
}
Instead of this:
.Button {
border: 1px solid #808080;
padding: 4px;
background-color: #f8f8f8;
margin: 0px;
border-radius: 2px;
}
.Button:hover {
border: 1px solid #808080;
padding: 4px;
background-color: #e8e8e8;
}
.Button:active {
border: 1px solid #808080;
padding: 4px;
background-color: #d8d8d8;
}
Button is an element name (case insensitive) instead of a class name…
Harbs
> On May 15, 2018, at 11:52 AM, Harbs <[email protected]> wrote:
>
> I just tried an experiment of giving an MDL Button a classname of “Button” in
> addition to all the MDL classes. Interestingly, the mdl class names overrode
> the Button one. I’m really not sure why because the Button css should have
> been loaded later than MDL. I’d appreciate your thoughts if you have any on
> that.