mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/Echo
synced 2024-11-28 01:30:15 +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 {
|
||||
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-left: ~"calc(30px + 1.6em)"; // 30px+0.8em from ItemWidget, plus 0.8em
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -27,11 +27,11 @@
|
|||
}
|
||||
|
||||
&-content {
|
||||
display: inline-block;
|
||||
// The icon is 30px and has a 0.8em right margin
|
||||
padding-left: ~"calc(30px + 0.8em)";
|
||||
display: block;
|
||||
// The icon is 30px
|
||||
margin-left: 30px;
|
||||
padding-left: 0.8em;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
|
||||
&-message {
|
||||
line-height: 16px;
|
||||
|
|
Loading…
Reference in a new issue