jenkins-bot has submitted this change and it was merged.
Change subject: Add `:focus` state to language button
......................................................................
Add `:focus` state to language button
Adding `:focus` state to language button and also showing it only
when JS is enabled.
Bug: T143127
Change-Id: I775c9ed7082ae4b74c6e129cf0ff3fb0a404685d
---
M dev/wikipedia.org/assets/postcss/_lang-dropdown.css
1 file changed, 10 insertions(+), 4 deletions(-)
Approvals:
VolkerE: Looks good to me, approved
jenkins-bot: Verified
diff --git a/dev/wikipedia.org/assets/postcss/_lang-dropdown.css
b/dev/wikipedia.org/assets/postcss/_lang-dropdown.css
index 0069ee0..47f7af1 100644
--- a/dev/wikipedia.org/assets/postcss/_lang-dropdown.css
+++ b/dev/wikipedia.org/assets/postcss/_lang-dropdown.css
@@ -18,15 +18,19 @@
overflow: hidden;
max-height: 0;
width: 80%;
- transition: max-height 0.5s ease-out;
background-color: var( --ss-c-grey-hover );
+ transition: max-height 0.5s ease-out, visibility 0.5s ease-in 1s;
+}
+
+.js-enabled .lang-list-container {
+ visibility: hidden;
}
.lang-list-active .lang-list-container,
.no-js .lang-list-container {
+ visibility: visible;
max-height: 10000px;
- transition: max-height 1s ease-in;
- transition-delay: 0.2s;
+ transition: max-height 1s ease-in 0.2s, visibility 1s ease-in 0s;
}
.no-js .lang-list-button {
@@ -50,6 +54,7 @@
z-index: 1;
background-color: #fff;
border: 1px solid #ccc;
+ border-radius: 2px;
outline: 1rem solid #fff;
transition: outline-width 0.05s ease-in;
transition-delay: 0.5s;
@@ -78,7 +83,8 @@
}
.lang-list-button:focus {
- box-shadow: none;
+ border: 1px solid var( --c-primary );
+ box-shadow: inset 0 0 0 1px var( --c-primary );
}
.no-js .lang-list-button,
--
To view, visit https://gerrit.wikimedia.org/r/310505
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: I775c9ed7082ae4b74c6e129cf0ff3fb0a404685d
Gerrit-PatchSet: 6
Gerrit-Project: wikimedia/portals
Gerrit-Branch: master
Gerrit-Owner: Jdrewniak <jdrewn...@wikimedia.org>
Gerrit-Reviewer: JGirault <julien.inbox.w...@gmail.com>
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
