1
1
mirror of https://github.com/go-gitea/gitea synced 2024-12-23 09:04:26 +00:00
gitea/web_src/js/components
silverwind a96c73f979
Remove svg.svg class, restore .rss-icon (#24667)
Fix regression from https://github.com/go-gitea/gitea/pull/24476 where
the `svg.svg` class misaligns SVG icons across the site and streched
buttons unintentionally in vertical height.

Before (button 30.3px):
<img width="157" alt="Screenshot 2023-05-11 at 22 09 42"
src="https://github.com/go-gitea/gitea/assets/115237/0fd137ab-ab52-4cf8-afca-c45776d526d0">

After (button 30px):
<img width="160" alt="Screenshot 2023-05-11 at 22 09 59"
src="https://github.com/go-gitea/gitea/assets/115237/4b741f4b-0fd2-4fae-9bee-16a7deb098e8">

[vertical-align:
middle](https://developer.mozilla.org/en-US/docs/Web/CSS/vertical-align)
is not suitable to align icons to text because

> Aligns the middle of the element with the baseline plus half the
x-height of the parent.

Example of `vertical-align: middle` from MDN:

<img width="232" alt="Screenshot 2023-05-11 at 22 29 28"
src="https://github.com/go-gitea/gitea/assets/115237/179fb756-85a1-4cab-8219-1a4958f333e2">

So I think the
[existing](365bb77a54/web_src/css/svg.css (L3))
`vertical-align: text-top` is generally still the best bet:

<img width="241" alt="Screenshot 2023-05-11 at 22 34 24"
src="https://github.com/go-gitea/gitea/assets/115237/0cd6edf5-12c0-4bdb-8771-a900f5ba2d35">

Co-authored-by: Giteabot <teabot@gitea.io>
2023-05-12 10:23:53 +00:00
..
.eslintrc.yaml Update eslints for Vue 3 (#23935) 2023-04-05 16:59:40 -04:00
ActionRunStatus.vue Attach a tooltip to the action status icon (#24614) 2023-05-09 21:39:16 +02:00
ActivityHeatmap.vue Localize activity heatmap (except tooltip) (#24131) 2023-04-17 14:26:01 -04:00
ContextPopup.vue Modify luminance calculation and extract related functions into single files (#24586) 2023-05-10 11:19:03 +00:00
DashboardRepoList.vue Remove highlight in repo list (#24675) 2023-05-12 10:00:17 +02:00
DiffFileList.vue Use data-tooltip-content for tippy tooltip (#23649) 2023-03-24 18:35:38 +08:00
DiffFileTree.vue Update the value of the diffEnd when click Show More btn in the DiffFileTree (#24069) 2023-04-12 15:11:23 +02:00
DiffFileTreeItem.vue Use reactive store to share data between components (#23996) 2023-04-11 20:44:26 -04:00
PullRequestMergeForm.vue Refactor branch/tag selector to Vue SFC (#23421) 2023-03-14 17:51:20 +08:00
RepoActionView.test.js Improve action log display with control chars (#23820) 2023-04-01 20:57:05 +08:00
RepoActionView.vue Make the actions control button look like an actual button (#24611) 2023-05-10 08:09:23 +00:00
RepoActivityTopAuthors.vue Refactor dashboard repo list to Vue SFC (#23405) 2023-03-14 12:09:06 +08:00
RepoBranchTagSelector.vue Remove svg.svg class, restore .rss-icon (#24667) 2023-05-12 10:23:53 +00:00