oppi.li / perf-test
loading up the forgejo repo on tangled to test page performance
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

Change `--border-radius-circle` to `--border-radius-full` (gitea#30936)

Cherry-pick of https://github.com/go-gitea/gitea/commit/2ced31e81dd9e45659660c1abff529d0192fd8ed adapted to Forgejo releases UI.

Percentage-based `border-radius` [creates undesirable
ellipse](https://jsfiddle.net/silverwind/j9ko5wnt/4/) on non-square
content. Instead, use pixel value and use same wording `full` like
tailwind does, but increast to 99999px over their 9999px.

(cherry picked from commit 2ced31e81dd9e45659660c1abff529d0192fd8ed)

authored by

silverwind and committed by
Earl Warren afa13806 df15abd0

+6 -6
+1 -1
tailwind.config.js
··· 66 66 'xl': '12px', 67 67 '2xl': '16px', 68 68 '3xl': '24px', 69 - 'full': 'var(--border-radius-circle)', // 50% 69 + 'full': 'var(--border-radius-full)', 70 70 }, 71 71 fontFamily: { 72 72 sans: 'var(--fonts-regular)',
+2 -2
web_src/css/base.css
··· 18 18 /* other variables */ 19 19 --border-radius: 4px; 20 20 --border-radius-medium: 6px; 21 - --border-radius-circle: 50%; 21 + --border-radius-full: 99999px; /* TODO: use calc(infinity * 1px) */ 22 22 --opacity-disabled: 0.55; 23 23 --height-loading: 16rem; 24 24 --repo-header-issue-min-height: 41px; ··· 1359 1359 1360 1360 .color-icon { 1361 1361 display: inline-block; 1362 - border-radius: var(--border-radius-circle); 1362 + border-radius: var(--border-radius-full); 1363 1363 height: 14px; 1364 1364 width: 14px; 1365 1365 }
+1 -1
web_src/css/modules/animations.css
··· 31 31 border-width: 4px; 32 32 border-style: solid; 33 33 border-color: var(--color-secondary) var(--color-secondary) var(--color-secondary-dark-8) var(--color-secondary-dark-8); 34 - border-radius: var(--border-radius-circle); 34 + border-radius: var(--border-radius-full); 35 35 } 36 36 37 37 .is-loading.loading-icon-2px::after {
+1 -1
web_src/css/repo.css
··· 791 791 width: 34px; 792 792 height: 34px; 793 793 background-color: var(--color-timeline); 794 - border-radius: var(--border-radius-circle); 794 + border-radius: var(--border-radius-full); 795 795 display: flex; 796 796 float: left; 797 797 margin-left: -33px;
+1 -1
web_src/css/repo/release-tag.css
··· 68 68 position: absolute; 69 69 left: -5.5px; 70 70 top: 30px; 71 - border-radius: var(--border-radius-circle); 71 + border-radius: var(--border-radius-full); 72 72 border: 2.5px solid var(--color-body); 73 73 } 74 74