jenkins-bot has submitted this change and it was merged. (
https://gerrit.wikimedia.org/r/344558 )
Change subject: Multiply all rem values by 1.6 to scale to 1rem = 10px
......................................................................
Multiply all rem values by 1.6 to scale to 1rem = 10px
Bug: T160474
Change-Id: I129a95e28136620e5e459ad7d096a82c56ba81f3
---
M dev/wikipedia.org/assets/postcss/_app-badge.css
M dev/wikipedia.org/assets/postcss/_base-portal.css
M dev/wikipedia.org/assets/postcss/_base.css
M dev/wikipedia.org/assets/postcss/_buttons.css
M dev/wikipedia.org/assets/postcss/_central-featured.css
M dev/wikipedia.org/assets/postcss/_central-textlogo.css
M dev/wikipedia.org/assets/postcss/_footer.css
M dev/wikipedia.org/assets/postcss/_forms.css
M dev/wikipedia.org/assets/postcss/_other-languages-bookshelf.css
M dev/wikipedia.org/assets/postcss/_other-languages.css
M dev/wikipedia.org/assets/postcss/_other-projects.css
M dev/wikipedia.org/assets/postcss/_search-language-picker.css
M dev/wikipedia.org/assets/postcss/_search-suggestions.css
M dev/wikipedia.org/assets/postcss/_search.css
M dev/wikipedia.org/assets/postcss/_vars.css
M dev/wikipedia.org/assets/postcss/_wm-portal.css
16 files changed, 148 insertions(+), 147 deletions(-)
Approvals:
Jdrewniak: Looks good to me, approved
jenkins-bot: Verified
diff --git a/dev/wikipedia.org/assets/postcss/_app-badge.css
b/dev/wikipedia.org/assets/postcss/_app-badge.css
index b106504..6201a78 100644
--- a/dev/wikipedia.org/assets/postcss/_app-badge.css
+++ b/dev/wikipedia.org/assets/postcss/_app-badge.css
@@ -7,12 +7,12 @@
}
.app-badges .footer-sidebar-text {
- padding-top: 0.5rem;
- padding-bottom: 0.5rem;
+ padding-top: 0.8rem;
+ padding-bottom: 0.8rem;
}
.app-badges .footer-sidebar-icon {
- top: 0.5rem;
+ top: 0.8rem;
}
.app-badges ul {
@@ -53,6 +53,6 @@
.app-badge-fulllist {
width: 100%;
- margin: 1.2rem 0 0.4rem 0;
+ margin: 1.92rem 0 0.64rem 0;
}
}
diff --git a/dev/wikipedia.org/assets/postcss/_base-portal.css
b/dev/wikipedia.org/assets/postcss/_base-portal.css
index b718360..ad963f5 100644
--- a/dev/wikipedia.org/assets/postcss/_base-portal.css
+++ b/dev/wikipedia.org/assets/postcss/_base-portal.css
@@ -3,9 +3,9 @@
body {
background-color: var( --background-color-base );
font-family: sans-serif;
- font-size: 0.8125rem;
+ font-size: 1.3rem;
line-height: 1.5;
- margin: 0.24375rem 0;
+ margin: 0.39rem 0;
}
a,
@@ -35,5 +35,5 @@
height: 0;
border: 0;
border-bottom: 1px solid var( --border-color-heading );
- margin: 0.1625rem 0.8125rem;
+ margin: 0.26rem 1.3rem;
}
diff --git a/dev/wikipedia.org/assets/postcss/_base.css
b/dev/wikipedia.org/assets/postcss/_base.css
index e98cf68..4eca1c6 100644
--- a/dev/wikipedia.org/assets/postcss/_base.css
+++ b/dev/wikipedia.org/assets/postcss/_base.css
@@ -20,6 +20,7 @@
font-family: sans-serif; /* 1 */
-ms-text-size-adjust: 100%; /* 2 */
-webkit-text-size-adjust: 100%; /* 2 */
+ font-size: 62.5%; /* 1rem = 10px */
}
/**
@@ -144,8 +145,8 @@
*/
h1 {
- font-size: 2rem;
- margin: 0.67rem 0;
+ font-size: 3.2rem;
+ margin: 1.07rem 0;
}
/**
@@ -212,7 +213,7 @@
*/
figure {
- margin: 1rem 2.5rem;
+ margin: 1.6rem 4rem;
}
/**
@@ -241,7 +242,7 @@
pre,
samp {
font-family: monospace, monospace;
- font-size: 1rem;
+ font-size: 1.4rem;
}
/* Forms
@@ -395,8 +396,8 @@
fieldset {
border: 1px solid #c0c0c0;
- margin: 0 0.125rem;
- padding: 0.35rem 0.625rem 0.75rem;
+ margin: 0 0.2rem;
+ padding: 0.56rem 1rem 1.2rem;
}
/**
diff --git a/dev/wikipedia.org/assets/postcss/_buttons.css
b/dev/wikipedia.org/assets/postcss/_buttons.css
index 2d09aa2..d650c38 100644
--- a/dev/wikipedia.org/assets/postcss/_buttons.css
+++ b/dev/wikipedia.org/assets/postcss/_buttons.css
@@ -25,12 +25,12 @@
background-color: var( --background-color-framed );
color: var( --color-base );
position: relative;
- min-height: 1.2rem;
- min-width: 1rem;
- margin: 0.1rem 0;
+ min-height: 1.92rem;
+ min-width: 1.6rem;
+ margin: 0.16rem 0;
border: var( --border-base );
border-radius: var( --border-radius-base );
- padding: 0.5rem 1rem;
+ padding: 0.8rem 1.6rem;
font-family: inherit;
font-size: inherit;
font-weight: bold;
diff --git a/dev/wikipedia.org/assets/postcss/_central-featured.css
b/dev/wikipedia.org/assets/postcss/_central-featured.css
index 524a32f..45a990a 100644
--- a/dev/wikipedia.org/assets/postcss/_central-featured.css
+++ b/dev/wikipedia.org/assets/postcss/_central-featured.css
@@ -4,8 +4,8 @@
.central-featured {
position: relative;
- height: 20.3125rem;
- width: 34.125rem;
+ height: 32.5rem;
+ width: 54.6rem;
max-width: 100%;
margin: 0 auto;
text-align: center;
@@ -13,13 +13,13 @@
}
.central-featured-logo-wrapper {
- line-height: 19.5rem;
+ line-height: 31.2rem;
vertical-align: middle;
}
.central-featured-lang {
position: absolute;
- width: 9.75rem;
+ width: 15.6rem;
}
/* Make entire block clickable, surpress hover underline */
@@ -50,7 +50,7 @@
.central-featured-lang small {
display: inline-block;
- font-size: 0.69rem;
+ font-size: 1.104rem;
line-height: 1.036rem;
}
@@ -116,9 +116,9 @@
.central-featured {
width: auto;
height: auto;
- margin-top: 2.6rem;
- padding-top: 1.3rem;
- font-size: 0.65rem;
+ margin-top: 4.16rem;
+ padding-top: 2.08rem;
+ font-size: 1.04rem;
text-align: left;
}
@@ -134,10 +134,10 @@
.central-featured-logo {
position: absolute;
top: -70px;
- left: 0.52rem;
+ left: 0.832rem;
right: 0;
width: 70px;
- margin-top: -2.6rem;
+ margin-top: -4.16rem;
}
.central-featured-lang {
@@ -148,16 +148,16 @@
left: auto;
right: auto;
box-sizing: border-box;
- height: 4rem;
+ height: 6.4rem;
width: 33%;
margin: 0;
- padding: 0 1rem;
- font-size: 0.8rem;
+ padding: 0 1.6rem;
+ font-size: 1.28rem;
text-align: center;
}
.central-featured-lang strong {
- font-size: 0.8rem;
+ font-size: 1.28rem;
}
.central-featured-lang small {
@@ -168,12 +168,12 @@
@media all and ( max-width: 375px ) {
.central-featured-lang {
- font-size: 0.7rem;
+ font-size: 1.12rem;
}
.central-featured-lang small {
- font-size: 0.6rem;
- line-height: 1.05rem;
+ font-size: 0.96rem;
+ line-height: 1.68rem;
}
}
diff --git a/dev/wikipedia.org/assets/postcss/_central-textlogo.css
b/dev/wikipedia.org/assets/postcss/_central-textlogo.css
index cc2affa..963bba0 100644
--- a/dev/wikipedia.org/assets/postcss/_central-textlogo.css
+++ b/dev/wikipedia.org/assets/postcss/_central-textlogo.css
@@ -3,12 +3,12 @@
/* Section containing the central Wikipedia header */
.central-textlogo {
- margin: 1.875rem 0 0.9375rem 0;
- padding: 0.625rem 0;
+ margin: 3rem 0 1.5rem 0;
+ padding: 1rem 0;
font-family: 'Linux Libertine', 'Hoefler Text', Georgia, 'Times New
Roman', Times, serif;
- font-size: 1.875rem;
+ font-size: 3rem;
font-weight: normal;
- line-height: 2.0625rem;
+ line-height: 3.3rem;
text-align: center;
/* Crossed W in Linux Libertine */
-moz-font-feature-settings: "ss05=1";
@@ -20,10 +20,10 @@
.localized-slogan {
display: block;
- margin-bottom: -1.25rem;
+ margin-bottom: -2rem;
/* FIXME replace with var() */
font-family: 'Linux Libertine', 'Times New Roman', serif;
- font-size: 1rem;
+ font-size: 1.6rem;
font-variant: normal;
font-weight: normal;
}
@@ -41,11 +41,11 @@
.central-textlogo img {
height: 35px;
width: auto;
- margin-top: 0.5rem;
+ margin-top: 0.8rem;
}
.localized-slogan {
- margin-left: 1.125rem;
+ margin-left: 1.8rem;
}
}
diff --git a/dev/wikipedia.org/assets/postcss/_footer.css
b/dev/wikipedia.org/assets/postcss/_footer.css
index a4c4ad7..af92329 100644
--- a/dev/wikipedia.org/assets/postcss/_footer.css
+++ b/dev/wikipedia.org/assets/postcss/_footer.css
@@ -4,8 +4,8 @@
overflow: hidden;
max-width: 100%;
margin: 0 auto;
- padding: 2.6rem 0.8rem 0.8rem;
- font-size: 0.8rem;
+ padding: 4.16rem 1.28rem 1.28rem;
+ font-size: 1.28rem;
}
.footer:before,
@@ -22,7 +22,7 @@
width: 30%;
float: left;
clear: left;
- margin-bottom: 2rem;
+ margin-bottom: 3.2rem;
vertical-align: top;
}
@@ -35,20 +35,20 @@
.footer-sidebar-icon {
position: absolute;
top: 0;
- left: 0.5rem;
+ left: 0.8rem;
}
.footer-sidebar-text {
position: relative;
margin: 0;
- padding-left: 3.75rem;
- padding-right: 1.25rem;
+ padding-left: 6rem;
+ padding-right: 2rem;
color: var( --ss-c-grey );
}
/* FIXME is privacy-policy-links being used anywhere? */
.privacy-policy-links {
- margin-top: 0.8rem;
+ margin-top: 1.28rem;
}
/* FIXME is privacy-policy-links being used anywhere? */
@@ -67,7 +67,7 @@
.footer {
display: flex;
flex-direction: column;
- padding-top: 0.8rem;
+ padding-top: 1.28rem;
}
.footer .footer-sidebar {
@@ -99,7 +99,7 @@
display: block;
position: relative;
left: 0;
- margin: 0 auto 0.8rem auto;
+ margin: 0 auto 1.28rem auto;
}
.footer-sidebar-content {
@@ -115,12 +115,12 @@
/* FIXME is privacy-policy-links being used anywhere? */
.privacy-policy-links a {
display: inline-block;
- margin: 0 0.5rem;
+ margin: 0 0.8rem;
}
}
@media screen and ( max-width: 480px ) {
.footer {
- padding: 0.6rem 0.4rem 0.8rem;
+ padding: 0.96rem 0.64rem 1.28rem;
}
}
diff --git a/dev/wikipedia.org/assets/postcss/_forms.css
b/dev/wikipedia.org/assets/postcss/_forms.css
index 649c1f5..af6eb24 100644
--- a/dev/wikipedia.org/assets/postcss/_forms.css
+++ b/dev/wikipedia.org/assets/postcss/_forms.css
@@ -35,7 +35,7 @@
box-sizing: border-box;
border: var( --border-base );
border-radius: var( --border-radius-base );
- padding: 0.5rem;
+ padding: 0.8rem;
box-shadow: inset 0 0 0 1px var( --background-color-base );
vertical-align: middle;
}
@@ -45,7 +45,7 @@
since IE8 won't execute CSS that contains a CSS3 selector.
*/
.pure-form input:not( [type] ) {
- padding: 0.5rem 0.6rem;
+ padding: 0.8rem 0.96rem;
display: inline-block;
border: var( --border-base );
border-radius: var( --border-radius-base );
@@ -57,7 +57,7 @@
/* Chrome (as of v.32/34 on OS X) needs additional room for color to display.
*/
/* May be able to remove this tweak as color inputs become more standardized
across browsers. */
.pure-form input[type="color"] {
- padding: 0.2em 0.5em;
+ padding: 0.32em 0.8em;
}
.pure-form input[type="text"]:focus,
@@ -98,7 +98,7 @@
}
.pure-form .pure-checkbox,
.pure-form .pure-radio {
- margin: 0.5rem 0;
+ margin: 0.8rem 0;
display: block;
}
@@ -153,7 +153,7 @@
}
.pure-form select {
/* Normalizes the height; padding is not sufficient. */
- height: 2.25rem;
+ height: 3.6rem;
border: var( --border-base );
background-color: var( --background-color-framed );
}
@@ -161,18 +161,18 @@
height: auto;
}
.pure-form label {
- margin: 0.5rem 0 0.2rem;
+ margin: 0.8rem 0 0.32rem;
}
.pure-form fieldset {
margin: 0;
- padding: 0.35rem 0 0.75rem;
+ padding: 0.56rem 0 1.2rem;
border: 0;
}
.pure-form legend {
display: block;
width: 100%;
- padding: 0.3rem 0;
- margin-bottom: 0.3rem;
+ padding: 0.48rem 0;
+ margin-bottom: 0.48rem;
color: var( --color-base );
}
@@ -195,7 +195,7 @@
.pure-form-stacked label,
.pure-form-stacked textarea {
display: block;
- margin: 0.25rem 0;
+ margin: 0.4rem 0;
}
/*
@@ -204,7 +204,7 @@
*/
.pure-form-stacked input:not( [type] ) {
display: block;
- margin: 0.25rem 0;
+ margin: 0.4rem 0;
}
.pure-form-aligned input,
.pure-form-aligned textarea,
@@ -223,34 +223,34 @@
/* Aligned Forms */
.pure-form-aligned .pure-control-group {
- margin-bottom: 0.5rem;
+ margin-bottom: 0.8rem;
}
.pure-form-aligned .pure-control-group label {
text-align: right;
display: inline-block;
vertical-align: middle;
- width: 10rem;
- margin: 0 1rem 0 0;
+ width: 16rem;
+ margin: 0 1.6rem 0 0;
}
.pure-form-aligned .pure-controls {
- margin: 1.5rem 0 0 11rem;
+ margin: 2.4rem 0 0 17.6rem;
}
/* Rounded Inputs */
.pure-form input.pure-input-rounded,
.pure-form .pure-input-rounded {
- border-radius: 2rem;
- padding: 0.5rem 1rem;
+ border-radius: 2.4rem;
+ padding: 0.8rem 1.6rem;
}
/* Grouped Inputs */
.pure-form .pure-group fieldset {
- margin-bottom: 0.67rem;
+ margin-bottom: 1.072rem;
}
.pure-form .pure-group input,
.pure-form .pure-group textarea {
display: block;
- padding: 0.625rem;
+ padding: 1rem;
margin: 0 0 -1px;
border-radius: 0;
position: relative;
@@ -279,7 +279,7 @@
margin: 0;
}
.pure-form .pure-group button {
- margin: 0.35rem 0;
+ margin: 0.56rem 0;
}
.pure-form .pure-input-1 {
@@ -306,22 +306,22 @@
.pure-form .pure-help-inline,
.pure-form-message-inline {
display: inline-block;
- padding-left: 0.3rem;
+ padding-left: 0.48rem;
color: var( --color-base );
vertical-align: middle;
- font-size: 0.875rem;
+ font-size: 1.4rem;
}
/* Block help for forms */
.pure-form-message {
display: block;
color: var( --color-base );
- font-size: 0.875rem;
+ font-size: 1.4rem;
}
@media only screen and ( max-width: 480px ) {
.pure-form button[type="submit"] {
- margin: 0.7rem 0 0;
+ margin: 1.12rem 0 0;
}
.pure-form input:not( [type] ),
@@ -340,7 +340,7 @@
.pure-form input[type="tel"],
.pure-form input[type="color"],
.pure-form label {
- margin-bottom: 0.3rem;
+ margin-bottom: 0.48rem;
display: block;
}
@@ -363,14 +363,14 @@
}
.pure-form-aligned .pure-control-group label {
- margin-bottom: 0.3rem;
+ margin-bottom: 0.48rem;
text-align: left;
display: block;
width: 100%;
}
.pure-form-aligned .pure-controls {
- margin: 1.5rem 0 0 0;
+ margin: 2.4rem 0 0 0;
}
/* NOTE: pure-help-inline is deprecated. Use .pure-form-message-inline
instead. */
@@ -378,8 +378,8 @@
.pure-form-message-inline,
.pure-form-message {
display: block;
- font-size: 0.75rem;
+ font-size: 1.2rem;
/* Increased bottom padding to make it group with its related input
element. */
- padding: 0.2rem 0 0.8rem;
+ padding: 0.32rem 0 1.28rem;
}
}
diff --git a/dev/wikipedia.org/assets/postcss/_other-languages-bookshelf.css
b/dev/wikipedia.org/assets/postcss/_other-languages-bookshelf.css
index 9e54d0e..5ca2e25 100644
--- a/dev/wikipedia.org/assets/postcss/_other-languages-bookshelf.css
+++ b/dev/wikipedia.org/assets/postcss/_other-languages-bookshelf.css
@@ -11,7 +11,7 @@
.bookshelf span {
background-color: var( --background-color-framed );
position: relative;
- top: -0.7rem;
+ top: -1.12rem;
font-weight: normal;
}
@@ -20,14 +20,14 @@
overflow: visible;
height: 1px;
width: 100%;
- margin: 1.5rem 0 1rem;
- font-size: 0.8125rem;
+ margin: 2.4rem 0 1.6rem;
+ font-size: 1.3rem;
font-weight: bold;
- line-height: 1.25rem;
+ line-height: 2rem;
}
.bookshelf-container .text {
- padding: 0 0.62rem;
+ padding: 0 0.992rem;
}
/* FIXME is .bookend being used somewhere ? */
diff --git a/dev/wikipedia.org/assets/postcss/_other-languages.css
b/dev/wikipedia.org/assets/postcss/_other-languages.css
index a64d218..7813a82 100644
--- a/dev/wikipedia.org/assets/postcss/_other-languages.css
+++ b/dev/wikipedia.org/assets/postcss/_other-languages.css
@@ -14,7 +14,7 @@
box-sizing: border-box;
max-height: 0;
width: 80%;
- margin: -1rem auto 3rem;
+ margin: -1.6rem auto 4.8rem;
transition: max-height 500ms ease-out, visibility 500ms ease-in 1000ms;
}
@@ -43,12 +43,12 @@
position: relative;
z-index: 1;
margin: 0 auto;
- padding: 0.4rem 0.8rem;
- outline: 1rem solid var( --background-color-base );
+ padding: 0.64rem 1.28rem;
+ outline: 1.6rem solid var( --background-color-base );
border: var( --border-base );
border-radius: var( --border-radius-base );
color: var( --color-primary );
- font-size: 0.8rem;
+ font-size: 1.28rem;
font-weight: normal;
line-height: 1;
transition: outline-width 100ms ease-in 500ms;
@@ -72,7 +72,7 @@
}
.lang-list-button-text {
- padding: 0 0.4rem;
+ padding: 0 0.64rem;
vertical-align: middle;
}
@@ -92,7 +92,7 @@
position: relative;
max-width: 460px;
width: 80%;
- margin: -1rem auto 1rem;
+ margin: -1.6rem auto 1.6rem;
height: 1px;
transition: max-width 200ms ease-out 400s;
}
@@ -110,7 +110,7 @@
position: relative;
box-sizing: border-box;
width: 100%;
- padding: 1rem 1rem 0;
+ padding: 1.6rem 1.6rem 0;
}
.sprite-icons-arrow-down-blue {
@@ -123,7 +123,7 @@
.langlist {
width: auto;
- margin: 1rem 0;
+ margin: 1.6rem 0;
text-align: left;
}
@@ -185,7 +185,7 @@
}
.langlist > ul {
- column-width: 7rem;
+ column-width: 11.2rem;
}
.langlist > ul > li {
@@ -202,7 +202,7 @@
}
.no-js .langlist > ul > li {
display: inline-block;
- padding: 0 0.5rem;
+ padding: 0 0.8rem;
}
.langlist > ul > li:before {
@@ -243,8 +243,8 @@
.lang-list-container {
width: auto;
- margin-left: 0.5rem;
- margin-right: 0.5rem;
+ margin-left: 0.8rem;
+ margin-right: 0.8rem;
}
.bookshelf {
diff --git a/dev/wikipedia.org/assets/postcss/_other-projects.css
b/dev/wikipedia.org/assets/postcss/_other-projects.css
index c5a7646..e9ec94f 100644
--- a/dev/wikipedia.org/assets/postcss/_other-projects.css
+++ b/dev/wikipedia.org/assets/postcss/_other-projects.css
@@ -9,7 +9,7 @@
float: left;
position: relative;
width: 33%;
- height: 5.625rem;
+ height: 9rem;
}
.other-project-link {
@@ -43,7 +43,7 @@
.other-project-tagline {
color: var( --ss-c-grey );
- font-size: 0.76rem;
+ font-size: 1.216rem;
}
@media screen and ( max-width: 768px ) {
@@ -66,10 +66,10 @@
@media screen and ( max-width: 320px ) {
.other-project-text {
margin-right: 5px;
- font-size: 0.72rem;
+ font-size: 1.152rem;
}
.other-project-tagline {
- font-size: 0.684rem;
+ font-size: 1.0944rem;
}
}
diff --git a/dev/wikipedia.org/assets/postcss/_search-language-picker.css
b/dev/wikipedia.org/assets/postcss/_search-language-picker.css
index c0fd7d2..257a90d 100644
--- a/dev/wikipedia.org/assets/postcss/_search-language-picker.css
+++ b/dev/wikipedia.org/assets/postcss/_search-language-picker.css
@@ -18,8 +18,8 @@
}
.styled-select .hide-arrow {
- right: 2rem;
- max-width: 4.25rem;
+ right: 3.2rem;
+ max-width: 6.8rem;
height: var( --ss-height );
padding: 0;
@@ -39,7 +39,7 @@
outline: 0;
box-sizing: border-box;
border: 0;
- line-height: 1.21875rem;
+ line-height: 1.95rem;
/*hide default down arrow in webkit */
-webkit-appearance: none;
@@ -68,12 +68,12 @@
.styled-select.no-js select {
opacity: 1;
margin: 0;
- padding: 0 1.5rem 0 0.5rem;
+ padding: 0 2.4rem 0 0.8rem;
color: var( --ss-c-grey );
}
.styled-select.no-js .hide-arrow {
- width: 4.25rem;
+ width: 6.8rem;
}
@@ -86,7 +86,7 @@
*/
.styled-select.js-enabled .hide-arrow {
- padding: 0 1.5rem 0 0.5rem;
+ padding: 0 2.4rem 0 0.8rem;
}
.styled-select.js-enabled select {
@@ -99,7 +99,7 @@
width: 100%;
border: 0;
margin: 0;
- padding: 0 1.5rem 0;
+ padding: 0 2.4rem 0;
color: transparent;
color: rgba( 255, 255, 255, 0 );
}
@@ -130,7 +130,7 @@
display: inline-block;
margin: 0;
color: var( --ss-c-grey );
- font-size: 0.8rem;
+ font-size: 1.28rem;
line-height: var( --ss-height );
text-transform: uppercase;
}
diff --git a/dev/wikipedia.org/assets/postcss/_search-suggestions.css
b/dev/wikipedia.org/assets/postcss/_search-suggestions.css
index 202ad7c..c49d682 100644
--- a/dev/wikipedia.org/assets/postcss/_search-suggestions.css
+++ b/dev/wikipedia.org/assets/postcss/_search-suggestions.css
@@ -21,9 +21,9 @@
display: block;
position: relative;
box-sizing: border-box;
- min-height: 4.375rem;
+ min-height: 7rem;
width: 100%;
- padding: 0.625rem 0.625rem 0.625rem 5.3125rem;
+ padding: 1rem 1rem 1rem 8.5rem;
border-bottom: 1px solid var( --wmui-color-base80 );
color: inherit;
text-decoration: none;
@@ -59,17 +59,17 @@
background-size: 100% auto;
background-size: cover;
height: 100%;
- width: 4.375rem;
+ width: 7rem;
position: absolute;
top: 0;
left: 0;
}
.suggestion-title {
- margin: 0 0 0.4875rem 0;
+ margin: 0 0 0.78rem 0;
color: var( --wmui-color-base20 );
- font-size: 0.975rem;
- line-height: 1.17rem;
+ font-size: 1.56rem;
+ line-height: 1.872rem;
}
.suggestion-link.active .suggestion-title {
@@ -84,6 +84,6 @@
.suggestion-description {
color: var( --wmui-color-base30 );
margin: 0;
- font-size: 0.8125rem;
- line-height: 0.89375rem;
+ font-size: 1.3rem;
+ line-height: 1.43rem;
}
diff --git a/dev/wikipedia.org/assets/postcss/_search.css
b/dev/wikipedia.org/assets/postcss/_search.css
index ff3846a..e655d69 100644
--- a/dev/wikipedia.org/assets/postcss/_search.css
+++ b/dev/wikipedia.org/assets/postcss/_search.css
@@ -4,18 +4,18 @@
float: none;
max-width: 95%;
width: 540px;
- margin: 0 auto 1.21875rem auto;
- padding: 0.24375rem;
+ margin: 0 auto 1.95rem auto;
+ padding: 0.39rem;
text-align: center;
vertical-align: middle;
}
.search-container button {
margin: 0;
- padding: 0.5rem 1rem;
+ padding: 0.8rem 1.6rem;
z-index: var( --ss-button-z-index );
- font-size: 1rem;
- line-height: 1.6rem;
+ font-size: 1.6rem;
+ line-height: 1.6;
vertical-align: middle;
}
@@ -45,19 +45,19 @@
.search-container .sprite-icons-arrow-down {
display: inline-block;
position: absolute;
- top: 0.375rem;
- right: 0.40625rem;
+ top: 0.6rem;
+ right: 0.65rem;
margin: 0;
vertical-align: middle;
}
#searchInput {
- height: 2.7rem;
+ height: 4.32rem;
width: 100%;
- padding: 0.5rem;
- padding-right: 6.4rem;
- font-size: 1rem;
- line-height: 1.6rem;
+ padding: 0.8rem;
+ padding-right: 10.24rem;
+ font-size: 1.6rem;
+ line-height: 1.6;
}
/* FIXME why should we have a class and an id ? */
@@ -66,7 +66,7 @@
display: inline-block;
position: relative;
width: 73%;
- margin-right: 0.5rem;
+ margin-right: 0.8rem;
vertical-align: top;
}
@@ -78,22 +78,22 @@
}
.search-container .pure-form fieldset {
- margin-left: 0.3125rem;
- margin-right: 5rem;
+ margin-left: 0.5rem;
+ margin-right: 8rem;
}
/* FIXME why should we have a class and an id ? */
.search-container .search-input {
- margin-left: 0.3125rem;
- margin-right: -4.375rem;
+ margin-left: 0.5rem;
+ margin-right: -7rem;
margin-bottom: 0;
width: 100%;
}
.search-container .pure-form button {
float: right;
- right: -4.375rem;
+ right: -7rem;
margin: 0;
- padding: 0.5rem 1rem;
+ padding: 0.8rem 1.6rem;
}
}
diff --git a/dev/wikipedia.org/assets/postcss/_vars.css
b/dev/wikipedia.org/assets/postcss/_vars.css
index 3e18164..7019117 100644
--- a/dev/wikipedia.org/assets/postcss/_vars.css
+++ b/dev/wikipedia.org/assets/postcss/_vars.css
@@ -153,16 +153,16 @@
--color-print--visited: #520;
/* Search language picker / Styled Select */
- --ss-pos-top: 0.625rem;
- --ss-pos-right: 0.75rem;
- --ss-pos-bottom: 0.75rem;
- --ss-width: 5.9375rem;
- --ss-height: 1.5rem;
+ --ss-pos-top: 1rem;
+ --ss-pos-right: 1.2rem;
+ --ss-pos-bottom: 1.2rem;
+ --ss-width: 9.5rem;
+ --ss-height: 2.4rem;
--ss-c-grey: var( --wmui-color-base20 );
--ss-c-grey-hover: var( --wmui-color-base90 );
- --ss-select-width: 6.875rem;
+ --ss-select-width: 11rem;
--ss-select-z-index: 1;
--ss-button-z-index: 2;
diff --git a/dev/wikipedia.org/assets/postcss/_wm-portal.css
b/dev/wikipedia.org/assets/postcss/_wm-portal.css
index 2ffa70a..11ffaf4 100644
--- a/dev/wikipedia.org/assets/postcss/_wm-portal.css
+++ b/dev/wikipedia.org/assets/postcss/_wm-portal.css
@@ -23,9 +23,9 @@
@media all and ( max-width: 480px ) {
.search-container {
margin-top: 0;
- height: 4.875rem;
+ height: 7.8rem;
position: absolute;
- top: 4.0625rem;
+ top: 6.5rem;
left: 0;
right: 0;
max-width: 100%;
@@ -54,7 +54,7 @@
}
hr {
- margin-top: 0.40625rem;
+ margin-top: 0.65rem;
}
}
--
To view, visit https://gerrit.wikimedia.org/r/344558
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I129a95e28136620e5e459ad7d096a82c56ba81f3
Gerrit-PatchSet: 2
Gerrit-Project: wikimedia/portals
Gerrit-Branch: master
Gerrit-Owner: JGirault <jgira...@wikimedia.org>
Gerrit-Reviewer: Jdrewniak <jdrewn...@wikimedia.org>
Gerrit-Reviewer: Mxn <m...@1ec5.org>
Gerrit-Reviewer: VolkerE <volke...@wikimedia.org>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
