mirror of
https://github.com/go-gitea/gitea.git
synced 2024-11-27 20:49:33 +08:00
Change --border-radius-circle
to --border-radius-full
(#30936)
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.
This commit is contained in:
parent
47e715a70f
commit
2ced31e81d
@ -66,7 +66,7 @@ export default {
|
|||||||
'xl': '12px',
|
'xl': '12px',
|
||||||
'2xl': '16px',
|
'2xl': '16px',
|
||||||
'3xl': '24px',
|
'3xl': '24px',
|
||||||
'full': 'var(--border-radius-circle)', // 50%
|
'full': 'var(--border-radius-full)',
|
||||||
},
|
},
|
||||||
fontFamily: {
|
fontFamily: {
|
||||||
sans: 'var(--fonts-regular)',
|
sans: 'var(--fonts-regular)',
|
||||||
|
@ -18,7 +18,7 @@
|
|||||||
/* other variables */
|
/* other variables */
|
||||||
--border-radius: 4px;
|
--border-radius: 4px;
|
||||||
--border-radius-medium: 6px;
|
--border-radius-medium: 6px;
|
||||||
--border-radius-circle: 50%;
|
--border-radius-full: 99999px; /* TODO: use calc(infinity * 1px) */
|
||||||
--opacity-disabled: 0.55;
|
--opacity-disabled: 0.55;
|
||||||
--height-loading: 16rem;
|
--height-loading: 16rem;
|
||||||
--min-height-textarea: 132px; /* padding + 6 lines + border = calc(1.57142em + 6lh + 2px), but lh is not fully supported */
|
--min-height-textarea: 132px; /* padding + 6 lines + border = calc(1.57142em + 6lh + 2px), but lh is not fully supported */
|
||||||
@ -1166,7 +1166,7 @@ overflow-menu .ui.label {
|
|||||||
|
|
||||||
.color-icon {
|
.color-icon {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
border-radius: var(--border-radius-circle);
|
border-radius: var(--border-radius-full);
|
||||||
height: 14px;
|
height: 14px;
|
||||||
width: 14px;
|
width: 14px;
|
||||||
}
|
}
|
||||||
|
@ -31,7 +31,7 @@
|
|||||||
border-width: 4px;
|
border-width: 4px;
|
||||||
border-style: solid;
|
border-style: solid;
|
||||||
border-color: var(--color-secondary) var(--color-secondary) var(--color-secondary-dark-8) var(--color-secondary-dark-8);
|
border-color: var(--color-secondary) var(--color-secondary) var(--color-secondary-dark-8) var(--color-secondary-dark-8);
|
||||||
border-radius: var(--border-radius-circle);
|
border-radius: var(--border-radius-full);
|
||||||
}
|
}
|
||||||
|
|
||||||
.is-loading.loading-icon-2px::after {
|
.is-loading.loading-icon-2px::after {
|
||||||
|
@ -790,7 +790,7 @@ td .commit-summary {
|
|||||||
width: 34px;
|
width: 34px;
|
||||||
height: 34px;
|
height: 34px;
|
||||||
background-color: var(--color-timeline);
|
background-color: var(--color-timeline);
|
||||||
border-radius: var(--border-radius-circle);
|
border-radius: var(--border-radius-full);
|
||||||
display: flex;
|
display: flex;
|
||||||
float: left;
|
float: left;
|
||||||
margin-left: -33px;
|
margin-left: -33px;
|
||||||
|
Loading…
Reference in New Issue
Block a user