wikimedia/mediawiki-skins-Vector
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git synced 2024-11-23 23:33:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge "Use client preferences for appearances menu"

Browse source
This commit is contained in:
jenkins-bot 2024-04-16 18:02:38 +00:00 committed by Gerrit Code Review
parent e678a43b6e c69a53a16c
commit f0673ac58a
9 changed files with 36 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
doc/configuration/configuration.md
View file

@ -173,4 +173,4 @@ The following are interface elements or settings that users can customize within
6. Vector Font Size (`vector-font-size`): Allows the user to select the preferred font size for the Vector. It can be set to 0 for regular, 1 for large, or 2 for x-large.
7. Vector Night Mode (`vector-theme`): Specifies the preference for night mode in Vector. It can be set to 'day' for (disabled), 'night' (enabled), and 'os' (automatic based on system preferences). For logged in users this feature can be forced on via the ?vectornightmode=night or ?vectornightmode=1 query string parameter.
7. Vector Night Mode (`vector-theme`): Specifies the preference for night mode in Vector. It can be set to 'day' for (disabled), 'night' (enabled), and 'os' (automatic based on system preferences). For logged in users this feature can be forced on via the ?vectornightmode=night or ?vectornightmode=1 query string parameter.

1
includes/Components/VectorComponentClientPrefs.php
View file

@ -28,6 +28,7 @@ class VectorComponentClientPrefs implements VectorComponent {
FeatureManager $featureManager
) {
$this->localizer = $localizer;
// FIXME: isPinned is no longer accurate because the appearance menu uses client preferences
$this->isPinned = $featureManager->isFeatureEnabled( Constants::FEATURE_CLIENT_PREFS_PINNED );
}

1
includes/Components/VectorComponentTableOfContents.php
View file

@ -43,6 +43,7 @@ class VectorComponentTableOfContents implements VectorComponent {
) {
$this->tocData = $tocData;
$this->localizer = $localizer;
// FIXME: isPinned is no longer accurate because the appearance menu uses client preferences
$this->isPinned = $featureManager->isFeatureEnabled( Constants::FEATURE_TOC_PINNED );
$this->config = $config;
$this->pinnableHeader = new VectorComponentPinnableHeader(

1
includes/FeatureManagement/FeatureManager.php
View file

@ -195,6 +195,7 @@ class FeatureManager {
break;
case CONSTANTS::FEATURE_LIMITED_WIDTH:
case CONSTANTS::FEATURE_TOC_PINNED:
case CONSTANTS::FEATURE_CLIENT_PREFS_PINNED:
$suffixEnabled = 'clientpref-1';
$suffixDisabled = 'clientpref-0';
break;

2
includes/FeatureManagement/FeatureManagerFactory.php
View file

@ -265,7 +265,7 @@ class FeatureManagerFactory {
]
);
// Feature: T345363: Client preferences dialog
// Feature: T345363: Client preferences menu
// ============================================
$featureManager->registerRequirement(
new OverridableConfigRequirement(

1
resources/skins.vector.js/features.js
View file

@ -14,6 +14,7 @@ function save( feature, enabled ) {
switch ( feature ) {
case 'toc-pinned':
case 'limited-width':
case 'client-prefs-pinned':
// Save the setting under the new system
// @ts-ignore https://github.com/wikimedia/typescript-types/pull/44
mw.user.clientPrefs.set( `vector-feature-${ feature }`, enabled ? '1' : '0' );

17
resources/skins.vector.js/pinnableElement.js
View file

@ -239,12 +239,29 @@ function movePinnableElement( pinnableElementId, newContainerId ) {
popupNotification.hideAll();
}
/**
* Update the pinnable element location in the DOM based off of whether its pinned or not.
* This is only necessary with pinnable elements that use client preferences (i.e. appearances menu)
* as all other pinnable elements should be serverside rendered in the correct location
*
* @param {HTMLElement} header
*/
function updatePinnableElementLocation( header ) {
const newContainerId = isPinned( header ) ?
header.dataset.pinnedContainerId :
header.dataset.unpinnedContainerId;
if ( header.dataset.pinnableElementId && newContainerId ) {
movePinnableElement( header.dataset.pinnableElementId, newContainerId );
}
}
function initPinnableElement() {
const pinnableHeader = /** @type {NodeListOf<HTMLElement>} */ ( document.querySelectorAll( '.vector-pinnable-header' ) );
pinnableHeader.forEach( ( header ) => {
if ( header.dataset.featureName && header.dataset.pinnableElementId ) {
bindPinnableToggleButtons( header );
bindPinnableBreakpoint( header );
updatePinnableElementLocation( header );
}
} );
}

5
resources/skins.vector.styles/components/ClientPreferences.less
View file

@ -1,6 +1,9 @@
// Ensure there is only 1 client prefs landmark at anytime
// TODO: Remove old classes after has been in prod
.vector-feature-client-prefs-pinned-enabled .vector-user-links .vector-client-prefs-landmark,
.vector-feature-client-prefs-pinned-disabled .vector-column-end .vector-client-prefs-landmark {
.vector-feature-client-prefs-pinned-disabled .vector-column-end .vector-client-prefs-landmark,
.vector-feature-client-prefs-pinned-clientpref-1 .vector-user-links .vector-client-prefs-landmark,
.vector-feature-client-prefs-pinned-clientpref-0 .vector-column-end .vector-client-prefs-landmark {
display: none;
}

12
resources/skins.vector.styles/layouts/grid.less
View file

@ -31,8 +31,10 @@
grid-area: footer;
}
// Remove selector after I636a557e724f23ea18da135bac59cb304ba81091 has been in prod
.vector-feature-page-tools-pinned-enabled .vector-column-end,
.vector-feature-client-prefs-pinned-enabled .vector-column-end {
.vector-feature-client-prefs-pinned-enabled .vector-column-end,
.vector-feature-client-prefs-pinned-clientpref-1 .vector-column-end {
width: @width-column-desktop;
}
@ -65,8 +67,10 @@
}
}
// TODO: Remove old classes after I636a557e724f23ea18da135bac59cb304ba81091 has been in prod
.vector-feature-page-tools-pinned-enabled .vector-column-end,
.vector-feature-client-prefs-pinned-enabled .vector-column-end {
.vector-feature-client-prefs-pinned-enabled .vector-column-end,
.vector-feature-client-prefs-pinned-clientpref-1 .vector-column-end {
width: @width-column-desktop-wide;
}
}
@ -122,8 +126,10 @@
}
}
// TODO: Remove old classes after I636a557e724f23ea18da135bac59cb304ba81091 has been in prod
.vector-feature-page-tools-pinned-enabled .mw-body,
.vector-feature-client-prefs-pinned-enabled .mw-body {
.vector-feature-client-prefs-pinned-enabled .mw-body,
.vector-feature-client-prefs-pinned-clientpref-1 .mw-body {
column-gap: @grid-column-gap;
}