A few typos, some from spell checker, some from grepping `the the`, `the a `, ` a the`. Some in comments and some in changelogs.
Decapped a few remaining annoying strings, and one new from https://codeberg.org/forgejo/forgejo/pulls/6351 which was introduced by copy-pasting on a slightly out-of-date branch, causing Weblate to issue "reused translation" alerts again. Ref #6439.
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/6666
Reviewed-by: Earl Warren <earl-warren@noreply.codeberg.org>
Reviewed-by: Gusted <gusted@noreply.codeberg.org>
Co-authored-by: 0ko <0ko@noreply.codeberg.org>
Co-committed-by: 0ko <0ko@noreply.codeberg.org>
The benefit / functionality provided by DiffFileList is already (better)
integrated in the header of the files.
If you want an overview, you can collapse all files via the same
overflow menu (where the stats were available).
To reduce the maintenance effort, the DiffFileList component is
therefore removed.
Followup to https://codeberg.org/forgejo/forgejo/pulls/6459.
Usually it's quite hard to have inputs with balanced size that works for both desktop and mobile: it's either too large or too small for one of them. I think this can be a solution for this new element.
I tried it locally, it feels good on a phone. There's likely one downside which is that the switch will still be larger on touch devices even when they're wide, like on tablets. I think it can be resolved separately at some point. It isn't a problem on small devices because usually these elements go on separate rows.
## Preview
This change only affects touch devices.
|Before|After|
|-|-|
|||
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/6546
Reviewed-by: Michael Kriese <michael.kriese@gmx.de>
Reviewed-by: Otto <otto@codeberg.org>
Co-authored-by: 0ko <0ko@noreply.codeberg.org>
Co-committed-by: 0ko <0ko@noreply.codeberg.org>
Followup to https://codeberg.org/forgejo/forgejo/pulls/6459 and https://codeberg.org/forgejo/forgejo/pulls/6542.
There are some edge cases where the UI would try to stretch the switch. Such inputs aren't really supposed to be dynamically stretched like this because it never looks good. So, I added a few rules to prevent this.
## Preview
This is the edge case with an artificially narrow screen.
|Before|After|
|-|-|
|||
No visual changes are expected outside of such edge case.
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/6543
Reviewed-by: Otto <otto@codeberg.org>
Co-authored-by: 0ko <0ko@noreply.codeberg.org>
Co-committed-by: 0ko <0ko@noreply.codeberg.org>
[skip ci] no relevant tests
It's been there for a while. `flex-start` causes all items to stick to one side and be misaligned if they have different heights.
`align-items` isn't actually needed in this area when the goal is centered vertical alignment, however, unsetting it _could_ break items' height. I couldn't make it do that, but to be safe I kept it and only replaced the value.
## Preview
||
|-|
||
There's no difference when they're broken into two rows, on mobile.
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/6541
Reviewed-by: Michael Kriese <michael.kriese@gmx.de>
Reviewed-by: Otto <otto@codeberg.org>
Co-authored-by: 0ko <0ko@noreply.codeberg.org>
Co-committed-by: 0ko <0ko@noreply.codeberg.org>
Accessibility:
- improved semantic layout
- Fixes unlabelled input for custom pronouns. CC @hazy
- Adds labels to dropdowns.
- Shortens certain texts for less verbose screen reader outputs and
people with slow reading speed.
- Turned optional username rename helper text with low contrast into
"normal" help text.
UI/UX:
- Removes section about primary email which is no longer managed in the
profile section.
- Fixes section about primary email not displaying in user settings when notifications are
not available.
- Removes primary email display, because it is not actually a form
element here. (Alternatively, we could display it and link to the
account settings for managing the email)
Added support for searching content in a specific directory or file.
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/6143
Reviewed-by: Gusted <gusted@noreply.codeberg.org>
Reviewed-by: 0ko <0ko@noreply.codeberg.org>
Co-authored-by: Shiny Nematoda <snematoda.751k2@aleeas.com>
Co-committed-by: Shiny Nematoda <snematoda.751k2@aleeas.com>
Confine the search menu to be at most the width of the page, or 80% of
the viewport width, whichever is smaller. To do this, introduce a new
`--container-width` variable for the descendant elements of
`.ui.container` to be able to access.
Also update the relevant e2e test: add a long 'lorem ipsum' page, add a
search for it, parameterize the width.
I found them to have too little contrast so I tweaked them a bit.
Screenshots and discussion can be found at:
https://codeberg.org/forgejo/forgejo/pulls/1746#issuecomment-2442469
Thanks a lot to @jpkhawam for creating the colorblind themes and for
helping me improving my changes even further! :)
This css class was used to display the "forgot password"-link right and above the password field.
cd75519a0b moves this link, so this class is now unused
UX/Translation changes:
- new teams: remove redundant tooltips that don't add meaningful information
- move general information to table fieldset
- new teams: rename "general" to "custom" access for clarity
- new teams: show labels beside options on mobile
Accessibility:
- semantic form elements allow easier navigation (fieldset, mostly)
- improve better labelling of new teams table
- fix accessibility scan issues
- TODO: the parts that "disable" form elements were not yet touched and
are not really accessible to screenreaders
Technical:
- replace two JavaScript solutions with one CSS standard
- implement a simpler grid (.simple-grid)
- simplify markup
- remove some webhook settings specific CSS
Testing:
- check more form content for accessibility issues
- but exclude tooltips from the scan :(
- reuse existing form tests from previous PR
Remove the snapping of the images on the projects cards, the images are
way too small to notice that when scrolling you're being snapped to
these images and when you do notice it, it doesn't make sense as you
wouldn't expect it to be snapped.
Modifies forms:
- (new) org team
- (new) repo webhook
- (new) repo protected branch
The forms are not completely rewritten to semantic HTML yet. The focus
of this change was on standard elements, some custom solutions were left
untouched for now.
- swaps the order fo permission radio buttons as per https://codeberg.org/forgejo/forgejo/issues/4983
- uses fieldsets to group related inputs
- ensures consistent styling across forms
- can be improved later, e.g. using horizontal lines between sections
- fixes: previous font size of labels was smaller than the font size of the help text
- help text are now part of the label, clicking them now also activates the input
- drop unused CSS (no required checkboxes in grouped class remain)
- playwright testing:
- move login boilerplate to utils
- automated form accessibility checking
- allow defining the scope, because legacy parts of the forms are not yet accessible
- assert some CSS properties that should not be overriden
- the Makefile adjustment was necessary, because eslint scanned some internal files in the tests/e2e/reports directory
- The usage of the `vue-bar-graph` is complicated, because of the `GSAP`
dependency they pull in, the dependency uses a non-free license.
- The code is rewritten to use the `chart.js` library, which is already
used to draw other charts in the activity tab. Due to the limitation of
`chart.js`, we have to create a plugin in order to have images as labels
and do click handling for those images.
- The chart isn't the same as the previous one, once again simply due to
how `chart.js` works, the amount of commits isn't drawn anymore in the
bar, you instead have to hover over it or look at the y-axis.
- Resolves#4569