Limit page issues truncation to at least 2 lines

In the case of template {{dictdef}} the issue gets limited to one
line making it unreadable on mobile at certain resolutions due to the
learn more link taking up space that's available to the issue itself

As well as enforcing a max-height, enforce a height so that all issues
can have at least 2 lines to play with on all mobile screen resolutions

Bug: T197931
Change-Id: Icebdcf37d0f307dc82493c5ced53b632a6b09aea
This commit is contained in:
jdlrobson 2018-07-26 11:04:57 +08:00 committed by Stephen Niedzielski
parent a10bb49c01
commit 28b9517dcb
1 changed files with 4 additions and 0 deletions

View File

@ -40,6 +40,9 @@ table.ambox {
// See https://en.wikipedia.org/w/index.php?title=Module:Message_box&action=raw (search for 'mbox-text-span').
.mbox-text-span {
max-height: @contentLineHeight * 2em;
// All will have this height (approx 2 lines) even if a single line e.g. {{dictdef}} when on mobile.
// Overriden later in tablet styles.
height: @contentLineHeight * 2em;
overflow: hidden;
}
@ -122,6 +125,7 @@ table.ambox {
@media screen and ( min-width: @width-breakpoint-tablet ) {
.mbox-text-span {
height: auto;
margin-bottom: @amboxPadding * 3 !important; // important offsets `.ambox div { margin:0!important}` which offsets inline styles.
}
.ambox-learn-more {