您需要先安装一个扩展,例如 篡改猴、Greasemonkey 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 Userscripts ,之后才能安装此脚本。
您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。
您需要先安装用户脚本管理器扩展后才能安装此脚本。
Switch UI styles (modern/retro/material) for YouTube, Google, Roblox, Yahoo!, and Amazon.
- // ==UserScript==
- // @name Website UI Switcher
- // @namespace http://tampermonkey.net/
- // @version 1.1
- // @description Switch UI styles (modern/retro/material) for YouTube, Google, Roblox, Yahoo!, and Amazon.
- // @author Your Name
- // @match *://*.youtube.com/*
- // @match *://*.google.com/*
- // @match *://*.roblox.com/*
- // @match *://*.yahoo.com/*
- // @match *://*.amazon.com/*
- // @grant GM_addStyle
- // @grant GM_registerMenuCommand
- // ==/UserScript==
- // Default settings
- let settings = {
- style: "modern", // "modern", "retro", or "material"
- roundedCorners: true, // true or false
- };
- // Load settings from localStorage
- if (localStorage.getItem("uiSwitcherSettings")) {
- settings = JSON.parse(localStorage.getItem("uiSwitcherSettings"));
- }
- // Apply styles based on settings
- function applyStyles() {
- if (settings.style === "modern") {
- GM_addStyle(`
- /* General Modern Rounded Styles */
- * {
- border-radius: ${settings.roundedCorners ? '10px' : '0px'} !important;
- box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);
- transition: all 0.3s ease;
- }
- /* Modern Font */
- body, button, input {
- font-family: 'Arial', sans-serif !important;
- }
- `);
- } else if (settings.style === "retro") {
- GM_addStyle(`
- /* Retro Styles */
- * {
- border-radius: ${settings.roundedCorners ? '10px' : '0px'} !important;
- box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
- background-color: #282c34 !important;
- color: #61dafb !important;
- transition: all 0.3s ease;
- }
- /* Retro Font */
- body, button, input {
- font-family: 'Press Start 2P', cursive !important;
- }
- `);
- } else if (settings.style === "material") {
- GM_addStyle(`
- /* Material Design Lite Styles */
- @import url('https://fonts.googleapis.com/icon?family=Material+Icons');
- @import url('https://code.getmdl.io/1.3.0/material.indigo-pink.min.css');
- * {
- border-radius: ${settings.roundedCorners ? '4px' : '0px'} !important;
- box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.2) !important;
- transition: all 0.3s ease;
- }
- body {
- font-family: 'Roboto', sans-serif !important;
- }
- .mdl-button {
- border-radius: 4px !important;
- }
- `);
- }
- }
- // Save settings
- function saveSettings() {
- localStorage.setItem("uiSwitcherSettings", JSON.stringify(settings));
- applyStyles();
- }
- // Settings page UI
- function createSettingsPage() {
- const settingsContainer = document.createElement("div");
- settingsContainer.id = "uiSwitcherSettingsContainer";
- settingsContainer.className = "mdl-card mdl-shadow--4dp";
- settingsContainer.style.position = "fixed";
- settingsContainer.style.top = "10%";
- settingsContainer.style.left = "50%";
- settingsContainer.style.transform = "translateX(-50%)";
- settingsContainer.style.zIndex = "9999";
- settingsContainer.style.width = "300px";
- settingsContainer.innerHTML = `
- <div class="mdl-card__title mdl-card--expand">
- <h2 class="mdl-card__title-text">UI Switcher Settings</h2>
- </div>
- <div class="mdl-card__supporting-text">
- <label for="uiStyleSelector">
- Style:
- <select id="uiStyleSelector" class="mdl-selectfield__select">
- <option value="modern" ${settings.style === 'modern' ? 'selected' : ''}>Modern</option>
- <option value="retro" ${settings.style === 'retro' ? 'selected' : ''}>Retro</option>
- <option value="material" ${settings.style === 'material' ? 'selected' : ''}>Material</option>
- </select>
- </label><br><br>
- <label for="roundedCornersCheckbox">
- Rounded Corners:
- <input type="checkbox" id="roundedCornersCheckbox" ${settings.roundedCorners ? 'checked' : ''}>
- </label><br><br>
- </div>
- <div class="mdl-card__actions mdl-card--border">
- <button id="saveSettingsButton" class="mdl-button mdl-js-button mdl-button--raised mdl-button--colored">
- Save
- </button>
- <button id="resetSettingsButton" class="mdl-button mdl-js-button mdl-button--raised mdl-button--accent">
- Reset to Default
- </button>
- <button id="closeSettingsButton" class="mdl-button mdl-js-button mdl-button--raised">
- Close
- </button>
- </div>
- `;
- document.body.appendChild(settingsContainer);
- // Initialize MDL components
- componentHandler.upgradeDom();
- // Add event listeners for controls
- document.getElementById("saveSettingsButton").addEventListener("click", () => {
- settings.style = document.getElementById("uiStyleSelector").value;
- settings.roundedCorners = document.getElementById("roundedCornersCheckbox").checked;
- saveSettings();
- alert("Settings saved!");
- });
- document.getElementById("resetSettingsButton").addEventListener("click", () => {
- localStorage.removeItem("uiSwitcherSettings");
- settings = {
- style: "modern",
- roundedCorners: true
- };
- document.getElementById("uiStyleSelector").value = 'modern';
- document.getElementById("roundedCornersCheckbox").checked = true;
- saveSettings();
- alert("Settings reset to default!");
- });
- document.getElementById("closeSettingsButton").addEventListener("click", () => {
- settingsContainer.remove();
- });
- }
- // Register menu command to open settings page
- GM_registerMenuCommand("UI Switcher Settings", createSettingsPage);
- // Apply styles on page load
- applyStyles();
QingJ © 2025
镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址