Fix active entry highlight in certain apps

[jancborchardt]

For example in the Mail app:
Before (no highlight) / After (proper highlight)

This is due to specific container structure. This pull request makes sure that our standard .with-icon class is used as identifying element.

Please review @nextcloud/designers @ChristophWurst @nextcloud/mail

[mention-bot]

@jancborchardt, thanks for your PR! By analyzing the history of the files in this pull request, we identified @skjnldsv, @juliushaertl and @MorrisJobke to be potential reviewers.

[ChristophWurst]

Finally \o/

Tested and works 👍

[ChristophWurst]

IMO this should be backported. cc @karlitschek

[skjnldsv]

@jancborchardt Where is the .with_icon documented? :)

@ChristophWurst The mail app is really not using the nextcloud docs for the app menu, I would prefer editing the mail app than adding some custom properties here! ;)
I can help you with that if you want :)

[ChristophWurst]

I can help you with that if you want :)

That would be awesome 👍 🙌

[MorrisJobke]

@jancborchardt Where is the .with_icon documented? :)

https://docs.nextcloud.com/server/12/developer_manual/app/css.html#navigation

This also makes sense and is how it is documented.

[MorrisJobke]

Backport is in #6397

[skjnldsv]

https://docs.nextcloud.com/server/12/developer_manual/app/css.html#navigation
This also makes sense and is how it is documented.

I removed this with the new implementation I did a few month ago. I still didn't had time to do nextcloud/documentation#333
We don't need the with-counter with-menu or with-icon anymore now.
We shouldn't have merged this, we implemented something we agreed to get rid of in january...

[MorrisJobke]

We shouldn't have merged this, we implemented something we agreed to get rid of in january...

🙈

[jancborchardt]

@skjnldsv sorry bout that :/ then we have to document it and fix the main apps though.

[skjnldsv]

@jancborchardt Yeah, it has been going on for too long. i should have resume my work earlier, didn't have the time back then :(
I'm doing a full scss/template work since a week, the end will be the rebuild of all the docs.
I expect to be finished pretty soon.

I will provide a design example of all possible and allowed template for nextcloud with some serious code in it. No one will be able to not understand what they can or can't do :)

[karlitschek]

backport makes sense from my point of view.

[jancborchardt]

@skjnldsv awesome! :) I was also thinking that the boilerplate app (from appstore) should also have more of these elements like 3-dot menu, and the contacts-column-layout.
And we need pictures of how it looks in the docs - then it's also time to rename it from "CSS" to "Design" ;)

Let me know when there's some work-in-progress to look over and review. :)