User:Resutant edition/OOUI-Demo.js

/* * -Task 2- * * Creating a Demo to turn the page into the dark mode by toggle button * */

$(document).ready(function {	mw.loader.using("oojs-ui-widgets").done(function { var toggleSwitch1 = new OO.ui.ToggleSwitchWidget({		value: false,		padded: true	 }); toggleSwitch1.on("change", function(state) {		// This changes the colour and background of the page.		console.log(state);		if (state) {		$("*").css({ "background-color":"black", "color": "white" });		} else {		 $("*").css({ "background-color":"", "color": "" })		}	 });	  var popup = new OO.ui.PopupButtonWidget({		$content: $( " This toggle buttons switch your MediaWiki page into dark mode which will be very helpful for the users to use at midnight. " ),		padded: true,		width: 300,		head: true,		label: "Dark mode"	 }); $(".mw-footer").append(toggleSwitch1.$element, popup.$element); popup.toggle(true); }); });