Greasy Fork

Greasy Fork is available in English.

图标替换辅助工具

高亮图标

当前为 2021-05-30 提交的版本,查看 最新版本

// ==UserScript==
// @name         图标替换辅助工具
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  高亮图标
// @author       jiezi19971225
// @include      http://localhost*
// @include      https://localhost*
// @match        http://*.xiaoman.cn/*
// @match        https://*.xiaoman.cn/*
// @require      https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js
// @run-at       document-idle
// @grant        GM_addStyle
// @encoding     utf-8
// ==/UserScript==

(function() {
    'use strict';

    function toggleStyle(style,initActive) {
     var styleEle = GM_addStyle(style)
     var styleActive = !!initActive
     if(!styleActive){
         styleEle.remove()
     }
     return function(state){
       if(state === undefined){
        styleActive = !styleActive
       }else{
        styleActive = !!state
       }
       if(!styleActive){
         styleEle.remove()
       }else{
         $("head").append(styleEle)
       }
     }
    }

    // Your code here...
   var toggleHighLightIconfontStyle = toggleStyle(`
.m-icon {
outline:1px solid red !important;
}
    `,true)

   var toggleHighLightAmumuIconStyle = toggleStyle(`
.mm-icon {
outline:1px solid red !important;
}
    `,true)

    GM_addStyle(`
.icon-replace-helper-controller{
padding:10px;
cursor:move;
width:200px;
position:absolute;
right:50px;
top:200px;
background:#eee;
border-radius:4px;
border:1px solid #ccc;
font-size:16px;
}
.icon-replace-helper-controller-header{
color: #0099CC;

}
.icon-replace-helper-controller-checkbox{
display:block;
}
    `)

    function addControler(){
        var controller = $(`<div class="icon-replace-helper-controller">
        <div class="icon-replace-helper-controller-header">图标替换助手</div>
        <div class="icon-replace-helper-controller-checkbox">
        <input type="checkbox" name="iconfont" id="iconfont-checkbox" checked/>
        高亮iconfont图标
        </div>
        <div class="icon-replace-helper-controller-checkbox">
        <input type="checkbox" name="amumu" id="amumu-checkbox" checked/>
        高亮amumu图标
        </div>
        <div class="icon-replace-helper-controller-checkbox">
        <input type="checkbox" name="iconname" id="iconname-checkbox" checked/>
        显示图标名称
        </div>
        <div class="icon-replace-helper-controller-checkbox">
        <input type="checkbox" name="inlist" id="inlist-checkbox" checked/>
        仅高亮替换列表图标
        </div>
        </div>`)
        $("body").append(controller)
        $("#iconfont-checkbox").change(function(){
          toggleHighLightIconfontStyle()
        })
        $("#amumu-checkbox").change(function(){
          toggleHighLightAmumuIconStyle()
        })
    }


    addControler()

})();