Vivaldi Forum mod
-
@juanvase Message = PM, i suspect.
-
@luetage Done.
-
-
-
Oh no! Someone
official
has discovered [one of] our top-secret hauntsQuick, everyone... hide!
-
@isak Oh no, you already fixed it. No more orbiting : / 🪐 [space sadness]
-
Can someone reply to this thread and send me a forum message?
-
@nomadic check
-
Alternate take on autohide Header (CSS mod), it hide everything except the V logo & notification section when you scroll down the page, mouseover the remaining section to reveal the whole header. You should disabled the extension autohide header mod for this to work properly:
#header-menu { z-index: 1002; } main#panel:has(#submenu.isfixed) #header-menu:not(:focus-within):not(:hover) { visibility: hidden; opacity: .2; transition: visibility .2s, opacity .2s !important; } main#panel:has(#submenu.isfixed:hover) #header-menu { visibility: visible !important; opacity: 1 !important; } #header-menu:not(:focus-within):not(:hover) + #submenu.isfixed:not(:focus-within):not(:hover) { visibility: hidden; opacity: 0; transition: visibility .2s, opacity .2s; } #vlogo, #vivaldilogin, #panel:has(#vivaldi-header:is(:focus-within, :hover)) #submenu.isfixed { visibility: visible; }
NOTE: Pls enable chrome://flags/#enable-experimental-web-platform-features for this code to work properly.
-
Alert loop animation for notification CSS mod:
#notif_dropdown .unread-count[data-content]:not([data-content=""]):not([data-content="0"]):after { animation: alert 3s steps(4) 0s both infinite; } @keyframes alert { 0%, 10% { transform: none; } 5% { transform: scale(2) translateY(8px); } }
Ergonomic post composer, make it wider & auto shrink on mouseout, & bring the hide/show button to center:
/* Composer */ @media (min-width: 1199px) { html.composing .composer { left: 2%; width: 96%; } } .composer { background: inherit; } .taskbar[data-active="1"] { z-index: 99999; max-width: fit-content; left: calc(50% - 25px); } #emote-picker { z-index: 1050; } #body > .composer.resizable:not(.maximized) { transition: top 0.3s ease-out 0.2s; } #body > .composer.resizable:not(.maximized):hover { top: 6.5% !important; transition: 0.3s ease-out 0.2s; } .composer .title-container .title:not(:focus-within) { background: rgba(250, 250, 250, 0.6) !important; } .write, .preview { background: linear-gradient(rgba(70 0 0 / 7%), transparent) !important; } .category > ul > li:not(.unread) h2 a { opacity: 0.7; }
EDIT 2: change
.taskbar
z-index to 99999 to float on top of.composer
.EDIT: updated the
z-index
of composer related element to fixheader
overlay problem. -
I think this extension have broke the new updated header a bit when the page is on the top... The 2nd row of the header (after the v logo & notification) is missing.
-
@dude99 That’s on purpose. The first and second row are combined into one. The forum mod broke with the most recent forum update 2 days ago. A fix is on the way.
-
@luetage OK. now I noticed it's more compact than the default thicc header... LOL
-
@dude99 I couldn’t help but notice you are using the
:has
selector here. I’m so confused. I know it works in the UI, but I thought it has zero influence on webpages. To my knowledge, Chrome doesn’t support it on stable right now. -
-
@luetage said in Vivaldi Forum mod:
Chrome doesn’t support it on stable right now.
It's on the experimental stage, so yeah... We need to enabled chrome://flags/#enable-experimental-web-platform-features for it to work. No reason to holding back if it's already supported "unofficially". It's a really powerful function that can't be replace with other syntax in many instances, & the CSS community have being requesting & waiting for it like 'forever' so I'm not gonna wait for it to be finalized to put it to good use. It's just like the
:is()
situation, where it got stuck in experimental stage for years & everyone just want to access it asap back then...I guess I will put up instruction for everyone who want to access the latest toy, until someone tell me it's pointless & not needed anymore. LOL
-
Do you know anything about the selector has-text()?
I mean: the CSS community have being requesting & waiting for?
It can be used in uBO:
-
version 4.2
is live on the webstore now. It contains fixes for the new forum update, including a simplified implementation of the custom notification icons mod. It will only work in the notifications dropdown from now on and the icons replace the mark‐read button toggle. This means each icon needs two states (regular and solid) and Fontawesome provides only a limited amount of solid icons, and even fewer regular icons, for free. The Vivaldi team has installed FA version 5.3) and I was forced to switch some icons around. No biggie in any case, just mentioning it. Thanks @nomadic for testing the fixes! -
@barbudo2005 I heard
:has-tex()
didn't make it into CSS3, so let's wait for another 14 years when they decided to move on to CSS4 then... LOLEveryone recommend using XPath thingy to get the job done, but I don't know much about it though.
-
With the arrival of autumn, @LonM felt nostalgic.
So that he started watching black and white and silent movies. (aka 2018 posts) LOLIf you want to dim them use this code:
h2.title:has([title*="2018"]) > a {color:#adadad !important; filter: opacity(25%) !important;}