aboutsummaryrefslogtreecommitdiffstats
path: root/web_src/css/modules
Commit message (Collapse)AuthorAgeFilesLines
...
* Use unique class for breadcrumb divider (#26524)silverwind2023-08-161-3/+8
| | | | | | | | | | | | | | | Fix regression from https://github.com/go-gitea/gitea/pull/25539: https://github.com/go-gitea/gitea/pull/26519#issuecomment-1678825200. Before: <img width="429" alt="Screenshot 2023-08-15 at 15 46 12" src="https://github.com/go-gitea/gitea/assets/115237/a818f60a-77a2-48fe-8e6f-363d152ccb1e"> After: <img width="424" alt="Screenshot 2023-08-15 at 15 46 19" src="https://github.com/go-gitea/gitea/assets/115237/c90159e2-ced2-4a74-8a0f-a1b2b5d0b565"> <img width="605" alt="Screenshot 2023-08-15 at 15 56 11" src="https://github.com/go-gitea/gitea/assets/115237/3ded6f57-86f4-422a-86cb-56dd2c216dee">
* Reduce margins on user settings page, introduce `flex-container` (#26046)silverwind2023-07-311-0/+23
| | | | | | | | | | | Same as https://github.com/go-gitea/gitea/pull/26026 but for the user settings page. It introduces a new `flex-container` class and shares it across both pages. Before and After: <img width="1264" alt="Screenshot 2023-07-21 at 19 35 57" src="https://github.com/go-gitea/gitea/assets/115237/1358dab4-55c0-40ce-a4d5-673099304f3d"> <img width="1269" alt="Screenshot 2023-07-21 at 19 35 42" src="https://github.com/go-gitea/gitea/assets/115237/34812f6d-dc65-4009-b977-90e03efdc6d1">
* Prevent SVG shrinking (#25652)silverwind2023-07-041-0/+41
| | | | | | | | | | | This will prevent the most common cases of SVG shrinking because lack of space. I evaluated multiple options and this seems to be the one with the least impact in size and processing cost, so I went with it. Unfortunately, CSS can not dynamically convert `16` obtained from `attr()` to `16px`, or else a generic solution for all sizes would have been possible. But a solution is [in sight](https://developer.mozilla.org/en-US/docs/Web/CSS/attr#type-or-unit) with `attr(width px)` but no browser supports it currently.
* Replace fomantic divider module with our own (#25539)silverwind2023-06-291-0/+39
| | | | | | | | | | | | | | | | | | | | | Should look exactly like before for normal dividers. "Horizontal" ones look better because they no longer use image backgrounds. <img width="917" alt="Screenshot 2023-06-27 at 19 07 56" src="https://github.com/go-gitea/gitea/assets/115237/d97d8dec-6859-44a8-85ba-e4549b4dd9df"> <img width="914" alt="Screenshot 2023-06-27 at 19 05 58" src="https://github.com/go-gitea/gitea/assets/115237/8bf98544-2d82-4ebf-ac68-d6dc237bd6b2"> <img width="1246" alt="Screenshot 2023-06-27 at 19 00 42" src="https://github.com/go-gitea/gitea/assets/115237/36a6bb21-6029-4f53-8bee-535f55c66fed"> <img width="344" alt="Screenshot 2023-06-27 at 18 58 15" src="https://github.com/go-gitea/gitea/assets/115237/a9e70aee-8e6b-4ea1-9e93-19c9f96aec6e"> <img width="823" alt="Screenshot 2023-06-27 at 18 56 22" src="https://github.com/go-gitea/gitea/assets/115237/e7a497cd-f262-4683-8872-23c3c8cce32f"> <img width="330" alt="Screenshot 2023-06-27 at 19 21 11" src="https://github.com/go-gitea/gitea/assets/115237/42f24149-a655-4c7e-bd26-8ab52db6446b">
* Use fetch form action for lock/unlock/pin/unpin on sidebar (#25380)HesterG2023-06-291-4/+11
| | | | | | | | | | | | | | | | | | | | | | | | | | | | Before: <img width="364" alt="Screen Shot 2023-06-20 at 11 59 11" src="https://github.com/go-gitea/gitea/assets/17645053/ad284b7e-8d21-43be-b178-bbcfd37cb5bd"> Might trigger many posts when keep clicking the buttons above. <img width="448" alt="Screen Shot 2023-06-20 at 11 52 28" src="https://github.com/go-gitea/gitea/assets/17645053/a60aa6ac-af74-45e4-b13a-512b436b81b0"> <img width="678" alt="Screen Shot 2023-06-20 at 11 52 37" src="https://github.com/go-gitea/gitea/assets/17645053/d6662700-3643-4cc7-a2ec-64e1c0f5fbdb"> After (PR sidebar, Same for issue): https://github.com/go-gitea/gitea/assets/17645053/9df3ad1f-e29c-439b-8bde-e6b917d63cc6 For delete, it is using `base/modal_actions_confirm` subtemplate, and we might need another general solution for this (maybe add another attribute to the subtemplate or something) --------- Co-authored-by: silverwind <me@silverwind.io> Co-authored-by: Giteabot <teabot@gitea.io> Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
* Update JS dependencies and misc tweaks (#25540)silverwind2023-06-271-1/+1
| | | | | | | | | | | | - Update all JS dependencies - Enable `declaration-property-unit-disallowed-list` to forbid `em` on `line-height` - Rename dependency update targets to `update-js` and `update-py` and document them - Remove margin on Asciicast viewer - Tested Swagger, Katex, Asciicast <img width="1243" alt="Screenshot 2023-06-27 at 19 51 05" src="https://github.com/go-gitea/gitea/assets/115237/2d2722a0-2aa7-4f4c-b8bd-17e1f3637b78">
* Add toasts to UI (#25449)silverwind2023-06-271-0/+78
| | | | | Fixes https://github.com/go-gitea/gitea/issues/24353 In some case like async success/error, it is useful to show toasts in UI.
* Navbar fixes (#25402)silverwind2023-06-241-4/+8
| | | | | | | | | | | | | | | | Fixes: https://github.com/go-gitea/gitea/issues/25444 Followup for some regressions from https://github.com/go-gitea/gitea/pull/25343. Before and after: <img width="219" alt="Screenshot 2023-06-21 at 00 25 20" src="https://github.com/go-gitea/gitea/assets/115237/08fe8e01-0a16-4cdf-ad4d-0a9048408e9e"> <img width="220" alt="Screenshot 2023-06-21 at 00 25 32" src="https://github.com/go-gitea/gitea/assets/115237/be25ae69-6ed0-4af5-8eeb-d7b210e7c124"> Fixes mobile button background and margins: <img width="836" alt="Screenshot 2023-06-21 at 00 39 58" src="https://github.com/go-gitea/gitea/assets/115237/d76ac1e9-747f-477c-9a42-b73e129b72ee">
* Fine tune project board label colors and modal content background (#25419)HesterG2023-06-211-0/+1
| | | | | | | | | | | | | | | | | | | | | | | | | | | | - The label text color on project board is not contrasting enough, changed to colors that are same as places that also used `useLightTextOnBackground` function ([util_render.go](https://github.com/go-gitea/gitea/blob/2cdf260f42d178d23a8db70db35664511aeab31e/modules/templates/util_render.go#L136-L141), [Context Popup](https://github.com/go-gitea/gitea/blob/2cdf260f42d178d23a8db70db35664511aeab31e/web_src/js/components/ContextPopup.vue#L81-L84)) - background of modal `content` is `#ffffff` (from fomantic) right now, which does not look good on dark mode, so changed to `var(--color-body)` Before: <img width="1378" alt="Screen Shot 2023-06-21 at 14 24 13" src="https://github.com/go-gitea/gitea/assets/17645053/1527ca28-c884-4ca9-a4be-7a72ad1a093a"> <img width="900" alt="Screen Shot 2023-06-21 at 14 25 52" src="https://github.com/go-gitea/gitea/assets/17645053/fab82116-7376-4027-a0a4-9eedf9fb0a30"> After: <img width="1383" alt="Screen Shot 2023-06-21 at 14 19 33" src="https://github.com/go-gitea/gitea/assets/17645053/fe0997e7-fee6-4522-bc4e-545088ec1cc8"> <img width="797" alt="Screen Shot 2023-06-21 at 14 32 42" src="https://github.com/go-gitea/gitea/assets/17645053/b0591af0-950c-4448-9430-34d6c7215971">
* Fix dropdown icon layout on diff page (#25397)wxiaoguang2023-06-201-6/+0
| | | | | | | | | | | | | | | | | | | | | | | | | | | | Address https://github.com/go-gitea/gitea/pull/25163#issuecomment-1599207916 Remove the unused "icon-button". And fix the layout: Without the dropdown icon: ``` {{svg "gitea-whitespace"}} ``` ![image](https://github.com/go-gitea/gitea/assets/2114189/58a524ba-f289-4982-aea2-6f9f9f9cbdcf) With the dropdown icon: ``` {{svg "gitea-whitespace" 16 "gt-mr-3"}} {{svg "octicon-triangle-down" 14 "dropdown icon"}} ``` ![image](https://github.com/go-gitea/gitea/assets/2114189/eb99168b-5d49-40a7-8665-5296cbb4e486)
* Support configuration variables on Gitea Actions (#24724)sillyguodong2023-06-201-1/+5
| | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | Co-Author: @silverwind @wxiaoguang Replace: #24404 See: - [defining configuration variables for multiple workflows](https://docs.github.com/en/actions/learn-github-actions/variables#defining-configuration-variables-for-multiple-workflows) - [vars context](https://docs.github.com/en/actions/learn-github-actions/contexts#vars-context) Related to: - [x] protocol: https://gitea.com/gitea/actions-proto-def/pulls/7 - [x] act_runner: https://gitea.com/gitea/act_runner/pulls/157 - [x] act: https://gitea.com/gitea/act/pulls/43 #### Screenshoot Create Variable: ![image](https://user-images.githubusercontent.com/33891828/236758288-032b7f64-44e7-48ea-b07d-de8b8b0e3729.png) ![image](https://user-images.githubusercontent.com/33891828/236758174-5203f64c-1d0e-4737-a5b0-62061dee86f8.png) Workflow: ```yaml test_vars: runs-on: ubuntu-latest steps: - name: Print Custom Variables run: echo "${{ vars.test_key }}" - name: Try to print a non-exist var run: echo "${{ vars.NON_EXIST_VAR }}" ``` Actions Log: ![image](https://user-images.githubusercontent.com/33891828/236759075-af0c5950-368d-4758-a8ac-47a96e43b6e2.png) --- This PR just implement the org / user (depends on the owner of the current repository) and repo level variables, The Environment level variables have not been implemented. Because [Environment](https://docs.github.com/en/actions/deployment/targeting-different-environments/using-environments-for-deployment#about-environments) is a module separate from `Actions`. Maybe it would be better to create a new PR to do it. --------- Co-authored-by: silverwind <me@silverwind.io> Co-authored-by: wxiaoguang <wxiaoguang@gmail.com> Co-authored-by: Giteabot <teabot@gitea.io>
* Navbar styling rework (#25343)silverwind2023-06-201-0/+138
| | | | | | | | | | | | | | | | | | | | | | | - Extract navbar CSS to own file - Reduce height from 52px to 50px - Give every item a hover effect of of 36px, including the logo and on mobile - Consistent horizontal padding of 10px left and right <img width="549" alt="Screenshot 2023-06-18 at 13 41 16" src="https://github.com/go-gitea/gitea/assets/115237/0b00d101-253e-4b1f-9ee2-322d60fb2e26"> <img width="98" alt="Screenshot 2023-06-18 at 14 03 43" src="https://github.com/go-gitea/gitea/assets/115237/4ef5d98b-4d1e-45de-822e-c2c844e19876"> <img width="234" alt="Screenshot 2023-06-18 at 14 03 18" src="https://github.com/go-gitea/gitea/assets/115237/a4d9b04b-83de-42aa-a9ce-f010a9690688"> <img width="873" alt="Screenshot 2023-06-18 at 13 58 28" src="https://github.com/go-gitea/gitea/assets/115237/8cb8e31e-2adf-40c8-ae3f-d00d011b4d1b"> --------- Co-authored-by: wxiaoguang <wxiaoguang@gmail.com> Co-authored-by: Giteabot <teabot@gitea.io>
* Fix loading state regression in markup content (#25349)silverwind2023-06-191-1/+11
| | | | | | | | | | | | | | | Fix regressions from https://github.com/go-gitea/gitea/pull/25219: Math before and after: <img width="630" alt="Screenshot 2023-06-18 at 16 00 52" src="https://github.com/go-gitea/gitea/assets/115237/f2a01e4b-31ca-407c-8fc3-f0aec569b48e"> <img width="680" alt="Screenshot 2023-06-18 at 16 03 44" src="https://github.com/go-gitea/gitea/assets/115237/faab8e39-f088-45ab-b460-15fc3654c99d"> Mermain before and after: <img width="810" alt="Screenshot 2023-06-18 at 15 58 56" src="https://github.com/go-gitea/gitea/assets/115237/d8c24e81-4702-4e17-b791-7dffe090c068"> <img width="786" alt="Screenshot 2023-06-18 at 15 58 37" src="https://github.com/go-gitea/gitea/assets/115237/3a268e10-c071-410d-a66e-8c4427d1d61c">
* add `stylelint-stylistic` (#25285)silverwind2023-06-173-6/+5
| | | | | | Add [stylelint-stylistic](https://github.com/elirasza/stylelint-stylistic), autofix all issues with two manual tweaks. This restores all the stylistic rules removed in Stylelint 15.
* Remove more unused Fomantic variants (#25292)silverwind2023-06-171-16/+0
| | | | | | | | | Save another 50KB of CSS by removing unused and useless Fomantic variants. Removed the last instance if a `tertiary` button and fixed a TODO: <img width="509" alt="Screenshot 2023-06-15 at 22 34 36" src="https://github.com/go-gitea/gitea/assets/115237/8a16ae7b-2b17-439b-a096-60a52724e3d6">
* Use flex to align SVG and text (#25163)wxiaoguang2023-06-141-4/+0
| | | | | | | | | | | | | | | | The code can be as simple as: ```html <div class="flex-text-block">{{svg "octicon-alert"}} {{svg "octicon-x"}} text (block)</div> <div><div class="flex-text-inline">{{svg "octicon-alert"}} {{svg "octicon-x"}} text</div> (inline)</div> <div><button class="ui red button">{{svg "octicon-alert" 24}} {{svg "octicon-x" 24}} text</button></div> ``` ![image](https://github.com/go-gitea/gitea/assets/2114189/1d3c10f1-0bc7-4c26-b236-bad537d5c465) --------- Co-authored-by: Giteabot <teabot@gitea.io>
* Change form actions to fetch for submit review box (#25219)HesterG2023-06-142-9/+18
| | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | 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>
* Change access token UI to select dropdowns (#25109)Jonathan Tran2023-06-131-0/+25
| | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | The current UI to create API access tokens uses checkboxes that have a complicated relationship where some need to be checked and/or disabled in certain states. It also requires that a user interact with it to understand what their options really are. This branch changes to use `<select>`s. It better fits the available options, and it's closer to [GitHub's UI](https://github.com/settings/personal-access-tokens/new), which is good, in my opinion. It's more mobile friendly since the tap-areas are larger. If we ever add more permissions, like Maintainer, there's a natural place that doesn't take up more screen real-estate. This branch also fixes a few minor issues: - Hide the error about selecting at least one permission after second submission - Fix help description to call it "authorization" since that's what permissions are about (not authentication) Related: #24767. <img width="883" alt="Screenshot 2023-06-07 at 5 07 34 PM" src="https://github.com/go-gitea/gitea/assets/10803/6b63d807-c9be-4a4b-8e53-ecab6cbb8f76"> --- When it's open: <img width="881" alt="Screenshot 2023-06-07 at 5 07 59 PM" src="https://github.com/go-gitea/gitea/assets/10803/2432c6d0-39c2-4ca4-820e-c878ffdbfb69">
* Fix mobile navbar and misc cleanups (#25134)silverwind2023-06-091-2/+2
| | | | | | | | | | | | | | | | | | - Fix and improve mobile navbar layout - Apply all cleanups suggested in https://github.com/go-gitea/gitea/pull/25111 - Make media query breakpoints match Fomantic's exactly - Clean up whitespace in class on navbar items Mobile navbar before and after: <img width="745" alt="Screenshot 2023-06-08 at 08 40 56" src="https://github.com/go-gitea/gitea/assets/115237/ca84b239-b10f-41db-8c06-dcf2b6dd9d28"> <img width="739" alt="Screenshot 2023-06-08 at 08 41 23" src="https://github.com/go-gitea/gitea/assets/115237/09133c54-eb7e-4110-858c-ead23c3b7521"> --------- Co-authored-by: wxiaoguang <wxiaoguang@gmail.com> Co-authored-by: Giteabot <teabot@gitea.io>
* Button and color enhancements (#24989)silverwind2023-06-091-253/+180
| | | | | | | | | | | | | | | | | | - Various corrections to button styles, especially secondary - Remove focus highlight, it's annoying when it stays on button after press - Clearly define ghost and link buttons with demos in devtest - Remove black, grey and tertiary buttons, they should not be used - Make `arc-green` slightly darker <img width="1226" alt="image" src="https://github.com/go-gitea/gitea/assets/115237/8d89786a-01ab-40f8-ae5a-e17f40e35084"> <img width="1249" alt="image" src="https://github.com/go-gitea/gitea/assets/115237/83651e6d-3c27-46ff-b8bd-ff344d70e949"> --------- Co-authored-by: wxiaoguang <wxiaoguang@gmail.com> Co-authored-by: Giteabot <teabot@gitea.io>
* Add button on diff header to copy file name, misc diff header tweaks (#24986)silverwind2023-06-011-1/+5
| | | | | | | | | | | | | | | | | | | | | 1. Add this button: <img width="232" alt="Screenshot 2023-05-29 at 15 21 47" src="https://github.com/go-gitea/gitea/assets/115237/5eaf6bd1-83db-4ffc-9503-eda0c59807d2"> <img width="297" alt="Screenshot 2023-05-29 at 15 20 22" src="https://github.com/go-gitea/gitea/assets/115237/708a344f-f6d7-4229-bfda-76e1571b42c8"> 2. Correct `button-link` styles to not have a background hover effect. 3. Tweak `.ui.container` padding to be the same for fluid and non-fluid. 4. Misc enhancements to diff header: Before: <img width="984" alt="Screenshot 2023-05-29 at 15 38 53" src="https://github.com/go-gitea/gitea/assets/115237/c7926f6a-bd0a-4b05-97ad-c91fc25c62d5"> After: <img width="987" alt="Screenshot 2023-05-29 at 15 43 10" src="https://github.com/go-gitea/gitea/assets/115237/0149f545-45f8-42cf-b443-e1c76bd5cdeb">
* Rework button coloring, add focus and active colors (#24507)silverwind2023-05-291-0/+816
| | | | | | | | | | | | | | | | | | | | | | | | | We were missing overrides for `:focus` and `:active` styles which I've added here along with two new color variants `dark-1` and `dark-2` for them. Fomantic UI has 4 different colors but I think 3 are sufficient. I also changed it on arc-green so button goes darker when pressed. <img width="129" alt="Screenshot 2023-05-04 at 01 21 43" src="https://user-images.githubusercontent.com/115237/236072060-7389276a-275b-4d3e-aa52-20b37c6e6d92.png"> <img width="130" alt="Screenshot 2023-05-04 at 01 17 59" src="https://user-images.githubusercontent.com/115237/236071818-0e46414a-33db-4bb2-a3bd-35b514a8a2d0.png"> <img width="129" alt="Screenshot 2023-05-04 at 01 18 07" src="https://user-images.githubusercontent.com/115237/236071819-562b1e38-541f-432b-b3b6-48e6d7594d00.png"> <img width="131" alt="Screenshot 2023-05-04 at 01 18 13" src="https://user-images.githubusercontent.com/115237/236071820-89b7dba9-ce6c-48e5-a075-9053063e6ad3.png"> <img width="133" alt="Screenshot 2023-05-04 at 01 18 30" src="https://user-images.githubusercontent.com/115237/236071823-b6fe2df4-b3f0-4dc8-97a8-f90ba6d19bec.png"> <img width="133" alt="Screenshot 2023-05-04 at 01 18 40" src="https://user-images.githubusercontent.com/115237/236071824-b02ce61a-2367-4c29-8a25-45f231f5e5ee.png"> One misc change includes some fixes to editor and slightly darker selection. <img width="1245" alt="Screenshot 2023-05-28 at 19 16 19" src="https://github.com/go-gitea/gitea/assets/115237/1ea4a4b6-26ba-45af-9cbc-5b8c476c2338">
* Add PDF rendering via PDFObject (#24086)silverwind2023-05-291-1/+2
| | | | | | | | | | | | | | | | | | | | | | | | | | | Use [PDFObject](https://pdfobject.com/) to embed PDFs, replacing our outdated PDF.js copy we vendor (the last non-webpack vendoring). [Commit 1](https://github.com/go-gitea/gitea/pull/24086/commits/673e0263da64b72565ff59b990ab1b8e87271872) is the PDFObject integration [Commit 2](https://github.com/go-gitea/gitea/pull/24086/commits/9336f5769d54445bba0e16776164f6a2fe2c32ac) is the removal of PDF.js <img width="1251" alt="Screenshot 2023-05-27 at 09 57 52" src="https://github.com/go-gitea/gitea/assets/115237/169ce50c-bd1d-4bb0-86e5-1710bd0400a9"> <img width="1257" alt="Screenshot 2023-05-27 at 10 12 50" src="https://github.com/go-gitea/gitea/assets/115237/318f7ee9-fb11-4093-83e7-17475aa70629"> Fallback for unsupporting browsers (most mobile ones, except Firefox Mobile): <img width="358" alt="Screenshot 2023-05-27 at 09 43 34" src="https://github.com/go-gitea/gitea/assets/115237/8c12d7ba-57d6-4228-89a0-5fef9fad0cbb"> --------- Co-authored-by: Giteabot <teabot@gitea.io>
* Consolidate the two review boxes into one (#24738)silverwind2023-05-291-1/+0
| | | | | | | | | | | | | | | | | | | | | | | | | View diff: https://github.com/go-gitea/gitea/pull/24738/files?diff=unified&w=1 Improve layout and functionality in review area: <img width="439" alt="Screenshot 2023-05-15 at 20 10 01" src="https://github.com/go-gitea/gitea/assets/115237/be10452b-5829-4927-8801-7b26a57b3dbd"> Remove the "Reviewers" timeline box that appears before the merge box. it's a duplicate of the top-right review area and all functionality of it has been moved to the other box: <img width="868" alt="Screenshot 2023-05-15 at 19 39 31" src="https://github.com/go-gitea/gitea/assets/115237/35489445-e54b-40d3-b3cf-38d029478f96"> Increase timeline item vertical padding from 12px to 16px: <img width="449" alt="Screenshot 2023-05-15 at 19 43 50" src="https://github.com/go-gitea/gitea/assets/115237/919c4f9d-a485-4f51-b08c-2c0fc714a413"> --------- Co-authored-by: Giteabot <teabot@gitea.io>
* Replace Fomantic reset module with our own (#24948)silverwind2023-05-281-0/+243
| | | | | | | | | | | | Replace the `reset` module with a modern version based on [modern-normalize](https://github.com/sindresorhus/modern-normalize). The only things I removed from that module are the `font-family` rules we don't need. Otherwise, it's similar to Fomantic's reset, but with the legacy IE stuff removed. I documented every change done to the module. Also this introduces a new `--tab-size` variable but it has no real effect on code yet.
* Change `--font-weight-bold` to `--font-weight-semibold` and 600 value, ↵silverwind2023-05-212-2/+2
| | | | | | | | | | | | | introduce new font weight variables (#24827) There was some recent discussion about this in Discord `ui-design` channel and the conclusion was that https://github.com/go-gitea/gitea/issues/24305 should have fixed their OS font installation to have semibold weights. I have now tested this 601 weight on a Windows 10 machine on Firefox myself, and I immediately noticed that bold was excessivly bold and rendering as 700 because browsers are biased towards bolder fonts. So revert this back to the previous value.
* Fix OAuth loading state (#24788)silverwind2023-05-181-0/+5
| | | | | | | | | | | | | | Fix regression from https://github.com/go-gitea/gitea/pull/24740 where the loading state was not showing because the `oauth-login-image` class was removed. Replaced the Fomantic loader with a pure CSS loader and cleaned up the HTML. Diff: https://github.com/go-gitea/gitea/pull/24788/files?diff=unified&w=1 ![](https://github.com/go-gitea/gitea/assets/115237/b5b4137f-9821-464b-9777-858fe85d9e03) Co-authored-by: Giteabot <teabot@gitea.io>
* Reorganize CSS files (#24739)silverwind2023-05-161-0/+81
| | | | | Reorganize various CSS files for clarity, group together by subdirectory in `index.css`. This reorders some of the rules, but I don't think it should introduce any issues because of that.
* Clean up various avatar dimensions (#24701)silverwind2023-05-141-13/+1
| | | | | | | | | | | | | | | | | | | | | | Clean up a few cases where avatar dimensions were overwritten via CSS, which were no longer needed or were possible to set via HTML width. Also included are two small fixes: - Fix one more case of incorrect avatar offset on review timeline - Vertically center avatars in review sidebar There is more to be done here, but some of the work depends on Fomantic `comment` module removal, or in the case of org member lists, a refactor of the `avatarlink` template to accept a size. <img width="371" alt="image" src="https://github.com/go-gitea/gitea/assets/115237/9c5902fb-2b89-4a7d-a152-60e74c3b2c56"> <img width="306" alt="image" src="https://github.com/go-gitea/gitea/assets/115237/c8d92e2a-91c9-4f4a-a7de-6ae1a6bc0479"> --------- Co-authored-by: Giteabot <teabot@gitea.io>
* Remove Fomantic comment module (#24703)silverwind2023-05-141-0/+103
| | | | Remove the comment module and put the styles that we still need into a separate file, eliminating about 2/3 of the CSS in line count.
* Improve avatar uploading / resizing / compressing, remove Fomantic card ↵wxiaoguang2023-05-131-0/+134
| | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | module (#24653) Fixes: #8972 Fixes: #24263 And I think it also (partially) fix #24263 (no need to convert) , because users could upload any supported image format if it isn't larger than AVATAR_MAX_ORIGIN_SIZE The main idea: * if the uploaded file size is not larger than AVATAR_MAX_ORIGIN_SIZE, use the origin * if the resized size is larger than the origin, use the origin Screenshots: JPG: <details> ![image](https://github.com/go-gitea/gitea/assets/2114189/70e98bb0-ecb9-4c4e-a89f-4a37d4e37f8e) </details> APNG: <details> ![image](https://github.com/go-gitea/gitea/assets/2114189/9055135b-5e2d-4152-bd72-596fcb7c6671) ![image](https://github.com/go-gitea/gitea/assets/2114189/50364caf-f7f6-4241-a289-e485fe4cd582) </details> WebP (animated) <details> ![image](https://github.com/go-gitea/gitea/assets/2114189/f642eb85-498a-49a5-86bf-0a7b04089ae0) </details> The only exception: if a WebP image is larger than MaxOriginSize and it is animated, then current `webp` package can't decode it, so only in this case it isn't supported. IMO no need to support such case: why a user would upload a 1MB animated webp as avatar? crazy ..... --------- Co-authored-by: silverwind <me@silverwind.io>
* Add markdown preview to Submit Review Textarea (#24672)yp053272023-05-121-4/+0
| | | | | | | | | | | | | | Before: ![image](https://github.com/go-gitea/gitea/assets/18380374/2909352c-b2ab-4d77-b410-9f08c2f5a154) After: ![image](https://github.com/go-gitea/gitea/assets/18380374/9448fa75-e29b-4f95-a30f-03c73c083a83) --------- Co-authored-by: wxiaoguang <wxiaoguang@gmail.com> Co-authored-by: Giteabot <teabot@gitea.io>
* Remove fomantic breadcrumb module (#24463)silverwind2023-05-011-0/+9
| | | | | | | | | | | | | | | | | | | | | | | ### File path before/after <img width="522" alt="Screenshot 2023-05-01 at 13 23 33" src="https://user-images.githubusercontent.com/115237/235445636-57776038-c98e-4cab-8abe-045138a76958.png"> <img width="522" alt="Screenshot 2023-05-01 at 13 24 08" src="https://user-images.githubusercontent.com/115237/235445638-70bef62a-1b70-41f8-ba51-728db4d54402.png"> ### File edit before/after <img width="499" alt="Screenshot 2023-05-01 at 13 24 46" src="https://user-images.githubusercontent.com/115237/235445676-7b3cc23e-289b-40a6-8d4f-0d7fb2efb55e.png"> <img width="497" alt="Screenshot 2023-05-01 at 13 24 52" src="https://user-images.githubusercontent.com/115237/235445677-db9f3974-8456-46de-a32b-9198110c0540.png"> ### Cherry-pick before/after <img width="590" alt="Screenshot 2023-05-01 at 13 25 30" src="https://user-images.githubusercontent.com/115237/235445717-99445024-1bb2-46d4-9bd8-8086bad57d34.png"> <img width="582" alt="Screenshot 2023-05-01 at 13 25 37" src="https://user-images.githubusercontent.com/115237/235445720-9c1dc497-eb23-4e10-a727-27f4d6df69e6.png">
* Move `Rename branch` from repo settings page to the page of branches list ↵sillyguodong2023-04-301-0/+1
| | | | | | | | | | | | | | | | (#24380) Co-Author: @wxiaoguang It is more convenient that user just need to enter a new branch name after he selects the branch which he want to rename. So this PR move the function of renaming branch to the page of branches list. This PR also restyle the button of `new branch`, `download`, `delete`.... https://user-images.githubusercontent.com/33891828/235277997-413060bb-759f-430a-b5c4-df5e40ffcd28.mov --------- Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
* Improve some modal action buttons (#24289)wxiaoguang2023-04-241-1/+15
| | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | Follow #24097 and #24285 And add a devtest page for modal action button testing. http://localhost:3000/devtest/fomantic-modal Now the `modal_actions_confirm.tmpl` could support: green / blue / yellow positive buttons, the negative button is "secondary". ps: this PR is only a small improvement, there are still a lot of buttons not having proper colors. In the future these buttons could be improved by this approach. These buttons could also be improved according to the conclusion of #24285 in the future. ![image](https://user-images.githubusercontent.com/2114189/233847773-a6d6b29b-7b5c-490e-8425-40dfd0ad2529.png) And add GitHub-like single danger button (context: https://github.com/go-gitea/gitea/issues/24285#issuecomment-1519100312) ![image](https://user-images.githubusercontent.com/2114189/233891566-055d7611-894d-4d5a-baf5-f6369180bf8d.png) --------- Co-authored-by: silverwind <me@silverwind.io>
* Refactor delete_modal_actions template and use it for project column related ↵Hester Gong2023-04-231-0/+47
| | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | | actions (#24097) Co-Author: @wxiaoguang This PR is to fix https://github.com/go-gitea/gitea/issues/23318#issuecomment-1506275446 . The way to fix this in this PR is to use `delete_modal_actions.tmpl` here both to fix this issue and keep ui consistency (as suggested by [TODO here](https://github.com/go-gitea/gitea/blob/4299c3b7db61f8741eca0ba3d663bb65745a4acc/templates/projects/view.tmpl#L161)) And this PR also refactors `delete_modal_actions.tmpl` and its related styles, and use the template for more modal actions: 1. Added template attributes: * locale * ModalButtonStyle: "yes" (default) or "confirm" * ModalButtonCancelText * ModalButtonOkText 2. Rename `delete_modal_actions.tmpl` template to `modal_actions_confirm.tmpl` because it is not only used for action modals deletion now. 3. Refactored css related to modals into `web_src/css/modules/modal.css` and improved the styles. 4. Also use the template for PR deletion modal and remove issue dependency modal. 5. Some modals should also use the template, but not sure how to open them, so mark these modal actions by `{{/* TODO: Convert to base/modal_actions_confirm */}}` After (Also tested on arc green): Hovering on the left buttons <img width="711" alt="Screen Shot 2023-04-23 at 15 17 12" src="https://user-images.githubusercontent.com/17645053/233825650-76307e65-9255-44bb-80e8-7062f58ead1b.png"> <img width="786" alt="Screen Shot 2023-04-23 at 15 17 21" src="https://user-images.githubusercontent.com/17645053/233825652-4dc6f7d1-a180-49fb-a468-d60950eaee0d.png"> Test for functionalities: https://user-images.githubusercontent.com/17645053/233826857-76376fda-022c-42d0-b0f3-339c17ca4e59.mov --------- Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
* Replace Less with CSS (#23481)silverwind2023-03-141-0/+116
Ran most of the Less files through the Less compiler and Prettier and then followed up with a round of manual fixes. The Less compiler had unfortunately stripped all `//` style comments that I had to restore (It did preserve `/* */` comments). Other fixes include duplicate selector removal which were revealed after the transpilation and which weren't caught by stylelint before but now are. Fixes: https://github.com/go-gitea/gitea/issues/15565