Echo/modules/styles/mw.echo.ui.PageNotificationsOptionWidget.less


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53

@import 'mediawiki.mixins';
@import '../echo.variables';

.mw-echo-ui-pageNotificationsOptionWidget {
	clear: both;
	width: 100%;
	.box-sizing( border-box );

	&.oo-ui-optionWidget {
		.transition( ~'background-color 100ms, color 100ms' );

		&-highlighted {
			background-color: #eaecf0;
			color: @color-base-active;
		}

		&-selected {
			background-color: @background-color-primary;
			color: @color-primary;
		}

		&-selected&-highlighted,
		&-pressed&-highlighted {
			background-color: rgba( 41, 98, 204, 0.1 );
			color: @color-primary;
		}
	}

	&-icon {
		float: left;
		.oo-ui-iconElement-icon {
			display: inline-block;
		}
	}

	&-title {
		padding: 0.2em 0;
	}

	&-count {
		background-color: #eaecf0;
		color: @grey-medium;
		float: right;
		padding: 0.2em 0.5em;
		margin-left: 0.5em;
		border-radius: 2px;

		.oo-ui-optionWidget-selected & {
			background: none; // `background-color: transparent` would be the goto value, but IE 8-9 introduces a bug
			color: @color-primary;
		}
	}
}