mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/Echo
synced 2024-11-24 07:54:13 +00:00
Avoid calc() in CSS
* Use `margin: A` with `padding: B` rather than `padding: calc(A + B)`. * Remove a `display: inline-block` which necessitated `width: 100%`. I think this results in the same rendering, but please test carefully, as I didn't check it for all the possible notifications. (There is one more calc() in mw.echo.badge.less that can't be avoided.) Bug: T135936 Change-Id: Ic01f16c8469c3b9d45d2885108ec6260e967731a
This commit is contained in:
parent
3fc46a639d
commit
cc9e667c49
|
@ -14,8 +14,11 @@
|
||||||
|
|
||||||
&-content {
|
&-content {
|
||||||
margin-bottom: 1em;
|
margin-bottom: 1em;
|
||||||
|
// The icon is 30px
|
||||||
|
margin-left: 30px;
|
||||||
|
// 0.8em from ItemWidget, plus 0.8em
|
||||||
|
padding-left: 1.6em;
|
||||||
padding-right: 0.8em;
|
padding-right: 0.8em;
|
||||||
padding-left: ~"calc(30px + 1.6em)"; // 30px+0.8em from ItemWidget, plus 0.8em
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -27,11 +27,11 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
&-content {
|
&-content {
|
||||||
display: inline-block;
|
display: block;
|
||||||
// The icon is 30px and has a 0.8em right margin
|
// The icon is 30px
|
||||||
padding-left: ~"calc(30px + 0.8em)";
|
margin-left: 30px;
|
||||||
|
padding-left: 0.8em;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
&-message {
|
&-message {
|
||||||
line-height: 16px;
|
line-height: 16px;
|
||||||
|
|
Loading…
Reference in a new issue