MediaWiki:Common.js: відмінності між версіями

← Попереднє редагування Наступне редагування →

@@ Рядок 1: / Рядок 1: @@
 $(function () {
+    // =======================
      // Теми
+    // =======================
      var themes = {
          light: '/w/index.php?title=MediaWiki:Light.css&action=raw&ctype=text/css',
@@ Рядок 6: / Рядок 8: @@
      };
-    // =======================
-    // Кнопка Темна/Світла тема
-    // =======================
      var theme = localStorage.getItem('selectedTheme');
      if (!theme) {
@@ Рядок 17: / Рядок 16: @@
      }
-     var $themeBtn = $('<button>')
+     // =======================
-        .text(theme === 'dark' ? 'Світла тема ☀️' : 'Темна тема 🌙')
+    // Функція створення кнопки
-        .attr('title', 'Змінити тему')
+    // =======================
-        .css({
+    function createButton(text, bottom, onClick, title) {
+        var $btn = $('<button>').text(text).attr('title', title).css({
              position: 'fixed',
-             bottom: '10px',
+             bottom: bottom + 'px',
              right: '10px',
              padding: '10px 16px',
@@ Рядок 36: / Рядок 36: @@
              boxShadow: '0 2px 6px rgba(0,0,0,0.3)',
              whiteSpace: 'nowrap'
-         })
+         }).click(onClick);
-         .click(function () {
+         $('body').append($btn);
+        return $btn;
+    }
+    // =======================
+    // Кнопка Темна/Світла тема
+    // =======================
+    var $themeBtn = createButton(
+        theme === 'dark' ? 'Світла тема ☀️' : 'Темна тема 🌙',
+,
+        function () {
              var newTheme = theme === 'dark' ? 'light' : 'dark';
              localStorage.setItem('selectedTheme', newTheme);
              location.reload();
-         });
+         },
+        'Змінити тему'
-     $('body').append($themeBtn);
+     );
      // =======================
      // Кнопка Доступність
      // =======================
-     var $accessBtn = $('<button>')
+     var $accessBtn = createButton(
-         .text('Доступність ♿')
+         'Доступність ♿',
-        .attr('title', 'Увімкнути режим доступності')
+,
-         .css({
+         function () {
-            position: 'fixed',
-            bottom: '70px', // над кнопкою теми
-            right: '10px',
-            padding: '10px 16px',
-            border: 'none',
-            borderRadius: '25px',
-            background: '#1a73e8',
-            color: '#ffffff',
-            fontWeight: 'bold',
-            fontSize: '14px',
-            cursor: 'pointer',
-            zIndex: 9999,
-            textAlign: 'center',
-            boxShadow: '0 2px 6px rgba(0,0,0,0.3)',
-            whiteSpace: 'nowrap'
-        })
-         .click(function () {
              if (!$('body').hasClass('accessibility-mode')) {
                  $('body').addClass('accessibility-mode');
@@ Рядок 76: / Рядок 69: @@
                  localStorage.setItem('accessibilityMode', 'off');
              }
-         });
+         },
+        'Увімкнути режим доступності'
+    );
-    $('body').append($accessBtn);
-    // Вмикаємо збережений режим доступності
      if (localStorage.getItem('accessibilityMode') === 'on') {
          $('body').addClass('accessibility-mode');
+    }
+    // =======================
+    // Лупа + / -
+    // =======================
+    var fontSize = parseInt($('body').css('font-size'), 10);
+    createButton('🔍 +', 130, function () {
+        fontSize += 2;
+        $('body').css('font-size', fontSize + 'px');
+        localStorage.setItem('fontSize', fontSize);
+    }, 'Збільшити шрифт');
+    createButton('🔍 -', 170, function () {
+        fontSize -= 2;
+        if (fontSize < 12) fontSize = 12;
+        $('body').css('font-size', fontSize + 'px');
+        localStorage.setItem('fontSize', fontSize);
+    }, 'Зменшити шрифт');
+    // Встановлюємо збережений розмір шрифту
+    if (localStorage.getItem('fontSize')) {
+        fontSize = parseInt(localStorage.getItem('fontSize'), 10);
+        $('body').css('font-size', fontSize + 'px');
      }
 });