- Backport #20781
- Since b9e8fa5 the avatar will be inlined into the comment header, so there's more room for the actual comment container(thus more text per line in the comment body). However this didn't take into consideration that the flex didn't allow any wrapping and thus was shrinking the avatar. Well this isn't a perfect solution, as you ideally all want these elements to be individually wrapped(such that comment-header-right can be on the same line as comment-header-left, which now causes a new line in certain situations). It's a better solution than the current CSS and to not mess with the desktop CSS/HTML.
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
- Backport #20726
- Currently the branch icon is "squashed" between the two branch names and feels a bit "amateur-ish" to my feeling(relative to other UI elements).
- This patch tries to improve that by making the icon bigger and by adding some margin to not have a "squashed" icon.
- This patch also includes a "fix", for some reason this symbol is not centering correctly. So apply allign-items: center to the top div
Previously, if a invalid form was submitted (for example issue with no
title), the form could not be re-submitted again because the button
would not stay stuck in loading state. Fix that by hooking the 'submit'
event instead which triggers only when the form is valid.
* Clean up and fix clone button script (#20415)
The button 'primary' class needs to be set in a synchronous script to prevent flicker of the button which was regressed recently, fixed that.
Additionally, reduced the two script tags to just one, the previous scripts were actually initializing the buttons thrice on the empty repo page, now it only initializes once. Finally, removed duplicate code and re-used the inline function in the update code as well.
I had to split out the script into a separate template as on the empty repo page, the script needs access to the clone URL span in the example text, which is rendered below the clone buttons, so buttons and script could not be combined.
* Add default value for clone URLs
Default clone URLs to HTTP(S) in DOM rendering. JS will immediately
replace this if the user preference is SSH.
Fixes: https://github.com/go-gitea/gitea/issues/20558
- Since #20108 we have two version of the notification bell, one for
mobile the other for non-mobile. However the code only accounts for one
notification count and thus was only updating the non-mobile one.
- This code fixes that by applying the code for all `.notification_count`s.
- Frontport will be in #20543
- This is a regression of improving mobile experience on Gitea, currently organization dashboard aren't readable and the popup won't show up when you want to switch between users/organization(as we saw in #19978).
- This patch fixes that, by allowing the popup to allocate the required pixels(for some absurd reason, z-index doesn't work on the popup, so it's not able to render over the existing elements, we can investigate later of why this is). And also remove the additional dropdown menu for the pages link, so it's one unified list which then can be displayed as rows.
Backport #20290
* Fix#19603
* fill HeadCommitID in PullRequest
* compare real commits ID as check for merging
Signed-off-by: Andrew Thornton <art27@cantab.net>
Co-authored-by: Andrew Thornton <art27@cantab.net>
Backport #20108
Backport #20236
Backport #20251
Make notification bell more prominent on mobile
Co-authored-by: Andrew Thornton <art27@cantab.net>
Co-authored-by: Tyrone Yeh <siryeh@gmail.com>
Signed-off-by: Andrew Thornton <art27@cantab.net>
- Backport #20234
- Initialize the popup for the tooltip inside the new code comment.
- This works and is good enough to have this issue fixed for 1.17
Fix#20068
- Backport #20142
- Firefox on Windows will unconditionally show scrollbars when you specify `overflow: scroll`. This is bad behavior, as you don't always need the scrollbar. Changing the scroll value to auto fixes this issue and only shows the scrollbar when necessary.
- Resolves#20139
Backport #20127
Store the file uuid(which is returned by Gitea in the upload file response) onto the file object, so it can be used for the remove feature to specify this file.
Fix#20115
- Fomantic tries to prevent overflowing on the `y/x`-as by default on
stackable menu's on mobile screens. We already solve this issue by
forcing overflow on x as and hide it on y as(due to some issues with
other menu's), since https://github.com/go-gitea/gitea/pull/19486.
- However this edge case does require a y-overflow to show the dropdown,
because you cannot easily adjust this with CSS, once you're fiddling
with overflow's (https://stackoverflow.com/a/6433475). However
interesting behavior is noted
https://css-tricks.com/popping-hidden-overflow/ when you remove the
position: relative, it will suddenly work again. Well because this is
the only solution without redesigning dropdowns, I think we can live
with the side-effect of the dropdown items being full-width instead
"relative" width to their parent.
- Resolves#19976
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Replace the only `<meter>` element in use with a `<progress>` which is
styled properly. Also slightly adjust colors on it for better contrast.
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
* Prettify number of issues
- Use the PrettyNumber function to add commas in large amount of issues.
* Use client-side formatting
* prettify on both server and client
* remove unused i18n entries
* handle more cases, support other int types in PrettyNumber
* specify locale to avoid issues with node default locale
* remove superfluos argument
* introduce template helper, octicon tweaks, js refactor
* Update modules/templates/helper.go
* Apply some suggestions.
* Add comment
* Update templates/user/dashboard/issues.tmpl
Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
- File headers can become quite width, so ensure the file size is not
being wrapped into itself(width + padding-right) and allow the overflow
to be scrolled(overflow-x).
Automatically add sidebar in the wiki view containing a TOC for the wiki page.
Make the TOC collapsable
Signed-off-by: Andrew Thornton <art27@cantab.net>
* Make the wiki editor bar sticky for longer wiki edits
On codeberg community it was requested to make the wiki editor toolbar sticky for longer wiki posts, so one wouldn't have to scroll to the top to use it. (Reference; https://codeberg.org/Codeberg/Community/issues/533).
In order to make this happen, the .editor-toolbar class needs to become position: sticky, and we need to fix it's transparent background and border-bottom. Because the bottom disappears, we add it. This makes the border become a double border, because the CodeMirror area defines borders for all. As such I've added a border-top: none, on the wiki write tab for the CodeMirror class.
* Make the issue bar in the issue view sticky for issue #10675
In issue #10675 it's requested to make the issue bar sticky upon scrolling in the issue view. The proposed change changes inline html, which is not desirable. As such I've added the position sticky option to it's container, and fix the background upon scrolling.
* Make linter happy on _repository.less
Fix 0px -> 0 to make the linter happy.
* Make linter happy on _editor.less
Fix 0px -> 0 to make the linter happy.
* Change z-index to the lowest boundary of 1
As per review of @silverwind change the z-index to it's lowest requirement of 1.
* Change z-index to the lowest boundary of 1
As per review of @silverwind change the z-index to it's lowest requirement of 1.
* Revert changes made to wiki editor (unsticky) and add max-height
Fixes the max-height to 85vh, on the proposed 90vh it just came out just slightly too large.
Unstickies the changes from the sticky commits.
* Revert changes for the sticky title editor
Removes the changes as done by the sticky title editor.
* Add max-height definition to CodeMirror-scroll
Add the max-height definition for the CodeMirror-scroll class in order to generalize the changes spoken about in PR #18271
* Remove CodeMirror-scroll definition
Remove the max-height in CodeMirror-scroll definition, in order to generalize it in the CodeMirror less file. As per discussion in #18271.
* fine tune CodeMirror min-height/max-height
Co-authored-by: 6543 <6543@obermui.de>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
* Remove customized (unmaintained) dropdown, improve aria a11y for dropdown
* fix repo permission
* use action instead of onChange
* re-order the CSS selector
* fix dropdown behavior for repo permissions, make elements inside menu item non-focusable
* use menu/menuitem instead of combobox/option. use tooltip(data-content) for aria-label, prevent from repeated attaching
* click menu item when pressing Enter
* code format
* fix repo permission
* repo setting: prevent from misleading users when error occurs
* fine tune the repo collaboration access mode dropdown (in case the access mode is undefined in the template)
Co-authored-by: zeripath <art27@cantab.net>
Co-authored-by: techknowlogick <techknowlogick@gitea.io>
Add ability to show source/target branches for Pull Request's list. It can be useful to see which branches are used in each PR right in the list.
Co-authored-by: Alexey Korobkov <akorobkov@cian.ru>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
Co-authored-by: Lauris BH <lauris@nix.lv>
* Make Ctrl+Enter (quick submit) work for issue comment and wiki editor
* Remove the required `SubmitReviewForm.Type`, empty type (triggered by quick submit) means "comment"
* Merge duplicate code
* make blue really blue
* replace blue button and label classes with primary
* add --color-blue-dark
* add light color variants, tweak a few colors
* fix colors
* add comment
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
- This is a continuation on [the work](https://github.com/go-gitea/gitea/pull/19546) I've done for improving mobile experience on Gitea.
- The current behavior of going trough the commits list is horrible, each individual item gets it's own row and thereby isn't quite compact as it should be on mobile. The commit view's header is in a bit better state, it's quite only that content is overlapping each other.
- This patch fixes those problems. Each row in the commit list table will actually take a row in the UI. The commit view's header has now a better organized way of placing the information.
* Update JS dependencies
- Update all JS dependencies minus vue and vue-loader
- Adapt to jest 28
- Add new eslint rules
- Tested Mermaid and Swagger-UI
* switch to @happy-dom/jest-environment for faster tests
* bump eslint env to es2022
* prevent double click new issue/pull/comment button
when network is not good, these button maybe
double clicked, then more than one same issues
pulls or comments will be created. this pull
request will fix this bug.
Signed-off-by: a1012112796 <1012112796@qq.com>
Start making the mobile experience not painful and be actually usable. This contains a few smaller changes to enhance this experience.
- Submit buttons on the review forms aren't columns anymore and are now allowed to be displayed on one row.
- The label/milestone & New Issue buttons were given each own row even tough, there's enough place to do it one the same row. This commit fixes that.
- The issues+Pull tab on repo's has a third item besides the label/milestone & New Issue buttons, the search bar. On desktop there's enough place to do this on one row, for mobile it isn't, currently it was using for each item a new row. This commits fixes that by only giving the searchbar a new row and have the other two buttons on the same row.
- The notification table will now be show a scrollbar instead of overflow.
- The repo buttons(Watch, Star, Fork) on mobile were showing quite big and the SVG wasn't even displayed on the same line, if the count of those numbers were too high it would even overflow. This commit removes the SVG, as there isn't any place to show them on the same row and allows them to have a new row if the counts of those buttons are high.
- The admin page can show you a lot of interesting information, on mobile the System Status + Configuration weren't properly displayed as the margin's were too high. This commit fixes that by reducing the margin to a number that makes sense on mobile.
- Fixes to not overflow the tables but instead force them to be scrollable.
- When viewing a issue or pull request, the comments aren't full-width but instead 80% and aligned to right, on mobile this is a annoyance as there isn't much width to begin with. This commits fixes that by forcing full-width and removing the avatars on the left side and instead including them inline in the comment header.
* Fix word breaks in Chrome
This fixes word wrapping on the filename for a comment on a PR. A previous commit fixed this problem in Firefox, but not Chrome.
Fixes#16248
* Don't break Outdated badge
This prevents the Outdated badge on a PR from wrapping in the middle of the word for a comment on a long filename.
* Move word break to recommended element
* Add overflow-wrap per PR review
* Update web_src/less/helpers.less
Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: 6543 <6543@obermui.de>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Adds a feature [like GitHub has](https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/proposing-changes-to-your-work-with-pull-requests/creating-a-pull-request-from-a-fork) (step 7).
If you create a new PR from a forked repo, you can select (and change later, but only if you are the PR creator/poster) the "Allow edits from maintainers" option.
Then users with write access to the base branch get more permissions on this branch:
* use the update pull request button
* push directly from the command line (`git push`)
* edit/delete/upload files via web UI
* use related API endpoints
You can't merge PRs to this branch with this enabled, you'll need "full" code write permissions.
This feature has a pretty big impact on the permission system. I might forgot changing some things or didn't find security vulnerabilities. In this case, please leave a review or comment on this PR.
Closes#17728
Co-authored-by: 6543 <6543@obermui.de>
* Make repository file list useable on mobile
- When you're browsing a repository on mobile, you're met by a giant
block called the "repository file list". The current design is not
useable for mobile and is a big annoyance while browsing a repo on
mobile. This PR removes that annoyance by making it more suitable design
when on mobile.
- Adds HTML for the commit/file time to align it vertically(noticeable
on mobile, not on PC).
- Show all information horizontally and not vertically.
- Remove the last commit message of the file, there isn't enough space
on mobile to place this anywhere, so we're not trying to make a
best-effort here and instead just not display it.
* Remove unnecessary `!important`
* Fix broken HTML
* Simplify code
* Improve dashboard's repo list performance
- Avoid a lot of database lookups for all the repo's, by adding a
undocumented "minimal" mode for this specific task, which returns the
data that's only needed by this list which doesn't require any database
lookups.
- Makes fetching these list faster.
- Less CPU overhead when a user visits home page.
* Refactor javascript code + fix Fork icon
- Use async in the function so we can use `await`.
- Remove `archivedFilter` check for count, as it doesn't make sense to
show the count of repos when you can't even see them(as they are
filited away).
* Add `count_only`
* Remove uncessary code
* Improve comment
Co-authored-by: delvh <dev.lh@web.de>
* Update web_src/js/components/DashboardRepoList.js
Co-authored-by: delvh <dev.lh@web.de>
* Update web_src/js/components/DashboardRepoList.js
Co-authored-by: delvh <dev.lh@web.de>
* By default apply minimal mode
* Remove `minimal` paramater
* Refactor count header
* Simplify init
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
Co-authored-by: delvh <dev.lh@web.de>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
Co-authored-by: zeripath <art27@cantab.net>