Need help with addressbar things



  • So i managed to change the color in the addressbar, but whenever a page load the overlay
    stays. So is there a way to make it so the progress bar still works but does not leave an overlay? And all help would be appreciated 😊

    Before it the page reloads/loads
    0_1520315639354_Capasdasdre.PNG
    After the page reloads/loads
    0_1520315645757_Capture.PNG



  • You're probably using the wrong selector. Would be easier to say what you're doing and/or missing if you shared your code.

    Poking through some of my old code I see a few things it could be. You can try fooling around with this,

    .addressfield .pageload .pageload-indicator::-webkit-progress-value {
        background-color: var(--colorBgDark) !important;
    }
    
    .addressfield .pageload:not(.unstarted).progress-done {
        opacity: 0 !important;
        border: none !important; 
    }
    
    .addressfield .pageload .pageload-indicator {
        height: 24px !important;
        bottom: 0 !important;
        opacity: .75 !important;
        background-color: var(--colorHighlightBg) !important;
    }
    


  • @sjudenim said in Need help with loading in addressbar:

    .addressfield .pageload .pageload-indicator::-webkit-progress-value {
        background-color: var(--colorBgDark) !important;
    }
    
    .addressfield .pageload:not(.unstarted).progress-done {
        opacity: 0 !important;
        border: none !important; 
    }
    
    .addressfield .pageload .pageload-indicator {
        height: 24px !important;
        bottom: 0 !important;
        opacity: .75 !important;
        background-color: var(--colorHighlightBg) !important;
    }
    

    That's perfect! Thank you so much!



  • @sjudenim Have another issue regarding the addressbar. Is there anyway to get rid of the highlight countouring the addressfield so it would be the redish rectangle in this case, when you select the addressfield?
    0_1520365205422_Capture.PNG



  • That had bothered me too. I think this should do it,

    .color-behind-tabs-on .addressfield,
    .color-behind-tabs-on .searchfield,
    .color-behind-tabs-on .addressfield:focus-within,
    .color-behind-tabs-on .searchfield:focus-within,
    .addressfield:focus-within,
    .searchfield:focus-within {
        border-color: none !important;
        box-shadow: none !important;
    }
    

    I say think because I'm using something a little different since I don't like the box-shadow usage , so I've disabled all of them and removed the boarders on those elements as well.

    .addressfield, .searchfield {border: 0 !important}
    
    * {box-shadow: none !important}
    

    You can always just add a box-shadow back to specific elements (like a drop shadow for the speed dial tiles) by placing that code after the above one.



  • @sjudenim said in Need help with loading in addressbar:

    .color-behind-tabs-on .addressfield,
    .color-behind-tabs-on .searchfield,
    .color-behind-tabs-on .addressfield:focus-within,
    .color-behind-tabs-on .searchfield:focus-within,
    .addressfield:focus-within,
    .searchfield:focus-within {
    border-color: none !important;
    box-shadow: none !important;
    }

    Thank you so much for such quick answers! This worked like a charm



  • @sjudenim I can't seem to get rid of the highhlight in the dropped down menu of the addressbar, where the typed history, suggestions, etc are. When i hover it's in the color I want, but when move my mouse away it turns to a the highlight color.

    0_1520378639542_Capture.PNG

    0_1520378655864_Capture1.PNG



  • I'm not sure what you've done there because that is not the default behaviour. Where is that red coming from, is it your Accent colour or Hightlight colour?



  • @sjudenim Highlight color, and I haven't moded that area yet nor have I added a mod that changes anything there, only thing I did change was the color when you hover, but as you can see I don't know how to change the color for when it does not hover(which I think is the highlight)



  • Sounds like a mistake in your code. By default it uses var(--colorHighlightBg) so when you hover it is uses your code but then reverts to the default when it is not hovered. I don't think using :active or :focus would do anything either. Without seeing your code, I don't know what else to say



  • @sjudenim My code is a mess and like a big blob as I have integrated some other small mods into mine XD. I apologize in advance for the state you will see the code in. You would be correct, hover/focus doesn't do anything.

    Edit I solved the issue XD I didn't try the most obvious thing





  • @sjudenim Never mind! I fixed it!
    .omni-clickable.highlight { background-color: var(--colorAccentBgDark) !important;}



  • @artex

    good to hear. I was just sifting through your code now



  • @sjudenim Thank you for all of your help! I think I finished my Colorful Vivaldi mod XD I'll upload the whole thing later.


Log in to reply
 

Looks like your connection to Vivaldi Forum was lost, please wait while we try to reconnect.