MediaWiki:Common.js: Perbedaan antara revisi
Tidak ada ringkasan suntingan Tanda: Dikembalikan Suntingan perangkat seluler Suntingan peramban seluler |
Tidak ada ringkasan suntingan Tanda: Dikembalikan Suntingan perangkat seluler Suntingan peramban seluler |
||
| Baris 1: | Baris 1: | ||
/* ========================================================================== | /* ========================================================================== | ||
🌙 FITUR CANGGIH: MODE FOKUS MEMBACA (READING LIGHT SWITCH) | |||
========================================================================== */ | ========================================================================== */ | ||
$(document).ready(function() { | $(document).ready(function() { | ||
if (mw.config.get('wgIsArticle') && mw.config.get('wgAction') === 'view' && mw.config.get('wgNamespaceNumber') === 0) { | |||
var $targetHeading = $('#firstHeading, .page-heading').first(); | |||
var $ | if (!$targetHeading.length) return; | ||
if ($ | // 1. Buat tombol switch lampu | ||
var $lightBtn = $('<button>', { | |||
id: 'mippedia-light-switch', | |||
type: 'button', | |||
style: 'margin-left: 15px; background: #f8f9fa; border: 1px solid #a2a9b1; padding: 4px 10px; border-radius: 4px; font-size: 0.75em; cursor: pointer; font-weight: bold; color: #202122; vertical-align: middle; display: inline-block;', | |||
text: '💡 Mode Redup' | |||
}); | |||
$targetHeading.append($lightBtn); | |||
// 2. Jalankan fungsi ubah warna kontras saat diklik | |||
var isDark = false; | |||
$lightBtn.on('click', function() { | |||
} | if (!isDark) { | ||
// Berubah ke mode redup/fokus | |||
$('#content, #mw-content-text').css({ 'background-color': '#10141e', 'color': '#e1e4e8' }); | |||
$('.mw-parser-output p, .mw-parser-output li, #firstHeading').css('color', '#e1e4e8'); | |||
$lightBtn.text('☀️ Mode Terang').css({ 'background': '#333', 'color': '#fff', 'border-color': '#333' }); | |||
isDark = true; | |||
} else { | |||
// Kembalikan ke normal | |||
$('#content, #mw-content-text').css({ 'background-color': '', 'color': '' }); | |||
$('.mw-parser-output p, .mw-parser-output li, #firstHeading').css('color', ''); | |||
$lightBtn.text('💡 Mode Redup').css({ 'background': '#f8f9fa', 'color': '#202122', 'border-color': '#a2a9b1' }); | |||
isDark = false; | |||
} | |||
}); | |||
} | } | ||
}); | }); | ||