mirror of
				https://codeberg.org/yeentown/barkey.git
				synced 2025-11-04 07:24:13 +00:00 
			
		
		
		
	fix: border radius
This commit is contained in:
		
							parent
							
								
									739f958842
								
							
						
					
					
						commit
						d536d0771b
					
				
					 6 changed files with 9 additions and 9 deletions
				
			
		| 
						 | 
					@ -358,7 +358,7 @@ const rejectFollowRequest = () => {
 | 
				
			||||||
	width: 20px;
 | 
						width: 20px;
 | 
				
			||||||
	height: 20px;
 | 
						height: 20px;
 | 
				
			||||||
	box-sizing: border-box;
 | 
						box-sizing: border-box;
 | 
				
			||||||
	border-radius: 100%;
 | 
						border-radius: var(--radius-full);
 | 
				
			||||||
	background: var(--panel);
 | 
						background: var(--panel);
 | 
				
			||||||
	box-shadow: 0 0 0 3px var(--panel);
 | 
						box-shadow: 0 0 0 3px var(--panel);
 | 
				
			||||||
	font-size: 11px;
 | 
						font-size: 11px;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -115,7 +115,7 @@ const exampleCWNote = reactive<Misskey.entities.Note>({
 | 
				
			||||||
		left: 0;
 | 
							left: 0;
 | 
				
			||||||
		right: 0;
 | 
							right: 0;
 | 
				
			||||||
		bottom: 0;
 | 
							bottom: 0;
 | 
				
			||||||
		border-radius: 999px;
 | 
							border-radius: var(--radius-ellipse);
 | 
				
			||||||
		background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
 | 
							background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -125,7 +125,7 @@ const exampleNote = reactive<Misskey.entities.Note>({
 | 
				
			||||||
		left: 0;
 | 
							left: 0;
 | 
				
			||||||
		right: 0;
 | 
							right: 0;
 | 
				
			||||||
		bottom: 0;
 | 
							bottom: 0;
 | 
				
			||||||
		border-radius: 999px;
 | 
							border-radius: var(--radius-ellipse);
 | 
				
			||||||
		background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
 | 
							background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -67,7 +67,7 @@ import { i18n } from '@/i18n.js';
 | 
				
			||||||
		left: 0;
 | 
							left: 0;
 | 
				
			||||||
		right: 0;
 | 
							right: 0;
 | 
				
			||||||
		bottom: 0;
 | 
							bottom: 0;
 | 
				
			||||||
		border-radius: 999px;
 | 
							border-radius: var(--radius-ellipse);
 | 
				
			||||||
		background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
 | 
							background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -38,7 +38,7 @@ const text = $computed(() => {
 | 
				
			||||||
.root {
 | 
					.root {
 | 
				
			||||||
	box-shadow: 0 0 0 3px var(--panel);
 | 
						box-shadow: 0 0 0 3px var(--panel);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	// sharkey(ShittyKopper): the comment mentions something about 100% radius not behaving correctly on blink.
 | 
						// sharkey: the comment mentions something about 100% radius not behaving correctly on blink.
 | 
				
			||||||
	// couldn't reproduce, assuming the 120% here was just an old workaround
 | 
						// couldn't reproduce, assuming the 120% here was just an old workaround
 | 
				
			||||||
	border-radius: var(--radius-full); // Blinkのバグか知らんけど、100%ぴったりにすると何故か若干楕円でレンダリングされる
 | 
						border-radius: var(--radius-full); // Blinkのバグか知らんけど、100%ぴったりにすると何故か若干楕円でレンダリングされる
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -159,7 +159,7 @@ watch(() => props.user.avatarBlurhash, () => {
 | 
				
			||||||
	display: inline-block;
 | 
						display: inline-block;
 | 
				
			||||||
	vertical-align: bottom;
 | 
						vertical-align: bottom;
 | 
				
			||||||
	flex-shrink: 0;
 | 
						flex-shrink: 0;
 | 
				
			||||||
	border-radius: 100%;
 | 
						border-radius: 100%; // sharkey: controlled by square avatars setting!
 | 
				
			||||||
	line-height: 16px;
 | 
						line-height: 16px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -169,7 +169,7 @@ watch(() => props.user.avatarBlurhash, () => {
 | 
				
			||||||
	left: 0;
 | 
						left: 0;
 | 
				
			||||||
	right: 0;
 | 
						right: 0;
 | 
				
			||||||
	top: 0;
 | 
						top: 0;
 | 
				
			||||||
	border-radius: 100%;
 | 
						border-radius: 100%; // sharkey: controlled by square avatars setting!
 | 
				
			||||||
	z-index: 1;
 | 
						z-index: 1;
 | 
				
			||||||
	overflow: clip;
 | 
						overflow: clip;
 | 
				
			||||||
	object-fit: cover;
 | 
						object-fit: cover;
 | 
				
			||||||
| 
						 | 
					@ -187,10 +187,10 @@ watch(() => props.user.avatarBlurhash, () => {
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.square {
 | 
					.square {
 | 
				
			||||||
	border-radius: 20%;
 | 
						border-radius: 20%; // sharkey: controlled by square avatars setting!
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	> .inner {
 | 
						> .inner {
 | 
				
			||||||
		border-radius: 20%;
 | 
							border-radius: 20%; // sharkey: controlled by square avatars setting!
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
	Add table
		
		Reference in a new issue