aboutsummaryrefslogtreecommitdiffstats
path: root/web_src/js/features/comp
Commit message (Collapse)AuthorAgeFilesLines
* Rewrite and restyle reaction selector and enable no-sizzle eslint rule ↵Giteabot2024-04-141-29/+27
| | | | | | | | | | | | | | | | | | | | | | | | (#30453) (#30473) Backport #30453 by @silverwind Enable `no-sizzle` lint rule, there was only one use in `initCompReactionSelector` which I have rewritten as follows: - Remove all jQuery except the necessary fomantic dropdown init - Remove the recursion, instead bind event listeners to common parent container nodes Did various tests, works with our without attachments, in diff view and in diff comments inside comment list. Additionally the style of reactions now matches between code comments and issue comments: <img width="275" alt="Screenshot 2024-04-13 at 14 58 10" src="https://github.com/go-gitea/gitea/assets/115237/9d08f188-8661-4dd9-bff4-cad6d6d09cab"> Co-authored-by: silverwind <me@silverwind.io> Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
* Migrate font-family to tailwind (#30118)silverwind2024-03-281-1/+1
| | | | | | | | | | | Enable us to use tailwind's [`font-family`](https://tailwindcss.com/docs/font-family) classes as well as remove `gt-mono` in favor of `tw-font-mono`. I also merged the "compensation" to one selector, previously this was two different values 0.9em and 0.95em. I did not declare a `serif` font because I don't think there will ever be a use case for those. Command ran: ```sh perl -p -i -e 's#gt-mono#tw-font-mono#g' web_src/js/**/* templates/**/*
* Remove jQuery class from the reaction selector (#30138)Yarden Shoham2024-03-271-1/+1
| | | | | | | - Switched from jQuery class functions to plain JavaScript `classList` - Tested the reaction selector and it works as before Signed-off-by: Yarden Shoham <git@yardenshoham.com> Co-authored-by: Giteabot <teabot@gitea.io>
* Refactor all `.length === 0` patterns in JS (#30045)silverwind2024-03-251-1/+1
| | | | This pattern comes of often during review, so let's fix it once and for all. Did not test, but changes are trivial enough imho.
* Remove jQuery `.attr` from the reaction selector (#30052)Yarden Shoham2024-03-251-3/+3
| | | | | | - Switched from jQuery `attr` to plain javascript `getAttribute` - Tested the reaction selector and it works as before Signed-off-by: Yarden Shoham <git@yardenshoham.com>
* Remove jQuery `.attr` from the ComboMarkdownEditor (#30051)Yarden Shoham2024-03-251-16/+15
| | | | | | | - Switched from jQuery `attr` to plain javascript `getAttribute` and `setAttribute` - Tested the markdown editor and it works as before Signed-off-by: Yarden Shoham <git@yardenshoham.com>
* Remove jQuery `.attr` from the label edit exclusive checkbox (#30053)Yarden Shoham2024-03-241-13/+13
| | | | | | - Switched from jQuery `attr` to plain javascript `getAttribute` - Tested the label edit exclusive checkbox and it works as before Signed-off-by: Yarden Shoham <git@yardenshoham.com>
* Migrate `gt-hidden` to `tw-hidden` (#30046)silverwind2024-03-241-3/+3
| | | | | | | | | | | | We have to define this one in helpers.css because tailwind only generates a single class but certain things rely on this being double-class. Command ran: ```sh perl -p -i -e 's#gt-hidden#tw-hidden#g' web_src/js/**/* templates/**/* models/**/* web_src/css/**/* --------- Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
* Enforce trailing comma in JS on multiline (#30002)silverwind2024-03-222-5/+5
| | | | | | | | To keep blame info accurate and to avoid [changes like this](https://github.com/go-gitea/gitea/pull/29977/files#diff-c3422631a14edbe1e508c4b22f0c718db318be08a6e889427802f9b6165d88d6R359), it's good to always have a trailing comma, so let's enforce it in JS. This rule is completely automatically fixable with `make lint-js-fix` and that's what I did here.
* Fix various loading states, remove `.loading` class (#29920)silverwind2024-03-211-1/+1
| | | | | | | | | | | | | | | | | | | | | | | Various code was using fomantic `loading` class which I think got broken a while ago and rendered only a full circle. Fix those to use `is-loading`. Before: <img width="295" alt="Screenshot 2024-03-19 at 22 56 26" src="https://github.com/go-gitea/gitea/assets/115237/dbe83395-5db4-4868-90bc-3613866a35f0"> After: <img width="60" alt="Screenshot 2024-03-19 at 22 54 35" src="https://github.com/go-gitea/gitea/assets/115237/8ac19b7e-035a-4c6d-850b-53a234ef69c2"> <img width="294" alt="Screenshot 2024-03-19 at 22 54 56" src="https://github.com/go-gitea/gitea/assets/115237/34e819d7-25f7-43a1-9d48-4a68dcd2b6ad"> <img width="320" alt="Screenshot 2024-03-19 at 22 55 16" src="https://github.com/go-gitea/gitea/assets/115237/05127544-47ff-4e18-9fd8-c84e44c374f8"> <img width="153" alt="Screenshot 2024-03-19 at 23 01 43" src="https://github.com/go-gitea/gitea/assets/115237/a33248c6-b11d-40ff-82d8-f5a3d85b55aa"> <img width="1300" alt="Screenshot 2024-03-19 at 23 56 25" src="https://github.com/go-gitea/gitea/assets/115237/562ca876-b5d5-4295-961e-9d2cdab31ab0"> <img width="136" alt="Screenshot 2024-03-20 at 00 00 38" src="https://github.com/go-gitea/gitea/assets/115237/44838ac4-67f3-4fec-a8e3-978cc5dbdb72">
* Remove jQuery `.attr` from the user search box (#29919)Yarden Shoham2024-03-201-3/+6
| | | | | | - Switched from jQuery `.attr` to plain javascript `.getAttribute` - Tested the user search box and it works as before Signed-off-by: Yarden Shoham <git@yardenshoham.com>
* Forbid jQuery `.css` and refactor all usage (#29852)silverwind2024-03-192-10/+12
| | | | | | | | | Tested all functionality. There is a [pre-existing bug](https://github.com/go-gitea/gitea/issues/29853) when moving a project panels which is not caused by this refactoring. --------- Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
* Forbid jQuery `.prop` and fix related issues (#29832)silverwind2024-03-161-3/+3
| | | | | | | | | | The issue checkbox code received a few more cleanups and I specifically tested it. The other changes are trivial. Also, I checked the cases for how many elements match the jQuery selection to determine querySelector vs. querySelectorAll. --------- Co-authored-by: Giteabot <teabot@gitea.io>
* Forbid variables containing jQuery collections not having the `$` prefix ↵Yarden Shoham2024-03-162-32/+32
| | | | | | | | | | | (#29839) See https://github.com/wikimedia/eslint-plugin-no-jquery/blob/master/docs/rules/variable-pattern.md --------- Signed-off-by: Yarden Shoham <git@yardenshoham.com> Co-authored-by: silverwind <me@silverwind.io>
* Fix WebHookEditor regression from jQuery removal (#29692)Yarden Shoham2024-03-091-7/+10
| | | | | | | | Make these calls optional --------- Signed-off-by: Yarden Shoham <git@yardenshoham.com> Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
* Support pasting URLs over markdown text (#29566)silverwind2024-03-082-30/+47
| | | | | | | | | | | | | | | | | Support pasting URLs over selection text in the textarea editor. Does not work in EasyMDE and I don't intend to support it. Image paste works as usual in both Textarea and EasyMDE. The new `replaceTextareaSelection` function changes textarea content via [`insertText`](https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand#using_inserttext) command, which preserves history, e.g. `CTRL-Z` works and is also demostrated below. We should later refactor the image paste code to use the same function because it currently destroys history. Overriding the formatting via `Shift` key is supported as well, e.g. `Ctrl+Shift+V` will insert the URL as-is, like on GitHub. ![urlpaste](https://github.com/go-gitea/gitea/assets/115237/522b1023-6797-401c-9e4a-498570adfc88)
* Remove jQuery AJAX from the markdown editor preview (#29384)Yarden Shoham2024-02-251-10/+10
| | | | | | | | | | | - Removed all jQuery AJAX calls and replaced with our fetch wrapper - Tested the markdown editor preview button functionality and it works as before # Demo using `fetch` instead of jQuery AJAX ![action](https://github.com/go-gitea/gitea/assets/20454870/3fc7abb8-4fdc-46e9-95f6-087d9526bb52) Signed-off-by: Yarden Shoham <git@yardenshoham.com>
* Remove jQuery from the image pasting functionality (#29324)Yarden Shoham2024-02-221-9/+11
| | | | | | | | | | - Switched to plain JavaScript - Tested the image pasting functionality and it works as before # Demo using JavaScript without jQuery ![demo](https://github.com/go-gitea/gitea/assets/20454870/018993ff-7b09-4d5f-88e0-f276368bacd6) Signed-off-by: Yarden Shoham <git@yardenshoham.com>
* Remove jQuery from repo wiki creation page (#29271)Yarden Shoham2024-02-201-8/+8
| | | | | | | | | | | | | - Switched to plain JavaScript - Tested the wiki creation form functionality and it works as before # Demo using JavaScript without jQuery ![action](https://github.com/go-gitea/gitea/assets/20454870/2dfc95fd-40cc-4ffb-9ae6-50f798fddd67) --------- Signed-off-by: Yarden Shoham <git@yardenshoham.com> Co-authored-by: silverwind <me@silverwind.io>
* Downscale pasted PNG images based on metadata (#29123)silverwind2024-02-191-3/+17
| | | | | | | | | | | | | | | | Some images like MacOS screenshots contain [pHYs](http://www.libpng.org/pub/png/book/chapter11.html#png.ch11.div.8) data which we can use to downscale uploaded images so they render in the same dppx ratio in which they were taken. Before: <img width="584" alt="image" src="https://github.com/go-gitea/gitea/assets/115237/50979e3a-5d5a-40dc-a0a4-36eb6e28f14a"> After: <img width="329" alt="image" src="https://github.com/go-gitea/gitea/assets/115237/0690902a-f2fe-4c6b-97b3-6fdd67c21bad">
* Remove jQuery from the webhook editor (#29211)Yarden Shoham2024-02-171-29/+27
| | | | | | | | | | | | | - Switched to plain JavaScript - Tested the webhook editing functionality and it works as before # Demo using JavaScript without jQuery ![action](https://github.com/go-gitea/gitea/assets/20454870/b24c264d-d5e5-4954-8789-e72564a99027) --------- Signed-off-by: Yarden Shoham <git@yardenshoham.com> Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
* Remove jQuery from the "quick submit" handler (#29200)Yarden Shoham2024-02-161-8/+1
| | | | | | | | | | | | - Switched to plain JavaScript - Tested the quick submit functionality and it works as before # Demo using JavaScript without jQuery ![action](https://github.com/go-gitea/gitea/assets/20454870/abbd6c49-ad0f-4f95-b4ba-e969b85a46e8) --------- Signed-off-by: Yarden Shoham <git@yardenshoham.com>
* Improve user search display name (#29002)KN4CK3R2024-02-011-5/+4
| | | | | | | | | | | | | | | | | I tripped over this strange method and I don't think we need that workaround to fix the value. old: ![grafik](https://github.com/go-gitea/gitea/assets/1666336/c8b6797b-eb45-4dec-99db-1b0649a34ec5) new: ![grafik](https://github.com/go-gitea/gitea/assets/1666336/ab1a65ae-de5b-4ce4-9813-3b8b39c7922e) --------- Co-authored-by: silverwind <me@silverwind.io> Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
* Update JS dependencies (#27922)silverwind2023-11-061-1/+0
| | | | | | | | - Update all JS dependencies minus @mcaptcha/vanilla-glue (unsolved error, see https://github.com/mCaptcha/glue/issues/65) - Migrate deprecated eslint rules to `@stylistic/eslint-plugin-js` - Enable and autofix `@stylistic/js/no-multiple-empty-lines` - Regenerate poetry.lock with latest poetry - Tested Mermaid, Swagger, Citation, Vue
* Use fetch helpers instead of fetch (#27026)silverwind2023-09-192-18/+5
| | | | | | | | | | | | WIP because: - [x] Some calls set a `content-type` but send no body, can likely remove the header - [x] Need to check whether `charset=utf-8` has any significance on the webauthn calls, I assume not as it is the default for json content. - [x] Maybe `no-restricted-globals` is better for eslint, but will require a lot of duplication in the yaml or moving eslint config to a `.js` extension. - [x] Maybe export `request` as `fetch`, shadowing the global.
* Change green buttons to primary color (#27099)silverwind2023-09-181-3/+3
| | | | | | | | | | | | | | | | | | | | | | | | I think it's better if the primary actions have primary color instead of green which fits better into the overall single-color UI design. This PR currently replaces every green button with primary: <img width="141" alt="Screenshot 2023-09-16 at 14 07 59" src="https://github.com/go-gitea/gitea/assets/115237/843c1e50-4fb2-4ec6-84ba-0efb9472dcbe"> <img width="161" alt="Screenshot 2023-09-16 at 14 07 51" src="https://github.com/go-gitea/gitea/assets/115237/9442195a-a3b2-4a42-b262-8377d6f5c0d1"> Modal actions now use uncolored/primary instead of previous green/red colors. I also removed the box-shadow on all basic buttons: <img width="259" alt="Screenshot 2023-09-16 at 14 16 39" src="https://github.com/go-gitea/gitea/assets/115237/5beea529-127a-44b0-8d4c-afa7b034a490"> <img width="261" alt="Screenshot 2023-09-16 at 14 17 42" src="https://github.com/go-gitea/gitea/assets/115237/4757f7b2-4d46-49bc-a797-38bb28437b88"> The change currently includes the "Merge PR" button, for which we might want to make an exception to match the icon color there: <img width="442" alt="Screenshot 2023-09-16 at 14 33 53" src="https://github.com/go-gitea/gitea/assets/115237/993ac1a5-c94d-4895-b76c-0d872181a70b">
* Focus editor on "Write" tab click (#26714)silverwind2023-08-251-0/+6
| | | | | Focus the editor when clicking the "Write" tab. Works for both Textarea and EasyMDE. Does for some reason not work without the `requestAnimationFrame`.
* Set "type=button" for editor's toolbar buttons (#26510)wxiaoguang2023-08-151-0/+2
| | | | The editor usually is in a form, so the buttons should have "type=button", avoid conflicting with the form's submit.
* Allow to archive labels (#26478)puni98692023-08-141-2/+5
| | | | | | | | | | | | | | | | | | | | | | | | | | | | | | ## Archived labels This adds the structure to allow for archived labels. Archived labels are, just like closed milestones or projects, a medium to hide information without deleting it. It is especially useful if there are outdated labels that should no longer be used without deleting the label entirely. ## Changes 1. UI and API have been equipped with the support to mark a label as archived 2. The time when a label has been archived will be stored in the DB ## Outsourced for the future There's no special handling for archived labels at the moment. This will be done in the future. ## Screenshots ![image](https://github.com/go-gitea/gitea/assets/80308335/208f95cd-42e4-4ed7-9a1f-cd2050a645d4) ![image](https://github.com/go-gitea/gitea/assets/80308335/746428e0-40bb-45b3-b992-85602feb371d) Part of https://github.com/go-gitea/gitea/issues/25237 --------- Co-authored-by: delvh <dev.lh@web.de> Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
* Don't autosize textarea in diff view (#26233)silverwind2023-07-311-2/+5
| | | | | | | | | | | | | | | | Resizing the comment editor can be a very expensive operation because it triggers page reflows, which on large PRs can take upwards of seconds to complete. Disable this mechanism on the diff page only where we know that the page can get large. Fixes https://github.com/go-gitea/gitea/issues/26201 for the textarea editor. I don't think this can be fixed for EasyMDE because as far as I can tell, it exposes no option to disable this resizing. --------- Co-authored-by: Giteabot <teabot@gitea.io>
* Add toasts to UI (#25449)silverwind2023-06-271-1/+2
| | | | | Fixes https://github.com/go-gitea/gitea/issues/24353 In some case like async success/error, it is useful to show toasts in UI.
* Batch delete issue and improve tippy opts (#25253)wxiaoguang2023-06-191-0/+30
| | | | | 1. Add "batch delete" button for selected issues, close #22273 2. Address the review in https://github.com/go-gitea/gitea/pull/25219#discussion_r1229266083
* Update JS dependencies, remove space after emoji completion (#25266)silverwind2023-06-181-1/+3
| | | | | | | | | | | | | | | | | - Update all JS dependencies - Enable stylint [`media-feature-name-value-no-unknown`](https://stylelint.io/user-guide/rules/media-feature-name-value-no-unknown) - Make use of new features in webpack and text-expander-element - Tested Swagger and Mermaid To explain the `text-expander-element` change: Before this version, the element added a unavoidable space after emoji completion. Now that https://github.com/github/text-expander-element/pull/36 is in, we gain control over this space and I opted to remove it for emoji completion and retain it for `@` mentions. --------- Co-authored-by: Giteabot <teabot@gitea.io>
* Change form actions to fetch for submit review box (#25219)HesterG2023-06-141-7/+14
| | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | Co-author: @wxiaoguang Close #25096 The way to fix it in this PR is to change form submit to fetch using formData, and add flags to avoid post repeatedly. Should be able to apply to more forms that have the same issue after this PR. In the demo below, 'approve' is clicked several times, and then 'comment' is clicked several time after 'request changes' clicked. After: https://github.com/go-gitea/gitea/assets/17645053/beabeb1d-fe66-4b76-b048-4f022b4e83a0 Update: screenshots from /devtest > ![image](https://user-images.githubusercontent.com/2114189/245680011-ee4231e0-a53d-4c2a-a9c2-71ccd98005cc.png) > > ![image](https://user-images.githubusercontent.com/2114189/245680057-9215d348-63d8-406d-8828-17e171163aaa.png) > > ![image](https://user-images.githubusercontent.com/2114189/245680148-89d7b3d1-d7b6-442f-b69e-eadaee112482.png) --------- Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
* Improve and fix bugs surrounding reactions (#24760)silverwind2023-05-281-39/+32
| | | | | | | | | | | | | | | | | | | | | | | | | | | | | - Slightly decrease size of reaction buttons - Remove tooltip inside menu, it's obvious by the picture alone - Fix top menu triangle - Use `display: grid` to align icons in menu - Use regular tooltip for reaction users - Fix bug that deleted the reaction bar on clicking already reacted reaction in dropdown <img width="490" alt="Screenshot 2023-05-17 at 00 03 42" src="https://github.com/go-gitea/gitea/assets/115237/61588b37-facb-4829-b75b-e1cb5dda8ca4"> <img width="67" alt="Screenshot 2023-05-17 at 00 11 14" src="https://github.com/go-gitea/gitea/assets/115237/29605589-3b5f-40c6-8ad4-09923094bb8e"> <img width="211" alt="Screenshot 2023-05-17 at 00 29 30" src="https://github.com/go-gitea/gitea/assets/115237/7d2725da-6a3d-4e42-a351-53647f79f762"> <img width="210" alt="Screenshot 2023-05-17 at 00 29 54" src="https://github.com/go-gitea/gitea/assets/115237/b50f8364-033c-4445-ba25-61a814bb2d92"> <img width="892" alt="Screenshot 2023-05-17 at 00 12 20" src="https://github.com/go-gitea/gitea/assets/115237/30a46424-406a-46e5-b4de-47172eb8679d"> --------- Co-authored-by: wxiaoguang <wxiaoguang@gmail.com> Co-authored-by: Giteabot <teabot@gitea.io>
* Support markdown editor for issue template (#24400)yp053272023-05-084-65/+88
| | | | | | | | | | | | | | | | | | | | | | | | | | | Fixes #24398 Task: - [x] Reusing "textarea" like GitHub seems more friendly to users. - [x] ^V image pasting and file uploading handling. <details><summary>screenshots</summary> ![image](https://user-images.githubusercontent.com/18380374/235418877-00090552-ebda-411c-8e39-b47246bc8746.png) ![image](https://user-images.githubusercontent.com/18380374/235419073-dc33cad7-7626-4bce-9161-eb205c7384b5.png) Display only one markdown editor: ![image](https://user-images.githubusercontent.com/18380374/235419098-ee21386d-2b2d-432e-bdb2-18646cc031e7.png) Support file upload and ^V image pasting ![image](https://user-images.githubusercontent.com/18380374/235419364-7b390fa4-da56-437d-b55e-3847fbc049e7.png) </details> --------- Co-authored-by: wxiaoguang <wxiaoguang@gmail.com> Co-authored-by: silverwind <me@silverwind.io>
* Fix EasyMDE toolbar (#24489)silverwind2023-05-032-57/+163
| | | | | | | | | | | | | Fixes https://github.com/go-gitea/gitea/issues/24486 The "clean block" button is gone because I could not find a matching octicon. Order of buttons is roughly equal to textarea. <img width="824" alt="Screenshot 2023-05-02 at 21 10 00" src="https://user-images.githubusercontent.com/115237/235762593-ceccb260-e665-4932-ac8a-ef6fe8406a3c.png"> --------- Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
* Remove all direct references to font-awesome (#24448)Yarden Shoham2023-05-011-4/+5
| | | | | | | | | | | | | | | | | - Related #10410 - I had to add an SVG for an empty checkbox https://github.com/primer/octicons/issues/942 # Before ![image](https://user-images.githubusercontent.com/20454870/235374683-13f355c3-1245-40db-adda-4c710fc80288.png) # After ![image](https://user-images.githubusercontent.com/20454870/235374655-cc637132-f314-424d-9243-13d45b8915d5.png) --------- Signed-off-by: Yarden Shoham <git@yardenshoham.com>
* Improve emoji and mention matching (#24255)Yarden Shoham2023-04-221-18/+4
| | | | | | | | | | | | | | | | | | | | | | | | Prioritize matches that start with the given text, then matches that contain the given text. I wanted to add a heart emoji on a pull request comment so I started writing `:`, `h`, `e`, `a`, `r` (at this point I still couldn't find the heart), `t`... The heart was not on the list, that's weird - it feels like I made a typo or a mistake. This fixes that. This also feels more like GitHub's emoji auto-complete. # Before ![image](https://user-images.githubusercontent.com/20454870/233630750-bd0a1b76-33d0-41d4-9218-a37b670c42b0.png) # After ![image](https://user-images.githubusercontent.com/20454870/233775128-05e67fc1-e092-4025-b6f7-1fd8e5f71e87.png) --------- Signed-off-by: Yarden Shoham <git@yardenshoham.com> Co-authored-by: silverwind <me@silverwind.io>
* Make mention autocomplete case insensitive in new markdown editor (#24190)Brecht Van Lommel2023-04-181-2/+4
| | | | | | | | This matches EasyMDE, and makes it easier to find the right user without having to remember the exact name. --------- Co-authored-by: silverwind <me@silverwind.io>
* Add option to search for users is active join a team (#24093)Tyrone Yeh2023-04-141-1/+1
| | | | | | | | Adding a user in a team to enter a username gives a list of no active users --------- Co-authored-by: Jason Song <i@wolfogre.com>
* Add monospace toggle button to textarea (#24034)silverwind2023-04-131-2/+19
| | | | | | | | | | | | | | | | | - Add new button to textarea to switch font. State is persisted in localStorage. - Change markdown-switch-easymde button from `<span>` to `<button>` - Slightly increased monospace font globally by 5% as I think it fits better. For hover effect on these buttons I'm deferring to https://github.com/go-gitea/gitea/pull/23896. ![](https://user-images.githubusercontent.com/115237/230948526-ecf8d730-0c69-4a8e-a1a5-1e5e079c754d.gif) --------- Co-authored-by: delvh <dev.lh@web.de>
* Add popup to hashed comments/pull requests/issues in file editing/adding ↵Hester Gong2023-04-111-7/+2
| | | | | | | | | | | | | | | | | | | | | | | preview tab (#24040) #23734 didn't add popups(tippy) to ref issues for the preview tab when adding/editing a file The location of the preview tab: <img width="1214" alt="截屏2023-04-10 13 55 38" src="https://user-images.githubusercontent.com/17645053/230836213-a73f0cee-378c-4a21-93db-583ba2c72f77.png"> This PR resues the logic in `ComboMarkdownEditor.js` to also add popup to hashed comments/pull requests/issues in file editing/adding preview tab. After - On hover: <img width="1222" alt="截屏2023-04-10 13 55 42" src="https://user-images.githubusercontent.com/17645053/230836250-527ca7d0-6ec4-4c68-89ab-4f1b57b09239.png"> --------- Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com> Co-authored-by: silverwind <me@silverwind.io>
* Fine tune markdown editor toolbar (#24046)wxiaoguang2023-04-111-1/+4
| | | | | | | | | | | | | | | | | | | | | | | 1. Remove unnecessary `btn-link` `muted` classes * Link is link, button is button, I can't see a real requirement to make a button like a link. * If anyone insists, please help to show me real example from modern frameworks / websites, how and why they do so. * No need to duplicate a lot of class names on similar elements * Declare styles clearly, for example, `markdown-toolbar` itself should have `display: flex`, but not use `gt-df` to overwrite the `display: block`. 2. Remove unnecessary `role` attribute * https://github.com/github/markdown-toolbar-element/issues/70 * The `markdown-toolbar-element` does want to add `role=button`, but there is a bug. * So we do the similar thing as upstream does (add the role by JS), until they fix their bugs. 3. Indent `markdown-switch-easymde` (before it doesn't have a proper indent) Screenshot: ![image](https://user-images.githubusercontent.com/2114189/231090912-f6ba01cb-d0eb-40ad-bf8c-ffc597d9a778.png)
* Replace tribute with text-expander-element for textarea (#23985)silverwind2023-04-091-4/+74
| | | | | | | | | | | | | | The completion popup now behaves now much more as expected than before for the raw textarea: - You can press <kbd>Tab</kbd> or <kbd>Enter</kbd> once the completion popup is open to accept the selected item - The menu does not close automatically when moving the cursor - When you delete text, previously correct suggestions are shown again - If you delete all text until the opening char (`@` or `:`) after applying a suggestion, the popup reappears again - Menu UI has been improved <img width="278" alt="Screenshot 2023-04-07 at 19 43 42" src="https://user-images.githubusercontent.com/115237/230653601-d6517b9f-0988-445e-aa57-5ebfaf5039f3.png">
* Improve markdown editor: width, height, preferred (#23895)wxiaoguang2023-04-071-13/+49
| | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | Follow #23876 1. Fine tune the heights of the editors (like before) * Auto expand the editor (increase/decrease the height) when editing 2. Remember user's last used editor (textarea/easymde) in LocalStorage, then next time the editor will be switched automatically * No need to introduce extra config option, it satisfies all users, including who prefer EasyMDE 3. Also fix the width problem of Review Panel Screenshot: <details> ![image](https://user-images.githubusercontent.com/2114189/229518585-2e05827e-8355-48f3-a20c-2c8b9e60ce74.png) ![image](https://user-images.githubusercontent.com/2114189/229518173-4caa6da7-6ad9-40e9-bf1a-ceddfcd4b37f.png) ![image](https://user-images.githubusercontent.com/2114189/229507886-148e9b84-9b58-46d1-ba3f-727e1396f476.png) ![image](https://user-images.githubusercontent.com/2114189/229518258-9f522294-1e64-4b06-91ab-ab43b0353aaa.png) ![image](https://user-images.githubusercontent.com/2114189/229507752-6d540ac7-7748-4bb6-bc09-28acab32d31b.png) ![image](https://user-images.githubusercontent.com/2114189/229510899-de322af5-57e8-4dc5-9a61-771a3b1bee79.png) </details> --------- Co-authored-by: silverwind <me@silverwind.io>
* Introduce GitHub markdown editor, keep EasyMDE as fallback (#23876)wxiaoguang2023-04-034-227/+303
| | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | The first step of the plan * #23290 Thanks to @silverwind for the first try in #15394 . Close #10729 and a lot of related issues. The EasyMDE is not removed, now it works as a fallback, users can switch between these two editors. Editor list: * Issue / PR comment * Issue / PR comment edit * Issue / PR comment quote reply * PR diff view, inline comment * PR diff view, inline comment edit * PR diff view, inline comment quote reply * Release editor * Wiki editor Some editors have attached dropzone Screenshots: <details> ![image](https://user-images.githubusercontent.com/2114189/229363558-7e44dcd4-fb6d-48a0-92f8-bd12f57bb0a0.png) ![image](https://user-images.githubusercontent.com/2114189/229363566-781489c8-5306-4347-9714-d71af5d5b0b1.png) ![image](https://user-images.githubusercontent.com/2114189/229363771-1717bf5c-0f2a-4fc2-ba84-4f5b2a343a11.png) ![image](https://user-images.githubusercontent.com/2114189/229363793-ad362d0f-a045-47bd-8f9d-05a9a842bb39.png) </details> --------- Co-authored-by: silverwind <me@silverwind.io>
* Append `(comment)` when a link points at a comment rather than the whole ↵Hester Gong2023-04-031-0/+3
| | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | issue (#23734) Close #23671 For the feature mentioned above, this PR append ' (comment)' to the rendered html if it is a hashcomment. After the PR, type in the following ``` pull request from other repo: http://localhost:3000/testOrg/testOrgRepo/pulls/2 pull request from this repo: http://localhost:3000/aaa/testA/pulls/2 issue comment from this repo: http://localhost:3000/aaa/testA/issues/1#issuecomment-18 http://localhost:3000/aaa/testA/pulls/2#issue-9 issue comment from other repo: http://localhost:3000/testOrg/testOrgRepo/pulls/2#issuecomment-24 http://localhost:3000/testOrg/testOrgRepo/pulls/2#issue ``` Gives: <img width="687" alt="截屏2023-03-27 13 53 06" src="https://user-images.githubusercontent.com/17645053/227852387-2b218e0d-3468-4d90-ad81-d702ddd17fd2.png"> Other than the above feature, this PR also includes two other changes: 1 Right now, the render of links from file changed tab in pull request might not be very proper, for example, if type in the following. (not sure if this is an issue or design, if not an issue, I will revert the changes). example on [try.gitea.io](https://try.gitea.io/HesterG/testrepo/pulls/1) ``` https://try.gitea.io/HesterG/testrepo/pulls/1/files#issuecomment-162725 https://try.gitea.io/HesterG/testrepo/pulls/1/files ``` it will render the following <img width="899" alt="截屏2023-03-24 15 41 37" src="https://user-images.githubusercontent.com/17645053/227456117-5eccedb7-9118-4540-929d-aee9a76de852.png"> In this PR, skip processing the link into a ref issue if it is a link from files changed tab in pull request After: type in following ``` hash comment on files changed tab: http://localhost:3000/testOrg/testOrgRepo/pulls/2/files#issuecomment-24 files changed link: http://localhost:3000/testOrg/testOrgRepo/pulls/2/files ``` Gives <img width="708" alt="截屏2023-03-27 22 09 02" src="https://user-images.githubusercontent.com/17645053/227964273-5dc06c50-3713-489c-b05d-d95367d0ab0f.png"> 2 Right now, after editing the comment area, there will not be tippys attached to `ref-issue`; and no tippy attached on preview as well. example: https://user-images.githubusercontent.com/17645053/227850540-5ae34e2d-b1d7-4d0d-9726-7701bf825d1f.mov In this PR, in frontend, make sure tippy is added after editing the comment, and to the comment on preview tab After: https://user-images.githubusercontent.com/17645053/227853777-06f56b4c-1148-467c-b6f7-f79418e67504.mov
* Use data-tooltip-content for tippy tooltip (#23649)wxiaoguang2023-03-241-1/+1
| | | | | | | | | | | | | | | | | Follow: * #23574 * Remove all ".tooltip[data-content=...]" Major changes: * Remove "tooltip" class, use "[data-tooltip-content=...]" instead of ".tooltip[data-content=...]" * Remove legacy `data-position`, it's dead code since last Fomantic Tooltip -> Tippy Tooltip refactoring * Rename reaction attribute from `data-content` to `data-reaction-content` * Add comments for some `data-content`: `{{/* used by the form */}}` * Remove empty "ui" class * Use "text color" for SVG icons (a few)
* Scoped labels: set aria-disabled on muted Exclusive option for a11y (#23306)Brecht Van Lommel2023-03-051-0/+2
| | | | | | | | | It is convenient to be able to toggle off this option after removing / from the name. This ensures the muted state is communicated to blind users even when the input is not fully disabled. Part of #22974 Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
generated by cgit v1.2.3 (git 2.39.1) at 2025-01-16 15:41:10 +0000