Write page Category widget styling

[federico.bond]

The categories widget/panel in the Write page looks like it was made at the last minute. Uploaded current state and a proposed use of tabs following the style of the tabs used to switch between html and visual editor.

[federico.bond]

Sorry. It was "Most Used" not "Most Popular" but you get the idea.

[sivel]

Can you add a patch to this ticket for the code modifications you made?

[federico.bond]

Sorry, it's just a mockup. I am fluent in XHTML/CSS and I will look into it but I haven't worked inside wordpress before.

[federico.bond]

I'm also not sure whether to use that styling or the plain gray one found in the same categories widget when you place it on the left column.

[federico.bond]

These are the styles I used. I made them look like the tabs that appear when you place the widget in the wider left column. Not sure where to place this modifications.

#category-adder H4
{
	margin-top: 4px;
	margin-bottom: 0px;
}
#categorydiv .ui-tabs-panel
{
	border: 3px solid #F1F1F1; 
}
UL#category-tabs
{
	margin-top: 12px;
}
UL#category-tabs LI
{
	padding: 5px 8px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	-webkit-border-radius-topleft: 3px;
	-webkit-border-radius-topright: 3px;
}

Step by step:

#category-adder H4
This is the Add new category link. Just a small correction to get it centered

#categorydiv .ui-tabs-panel
Thick border similar to the one the widget has when you place it on the left column. Gray theme colors.

UL#category-tabs
Another small correction so that the tabs are not too close to the top border of the panel

UL#category-tabs LI
Some padding to enlarge the click area and make the links look like tabs, and rounded corner goodness. Don't know if we have to support other vendors.

[federico.bond]

Firefox Screenshot (Not mockup)

[federico.bond]

ONLY TESTED IN FIREFOX

[federico.bond]

font-weight: bold; should also be added to UL#category-tabs LI.ui-tabs-selected to maximize consistency independently of the column where you place the widget.

[janeforshort]

+1, but this is an enhancement, not a bug. Please be careful to choose the correct metadata on tickets to avoid slowing down developers.

[thee17]

I'll attempt today to turn this to a diff.

[azaozz]

(In [10301]) Categories postbox styling when in right sidebar, props federico.bond, fixes #8606 for 2.7

[azaozz]

Reopen for trunk

[azaozz]

(In [10302]) Categories postbox styling when in right sidebar, props federico.bond, fixes #8606 for trunk