mediawiki-extensions-Echo/modules/styles/mw.echo.ui.SubGroupListWidget.less
Bartosz Dziewoński b6b19e1a2f Simplify Special:Notifications layout using flexbox
Compared to the previous approach using table layouts, it is much
easier to control which elements are allowed to extend to maximum
available width, and to provide alternative layouts for mobile.
There should be no visual changes.

It doesn't require using `white-space: nowrap` to prevent elements
from being squished, which will help with T237244.

(These styles are only loaded on Special:Notifications, they don't
apply to the flyout.)

Bug: T237244
Change-Id: I09e692e427f61fabd53b3824a1ed7e4f8e76fad4
2024-05-15 23:41:59 +02:00

30 lines
615 B
Plaintext

@import 'mediawiki.skin.variables.less';
@import '../echo.variables.less';
.mw-echo-ui-subGroupListWidget {
&:not( :first-child ) {
padding-top: @bundle-group-padding;
}
&-header {
&-row {
display: flex;
align-items: center;
&-title {
flex-grow: 1;
align-self: end;
}
}
}
}
/* stylelint-disable no-descending-specificity */
.mw-echo-ui-subGroupListWidget,
.mw-echo-ui-bundleNotificationItemWidget-group {
.mw-echo-ui-sortedListWidget-group:not( :empty ) {
border: @border-width-base @border-style-base @border-color-subtle;
}
}
/* stylelint-enable no-descending-specificity */