spmbt / googleSearchExtraButtons

Google Search Extra Buttons
66 stars 20 forks source link

Remove or change style that causes fading behavior #9

Closed e-volusian closed 7 years ago

e-volusian commented 7 years ago

Hey, if I wanted to remove the styling that causes the menus to fade in and out, how would I go about doing so?

mikhoul commented 7 years ago

All the styling is between line 254 and 276 :

addRules('.hp .sfsbc,.sfsbc{display: inline-block}.siteList:hover button{display: block}'
    +'.gb_Ib >.gb_e{height:47px}.gb_Fb{z-index:1087}.tsf-p{z-index:203}'
    +'.lsbb .xButt,.sbibod .xButt,.lsbb >.siteList,.sbibod >.siteList{z-index: 2002; width:34px; height:17px;'
        +'padding:0 2px; line-height:14px; font-size:14px; border:1px solid transparent; border-radius:2px;'
        +'background-color:#dddae6; color:#eee; opacity: 0.45; transition:.1s}'
    +'.lsbb .xButt:not(.xButt2),.sbibod .xButt:not(.xButt2),.lsbb >.siteList{background-color:#4889f1; color:#fff; opacity: 0.64}'
    +'.xButt2{padding:0 0 2px; background-color:#dad6e2; color:#eee; opacity: 1}'
    +'.lsbb .xButt:hover,.sbibod .xButt:hover,.xButt.xButt2:hover .xButt2,.xButt2:hover{background-color:#cac6d2; color:#fff; opacity: 1}'
    +'.lsbb >.siteList:hover{background-color:#4889f1}'
    +'.lsbb >.siteList,.sbibod >.siteList{width:32px; height:auto; padding:1px 0 2px; text-align:center}'
    +'.lsbb >.siteList .lsb,.sbibod >.siteList .lsb{font-weight: normal; color:#d4d4d4}.lsbb .lsb:hover,.sbibod .lsb:hover{opacity: 1; color:#fff}'
    +'.sbibod >.siteList:hover,.lsbb >.siteList >div:not([class]):hover{background-color:#dad6e2; opacity:.91}'
    +'.sbibod:not(.lsbb) >.siteList{background-color:#dddae6; opacity:.45}.sbibod:not(.lsbb) >.siteList:hover{background-color:#dddae6; opacity:.87}.sbibod.lsbb{height:44px}'
    +'.sbibod >.siteList >.list{background-color:#e1deeb}'
    +'.siteList .sett .txt{padding:2px 2px 4px; font-size: 14px}'
    +'.lsbb >.siteList .sett .txt{background-color:#4889f1}'
    +'.siteList .settIn{display: none; width: 250px; padding: 2px 4px; text-align:left; border:1px solid #48f; font-size: 14px;'
        +'background-color:#eef; color:#336}'
    +'.siteList .settIn hr{margin:2px 0}'
    +'.sbibtd .sfsbc .nojsb, .siteList .sett:hover .settIn, .siteList .settIn.changed,'
        +'.siteList .settIn.changed .reload{display: block}.siteList .settIn .reload, .siteList.hiddn{display: none}'
    +'div.gb_g[aria-label="promo"],.pdp-psy.og-pdp, .gb_Sc.gb_g .gb_ha, .gb_g.gb_ha{display: none}.rhsvw{opacity:.16; transition:.4s}.rhsvw:hover{opacity:1}'
    +'.srp #sfdiv{overflow: inherit}'); //hide promo

One way to do it without messing with the code and having to redo it after each update would be to do a custom Stylish style and apply it to Google search.

Regards :octocat:

e-volusian commented 7 years ago

Didn't see that. Thank you for answering! Great script!