Santhosh has uploaded a new change for review.
https://gerrit.wikimedia.org/r/200508
Change subject: Revert "Update inputs to use mw-ui styles"
......................................................................
Revert "Update inputs to use mw-ui styles"
This reverts commit 30d26a4fd2a239f8874f1983972a266246b79548.
The style update is incomplete and make the dialog styles broken.
Following problems are noticed:
- Large font sizes
- Buttons missing colors(green, blue, red)
- Language name buttons breaking to two lines
- Unnecessary button.css not removed
Change-Id: I35c1eb2db5ead8ca75dc2724997d789c83c69b6d
---
M Resources.php
M resources/css/ext.uls.inputsettings.css
M resources/js/ext.uls.displaysettings.js
M resources/js/ext.uls.inputsettings.js
M resources/js/ext.uls.languagesettings.js
5 files changed, 32 insertions(+), 33 deletions(-)
git pull
ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/UniversalLanguageSelector
refs/changes/08/200508/1
diff --git a/Resources.php b/Resources.php
index a2298a5..4e0a8cf 100644
--- a/Resources.php
+++ b/Resources.php
@@ -34,7 +34,6 @@
'ext.uls.mediawiki',
'ext.uls.webfonts',
'mediawiki.api.parse',
- 'mediawiki.ui.checkbox',
),
) + $resourcePaths;
@@ -102,7 +101,6 @@
'ext.uls.languagesettings',
'ext.uls.mediawiki',
'jquery.ime',
- 'mediawiki.ui.radio',
),
) + $resourcePaths;
@@ -131,6 +129,7 @@
'scripts' => 'resources/js/ext.uls.languagesettings.js',
'styles' => 'resources/css/ext.uls.languagesettings.css',
'dependencies' => array(
+ 'ext.uls.buttons',
'ext.uls.messages',
'ext.uls.preferences',
// The grid styles are used here,
@@ -255,7 +254,6 @@
'jquery.i18n',
'jquery.uls.data',
'jquery.uls.grid',
- 'mediawiki.ui.input',
),
) + $resourcePaths;
diff --git a/resources/css/ext.uls.inputsettings.css
b/resources/css/ext.uls.inputsettings.css
index bb9484c..1065807 100644
--- a/resources/css/ext.uls.inputsettings.css
+++ b/resources/css/ext.uls.inputsettings.css
@@ -12,7 +12,7 @@
}
.imelabel {
- display: inline;
+ display: block;
padding-bottom: 10px;
font-size: 10pt;
line-height: 16pt;
@@ -22,6 +22,10 @@
padding-left: 5px;
}
+.imelabel input {
+ float: left;
+}
+
.uls-ime-menu-settings-item {
background-color: #f0f0f0;
border-radius: 0 0 5px 5px;
diff --git a/resources/js/ext.uls.displaysettings.js
b/resources/js/ext.uls.displaysettings.js
index 4a06124..3d90e05 100644
--- a/resources/js/ext.uls.displaysettings.js
+++ b/resources/js/ext.uls.displaysettings.js
@@ -23,9 +23,9 @@
+ '<div class="row">' // Tab switcher buttons
+ '<div class="twelve columns
uls-display-settings-tab-switcher">'
- + '<div class="uls-button-group mw-ui-button-group">'
- + '<button id="uls-display-settings-language-tab"
class="mw-ui-button mw-ui-checked"
data-i18n="ext-uls-display-settings-language-tab"></button>'
- + '<button id="uls-display-settings-fonts-tab"
class="mw-ui-button" data-i18n="ext-uls-display-settings-fonts-tab"></button>'
+ + '<div class="uls-button-group">'
+ + '<button id="uls-display-settings-language-tab" class="button
down" data-i18n="ext-uls-display-settings-language-tab"></button>'
+ + '<button id="uls-display-settings-fonts-tab" class="button"
data-i18n="ext-uls-display-settings-fonts-tab"></button>'
+ '</div>'
+ '</div>'
+ '</div>'
@@ -79,9 +79,9 @@
// Webfonts enabling checkbox with label
+ '<div class="row">'
- + '<div class="eleven columns mw-ui-checkbox">'
+ + '<div class="eleven columns">'
+ + '<label class="checkbox">'
+ '<input type="checkbox" id="webfonts-enable-checkbox" />'
- + '<label class="checkbox" for="webfonts-enable-checkbox">'
+ '<strong
data-i18n="ext-uls-webfonts-settings-title"></strong> '
+ '<span data-i18n="ext-uls-webfonts-settings-info"></span> '
+ '<a target="_blank"
href="https://www.mediawiki.org/wiki/Universal_Language_Selector/WebFonts";
data-i18n="ext-uls-webfonts-settings-info-link"></a>'
@@ -242,8 +242,8 @@
return function () {
displaySettings.markDirty();
displaySettings.uiLanguage =
button.data( 'language' ) || displaySettings.uiLanguage;
- $( 'div.uls-ui-languages
button.mw-ui-button' ).removeClass( 'mw-ui-checked' );
- button.addClass( 'mw-ui-checked' );
+ $( 'div.uls-ui-languages button.button'
).removeClass( 'down' );
+ button.addClass( 'down' );
displaySettings.prepareUIFonts();
displaySettings.preview(
displaySettings.uiLanguage );
};
@@ -253,7 +253,7 @@
for ( i = 0; i < SUGGESTED_LANGUAGES_NUMBER; i++ ) {
language = languagesForButtons[i];
$button = $( '<button>' )
- .addClass( 'mw-ui-button
uls-language-button autonym' )
+ .addClass( 'button uls-language-button
autonym' )
.text( $.uls.data.getAutonym( language
) )
.prop( {
lang: language,
@@ -261,7 +261,7 @@
} );
if ( language === this.uiLanguage ) {
- $button.addClass( 'mw-ui-checked' );
+ $button.addClass( 'down' );
}
$button.data( 'language', language );
@@ -282,7 +282,7 @@
$languages = this.$template.find(
'div.uls-ui-languages' );
$moreLanguagesButton = $( '<button>' )
.prop( 'class', 'uls-more-languages' )
- .addClass( 'mw-ui-button' ).text( '...' );
+ .addClass( 'button' ).text( '...' );
$languages.append( $moreLanguagesButton );
// Show the long language list to select a language for
display settings
@@ -578,7 +578,7 @@
$tabButtons.on( 'click', function () {
var $button = $( this );
- if ( $button.hasClass( 'mw-ui-checked' ) ) {
+ if ( $button.hasClass( 'down' ) ) {
return;
}
@@ -593,8 +593,8 @@
} );
displaySettings.$parent.position();
- $tabButtons.filter( '.mw-ui-checked'
).removeClass( 'mw-ui-checked' );
- $button.addClass( 'mw-ui-checked' );
+ $tabButtons.filter( '.down' ).removeClass(
'down' );
+ $button.addClass( 'down' );
} );
diff --git a/resources/js/ext.uls.inputsettings.js
b/resources/js/ext.uls.inputsettings.js
index cd61fda..c08de49 100644
--- a/resources/js/ext.uls.inputsettings.js
+++ b/resources/js/ext.uls.inputsettings.js
@@ -48,9 +48,9 @@
// Disable IME system button
+ '<div class="row">'
- + '<div class="eleven columns
uls-input-settings-disable-info"></div>'
- + '<div class="six columns uls-input-settings-toggle">'
- + '<button class="mw-ui-button
uls-input-toggle-button"></button>'
+ + '<div class="eleven columns button
uls-input-settings-disable-info"></div>'
+ + '<div class="six columns button uls-input-settings-toggle">'
+ + '<button class="active green button
uls-input-toggle-button"></button>'
+ '</div>'
+ '</div>';
@@ -119,7 +119,7 @@
$imeListTitle = this.$template.find(
'.ext-uls-input-settings-imes-title' );
$imeListContainer = this.$template.find(
'.uls-input-settings-inputmethods-list' );
- $imeListContainer.find( 'div, label' ).remove();
+ $imeListContainer.find( 'label' ).remove();
if ( !imes ) {
$imeListContainer.append( $( '<label>' )
@@ -159,15 +159,13 @@
* @return {Object} jQuery object corresponding to the input
method item.
*/
renderInputmethodOption: function ( imeId, selected ) {
- var $imeHolder, $imeLabel, name, description,
$helplink, inputmethod, $inputMethodItem;
+ var $imeLabel, name, description, $helplink,
inputmethod, $inputMethodItem;
if ( imeId !== 'system' && !$.ime.sources[imeId] ) {
// imeId not known for jquery.ime.
// It is very rare, but still validate it.
return $();
}
-
- $imeHolder = $( '<div>' ).addClass( 'mw-ui-radio' );
$imeLabel = $( '<label>' ).attr( {
'for': imeId,
@@ -181,7 +179,7 @@
checked: selected
} );
- $imeHolder.append( $inputMethodItem );
+ $imeLabel.append( $inputMethodItem );
if ( imeId === 'system' ) {
name = $.i18n( 'ext-uls-disable-input-method' );
@@ -211,8 +209,7 @@
$helplink
);
- $imeHolder.append( $imeLabel );
- return $imeHolder;
+ return $imeLabel;
},
/**
@@ -277,8 +274,8 @@
$.ime.preferences.setLanguage(
language );
}
// Mark the button selected
- $( '.uls-ui-languages .mw-ui-button'
).removeClass( 'mw-ui-checked' );
- button.addClass( 'mw-ui-checked' );
+ $( '.uls-ui-languages .button'
).removeClass( 'down' );
+ button.addClass( 'down' );
inputSettings.prepareInputmethods(
language );
};
}
@@ -289,7 +286,7 @@
for ( i = 0; i < SUGGESTED_LANGUAGES_NUMBER; i++ ) {
language = languagesForButtons[i];
$button = $( '<button>' )
- .addClass( 'mw-ui-button
uls-language-button autonym' )
+ .addClass( 'button uls-language-button
autonym' )
.text( $.uls.data.getAutonym( language
) )
.prop( {
lang: language,
@@ -321,7 +318,7 @@
$languages = this.$template.find( '.uls-ui-languages' );
$moreLanguagesButton = $( '<button>' )
.prop( 'class', 'uls-more-languages' )
- .addClass( 'mw-ui-button' ).text( '...' );
+ .addClass( 'button' ).text( '...' );
$languages.append( $moreLanguagesButton );
// Show the long language list to select a language for
ime settings
diff --git a/resources/js/ext.uls.languagesettings.js
b/resources/js/ext.uls.languagesettings.js
index d199856..5f93693 100644
--- a/resources/js/ext.uls.languagesettings.js
+++ b/resources/js/ext.uls.languagesettings.js
@@ -34,8 +34,8 @@
// Apply and Cancel buttons
buttonsRow = '<div class="row language-settings-buttons">' +
'<div class="eleven columns">' +
- '<button class="mw-ui-button uls-settings-cancel"
data-i18n="ext-uls-language-settings-cancel"></button>' +
- '<button class="mw-ui-button mw-ui-constuctive
uls-settings-apply" data-i18n="ext-uls-language-settings-apply"
disabled></button>' +
+ '<button class="button uls-settings-cancel"
data-i18n="ext-uls-language-settings-cancel"></button>' +
+ '<button class="button active blue uls-settings-apply"
data-i18n="ext-uls-language-settings-apply" disabled></button>' +
'</div>' +
'</div>' +
'</div>';
--
To view, visit https://gerrit.wikimedia.org/r/200508
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: newchange
Gerrit-Change-Id: I35c1eb2db5ead8ca75dc2724997d789c83c69b6d
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/UniversalLanguageSelector
Gerrit-Branch: master
Gerrit-Owner: Santhosh <santhosh.thottin...@gmail.com>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
