Can't override AccordionContainer content pane border color for claro

[Bill Reed]

In Maqetta.org IDE we have functions that allow a user to create a CSS rule to override existing theme rules, Bu with claro in dojo 1.8 the user can't override the rule because property has the !important which does not seem to be need.

.claro .dijitAccordionInnerContainerSelectedHover .dijitAccordionChildWrapper, .claro .dijitAccordionInnerContainerSelectedActive .dijitAccordionChildWrapper {
background-color: white;
border: 1px solid #759DC0 !important;
-webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.25);
-moz-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.25);
box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.25);
}

We currently do not allow users to add !important from the UI the user would have to hand edit the CSS to add the !important.

Would it be possible to remove the !important from the property?

[bill]

Sure. I traced back and that !important has been there since the beginning but I agree that it shouldn't be there.

There are some other !important's that I didn't catch that should also be removed if possible. Including AccordionContainer, the list is:

./Dialog.less:	left: auto !important;
./form/Common.less:	background-color: transparent !important; /* so the INPUT doesn't obscure the border in rtl+a11y */
./form/Common_rtl.less:	border-left-width: 0 !important;
./form/Common_rtl.less:	border-right-width: 1px !important;
./layout/AccordionContainer.less:	border:1px solid @hovered-border-color !important;
./layout/TabContainer.less:	_background-image: none !important;

[bill]

In [29587]:

Minimal change to remove apparently unneeded !important flag from claro's Accordion theme, fixes #15730 on trunk/.

[bill]

In [29588]:

Minimal change to remove apparently unneeded !important flag from claro's Accordion theme, fixes #15730 on 1.8/ branch.

[bill]

In [29589]:

Remove effect when hovering or pressing the active accordion pane. It's inconsistent w/the rest of claro (ex: hovering the selected tab), and violates usability guidelines, at least as I understand them. Refs #15730.

[bill]

In [29590]:

Remove !important from Dialog CSS by reordering the selectors so the one that should take precedence is last, refs #15730.

[bill]

In [29591]:

Increase tab button selector's precedence so that we don't need to use !important. In this case it doesn't really matter, since it's not a rule that anyone would want to override, but removing it anyway just to avoid the appearance of impropriety. The other option would be to move the rule to dijit.css. Refs #15730.

[bill]

In [29592]:

Remove !important from ValidationTextBox CSS, the RTL rules naturally take precedence over the LTR rules because the RTL come after the LTR ones, refs #15730.

[bill]

In [29593]:

Remove unneeded !important from ValidationTextBox CSS. I can see the border break in RTL+highcontrast mode if the background-color isn't specified at all, but it doesn't make a difference whether or not it's specified with !important or no. Refs #15730.