Utilisateur:Bahati11/Polices.js

Note : après avoir enregistré la page, vous devrez forcer le rechargement complet du cache de votre navigateur pour voir les changements.

Mozilla / Firefox / Konqueror / Safari : maintenez la touche Majuscule (Shift) en cliquant sur le bouton Actualiser (Reload) ou pressez Maj-Ctrl-R (Cmd-R sur Apple Mac) ;

Firefox (sur GNU/Linux) / Chrome / Internet Explorer / Opera : maintenez la touche Ctrl en cliquant sur le bouton Actualiser ou pressez Ctrl-F5.

(function() {
    'use strict';

    const searchForm = document.querySelector('#searchform, #searchInput')?.closest('form');
    if (!searchForm) return;

    const container = document.createElement('div');
    container.style.display = 'inline-block';
    container.style.position = 'relative';
    container.style.marginLeft = '10px';
    container.style.verticalAlign = 'middle';

    const button = document.createElement('button');
    button.textContent = 'Police';
    button.style.padding = '6px 14px';
    button.style.border = 'none';
    button.style.borderRadius = '10px';
    button.style.background = 'linear-gradient(135deg, #6CC1FF, #3A8DFF)';
    button.style.color = '#fff';
    button.style.fontWeight = 'bold';
    button.style.cursor = 'pointer';
    button.style.transition = '0.3s';
    button.onmouseover = () => button.style.background = 'linear-gradient(135deg, #3A8DFF, #6CC1FF)';
    button.onmouseout = () => button.style.background = 'linear-gradient(135deg, #6CC1FF, #3A8DFF)';

    const menu = document.createElement('div');
    menu.style.position = 'absolute';
    menu.style.top = '38px';
    menu.style.right = '0';
    menu.style.background = '#fff';
    menu.style.border = '1px solid #ccc';
    menu.style.borderRadius = '10px';
    menu.style.boxShadow = '0 4px 12px rgba(0,0,0,0.25)';
    menu.style.display = 'none';
    menu.style.zIndex = '1000';
    menu.style.minWidth = '200px';
    menu.style.overflow = 'hidden';

    const fonts = [
        'Arial', 'Verdana', 'Tahoma', 'Trebuchet MS', 'Georgia', 'Garamond', 
        'Courier New', 'Lucida Console', 'Impact', 'Comic Sans MS', 'Palatino Linotype', 
        'Times New Roman', 'Century Gothic', 'Franklin Gothic Medium', 'Segoe UI', 
        'Calibri', 'Candara', 'Futura', 'Bookman', 'Didot', 'Optima', 'Helvetica', 
        'Gill Sans', 'Monaco', 'Brush Script MT', 'Lucida Sans', 'Copperplate', 'Baskerville', 
        'Rockwell', 'American Typewriter'
    ];

    const styleTag = document.createElement('style');
    document.head.appendChild(styleTag);

    // Appliquer la police sauvegardée si existante
    const savedFont = localStorage.getItem('userFont');
    if (savedFont) {
        styleTag.innerHTML = `html, body { font-family: "${savedFont}", sans-serif !important; }`;
    }

    // Bouton "Désactiver"
    const disableItem = document.createElement('div');
    disableItem.textContent = 'Désactiver';
    disableItem.style.padding = '6px 8px';
    disableItem.style.cursor = 'pointer';
    disableItem.style.fontWeight = 'bold';
    disableItem.style.color = '#FF0000';
    disableItem.onmouseover = () => disableItem.style.background = '#f0f0f0';
    disableItem.onmouseout = () => disableItem.style.background = '#fff';
    disableItem.addEventListener('click', () => {
        styleTag.innerHTML = '';
        localStorage.removeItem('userFont');
        menu.style.display = 'none';
    });
    menu.appendChild(disableItem);

    fonts.forEach(font => {
        const item = document.createElement('div');
        item.style.padding = '6px 8px';
        item.style.cursor = 'pointer';
        item.style.transition = '0.2s';
        item.onmouseover = () => item.style.background = '#f0f0f0';
        item.onmouseout = () => item.style.background = '#fff';
        item.textContent = font;
        item.style.fontFamily = font;

        item.addEventListener('click', () => {
            styleTag.innerHTML = `html, body { font-family: "${font}", sans-serif !important; }`;
            localStorage.setItem('userFont', font); // sauvegarde
            menu.style.display = 'none';
        });

        menu.appendChild(item);
    });

    button.addEventListener('click', () => {
        menu.style.display = menu.style.display === 'none' ? 'block' : 'none';
    });

    container.appendChild(button);
    container.appendChild(menu);
    searchForm.parentNode.insertBefore(container, searchForm.nextSibling);
})();