OOUI/Themes/nl

This page is a translated version of the page OOUI/Themes and the translation is 100% complete.

Thema's geven aan hoe OOUI-interfaces eruit zien en aanvoelen. Een maker van een skin kan thema's aanmaken en deze gebruiken in MediaWiki.

Thema's bieden voornamelijk de CSS, maar ze kunnen ook wat JavaScript-code leveren (in de praktijk wordt dit alleen gebruikt om pictogramvarianten te implementeren) en aangepaste pictogramafbeeldingen (in de praktijk nu niet gebruikt).

Ingebouwde thema's

Twee thema's worden standaard verstrekt.

We zijn niet van plan om meer dan twee ingebouwde thema's te hebben vanwege de extra inspanning die nodig zou zijn om ze te onderhouden.

Aangepaste thema's

Het is mogelijk om aangepaste OOUI-thema's te maken. Merk op dat dit veel initieel werk en veel voortdurende inspanning vereist om uw thema up-to-date te houden met OOUI-wijzigingen.

OOUI-thema's moeten nu in dezelfde repository leven als de hoofdbroncode van OOUI (T76632), vanwege beperkingen in het bouwproces.

Een nieuw OOUI-thema maken:

  1. Fork de OOUI-repository, bijvoorbeeld van https://github.com/wikimedia/oojs-ui.
  2. Navigeer naar de map oojs-ui en voer npm install uit
  3. Zorg ervoor dat u de bibliotheek kunt maken met grunt build en bekijk de demo. Om de demo te initialiseren, voert u npm run-script demos uit en opent u /resources/lib/oojs-ui/demos/index.html in uw browser.
  4. Voer grunt add-theme --name=FooBar --template=Blank uit en vervang de naam van uw thema door FooBar. In plaats van het thema Blank te gebruiken, kunt u ook beginnen met Apex of WikimediaUI.
    • Hiermee wordt een kopie van het sjabloonthema onder een nieuwe naam gemaakt en worden het bouwproces en de demo's aangepast om uw nieuwe thema op te nemen. Voer daarna grunt build uit om het bouwproces het nieuwe thema te laten oppikken.
    • De stijlen van uw thema staan nu in src/themes/foobar/.
    • De themanamen zijn hoofdlettergevoelig; Als u de naam van het sjabloonthema in kleine letters typt, krijgt u verwarrende fouten. Misschien wilt u uw thema ook een hoofdletter met hoofdletters geven om lint-fouten te voorkomen.
  5. Schrijf de stijlen voor uw thema!
    • Voer grunt build (of grunt quick-build) uit om het te bouwen, gebruik de demo om uw wijzigingen te testen.
  6. Voeg regelmatig de wijzigingen uit de OOUI-repository samen in uw fork. We brengen om de paar weken een versie van OOUI uit. U moet het waarschijnlijk op zijn minst doen voor nieuwe MediaWiki-versies (ongeveer elke 6 maanden).
    • Hoewel we meestal geen onnodige wijzigingen aanbrengen waarvoor oplossingen voor themastijlen nodig zijn, gebeuren ze soms en zijn er waarschijnlijk geen waarschuwingen. Sorry. U kunt kijken naar wijzigingen in het Apex-thema om dingen te herkennen die waarschijnlijk ook van invloed zijn op uw thema (Apex is niet in actieve ontwikkeling).
    • Zelfs als er geen dergelijke brekende wijzigingen waren, moet u uw versie nog steeds af en toe opnieuw opbouwen om eventuele wijzigingen in de basisstijlen op te nemen.

Thema's gebruiken

Elke widget gebruikt het thema dat is gedefinieerd door de huidige skin met behulp van SkinOOUIThemes in extension.json. Om een ingebouwd thema te gebruiken, is dit alles wat u hoeft te doen.

Een aangepast thema gebruiken in uw MediaWiki-skin:

  1. Run grunt build.
  2. Kopieer en plak de gegenereerde bestanden van dist/ (u heeft oojs-ui-foobar.js en alle oojs-ui-...-foobar.css nodig, negeer de oveirge) in een submap in uw skin. Kopieer ook FooBarTheme.php in php/.
  3. Als u aangepaste afbeeldingen hebt, kopieert en plakt u ook de inhoud van dist/themes/foobar/ en de .json-bestanden van src/themes/foobar/.
  4. Definieer het thema met OOUIThemePaths in het skin.json-bestand en laat uw skin het nieuwe thema gebruiken met SkinOOUIThemes zoals voorheen.

Voorbeeldwijziging met een aangepast thema in een skin: https://gerrit.wikimedia.org/r/c/mediawiki/skins/Example/+/343240