jenkins-bot has submitted this change and it was merged. Change subject: Adjust styling of CAPTCHA in alpha ......................................................................
Adjust styling of CAPTCHA in alpha Add styling rules that let the CAPTCHA section looks more like the other fields in this form. Bug: T87256 Change-Id: Iaff53c40c8c5536a87330669c558d3c3760f0190 --- A resources/skins.minerva.special.userlogin.styles/icons/refresh.png A resources/skins.minerva.special.userlogin.styles/icons/refresh.svg M resources/skins.minerva.special.userlogin.styles/userlogin.less 3 files changed, 62 insertions(+), 16 deletions(-) Approvals: Jdlrobson: Looks good to me, approved jenkins-bot: Verified diff --git a/resources/skins.minerva.special.userlogin.styles/icons/refresh.png b/resources/skins.minerva.special.userlogin.styles/icons/refresh.png new file mode 100644 index 0000000..8dc3b67 --- /dev/null +++ b/resources/skins.minerva.special.userlogin.styles/icons/refresh.png Binary files differ diff --git a/resources/skins.minerva.special.userlogin.styles/icons/refresh.svg b/resources/skins.minerva.special.userlogin.styles/icons/refresh.svg new file mode 100644 index 0000000..78e0335 --- /dev/null +++ b/resources/skins.minerva.special.userlogin.styles/icons/refresh.svg @@ -0,0 +1,11 @@ +<?xml version="1.0" encoding="utf-8"?> +<!-- Generator: Adobe Illustrator 17.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> +<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" + width="40px" height="40px" viewBox="0 0 40 40" enable-background="new 0 0 40 40" xml:space="preserve"> +<path fill="#787878" d="M33.117,6.516c-3.263-3-7.613-4.835-12.385-4.835C10.632,1.681,2.414,9.899,2.414,20 + s8.218,18.319,18.319,18.319c5.042,0,9.615-2.048,12.93-5.356l-3.625-3.625c-2.387,2.378-5.677,3.852-9.305,3.852 + C13.46,33.189,7.543,27.273,7.543,20S13.46,6.811,20.733,6.811c3.357,0,6.424,1.263,8.754,3.336l-4.358,4.358h7.589h4.868v-1.68 + V2.048L33.117,6.516z"/> +</svg> + diff --git a/resources/skins.minerva.special.userlogin.styles/userlogin.less b/resources/skins.minerva.special.userlogin.styles/userlogin.less index 9fcf44d..9fbbbaf 100644 --- a/resources/skins.minerva.special.userlogin.styles/userlogin.less +++ b/resources/skins.minerva.special.userlogin.styles/userlogin.less @@ -16,7 +16,10 @@ margin: 1em 0; } -.inputs-box { +// FIXME: This should be merged with the .captcha rule in the alpha section +// once the alpha login page is moved to stable +.inputs-box, +.captcha { border: solid 1px @colorGray12; border-radius: 5px; overflow: hidden; @@ -24,7 +27,7 @@ margin: 0 0 .8em; text-align: center; - input:not([type=submit]), img { + input:not([type=submit]), img, #wpCaptchaWord { border: none; border-top: solid 1px @colorGray12; @@ -61,22 +64,27 @@ display: block; } } +} - /* fancycaptcha reload button */ - #mf-captcha-reload-container { - border-top: 1px dashed #e1e1e1; - display: inline-block; - padding: 14px 25%; +// FIXME: Should be moved into the .captcha class, once the alpha +// login page is moved to stable +/* fancycaptcha reload button */ +#mf-captcha-reload-container, +.alpha .confirmedit-captcha-reload { + border-top: 1px dashed #e1e1e1; + display: inline-block; + padding: 14px 25%; - // FIXME: Make use of icon classes - .fancycaptcha-reload { - color: @colorGray7; - font-weight: bold; - .background-image('images/login/refresh.png'); - background-repeat: no-repeat; - background-size: 24px; - padding: 4px 0px 4px 26px; - } + // FIXME: Make use of icon classes + .fancycaptcha-reload, + &.fancycaptcha-reload { + color: @colorGray7; + font-weight: bold; + .background-image-svg('icons/refresh.svg', 'icons/refresh.png'); + background-position: center left; + background-repeat: no-repeat; + background-size: 16px; + padding: 4px 0px 4px 26px; } } @@ -111,6 +119,33 @@ .mw-createacct-benefits-container { display: none; } + + // CAPTCHA style improvements + .captcha { + border-radius: 2px; + margin: .8em 0 0; + + // CAPTCHA's are well known by internet users, save the space of the explanation + > p, + label { + display: none; + } + + // FancyCaptcha things + .fancycaptcha-image-container img { + display: block; + margin-left: auto; + margin-right: auto; + } + + .mw-createacct-captcha-assisted { + font-size: .8em; + } + + .confirmedit-captcha-reload { + position: relative; + } + } } // The following css rules apply to beta/alpha mobile only -- To view, visit https://gerrit.wikimedia.org/r/231147 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: merged Gerrit-Change-Id: Iaff53c40c8c5536a87330669c558d3c3760f0190 Gerrit-PatchSet: 3 Gerrit-Project: mediawiki/extensions/MobileFrontend Gerrit-Branch: master Gerrit-Owner: Florianschmidtwelzow <[email protected]> Gerrit-Reviewer: Florianschmidtwelzow <[email protected]> Gerrit-Reviewer: Jdlrobson <[email protected]> Gerrit-Reviewer: jenkins-bot <> _______________________________________________ MediaWiki-commits mailing list [email protected] https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
