Addressfield theming
-
This CSS customization changes the colors of URLfragments, the certified site info button, the icons for blocked content and the bookmark button.
The only fixed color in the address field not being touched by this mod is the red broken padlock icon indicating unsafe sites./* Addressfield Theming version 2022.2.2 https://forum.vivaldi.net/post/356714 Changes the colors of the hostfragments, the certified siteinfo button, the icons for blocked content and the bookmark button in the addressfield. */ .UrlFragment-Wrapper, .UrlFragment--Lowlight:first-of-type { color: var(--colorFgFaded); } .UrlFragment-HostFragment-Basedomain, .UrlFragment-HostFragment-TLD { color: var(--colorFgIntense) !important; font-weight: bold; } .UrlFragment-HostFragment-Subdomain { color: var(--colorHighlightBg) !important; font-weight: bold; } .SiteInfoButton.certified { fill: var(--colorHighlightBgDark); color: var(--colorHighlightBg); } .SiteInfoButton.certified:hover, .SiteInfoButton.certified:focus:not([tabindex="-1"]), .SiteInfoButton.certified:active { fill: var(--colorHighlightBg); } .SiteInfoButton .siteinfo-text { display: none; } .bookmark-animated-fill { fill: var(--colorFg) !important; } .permission-denied circle { fill: var(--colorHighlightBg); } .permission-denied path { fill: var(--colorHighlightFg); }
History
- 2022.2.2 Minor updates and changes
- 2020-07-25 Updated addressfield colors for snapshot
- 2020-08-14 Fix for snapshot 3.3.2009.3
- 2020-08-20 Snapshot 3.3.2022.6, no more private window fixes needed
- 2021-09-28 Add urlfragment theming
-
Nice
Why not the
.SiteInfoButton.secure
too? -
@Hadden89 Because it's already a non-fixed color, but you can of course color it with highlight by adding
SiteInfoButton.secure
to the first 2 commands. -
Pretty sure they've changed the unlocked padlock by the way, but I'll address that in the appropriate thread
The default addressfield definitely needs some reworking, thanks for sharing
-
@sjudenim To my knowledge there are four possible states right now
- secure
- secure certified
- not secure
- insecure(eg invalid certificate)
As you can see the broken padlock is still being used.
.SiteInfoButton.insecure
-
I see. I guess they've changed the rules for the icons because the few sites that I visit that had the unlocked padlock now show the info icon.
Thanks for the clarification
-
@sjudenim You can test it here: https://www.futureboy.us/pgp.html
It's a completely safe site with a pgg (pretty good guide) to using gpg that won't load, because the certificate expired. Gladly still available through wayback machine. -
Ah, I was (also) thrown by the message in the pop up, it's exactly the same for both
Your connection to this site is not secure
. -
@luetage @sjudenim For testing different connection states I recommend badssl.com or vivaldi://interstitials/ instead of actually putting yourself at a risk
-
@madiso You can be βat a riskβ on a perfectly valid https site too. Just the fact that a site is encrypted, doesn't mean it's safe. The thing you need to be vary of is inputting credentials, sending any form of data. A little icon in the address field can't protect you from your own stupidity.
-
@luetage My point was about seeking random pages with connection errors or misconfiguration - better to use tools made for that.
-
@madiso Nobody here sought out a random site though.
-
@Hadden89 I took your advice and colored the standard siteinfo button now, because I noticed the unhovered version can become invisible on some themes on unmodified Vivaldi. By the way, somebody noticed this?
The βManage Cookiesβ button should have the lighter background of the close button, but does so only in one place, because somehow the background image gradient gets messed up.
-
mmh.. same is on CGA theme.
For padlock I opted for the minimalism.
Secure | Certified Https
NOT Secure [Http|Broken Https?] (Flipped info, tnx sjudenim)
VERY unsecure (Broken Https: Invalid certs, mixed sources and so on).
-
@luetage "Color glitch" is still present in latest snapshot.
Did you report that? -
@Hadden89 No, stuff like this is most likely already reported. It's a shame, but I don't deem bugs like this worth the time reporting, since the bugtracker is closed and I cannot check whether it's a duplicate.
But go on and issue it if you'd like ^^
-
@luetage VB-65870
I still hope we'll see a "read-only-auto-mirrored-text-only-bug-tracker-report-summary" one day.
In most cases having the essential (and un-disclosed) infos will be fine; no need to something like chr. monorail (which is quite ugly to browse). But this won't probably happen. Sad
It is of course a "low priority issue" for a snapshot but bad to see on a stable (I think we are almost in stabilization) -
@Hadden89 said in Addressfield theming:
@luetage VB-65870
I had a mail about this. Confirmed but low priority - being mainly an "aesthetic" issue.
-
@Hadden89 This seems to be fixed now, on my side the button has the right background color, both hovered and normal.
-
The newest snapshot makes the addressfield unreadable in private windows, made an update to fix this. I adjusted the faded colors in the urlfragment wrapper too, to make them slightly more visible compared to the main address.