Break words in the category dialog

Of course CSS is perfectly standardized and wonderful, so we need a bunch
of duplicative and non-standard rules.

Also fix the mixin in MWCategoryWidget

Change-Id: I24da0ddb29d2886c450da362fee47d22da8e631d
This commit is contained in:
Roan Kattouw 2013-06-10 16:41:12 -07:00
parent 8e8ddd9cad
commit b2fbe35962
2 changed files with 16 additions and 3 deletions

View file

@ -385,7 +385,7 @@
outline: none;
}
/* ve.ui.CategoryListWidget */
/* ve.ui.MWCategoryWidget */
.ve-ui-mwCategoryListWidget {
border: 1px solid #CCC;
@ -393,11 +393,22 @@
padding: .75em;
}
.ve-ui-mwCategoryListWidget-items {
/* MDN claims we need to use word-wrap: break-word; and that it's been renamed to
* overflow-wrap: break-word; , but the only thing that actually works in practice is
* word-break: break-word; (which is not documented in any standard at all). So we just use
* all three.
*/
word-break: break-word;
word-wrap: break-word;
overflow-wrap: break-word;
}
.ve-ui-mwCategoryInputWidget {
float: left;
}
/* ve.ui.CategoryListItemWidget */
/* ve.ui.MWCategoryListItemWidget */
.ve-ui-mwCategoryListItemWidget {
position: relative;

View file

@ -49,7 +49,7 @@ ve.ui.MWCategoryWidget = function VeUiMWCategoryWidget( config ) {
// Initialization
this.$.addClass( 've-ui-mwCategoryListWidget' )
.append(
this.$group,
this.$group.addClass( 've-ui-mwCategoryListWidget-items' ),
this.input.$,
this.$$( '<div>' ).css( 'clear', 'both' )
);
@ -59,6 +59,8 @@ ve.ui.MWCategoryWidget = function VeUiMWCategoryWidget( config ) {
ve.inheritClass( ve.ui.MWCategoryWidget, ve.ui.Widget );
ve.mixinClass( ve.ui.MWCategoryWidget, ve.ui.GroupElement );
/* Events */
/**