fix the search popup for everyone

[szaimen]

Fix#28584
Signed-off-by: szaimen szaimen@e.mail.de
(I broke this in #27844)

[szaimen]

/backport to stable22

[szaimen]

/backport to stable21

[szaimen]

/backport to stable20

[szaimen]

/compile amend /

[PVince81]

👍

assuming you also retested on mobile to make sure the other fix you did for it still works

[szaimen]

Yes, it was tested successrully on mobile, too. But after thinking about it a bit more does the carret need a bit more love...

[skjnldsv]

We use the same design for non-vue header menu, no? Can you double check those changes are also applied properly?
Iirc the main issue with a fixed position is that it will not be relative to the button as per the original design requirements.

The change applies on the mobile view:

server/core/css/mobile.scss

Lines 141 to 148 in cfb94c7

	@mediaonlyscreenand (max-width: 480px) {
	#header.header-right > div > .menu {
	max-width: calc(100vw-10px);
	position: fixed;
	&::after {
	display: none!important;
	}
	}

[szaimen]

This css code is unfortunately not applied on this element...

[skjnldsv]

Yes, this is what is missing.
When the screen is narrower than 480, then it should be fixed :)

[skjnldsv]

You can just copy/paste the style from the mobile.scss and put it in the HeaderMenu component 😉

[szaimen]

Thats what I am talking about at my last comment down below:

The best solution would be if the carrot wasn't part of the element but instead created by the element that triggers the popup so that the carrot can be positioned absolute to the trigger element and the popup can be positioned fixed on the site.

This is excactly how the legacy code does it. See:

The solution that the legacy mobile.scss code uses is not possible here because the carrot is part of the element.

[skjnldsv]

szaimen requested review from nextcloud/server-frontend, PVince81, juliushaertl and artonge and removed request for nextcloud/server-frontendil y a 19 heures

Please also check the git blame/review suggestions, as the author of this file, I should have been requested for reviews to avoid regressions 😉

[szaimen]

Please also check the git blame/review suggestions, as the author of this file, I should have been requested for reviews to avoid regressions 😉

Will do that in the future. I think I didn't ping you in the other one because you seemed to be very busy...

[szaimen]

@skjnldsv I currently see no way to fix this for everyone (for mobile and for people that disabled the notifications app). The best solution would be if the carrot wasn't part of the element but instead created by the element that triggers the popup so that the carrot can be positioned absolute to the trigger element and the popup can be positioned fixed on the site. But this is unfortunately a bit over my level of skill. Maybe @Pytal or @artonge can help me here?

[szaimen]

Another attempt is in #28660