Opened 7 years ago

Closed 7 years ago

Last modified 7 years ago

#15730 closed enhancement (fixed)

Can't override AccordionContainer content pane border color for claro

Reported by: Bill Reed Owned by: bill
Priority: undecided Milestone: 1.8.1
Component: Dijit - LnF Version: 1.8.0b1
Keywords: Cc:
Blocked By: Blocking:

Description

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?

Change History (8)

comment:1 Changed 7 years ago by bill

Component: themesDijit - LnF
Milestone: tbd1.8.1
Owner: changed from nonken to bill
Status: newassigned

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;

comment:2 Changed 7 years ago by bill

Resolution: fixed
Status: assignedclosed

In [29587]:

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

comment:3 Changed 7 years ago by bill

In [29588]:

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

comment:4 Changed 7 years ago by 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.

comment:5 Changed 7 years ago by bill

In [29590]:

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

comment:6 Changed 7 years ago by 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.

comment:7 Changed 7 years ago by 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.

comment:8 Changed 7 years ago by 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.

Note: See TracTickets for help on using tickets.