Update JS dependencies and misc tweaks (#25540)

- 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">

.stylelintrc.yaml

@@ -50,7 +50,7 @@ rules:
   declaration-no-important: null
   declaration-property-max-values: null
   declaration-property-unit-allowed-list: null
-  declaration-property-unit-disallowed-list: null
+  declaration-property-unit-disallowed-list: {line-height: [em]}
   declaration-property-value-allowed-list: null
   declaration-property-value-disallowed-list: null
   declaration-property-value-no-unknown: true

Makefile

@@ -226,6 +226,8 @@ help:
 	@echo " - test-frontend                    test frontend files"
 	@echo " - test-backend                     test backend files"
 	@echo " - test-e2e[\#TestSpecificName]     test end to end using playwright"
+	@echo " - update-js                        update js dependencies"
+	@echo " - update-py                        update py dependencies"
 	@echo " - webpack                          build webpack files"
 	@echo " - svg                              build svg files"
 	@echo " - fomantic                         build fomantic files"
@@ -924,15 +926,15 @@ node_modules: package-lock.json
 	poetry install
 	@touch .venv
 
-.PHONY: npm-update
-npm-update: node-check | node_modules
+.PHONY: update-js
+update-js: node-check | node_modules
 	npx updates -u -f package.json
 	rm -rf node_modules package-lock.json
 	npm install --package-lock
 	@touch node_modules
 
-.PHONY: poetry-update
-poetry-update: node-check | node_modules
+.PHONY: update-py
+update-py: node-check | node_modules
 	npx updates -u -f pyproject.toml
 	rm -rf .venv poetry.lock
 	poetry install

package.json

@@ -17,7 +17,7 @@
     "@webcomponents/custom-elements": "1.6.0",
     "add-asset-webpack-plugin": "2.0.1",
     "ansi_up": "5.2.1",
-    "asciinema-player": "3.4.0",
+    "asciinema-player": "3.5.0",
     "clippie": "4.0.1",
     "css-loader": "6.8.1",
     "dropzone": "6.0.0-beta.2",
@@ -27,17 +27,17 @@
     "fast-glob": "3.2.12",
     "jquery": "3.7.0",
     "jquery.are-you-sure": "1.9.0",
-    "katex": "0.16.7",
+    "katex": "0.16.8",
     "license-checker-webpack-plugin": "0.2.1",
     "mermaid": "10.2.3",
     "mini-css-extract-plugin": "2.7.6",
-    "minimatch": "9.0.1",
+    "minimatch": "9.0.2",
     "monaco-editor": "0.39.0",
     "monaco-editor-webpack-plugin": "7.0.1",
     "pdfobject": "2.2.12",
     "pretty-ms": "8.0.0",
     "sortablejs": "1.15.0",
-    "swagger-ui-dist": "5.0.0",
+    "swagger-ui-dist": "5.1.0",
     "throttle-debounce": "5.0.0",
     "tippy.js": "6.3.7",
     "toastify-js": "1.12.0",
@@ -47,7 +47,7 @@
     "vue-bar-graph": "2.0.0",
     "vue-loader": "17.2.2",
     "vue3-calendar-heatmap": "2.0.5",
-    "webpack": "5.87.0",
+    "webpack": "5.88.0",
     "webpack-cli": "5.1.4",
     "wrap-ansi": "8.1.0"
   },
@@ -67,12 +67,12 @@
     "eslint-plugin-regexp": "1.15.0",
     "eslint-plugin-sonarjs": "0.19.0",
     "eslint-plugin-unicorn": "47.0.0",
-    "eslint-plugin-vue": "9.14.1",
+    "eslint-plugin-vue": "9.15.1",
     "eslint-plugin-wc": "1.5.0",
     "jsdom": "22.1.0",
     "markdownlint-cli": "0.35.0",
     "postcss-html": "1.5.0",
-    "stylelint": "15.8.0",
+    "stylelint": "15.9.0",
     "stylelint-declaration-block-no-ignored-properties": "2.7.0",
     "stylelint-declaration-strict-value": "1.9.2",
     "stylelint-stylistic": "0.4.2",

web_src/css/base.css

@@ -2166,7 +2166,7 @@ table th[data-sortt-desc] .svg {
 }
 
 .truncated-item-name {
-  line-height: 2em;
+  line-height: 2;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -2188,7 +2188,7 @@ table th[data-sortt-desc] .svg {
 }
 
 .ui.dropdown {
-  line-height: 1em; /* the dropdown doesn't have default line-height, use this to make the dropdown icon align with plain dropdown */
+  line-height: 1; /* the dropdown doesn't have default line-height, use this to make the dropdown icon align with plain dropdown */
 }
 
 /* dropdown has some kinds of icons:

web_src/css/modules/card.css

@@ -59,7 +59,7 @@
   font-weight: var(--font-weight-medium);
   font-size: 1.28571429em;
   margin-top: -.21425em;
-  line-height: 1.28571429em;
+  line-height: 1.28571429;
 }
 
 .ui.cards > .card > .content:first-child,

web_src/css/repo.css

@@ -478,7 +478,7 @@
 }
 
 .repository.file.list .non-diff-file-content .asciicast {
-  padding: 5px !important;
+  padding: 0 !important;
 }
 
 .non-diff-file-content .attached.segment,
@@ -1903,7 +1903,7 @@
 
 .repository.settings.collaboration .collaborator.list > .item {
   margin: 0;
-  line-height: 2em;
+  line-height: 2;
 }
 
 .repository.settings.collaboration #repo-collab-form #search-user-box .results {
@@ -2601,7 +2601,7 @@
 .labels-list .label {
   margin: 2px 0;
   display: inline-flex !important;
-  line-height: 1.3em; /* there is a `font-size: 1.25em` for inside emoji, so here the line-height needs to be larger slightly */
+  line-height: 1.3; /* there is a `font-size: 1.25em` for inside emoji, so here the line-height needs to be larger slightly */
 }
 
 /* Scoped labels with different colors on left and right */