Join the popup label into one message

The popup label was being styled as two words from two different
i18n messages, each a different colour. This combines them into
one, moves the identifing class name up to the outer span, and
colours both words blue (the outer braces are left black).

Bug: T174219
Change-Id: Id1166f48ae4b3b8daff29be56dd92ef330dd9cef
This commit is contained in:
Sam Wilson 2017-09-11 10:23:22 +08:00
parent 8fd002756a
commit b4b9da7e51
5 changed files with 10 additions and 19 deletions

View file

@ -44,8 +44,7 @@
], ],
"messages": [ "messages": [
"codemirror-toggle-label", "codemirror-toggle-label",
"codemirror-popup-syntax", "codemirror-popup-label",
"codemirror-popup-highlighting",
"codemirror-popup-desc", "codemirror-popup-desc",
"codemirror-popup-btn-yes", "codemirror-popup-btn-yes",
"codemirror-popup-btn-no" "codemirror-popup-btn-no"

View file

@ -8,8 +8,7 @@
"codemirror-toggle-label": "Syntax highlighting", "codemirror-toggle-label": "Syntax highlighting",
"codemirror-beta-title": "Wikitext syntax highlighting", "codemirror-beta-title": "Wikitext syntax highlighting",
"codemirror-beta-desc": "Syntax highlighting makes editing easier by using color and shade to visually separate page text from the code for links, references and templates.", "codemirror-beta-desc": "Syntax highlighting makes editing easier by using color and shade to visually separate page text from the code for links, references and templates.",
"codemirror-popup-syntax": "Syntax", "codemirror-popup-label": "Syntax Highlighting",
"codemirror-popup-highlighting": "Highlighting",
"codemirror-popup-desc": "Syntax highlighting will help you easily distinguish different parts of your edit by color coding them.", "codemirror-popup-desc": "Syntax highlighting will help you easily distinguish different parts of your edit by color coding them.",
"codemirror-popup-btn-yes": "Try it", "codemirror-popup-btn-yes": "Try it",
"codemirror-popup-btn-no": "No, thank you" "codemirror-popup-btn-no": "No, thank you"

View file

@ -12,8 +12,7 @@
"codemirror-toggle-label": "Title tooltip for button to toggle CodeMirror in the editing toolbar.", "codemirror-toggle-label": "Title tooltip for button to toggle CodeMirror in the editing toolbar.",
"codemirror-beta-title": "Title for syntax highlighting beta feature", "codemirror-beta-title": "Title for syntax highlighting beta feature",
"codemirror-beta-desc": "Description for syntax highlight beta feature", "codemirror-beta-desc": "Description for syntax highlight beta feature",
"codemirror-popup-syntax": "This message appears before the message {{msg-mw|codemirror-popup-highlighting}} to form the title \"Syntax Highlighting\" (with the two words having different styling). If you would translate \"Syntax Highlighting\" as \"Highlighting of Syntax\", translate this message as \"Highlighting\" and {{msg-mw|codemirror-popup-highlighting}} as \"Syntax\".", "codemirror-popup-label": "The title of the popup",
"codemirror-popup-highlighting": "This message appears after the message {{msg-mw|codemirror-popup-syntax}} to form the title \"Syntax Highlighting\" (with the two words having different styling). If you would translate \"Syntax Highlighting\" as \"Highlighting of Syntax\", translate {{msg-mw|codemirror-popup-highlighting}} as \"Highlighting\" and this message as \"Syntax\".",
"codemirror-popup-desc": "Description of the syntax highlighting feature in the popup", "codemirror-popup-desc": "Description of the syntax highlighting feature in the popup",
"codemirror-popup-btn-yes": "Text on the button for trying out codemirror", "codemirror-popup-btn-yes": "Text on the button for trying out codemirror",
"codemirror-popup-btn-no": "Text on the button for dismissing popup" "codemirror-popup-btn-no": "Text on the button for dismissing popup"

View file

@ -398,10 +398,8 @@
* If popup hasn't been shown before, show popup and add a localStorage entry. * If popup hasn't been shown before, show popup and add a localStorage entry.
* check it before showing popup in future. * check it before showing popup in future.
*/ */
/**
*/
function handlePopup() { function handlePopup() {
var yesButton, noButton, $title, $content, popup; var yesButton, noButton, $labelText, $label, $content, popup;
// If CodeMirror button doesn't exist, don't show popup // If CodeMirror button doesn't exist, don't show popup
if ( !$( '#mw-editbutton-codemirror' ).length ) { if ( !$( '#mw-editbutton-codemirror' ).length ) {
@ -422,14 +420,10 @@
label: mw.msg( 'codemirror-popup-btn-no' ), label: mw.msg( 'codemirror-popup-btn-no' ),
flags: [ 'destructive' ] flags: [ 'destructive' ]
} ); } );
$title = $labelText = $( '<span>' ).text( mw.msg( 'codemirror-popup-label' ) );
$( '<span>' ).append( $label = $( '<span>' )
'{ ', .addClass( 'codemirror-popup-label' )
$( '<span>' ).addClass( 'codemirror-popup-color-blue' ).text( mw.msg( 'codemirror-popup-syntax' ) ), .append( '{ ', $labelText, ' }' );
' ',
document.createTextNode( mw.msg( 'codemirror-popup-highlighting' ) ),
' }'
);
$content = $content =
$( '<div>' ).addClass( 'codemirror-popup-div' ).append( $( '<div>' ).addClass( 'codemirror-popup-div' ).append(
$( '<div>' ).addClass( 'codemirror-popup-text' ).text( mw.msg( 'codemirror-popup-desc' ) ), $( '<div>' ).addClass( 'codemirror-popup-text' ).text( mw.msg( 'codemirror-popup-desc' ) ),
@ -439,7 +433,7 @@
popup = new OO.ui.PopupWidget( { popup = new OO.ui.PopupWidget( {
head: true, head: true,
label: $title, label: $label,
classes: [ 'codemirror-popup' ], classes: [ 'codemirror-popup' ],
$content: $content, $content: $content,
$floatableContainer: $( '#mw-editbutton-codemirror' ), $floatableContainer: $( '#mw-editbutton-codemirror' ),

View file

@ -13,7 +13,7 @@
} }
} }
.codemirror-popup-color-blue { .codemirror-popup-label span {
color: #1e90ff; color: #1e90ff;
} }