Mask for the address bar

nomadic

@stardepp Sorry I wasn't clear, didn't need all the css in images, just the beginning. Must have taken some time.

It is getting off topic here.

Send me a chat message and I will try and help you if I can. I tried sending you a message, but you have it restricted to only people you follow.

tam710562

@stardepp I see a few problems in your css file

stardepp

@tam710562 Many thanks for this tip, I have changed. But it has not solved the problem yet.

Streptococcus

@tam710562
Why make anything in the address bar hard to read? I have never understood why that is desirable. Of all the ways to emphasize the domain name, most browsers will choose the most awkward way to do that: by making most of the URL semitransparent and hard to read or remove it altogether. What is so bad about the prefix of the hostname? Why hide that?

nomadic

@tam710562 and anyone else following along at home, @stardepp and I managed to get it working on their computer.

Thanks for the great Mod!

sjudenim

Vivaldi have somewhat added this mod to the Snapshot but the colour scheme they are using is very hard to read. And since I used theme-3, nothing is centred anymore.

While this mod is less needed, it still seems like the right place to add any changes. so to recreate theme-3 in the snapshot you can use this

CSS

.UrlField {
  justify-content: center;
  font-weight: 700;
}

 .UrlField .UrlBar-UrlField {
  text-align: center;
  font-weight: 400;
}

.UrlFragment-Wrapper--ShouldHighlight {
  --HighlightColor: var(--colorFg) !important;
  --LowlightColor: var(--colorFgFaded) !important;
}

embryo626

it does not work on v3.3,please fix it,thank you.

barbudo2005

@tam710562 Please update it.

I read a lot of blogspot pages so to me is more important highlight the subdomain.

Example: aboutmysteryandcrime

https://aboutmysteryandcrime.blogspot.com/

sjudenim

@barbudo2005

Try this

/* URL unset colour */
.UrlFragment-Wrapper { color: unset; }

/* URL colour */
.UrlFragment--Lowlight:first-of-type { color: var(--colorFgFaded); }

/* URL Sub-domain */
.UrlFragment-HostFragment-Subdomain {
  color: var(--colorFgIntense) !important;
  font-weight: bold;
}

Or you can have both domain and sub-domain stand out while still having the sub pop more

/* URL colour */
.UrlFragment-Wrapper, .UrlFragment--Lowlight:first-of-type { color: var(--colorFgFaded); }

/* URL Base-domain  */
.UrlFragment-HostFragment-Basedomain, .UrlFragment-HostFragment-TLD {
  color: var(--colorFgIntense) !important;
  font-weight: bold;
}

/* URL Sub-domain */
.UrlFragment-HostFragment-Subdomain {
  color: var(--colorHighlightBg) !important;
  font-weight: bold;
}

barbudo2005

@sjudenim Thank you very much.

Your Mod (the second part) do the job, but I would like to have the rest of the URL with the color of https://.

Rest of the URL: /topic/37609/mask-for-the-address-bar/62

Could you help me?

sjudenim

@barbudo2005

I've updated the second one, give it a try. If you want them darker still just switch var(--colorFgFaded) with var(--colorFgFadedMore)

barbudo2005

@sjudenim Thank you again.

Where I can learn what is the meaning of this type of colors : var(--colorFgFaded), var(--colorFgFadedMore), etc.

I am used to use in CSS the simple colors: #171b1d, #d8d8d8, etc.

A Former User

@barbudo2005 All those are Vivaldi-defined variables (no hack, a normal CSS feature). You can see all the variables with the colours they have in the current theme at vivaldi://themecolors.

luetage

@sjudenim I never cared much for the address coloring, but the second version is pretty good. I like the inclusion of the highlight color. Anyway, no need to activate the highlighting of base domain in settings, the selectors are available with the option turned off too.

barbudo2005

@sjudenim Is possible not to consider "www." as part of the subdomain?

tam710562

I just fix some css for the mod in version 3.4.2038.4. May be develop new mod on the new tags of Vivaldi is the better option, but I'm too lazy to do it

embryo626

@tam710562 The mod is working again,thank you,but https is not green in V3.3,Is there something missing？

tam710562

@embryo626 said in Mask for the address bar:

@tam710562 The mod is working again,thank you,but https is not green in V3.3,Is there something missing？

This bug has been fixed :face_savouring_delicious_food:

embryo626

@tam710562 thanks again,especially for your speed

sjudenim

@barbudo2005 said in Mask for the address bar:

@sjudenim Is possible not to consider "www." as part of the subdomain?

Yes, you just move this .UrlFragment--Lowlight:first-of-type from the URL colour to to the URL Sub-domain

/* URL Sub-domain */
.UrlFragment-HostFragment-Subdomain, .UrlFragment--Lowlight:first-of-type {
  color: var(--colorHighlightBg) !important;
  font-weight: bold;
}