golem
/
VectorGOLEM
9
0
Fork 0
Code Issues 1 Pull Requests Releases Wiki Activity

Unify LESS variable naming scheme for `@line-height-*` variables 

Unifying variable naming to property-identifier-modifier scheme.
Settling on non-em-based `line-height` values with one exception
of Vector tabs, where removing `em` would lead to different
calculation.
Also removing unneeded `inherit` assignment on content paragraphs
that has been part since Ic5ba836364.

Bug: T4013
Change-Id: I514467e4065d27de8d0ea82cdd3d23ccef6cffe3
This commit is contained in:
Volker E 2019-09-26 21:25:59 -07:00
parent 0d097a2a43
commit 83fbe68b5f
6 changed files with 22 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
components/common.less
View File

@ -48,10 +48,10 @@ body {
& h1,
&-content h1,
&-content h2 {
font-family: @font-family-serif;
line-height: @heading-line-height;
margin-bottom: 0.25em;
padding: 0;
font-family: @font-family-serif;
line-height: @line-height-heading;
// Fallback heading font for scripts which render poorly in `@font-family-serif`.
// See T73240
@ -81,7 +81,7 @@ body {
.mw-indicators {
float: right;
font-size: @font-size-base;
line-height: @content-line-height;
line-height: @line-height-base;
/* Ensure that this is displayed on top of .mw-body-content and clickable */
position: relative;
z-index: 1;
@ -98,11 +98,10 @@ body {
.mw-body-content {
position: relative;
font-size: @font-size-base;
line-height: @content-line-height;
line-height: @line-height-base;
z-index: 0;
p {
line-height: inherit;
margin: 0.5em 0;
}
@ -119,10 +118,10 @@ body {
h4,
h5,
h6 {
line-height: @content-line-height;
margin-top: 0.3em;
margin-bottom: 0;
padding-bottom: 0;
line-height: @line-height-base;
}
h3 {
@ -164,7 +163,7 @@ ul {
pre,
.mw-code {
line-height: 1.3em;
line-height: @line-height-code;
}
/* Site Notice (includes notices from CentralNotice extension) */

6
components/footer.less
View File

@ -25,14 +25,14 @@
li {
float: left;
margin-left: 0.5em;
line-height: 2em;
line-height: @line-height-footer-buttons;
text-align: right;
}
}
#footer-info {
li {
line-height: 1.4em;
line-height: @line-height-footer-info;
}
}
@ -40,6 +40,6 @@
li {
float: left;
margin-right: 1em;
line-height: 2em;
line-height: @line-height-footer-buttons;
}
}

2
components/navigation.less
View File

@ -104,10 +104,10 @@
}
li {
line-height: 1.125em;
margin: 0;
padding: 0.25em 0;
font-size: @font-size-menu-main-body;
line-height: @line-height-navigation;
word-wrap: break-word;
a {

2
components/personalMenu.less
View File

@ -36,7 +36,7 @@
.background-image-svg( 'images/user-avatar.svg', 'images/user-avatar.png' );
background-position: @background-position-menu-personal-icon;
background-repeat: no-repeat;
background-size: @line-height-menu-personal @line-height-menu-personal;
background-size: @background-size-menu-personal-icon @background-size-menu-personal-icon;
// Same as `#p-personal li` above
padding-top: 0.5em !important; // stylelint-disable-line declaration-no-important
padding-left: 16px !important; // stylelint-disable-line declaration-no-important

2
components/tabs.less
View File

@ -31,7 +31,6 @@
li {
float: left;
line-height: 1.125em;
display: block;
height: 100%;
margin: 0;
@ -39,6 +38,7 @@
.background-image('images/tab-normal-fade.png');
background-position: bottom left;
background-repeat: repeat-x;
line-height: @line-height-navigation;
white-space: nowrap;
&.new {

12
variables.less
View File

@ -22,15 +22,21 @@
@font-size-heading-3: 1.2em;
@font-size-notification: 0.8em;
@font-size-site-notice: 0.8em;
@line-height-base: 1.6;
@line-height-heading: 1.3;
@line-height-code: 1.3;
@line-height-footer-info: 1.4;
@line-height-footer-buttons: 2;
// FIXME: Use global variable since Echo and CentralNotice use this variable
@content-border-color: #a7d7f9;
@content-line-height: 1.6;
@content-padding: 1em;
@heading-line-height: 1.3;
// Navigation
@background-color-secondary: #f6f6f6;
// Navigation `line-height` has to be set in `em`s due to a rendering calculation issue.
@line-height-navigation: 1.125em;
// Main menu
@font-size-menu-main: inherit;
@ -44,8 +50,10 @@
// Personal menu
@background-position-menu-personal-icon: left ( 4 / @font-size-browser / @font-size-menu-personal );
@background-size-menu-personal-icon: 14 / @font-size-browser / @font-size-menu-personal;
@font-size-menu-personal: 0.75em;
@line-height-menu-personal: 14 / @font-size-browser / @font-size-menu-personal; // equals `1.667em`≈`14px`
// Using `unit()` without second parameter to achieve a unitless output for `line-height`.
@line-height-menu-personal: unit( 14 / @font-size-browser / @font-size-menu-personal ); // Equals `1.667`.
// Tabs
@font-size-tabs: unit( 13 / @font-size-browser, em ); // Equals `0.8125em`.