jenkins-bot has submitted this change and it was merged.
Change subject: Align leftover colors to overhauled color palette
......................................................................
Align leftover colors to overhauled color palette
Aligning several colors to overhauled color palette, that
were left behind so far. Also making better use of WikimediaUI Base
variables.
Bug: T146231
Change-Id: I8a0ac44228d86c520cd5892b06496881f42d049e
---
M dev/wikipedia.org/assets/postcss/_forms.css
M dev/wikipedia.org/assets/postcss/_lang-dropdown.css
M dev/wikipedia.org/assets/postcss/_search-box.css
M dev/wikipedia.org/assets/postcss/_vars.css
4 files changed, 21 insertions(+), 26 deletions(-)
Approvals:
JGirault: Looks good to me, approved
jenkins-bot: Verified
diff --git a/dev/wikipedia.org/assets/postcss/_forms.css
b/dev/wikipedia.org/assets/postcss/_forms.css
index f92929a..013691e 100644
--- a/dev/wikipedia.org/assets/postcss/_forms.css
+++ b/dev/wikipedia.org/assets/postcss/_forms.css
@@ -28,15 +28,16 @@
.pure-form input[type="color"],
.pure-form select,
.pure-form textarea {
- padding: 0.5em;
+ background-color: var( --background-color-base );
display: inline-block;
- border: 1px solid #ccc;
- box-shadow: inset 0 0 0 0 rgb( 52, 123, 255 );
- border-radius: 0.1em;
- vertical-align: middle;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
+ border: var( --border-base );
+ border-radius: var( --border-radius-base );
+ padding: 0.5em;
+ box-shadow: inset 0 0 0 1px var( --background-color-base );
+ vertical-align: middle;
}
/*
@@ -46,8 +47,7 @@
.pure-form input:not( [type] ) {
padding: 0.5em 0.6em;
display: inline-block;
- border: 1px solid #ccc;
- box-shadow: inset 0 1px 3px #ddd;
+ border: var( --border-base );
border-radius: 4px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
@@ -78,7 +78,7 @@
.pure-form textarea:focus {
outline: 0;
border-color: var( --color-primary );
- box-shadow: inset 0 0 0 0.1em var( --color-primary );
+ box-shadow: var( --box-shadow-base--focus );
}
/*
@@ -118,9 +118,9 @@
.pure-form input[type="color"][disabled],
.pure-form select[disabled],
.pure-form textarea[disabled] {
- cursor: not-allowed;
+ cursor: var( --cursor-base--disabled );
background-color: #eaeded;
- color: #cad2d3;
+ color: var( --color-base--disabled );
}
/*
@@ -128,7 +128,7 @@
since IE8 won't execute CSS that contains a CSS3 selector.
*/
.pure-form input:not([type])[disabled] {
- cursor: not-allowed;
+ cursor: var( --cursor-base--disabled );
background-color: #eaeded;
color: #cad2d3;
}
@@ -154,7 +154,7 @@
.pure-form select {
/* Normalizes the height; padding is not sufficient. */
height: 2.25em;
- border: 1px solid #ccc;
+ border: var( --border-base );
background-color: #fff;
}
.pure-form select[multiple] {
@@ -173,8 +173,7 @@
width: 100%;
padding: 0.3em 0;
margin-bottom: 0.3em;
- color: #333;
- border-bottom: 1px solid #e5e5e5;
+ color: var( --color-base );
}
.pure-form-stacked input[type="text"],
diff --git a/dev/wikipedia.org/assets/postcss/_lang-dropdown.css
b/dev/wikipedia.org/assets/postcss/_lang-dropdown.css
index ea9c58e..c07db7e 100644
--- a/dev/wikipedia.org/assets/postcss/_lang-dropdown.css
+++ b/dev/wikipedia.org/assets/postcss/_lang-dropdown.css
@@ -8,7 +8,7 @@
*/
hr {
- border-color: #ccc;
+ border-color: var( --border-color-heading );
}
.lang-list-container {
@@ -18,7 +18,7 @@
overflow: hidden;
max-height: 0;
width: 80%;
- background-color: var( --ss-c-grey-hover );
+ background-color: var( --background-color-framed );
transition: max-height 0.5s ease-out, visibility 0.5s ease-in 1s;
}
@@ -54,10 +54,9 @@
z-index: 1;
background-color: var( --background-color-framed );
border: var( --border-base );
- border-radius: 2px;
+ border-radius: var( --border-radius-base );
outline: 1rem solid #fff;
- transition: outline-width 0.05s ease-in;
- transition-delay: 0.5s;
+ transition: outline-width 0.05s ease-in 0.5s;
}
.lang-list-button:hover {
@@ -99,9 +98,8 @@
max-width: 460px;
width: 80%;
height: 1px;
- background-color: #c8ccd1;
- transition: max-width 0.2s ease-out;
- transition-delay: 0.4s;
+ background-color: var( --border-color-heading );
+ transition: max-width 0.2s ease-out 0.4s;
}
.lang-list-active .lang-list-border {
@@ -138,11 +136,11 @@
.bookshelf {
text-align: center;
white-space: normal;
- border-top: 1px solid #ddd;
+ border-top: 1px solid var( --border-color-heading );
box-shadow: 0 -1px 0 #fff;
}
.bookshelf span {
- background-color: var( --ss-c-grey-hover );
+ background-color: var( --background-color-framed );
position: relative;
top: -0.7rem;
font-weight: normal;
diff --git a/dev/wikipedia.org/assets/postcss/_search-box.css
b/dev/wikipedia.org/assets/postcss/_search-box.css
index 84ee911..c1a5148 100644
--- a/dev/wikipedia.org/assets/postcss/_search-box.css
+++ b/dev/wikipedia.org/assets/postcss/_search-box.css
@@ -18,7 +18,6 @@
width: 100%;
padding-right: 6.4rem;
height: 2.7rem;
- background: var( --ss-c-white-bg );
}
.search-container button {
diff --git a/dev/wikipedia.org/assets/postcss/_vars.css
b/dev/wikipedia.org/assets/postcss/_vars.css
index 1b789e6..fe884bd 100644
--- a/dev/wikipedia.org/assets/postcss/_vars.css
+++ b/dev/wikipedia.org/assets/postcss/_vars.css
@@ -157,7 +157,6 @@
--ss-width: 95px;
--ss-height: 24px;
- --ss-c-white-bg: var( --wmui-color-base100 );
--ss-c-grey: var( --wmui-color-base20 );
--ss-c-grey-hover: var( --wmui-color-base90 );
--
To view, visit https://gerrit.wikimedia.org/r/325057
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I8a0ac44228d86c520cd5892b06496881f42d049e
Gerrit-PatchSet: 2
Gerrit-Project: wikimedia/portals
Gerrit-Branch: master
Gerrit-Owner: VolkerE <volke...@wikimedia.org>
Gerrit-Reviewer: JGirault <julien.inbox.w...@gmail.com>
Gerrit-Reviewer: Jdrewniak <jdrewn...@wikimedia.org>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
