Replaced dropdowns in the navbar with JS-less ones from https://codeberg.org/forgejo/forgejo/pulls/7906.
Also made some changes to the dropdown component:
* fixed variable name
* painted backgrounds (hover, focus) are now consistently applied to the actual interactive items (`<a>`, `<button>`), not to `<li>`. This is consistent with how backgrounds are conditionally applied to pre-selected (`.active`) items and is better, as it allows to place additional things to `<li>`...
* ...`<hr>` can now be placed in some `<li>` instead of requiring splitting into multiple `<ul>`. This is simpler in code and I am guessing this should be better for a11y as screen readers can cast one continuous list instead of multiple ones. But have no hard proof that this is actually better. My main motivation was to avoid ugly mistake-prone tmpl logic where unconditional `<ul>` was getting closed and reopened inside of a condition.
I should note that on mobile all items, including these dropdowns, are hidden in another dropdown, and it stays JS-dependand for now. So this PR only makes this part of the UI JS-less for desktop.
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/10025
Reviewed-by: Robert Wolff <mahlzahn@posteo.de>
Reviewed-by: Gusted <gusted@noreply.codeberg.org>
Co-authored-by: 0ko <0ko@noreply.codeberg.org>
Co-committed-by: 0ko <0ko@noreply.codeberg.org>
Related: https://codeberg.org/forgejo/forgejo/pulls/6977/files#diff-fd05eba523810d46c7763db938ad5839372a074a, https://codeberg.org/forgejo/forgejo/pulls/3949, https://codeberg.org/forgejo/forgejo/pulls/7906
* use the new noJS dropdown for extra actions in org view (currently only includes report button)
* this required some refactoring of the area because the said dropdown was not built to be placed in an area where `font-size:36px` is forced onto everything
* this greatly improves consistently with user profiles which now use this type of dropdown
* I decided against making the opener button mimicrate an actual button because it looks ok as is and is consitent with menu in user profiles and because I don't think this is a good design language to make a kebab menu opener look this way
* add icon to the entry
* add atom entry
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/8572
Reviewed-by: Gusted <gusted@noreply.codeberg.org>
Reviewed-by: Beowulf <beowulf@beocode.eu>
Co-authored-by: 0ko <0ko@noreply.codeberg.org>
Co-committed-by: 0ko <0ko@noreply.codeberg.org>
Related: https://codeberg.org/forgejo/forgejo/pulls/3950#issue-785253, https://codeberg.org/forgejo/forgejo/pulls/3950#issuecomment-1998551.
## Links in dropdown
* move _admin only_ User details link here, give it always-visible text
* add new _self only_ Edit profile link here
* move RSS feed link here
* add new Atom feed link here, previously unadvertised
* add new SSH keys link here (`.keys`), previously unadvertised
* add new GPG keys link here (`.gpg`), previously unadvertised
* move Block/Unblock button here
* move Report abuse link here
If primary action is available (Follow/Unfollow), dropdown with more actions goes after it. If not, it is in line with followers, in place where RSS feed button used to be.
## New dropdown
Related: https://codeberg.org/forgejo/design/issues/23, https://codeberg.org/forgejo/forgejo/issues/3853, https://codeberg.org/0ko/forgejo/issues/2.
Implemented a new dropdown: noJS-usable, JS-enhanced for better keyboard navigation and a11y.
Styling is mostly same as the existing ones have, but row density depends on `@media` pointer type.
My choice of CSS properties have been influenced of these:
* 72a3adb16b
* 51dd2293ca
Inspired-by: KiranMantha <kiranv.mantha@gmail.com>
Inspired-by: Lucas Larroche <lucas@larroche.com>
Co-authored-by: Beowulf <beowulf@beocode.eu>
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/7906
Reviewed-by: Otto <otto@codeberg.org>
Reviewed-by: Beowulf <beowulf@beocode.eu>
Co-authored-by: 0ko <0ko@noreply.codeberg.org>
Co-committed-by: 0ko <0ko@noreply.codeberg.org>
