* @license The MIT License (MIT); see LICENSE.txt
*/
-.mw-widget-titleOptionWidget-description {
- display: none;
-}
+.mw-widget-titleWidget-menu {
+ .mw-widget-titleOptionWidget {
+ line-height: normal;
+
+ &-description {
+ color: #888;
+ }
+ }
-.mw-widget-titleWidget {
- &-menu-withImages {
+ &-withImages {
.mw-widget-titleOptionWidget {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
min-height: 3.75em;
- margin-left: 3.75em;
- }
+ padding-left: 4.75em;
- .mw-widget-titleOptionWidget:not(:last-child) {
- margin-bottom: 1px;
- }
+ &:not(:last-child) {
+ margin-bottom: 2px;
+ }
- .oo-ui-iconElement .oo-ui-iconElement-icon {
- display: block;
- width: 3.75em;
- height: 3.75em;
- left: -3.75em;
- background-color: #ccc;
- opacity: 0.4;
- }
+ > .oo-ui-labelElement-label {
+ line-height: 2.8em;
+ }
- .oo-ui-iconElement .mw-widget-titleOptionWidget-hasImage {
- border: 0;
- background-size: cover;
- opacity: 1;
+ &.oo-ui-iconElement {
+ >.oo-ui-iconElement-icon {
+ display: block;
+ width: 3.75em;
+ height: 3.75em;
+ left: 0;
+ background-color: #ccc;
+ opacity: 0.4;
+ }
+
+ > .mw-widget-titleOptionWidget-hasImage {
+ border: 0;
+ background-size: cover;
+ opacity: 0.7;
+ }
+ }
}
- .mw-widget-titleOptionWidget .oo-ui-labelElement-label {
- line-height: 2.8em;
+ &.oo-ui-optionWidget-highlighted, &.oo-ui-optionWidget-selected {
+ &.oo-ui-iconElement > .mw-widget-titleOptionWidget-hasImage {
+ opacity: 1;
+ }
}
}
- &-menu-withDescriptions {
- .mw-widget-titleOptionWidget .oo-ui-labelElement-label {
- line-height: 1.5em;
+ &-withDescriptions {
+ .mw-widget-titleOptionWidget {
+ > .oo-ui-labelElement-label {
+ line-height: 1.5em;
+ }
+
+ &-description {
+ display: block;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ }
}
+ }
+ &:not(&-withDescriptions) {
.mw-widget-titleOptionWidget-description {
- display: block;
- white-space: nowrap;
- text-overflow: ellipsis;
- overflow: hidden;
+ display: none;
}
}
}
-
-.oo-ui-menuOptionWidget:not(.oo-ui-optionWidget-selected) .mw-widget-titleOptionWidget-description,
-.oo-ui-menuOptionWidget.oo-ui-optionWidget-highlighted .mw-widget-titleOptionWidget-description {
- color: #888;
-}