mirror of
				https://codeberg.org/yeentown/barkey.git
				synced 2025-11-04 07:24:13 +00:00 
			
		
		
		
	prototype: decreased rounding
This commit is contained in:
		
							parent
							
								
									a782aa5b0e
								
							
						
					
					
						commit
						7a51e2d404
					
				
					 93 changed files with 142 additions and 142 deletions
				
			
		| 
						 | 
					@ -228,7 +228,7 @@
 | 
				
			||||||
		}
 | 
							}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
		button {
 | 
							button {
 | 
				
			||||||
			border-radius: 999px;
 | 
								border-radius: 4px;
 | 
				
			||||||
			padding: 0px 12px 0px 12px;
 | 
								padding: 0px 12px 0px 12px;
 | 
				
			||||||
			border: none;
 | 
								border: none;
 | 
				
			||||||
			cursor: pointer;
 | 
								cursor: pointer;
 | 
				
			||||||
| 
						 | 
					@ -296,7 +296,7 @@
 | 
				
			||||||
			margin-bottom: 2rem;
 | 
								margin-bottom: 2rem;
 | 
				
			||||||
			padding: 0.5rem 1rem;
 | 
								padding: 0.5rem 1rem;
 | 
				
			||||||
			width: 40rem;
 | 
								width: 40rem;
 | 
				
			||||||
			border-radius: 10px;
 | 
								border-radius: 5px;
 | 
				
			||||||
			justify-content: center;
 | 
								justify-content: center;
 | 
				
			||||||
			margin: auto;
 | 
								margin: auto;
 | 
				
			||||||
		}
 | 
							}
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -24,7 +24,7 @@ html {
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
button {
 | 
					button {
 | 
				
			||||||
    border-radius: 999px;
 | 
					    border-radius: 4px;
 | 
				
			||||||
    padding: 0px 12px 0px 12px;
 | 
					    padding: 0px 12px 0px 12px;
 | 
				
			||||||
    border: none;
 | 
					    border: none;
 | 
				
			||||||
    cursor: pointer;
 | 
					    cursor: pointer;
 | 
				
			||||||
| 
						 | 
					@ -93,7 +93,7 @@ code {
 | 
				
			||||||
    background: #333;
 | 
					    background: #333;
 | 
				
			||||||
    padding: 0.5rem 1rem;
 | 
					    padding: 0.5rem 1rem;
 | 
				
			||||||
    max-width: 40rem;
 | 
					    max-width: 40rem;
 | 
				
			||||||
    border-radius: 10px;
 | 
					    border-radius: 5px;
 | 
				
			||||||
    justify-content: center;
 | 
					    justify-content: center;
 | 
				
			||||||
    margin: auto;
 | 
					    margin: auto;
 | 
				
			||||||
    white-space: pre-wrap;
 | 
					    white-space: pre-wrap;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -84,7 +84,7 @@ function resolve() {
 | 
				
			||||||
			box-sizing: border-box;
 | 
								box-sizing: border-box;
 | 
				
			||||||
			align-items: center;
 | 
								align-items: center;
 | 
				
			||||||
			padding: 14px;
 | 
								padding: 14px;
 | 
				
			||||||
			border-radius: 8px;
 | 
								border-radius: 5px;
 | 
				
			||||||
			--c: rgb(255 196 0 / 15%);
 | 
								--c: rgb(255 196 0 / 15%);
 | 
				
			||||||
			background-image: linear-gradient(45deg, var(--c) 16.67%, transparent 16.67%, transparent 50%, var(--c) 50%, var(--c) 66.67%, transparent 66.67%, transparent 100%);
 | 
								background-image: linear-gradient(45deg, var(--c) 16.67%, transparent 16.67%, transparent 50%, var(--c) 50%, var(--c) 66.67%, transparent 66.67%, transparent 100%);
 | 
				
			||||||
			background-size: 16px 16px;
 | 
								background-size: 16px 16px;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -125,6 +125,6 @@ function openPostForm() {
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.postForm {
 | 
					.postForm {
 | 
				
			||||||
	background: var(--bg);
 | 
						background: var(--bg);
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
</style>
 | 
					</style>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -154,7 +154,7 @@ function onMousedown(evt: MouseEvent): void {
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&.rounded {
 | 
						&.rounded {
 | 
				
			||||||
		border-radius: 999px;
 | 
							border-radius: 4px;
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&.primary {
 | 
						&.primary {
 | 
				
			||||||
| 
						 | 
					@ -264,7 +264,7 @@ function onMousedown(evt: MouseEvent): void {
 | 
				
			||||||
	left: 0;
 | 
						left: 0;
 | 
				
			||||||
	width: 100%;
 | 
						width: 100%;
 | 
				
			||||||
	height: 100%;
 | 
						height: 100%;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	overflow: clip;
 | 
						overflow: clip;
 | 
				
			||||||
	pointer-events: none;
 | 
						pointer-events: none;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -100,7 +100,7 @@ const bannerStyle = computed(() => {
 | 
				
			||||||
			padding: 8px 12px;
 | 
								padding: 8px 12px;
 | 
				
			||||||
			font-size: 80%;
 | 
								font-size: 80%;
 | 
				
			||||||
			background: rgba(0, 0, 0, 0.7);
 | 
								background: rgba(0, 0, 0, 0.7);
 | 
				
			||||||
			border-radius: 6px;
 | 
								border-radius: 5px;
 | 
				
			||||||
			color: #fff;
 | 
								color: #fff;
 | 
				
			||||||
		}
 | 
							}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -111,7 +111,7 @@ const bannerStyle = computed(() => {
 | 
				
			||||||
			left: 16px;
 | 
								left: 16px;
 | 
				
			||||||
			background: rgba(0, 0, 0, 0.7);
 | 
								background: rgba(0, 0, 0, 0.7);
 | 
				
			||||||
			color: var(--warn);
 | 
								color: var(--warn);
 | 
				
			||||||
			border-radius: 6px;
 | 
								border-radius: 5px;
 | 
				
			||||||
			font-weight: bold;
 | 
								font-weight: bold;
 | 
				
			||||||
			font-size: 1em;
 | 
								font-size: 1em;
 | 
				
			||||||
			padding: 4px 7px;
 | 
								padding: 4px 7px;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -55,7 +55,7 @@ defineExpose({
 | 
				
			||||||
			font-size: 85%;
 | 
								font-size: 85%;
 | 
				
			||||||
			padding: 4px 12px 4px 8px;
 | 
								padding: 4px 12px 4px 8px;
 | 
				
			||||||
			border: solid 1px var(--divider);
 | 
								border: solid 1px var(--divider);
 | 
				
			||||||
			border-radius: 999px;
 | 
								border-radius: 4px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
			&:hover {
 | 
								&:hover {
 | 
				
			||||||
				border-color: var(--inputBorderHover);
 | 
									border-color: var(--inputBorderHover);
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -102,7 +102,7 @@ const onInput = (ev: KeyboardEvent) => {
 | 
				
			||||||
	color: var(--fg);
 | 
						color: var(--fg);
 | 
				
			||||||
	background: var(--panel);
 | 
						background: var(--panel);
 | 
				
			||||||
	border: solid 1px var(--panel);
 | 
						border: solid 1px var(--panel);
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	outline: none;
 | 
						outline: none;
 | 
				
			||||||
	box-shadow: none;
 | 
						box-shadow: none;
 | 
				
			||||||
	box-sizing: border-box;
 | 
						box-sizing: border-box;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -223,7 +223,7 @@ onUnmounted(() => {
 | 
				
			||||||
				background: var(--panel);
 | 
									background: var(--panel);
 | 
				
			||||||
				padding: 6px 10px;
 | 
									padding: 6px 10px;
 | 
				
			||||||
				font-size: 0.8em;
 | 
									font-size: 0.8em;
 | 
				
			||||||
				border-radius: 999px;
 | 
									border-radius: 4px;
 | 
				
			||||||
				box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
 | 
									box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
 | 
				
			||||||
			}
 | 
								}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -196,7 +196,7 @@ onBeforeUnmount(() => {
 | 
				
			||||||
	box-sizing: border-box;
 | 
						box-sizing: border-box;
 | 
				
			||||||
	text-align: center;
 | 
						text-align: center;
 | 
				
			||||||
	background: var(--panel);
 | 
						background: var(--panel);
 | 
				
			||||||
	border-radius: 16px;
 | 
						border-radius: 4px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.icon {
 | 
					.icon {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -100,7 +100,7 @@ function onDragend() {
 | 
				
			||||||
	position: relative;
 | 
						position: relative;
 | 
				
			||||||
	padding: 8px 0 0 0;
 | 
						padding: 8px 0 0 0;
 | 
				
			||||||
	min-height: 180px;
 | 
						min-height: 180px;
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	cursor: pointer;
 | 
						cursor: pointer;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&:hover {
 | 
						&:hover {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -63,7 +63,7 @@ const isThumbnailAvailable = computed(() => {
 | 
				
			||||||
	position: relative;
 | 
						position: relative;
 | 
				
			||||||
	display: flex;
 | 
						display: flex;
 | 
				
			||||||
	background: var(--panel);
 | 
						background: var(--panel);
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	overflow: clip;
 | 
						overflow: clip;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -139,7 +139,7 @@ onMounted(() => {
 | 
				
			||||||
	background: var(--buttonBg);
 | 
						background: var(--buttonBg);
 | 
				
			||||||
	-webkit-backdrop-filter: var(--blur, blur(15px));
 | 
						-webkit-backdrop-filter: var(--blur, blur(15px));
 | 
				
			||||||
	backdrop-filter: var(--blur, blur(15px));
 | 
						backdrop-filter: var(--blur, blur(15px));
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	transition: border-radius 0.3s;
 | 
						transition: border-radius 0.3s;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&:hover {
 | 
						&:hover {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -221,7 +221,7 @@ defineExpose({
 | 
				
			||||||
	color: var(--fg);
 | 
						color: var(--fg);
 | 
				
			||||||
	background: var(--panel);
 | 
						background: var(--panel);
 | 
				
			||||||
	border: solid 1px var(--panel);
 | 
						border: solid 1px var(--panel);
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	outline: none;
 | 
						outline: none;
 | 
				
			||||||
	box-shadow: none;
 | 
						box-shadow: none;
 | 
				
			||||||
	box-sizing: border-box;
 | 
						box-sizing: border-box;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -46,7 +46,7 @@ function getInstanceIcon(instance): string {
 | 
				
			||||||
	align-items: center;
 | 
						align-items: center;
 | 
				
			||||||
	padding: 16px;
 | 
						padding: 16px;
 | 
				
			||||||
	background: var(--panel);
 | 
						background: var(--panel);
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	> :global(.icon) {
 | 
						> :global(.icon) {
 | 
				
			||||||
		display: block;
 | 
							display: block;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -74,7 +74,7 @@ function close() {
 | 
				
			||||||
	overflow: auto;
 | 
						overflow: auto;
 | 
				
			||||||
	overscroll-behavior: contain;
 | 
						overscroll-behavior: contain;
 | 
				
			||||||
	text-align: left;
 | 
						text-align: left;
 | 
				
			||||||
	border-radius: 16px;
 | 
						border-radius: 4px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&.asDrawer {
 | 
						&.asDrawer {
 | 
				
			||||||
		width: 100%;
 | 
							width: 100%;
 | 
				
			||||||
| 
						 | 
					@ -97,7 +97,7 @@ function close() {
 | 
				
			||||||
			justify-content: center;
 | 
								justify-content: center;
 | 
				
			||||||
			vertical-align: bottom;
 | 
								vertical-align: bottom;
 | 
				
			||||||
			height: 100px;
 | 
								height: 100px;
 | 
				
			||||||
			border-radius: 10px;
 | 
								border-radius: 5px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
			&:hover {
 | 
								&:hover {
 | 
				
			||||||
				color: var(--accent);
 | 
									color: var(--accent);
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -82,7 +82,7 @@ onMounted(() => {
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.audio {
 | 
					.audio {
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	overflow: clip;
 | 
						overflow: clip;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
</style>
 | 
					</style>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -157,7 +157,7 @@ function showMenu(ev: MouseEvent) {
 | 
				
			||||||
.hide {
 | 
					.hide {
 | 
				
			||||||
	display: block;
 | 
						display: block;
 | 
				
			||||||
	position: absolute;
 | 
						position: absolute;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	background-color: black;
 | 
						background-color: black;
 | 
				
			||||||
	color: var(--accentLighten);
 | 
						color: var(--accentLighten);
 | 
				
			||||||
	font-size: 12px;
 | 
						font-size: 12px;
 | 
				
			||||||
| 
						 | 
					@ -187,7 +187,7 @@ function showMenu(ev: MouseEvent) {
 | 
				
			||||||
.menu {
 | 
					.menu {
 | 
				
			||||||
	display: block;
 | 
						display: block;
 | 
				
			||||||
	position: absolute;
 | 
						position: absolute;
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
	background-color: rgba(0, 0, 0, 0.3);
 | 
						background-color: rgba(0, 0, 0, 0.3);
 | 
				
			||||||
	-webkit-backdrop-filter: var(--blur, blur(15px));
 | 
						-webkit-backdrop-filter: var(--blur, blur(15px));
 | 
				
			||||||
	backdrop-filter: var(--blur, blur(15px));
 | 
						backdrop-filter: var(--blur, blur(15px));
 | 
				
			||||||
| 
						 | 
					@ -223,7 +223,7 @@ function showMenu(ev: MouseEvent) {
 | 
				
			||||||
.indicator {
 | 
					.indicator {
 | 
				
			||||||
	/* Hardcode to black because either --bg or --fg makes it hard to read in dark/light mode */
 | 
						/* Hardcode to black because either --bg or --fg makes it hard to read in dark/light mode */
 | 
				
			||||||
	background-color: black;
 | 
						background-color: black;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	color: var(--accentLighten);
 | 
						color: var(--accentLighten);
 | 
				
			||||||
	display: inline-block;
 | 
						display: inline-block;
 | 
				
			||||||
	font-weight: bold;
 | 
						font-weight: bold;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -341,7 +341,7 @@ const previewable = (file: Misskey.entities.DriveFile): boolean => {
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.media {
 | 
					.media {
 | 
				
			||||||
	overflow: hidden; // clipにするとバグる
 | 
						overflow: hidden; // clipにするとバグる
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
:global(.pswp) {
 | 
					:global(.pswp) {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -68,7 +68,7 @@ const hide = ref((defaultStore.state.nsfw === 'force' || defaultStore.state.enab
 | 
				
			||||||
.hide {
 | 
					.hide {
 | 
				
			||||||
	display: block;
 | 
						display: block;
 | 
				
			||||||
	position: absolute;
 | 
						position: absolute;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	background-color: black;
 | 
						background-color: black;
 | 
				
			||||||
	color: var(--accentLighten);
 | 
						color: var(--accentLighten);
 | 
				
			||||||
	font-size: 14px;
 | 
						font-size: 14px;
 | 
				
			||||||
| 
						 | 
					@ -118,7 +118,7 @@ const hide = ref((defaultStore.state.nsfw === 'force' || defaultStore.state.enab
 | 
				
			||||||
.indicator {
 | 
					.indicator {
 | 
				
			||||||
	/* Hardcode to black because either --bg or --fg makes it hard to read in dark/light mode */
 | 
						/* Hardcode to black because either --bg or --fg makes it hard to read in dark/light mode */
 | 
				
			||||||
	background-color: black;
 | 
						background-color: black;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	color: var(--accentLighten);
 | 
						color: var(--accentLighten);
 | 
				
			||||||
	display: inline-block;
 | 
						display: inline-block;
 | 
				
			||||||
	font-weight: bold;
 | 
						font-weight: bold;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -43,7 +43,7 @@ const bgCss = bg.toRgbString();
 | 
				
			||||||
.root {
 | 
					.root {
 | 
				
			||||||
	display: inline-block;
 | 
						display: inline-block;
 | 
				
			||||||
	padding: 4px 8px 4px 4px;
 | 
						padding: 4px 8px 4px 4px;
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
	color: var(--mention);
 | 
						color: var(--mention);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&.isMe {
 | 
						&.isMe {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -288,7 +288,7 @@ onBeforeUnmount(() => {
 | 
				
			||||||
		margin: auto;
 | 
							margin: auto;
 | 
				
			||||||
		width: calc(100% - 16px);
 | 
							width: calc(100% - 16px);
 | 
				
			||||||
		height: 100%;
 | 
							height: 100%;
 | 
				
			||||||
		border-radius: 6px;
 | 
							border-radius: 5px;
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&:not(:disabled):hover {
 | 
						&:not(:disabled):hover {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -552,7 +552,7 @@ function readPromo() {
 | 
				
			||||||
			padding: 0 4px;
 | 
								padding: 0 4px;
 | 
				
			||||||
			margin-bottom: 0 !important;
 | 
								margin-bottom: 0 !important;
 | 
				
			||||||
			background: var(--popup);
 | 
								background: var(--popup);
 | 
				
			||||||
			border-radius: 8px;
 | 
								border-radius: 5px;
 | 
				
			||||||
			box-shadow: 0px 4px 32px var(--shadow);
 | 
								box-shadow: 0px 4px 32px var(--shadow);
 | 
				
			||||||
		}
 | 
							}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -684,7 +684,7 @@ function readPromo() {
 | 
				
			||||||
	left: 8px;
 | 
						left: 8px;
 | 
				
			||||||
	width: 5px;
 | 
						width: 5px;
 | 
				
			||||||
	height: calc(100% - 16px);
 | 
						height: calc(100% - 16px);
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
	pointer-events: none;
 | 
						pointer-events: none;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -724,7 +724,7 @@ function readPromo() {
 | 
				
			||||||
	background: var(--popup);
 | 
						background: var(--popup);
 | 
				
			||||||
	padding: 6px 10px;
 | 
						padding: 6px 10px;
 | 
				
			||||||
	font-size: 0.8em;
 | 
						font-size: 0.8em;
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
	box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
 | 
						box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -754,7 +754,7 @@ function readPromo() {
 | 
				
			||||||
	background: var(--panel);
 | 
						background: var(--panel);
 | 
				
			||||||
	padding: 6px 10px;
 | 
						padding: 6px 10px;
 | 
				
			||||||
	font-size: 0.8em;
 | 
						font-size: 0.8em;
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
	box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
 | 
						box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -789,7 +789,7 @@ function readPromo() {
 | 
				
			||||||
.quoteNote {
 | 
					.quoteNote {
 | 
				
			||||||
	padding: 16px;
 | 
						padding: 16px;
 | 
				
			||||||
	border: dashed 1px var(--renote);
 | 
						border: dashed 1px var(--renote);
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	overflow: clip;
 | 
						overflow: clip;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -552,7 +552,7 @@ if (appearNote.reply && appearNote.reply.replyId && defaultStore.state.autoloadC
 | 
				
			||||||
	width: 28px;
 | 
						width: 28px;
 | 
				
			||||||
	height: 28px;
 | 
						height: 28px;
 | 
				
			||||||
	margin: 0 8px 0 0;
 | 
						margin: 0 8px 0 0;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.renoteText {
 | 
					.renoteText {
 | 
				
			||||||
| 
						 | 
					@ -679,7 +679,7 @@ if (appearNote.reply && appearNote.reply.replyId && defaultStore.state.autoloadC
 | 
				
			||||||
.quoteNote {
 | 
					.quoteNote {
 | 
				
			||||||
	padding: 16px;
 | 
						padding: 16px;
 | 
				
			||||||
	border: dashed 1px var(--renote);
 | 
						border: dashed 1px var(--renote);
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	overflow: clip;
 | 
						overflow: clip;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -757,7 +757,7 @@ if (appearNote.reply && appearNote.reply.replyId && defaultStore.state.autoloadC
 | 
				
			||||||
.reactionTab {
 | 
					.reactionTab {
 | 
				
			||||||
	padding: 4px 6px;
 | 
						padding: 4px 6px;
 | 
				
			||||||
	border: solid 1px var(--divider);
 | 
						border: solid 1px var(--divider);
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.reactionTabActive {
 | 
					.reactionTabActive {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -50,7 +50,7 @@ const showContent = $ref(false);
 | 
				
			||||||
	margin: 0 10px 0 0;
 | 
						margin: 0 10px 0 0;
 | 
				
			||||||
	width: 34px;
 | 
						width: 34px;
 | 
				
			||||||
	height: 34px;
 | 
						height: 34px;
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	position: sticky !important;
 | 
						position: sticky !important;
 | 
				
			||||||
	top: calc(16px + var(--stickyTop, 0px));
 | 
						top: calc(16px + var(--stickyTop, 0px));
 | 
				
			||||||
	left: 0;
 | 
						left: 0;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -278,7 +278,7 @@ if (props.detail) {
 | 
				
			||||||
	left: 8px;
 | 
						left: 8px;
 | 
				
			||||||
	width: 5px;
 | 
						width: 5px;
 | 
				
			||||||
	height: calc(100% - 8px);
 | 
						height: calc(100% - 8px);
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
	pointer-events: none;
 | 
						pointer-events: none;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -288,7 +288,7 @@ if (props.detail) {
 | 
				
			||||||
	margin: 0 8px 0 0;
 | 
						margin: 0 8px 0 0;
 | 
				
			||||||
	width: 38px;
 | 
						width: 38px;
 | 
				
			||||||
	height: 38px;
 | 
						height: 38px;
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.body {
 | 
					.body {
 | 
				
			||||||
| 
						 | 
					@ -362,6 +362,6 @@ if (props.detail) {
 | 
				
			||||||
	padding: 8px !important;
 | 
						padding: 8px !important;
 | 
				
			||||||
	border: 1px solid var(--divider);
 | 
						border: 1px solid var(--divider);
 | 
				
			||||||
	margin: 8px 8px 0 8px;
 | 
						margin: 8px 8px 0 8px;
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
</style>
 | 
					</style>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -181,7 +181,7 @@ useTooltip(reactionRef, (showing) => {
 | 
				
			||||||
	display: block;
 | 
						display: block;
 | 
				
			||||||
	width: 100%;
 | 
						width: 100%;
 | 
				
			||||||
	height: 100%;
 | 
						height: 100%;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.subIcon {
 | 
					.subIcon {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -69,7 +69,7 @@ onUnmounted(() => {
 | 
				
			||||||
				background: var(--panel);
 | 
									background: var(--panel);
 | 
				
			||||||
				padding: 6px 10px;
 | 
									padding: 6px 10px;
 | 
				
			||||||
				font-size: 0.8em;
 | 
									font-size: 0.8em;
 | 
				
			||||||
				border-radius: 999px;
 | 
									border-radius: 4px;
 | 
				
			||||||
				box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
 | 
									box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
 | 
				
			||||||
			}
 | 
								}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -61,7 +61,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 | 
				
			||||||
				<MkAcct :user="u"/>
 | 
									<MkAcct :user="u"/>
 | 
				
			||||||
				<button class="_button" style="padding: 4px 8px;" @click="removeVisibleUser(u)"><i class="ph-x ph-bold ph-lg"></i></button>
 | 
									<button class="_button" style="padding: 4px 8px;" @click="removeVisibleUser(u)"><i class="ph-x ph-bold ph-lg"></i></button>
 | 
				
			||||||
			</span>
 | 
								</span>
 | 
				
			||||||
			<button class="_buttonPrimary" style="padding: 4px; border-radius: 8px;" @click="addVisibleUser"><i class="ph-plus ph-bold ph-lg ti-fw"></i></button>
 | 
								<button class="_buttonPrimary" style="padding: 4px; border-radius: 5px;" @click="addVisibleUser"><i class="ph-plus ph-bold ph-lg ti-fw"></i></button>
 | 
				
			||||||
		</div>
 | 
							</div>
 | 
				
			||||||
	</div>
 | 
						</div>
 | 
				
			||||||
	<MkInfo v-if="hasNotSpecifiedMentions" warn :class="$style.hasNotSpecifiedMentions">{{ i18n.ts.notSpecifiedMentionWarning }} - <button class="_textButton" @click="addMissingMention()">{{ i18n.ts.add }}</button></MkInfo>
 | 
						<MkInfo v-if="hasNotSpecifiedMentions" warn :class="$style.hasNotSpecifiedMentions">{{ i18n.ts.notSpecifiedMentionWarning }} - <button class="_textButton" @click="addMissingMention()">{{ i18n.ts.add }}</button></MkInfo>
 | 
				
			||||||
| 
						 | 
					@ -993,7 +993,7 @@ defineExpose({
 | 
				
			||||||
	padding: 0 12px;
 | 
						padding: 0 12px;
 | 
				
			||||||
	line-height: 34px;
 | 
						line-height: 34px;
 | 
				
			||||||
	font-weight: bold;
 | 
						font-weight: bold;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	min-width: 90px;
 | 
						min-width: 90px;
 | 
				
			||||||
	box-sizing: border-box;
 | 
						box-sizing: border-box;
 | 
				
			||||||
	color: var(--fgOnAccent);
 | 
						color: var(--fgOnAccent);
 | 
				
			||||||
| 
						 | 
					@ -1003,7 +1003,7 @@ defineExpose({
 | 
				
			||||||
.headerRightItem {
 | 
					.headerRightItem {
 | 
				
			||||||
	margin: 0;
 | 
						margin: 0;
 | 
				
			||||||
	padding: 8px;
 | 
						padding: 8px;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&:hover {
 | 
						&:hover {
 | 
				
			||||||
		background: var(--X5);
 | 
							background: var(--X5);
 | 
				
			||||||
| 
						 | 
					@ -1066,7 +1066,7 @@ defineExpose({
 | 
				
			||||||
.visibleUser {
 | 
					.visibleUser {
 | 
				
			||||||
	margin-right: 14px;
 | 
						margin-right: 14px;
 | 
				
			||||||
	padding: 8px 0 8px 8px;
 | 
						padding: 8px 0 8px 8px;
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	background: var(--X4);
 | 
						background: var(--X4);
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -1135,7 +1135,7 @@ defineExpose({
 | 
				
			||||||
	padding: 4px 6px;
 | 
						padding: 4px 6px;
 | 
				
			||||||
	font-size: .9em;
 | 
						font-size: .9em;
 | 
				
			||||||
	color: var(--warn);
 | 
						color: var(--warn);
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	min-width: 1.6em;
 | 
						min-width: 1.6em;
 | 
				
			||||||
	text-align: center;
 | 
						text-align: center;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -1175,7 +1175,7 @@ defineExpose({
 | 
				
			||||||
	font-size: 1em;
 | 
						font-size: 1em;
 | 
				
			||||||
	width: auto;
 | 
						width: auto;
 | 
				
			||||||
	height: 100%;
 | 
						height: 100%;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&:hover {
 | 
						&:hover {
 | 
				
			||||||
		background: var(--X5);
 | 
							background: var(--X5);
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -55,7 +55,7 @@ function toggle(): void {
 | 
				
			||||||
	background-color: var(--panel);
 | 
						background-color: var(--panel);
 | 
				
			||||||
	background-clip: padding-box !important;
 | 
						background-clip: padding-box !important;
 | 
				
			||||||
	border: solid 1px var(--panel);
 | 
						border: solid 1px var(--panel);
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	font-size: 90%;
 | 
						font-size: 90%;
 | 
				
			||||||
	transition: all 0.2s;
 | 
						transition: all 0.2s;
 | 
				
			||||||
	user-select: none;
 | 
						user-select: none;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -181,7 +181,7 @@ const onMousedown = (ev: MouseEvent | TouchEvent) => {
 | 
				
			||||||
		padding: 7px 12px;
 | 
							padding: 7px 12px;
 | 
				
			||||||
		background: var(--panel);
 | 
							background: var(--panel);
 | 
				
			||||||
		border: solid 1px var(--panel);
 | 
							border: solid 1px var(--panel);
 | 
				
			||||||
		border-radius: 6px;
 | 
							border-radius: 5px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
		> .container {
 | 
							> .container {
 | 
				
			||||||
			position: relative;
 | 
								position: relative;
 | 
				
			||||||
| 
						 | 
					@ -197,7 +197,7 @@ const onMousedown = (ev: MouseEvent | TouchEvent) => {
 | 
				
			||||||
				width: calc(100% - #{$thumbWidth});
 | 
									width: calc(100% - #{$thumbWidth});
 | 
				
			||||||
				height: 3px;
 | 
									height: 3px;
 | 
				
			||||||
				background: rgba(0, 0, 0, 0.1);
 | 
									background: rgba(0, 0, 0, 0.1);
 | 
				
			||||||
				border-radius: 999px;
 | 
									border-radius: 4px;
 | 
				
			||||||
				overflow: clip;
 | 
									overflow: clip;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
				> .highlight {
 | 
									> .highlight {
 | 
				
			||||||
| 
						 | 
					@ -228,7 +228,7 @@ const onMousedown = (ev: MouseEvent | TouchEvent) => {
 | 
				
			||||||
					height: 3px;
 | 
										height: 3px;
 | 
				
			||||||
					margin-left: - math.div($tickWidth, 2);
 | 
										margin-left: - math.div($tickWidth, 2);
 | 
				
			||||||
					background: var(--divider);
 | 
										background: var(--divider);
 | 
				
			||||||
					border-radius: 999px;
 | 
										border-radius: 4px;
 | 
				
			||||||
				}
 | 
									}
 | 
				
			||||||
			}
 | 
								}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -238,7 +238,7 @@ const onMousedown = (ev: MouseEvent | TouchEvent) => {
 | 
				
			||||||
				height: $thumbHeight;
 | 
									height: $thumbHeight;
 | 
				
			||||||
				cursor: grab;
 | 
									cursor: grab;
 | 
				
			||||||
				background: var(--accent);
 | 
									background: var(--accent);
 | 
				
			||||||
				border-radius: 999px;
 | 
									border-radius: 4px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
				&:hover {
 | 
									&:hover {
 | 
				
			||||||
					background: var(--accentLighten);
 | 
										background: var(--accentLighten);
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -119,7 +119,7 @@ useTooltip(buttonEl, async (showing) => {
 | 
				
			||||||
	margin: 2px;
 | 
						margin: 2px;
 | 
				
			||||||
	padding: 0 6px;
 | 
						padding: 0 6px;
 | 
				
			||||||
	font-size: 1.5em;
 | 
						font-size: 1.5em;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&.canToggle {
 | 
						&.canToggle {
 | 
				
			||||||
		background: var(--buttonBg);
 | 
							background: var(--buttonBg);
 | 
				
			||||||
| 
						 | 
					@ -147,7 +147,7 @@ useTooltip(buttonEl, async (showing) => {
 | 
				
			||||||
	&.large {
 | 
						&.large {
 | 
				
			||||||
		height: 52px;
 | 
							height: 52px;
 | 
				
			||||||
		font-size: 2em;
 | 
							font-size: 2em;
 | 
				
			||||||
		border-radius: 8px;
 | 
							border-radius: 5px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
		> .count {
 | 
							> .count {
 | 
				
			||||||
			font-size: 0.6em;
 | 
								font-size: 0.6em;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -241,7 +241,7 @@ function show(ev: MouseEvent) {
 | 
				
			||||||
	color: var(--fg);
 | 
						color: var(--fg);
 | 
				
			||||||
	background: var(--panel);
 | 
						background: var(--panel);
 | 
				
			||||||
	border: solid 1px var(--panel);
 | 
						border: solid 1px var(--panel);
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	outline: none;
 | 
						outline: none;
 | 
				
			||||||
	box-shadow: none;
 | 
						box-shadow: none;
 | 
				
			||||||
	box-sizing: border-box;
 | 
						box-sizing: border-box;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -165,7 +165,7 @@ async function updateAgreeNote(v: boolean) {
 | 
				
			||||||
		font-weight: bold;
 | 
							font-weight: bold;
 | 
				
			||||||
		align-items: center;
 | 
							align-items: center;
 | 
				
			||||||
		justify-content: center;
 | 
							justify-content: center;
 | 
				
			||||||
		border-radius: 999px;
 | 
							border-radius: 4px;
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -78,7 +78,7 @@ const collapsed = $ref(isLong);
 | 
				
			||||||
				background: var(--panel);
 | 
									background: var(--panel);
 | 
				
			||||||
				padding: 6px 10px;
 | 
									padding: 6px 10px;
 | 
				
			||||||
				font-size: 0.8em;
 | 
									font-size: 0.8em;
 | 
				
			||||||
				border-radius: 999px;
 | 
									border-radius: 4px;
 | 
				
			||||||
				box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
 | 
									box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
 | 
				
			||||||
			}
 | 
								}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -114,7 +114,7 @@ const collapsed = $ref(isLong);
 | 
				
			||||||
	background: var(--popup);
 | 
						background: var(--popup);
 | 
				
			||||||
	padding: 6px 10px;
 | 
						padding: 6px 10px;
 | 
				
			||||||
	font-size: 0.8em;
 | 
						font-size: 0.8em;
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
	box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
 | 
						box-shadow: 0 2px 6px rgb(0 0 0 / 20%);
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
</style>
 | 
					</style>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -59,7 +59,7 @@ defineProps<{
 | 
				
			||||||
				width: 100%;
 | 
									width: 100%;
 | 
				
			||||||
				box-sizing: border-box;
 | 
									box-sizing: border-box;
 | 
				
			||||||
				padding: 9px 16px 9px 8px;
 | 
									padding: 9px 16px 9px 8px;
 | 
				
			||||||
				border-radius: 9px;
 | 
									border-radius: 5px;
 | 
				
			||||||
				font-size: 0.9em;
 | 
									font-size: 0.9em;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
				&:hover {
 | 
									&:hover {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -52,7 +52,7 @@ const toggle = () => {
 | 
				
			||||||
	background: var(--switchOffBg);
 | 
						background: var(--switchOffBg);
 | 
				
			||||||
	background-clip: content-box;
 | 
						background-clip: content-box;
 | 
				
			||||||
	border: solid 1px var(--switchOffBg);
 | 
						border: solid 1px var(--switchOffBg);
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
	cursor: pointer;
 | 
						cursor: pointer;
 | 
				
			||||||
	transition: inherit;
 | 
						transition: inherit;
 | 
				
			||||||
	user-select: none;
 | 
						user-select: none;
 | 
				
			||||||
| 
						 | 
					@ -72,7 +72,7 @@ const toggle = () => {
 | 
				
			||||||
	top: 3px;
 | 
						top: 3px;
 | 
				
			||||||
	width: 15px;
 | 
						width: 15px;
 | 
				
			||||||
	height: 15px;
 | 
						height: 15px;
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
	transition: all 0.2s ease;
 | 
						transition: all 0.2s ease;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&:not(.knobChecked) {
 | 
						&:not(.knobChecked) {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -39,7 +39,7 @@ export default defineComponent({
 | 
				
			||||||
	> button {
 | 
						> button {
 | 
				
			||||||
		flex: 1;
 | 
							flex: 1;
 | 
				
			||||||
		padding: 10px 8px;
 | 
							padding: 10px 8px;
 | 
				
			||||||
		border-radius: 999px;
 | 
							border-radius: 4px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
		&:disabled {
 | 
							&:disabled {
 | 
				
			||||||
			opacity: 1 !important;
 | 
								opacity: 1 !important;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -153,7 +153,7 @@ onMounted(() => {
 | 
				
			||||||
	color: var(--fg);
 | 
						color: var(--fg);
 | 
				
			||||||
	background: var(--panel);
 | 
						background: var(--panel);
 | 
				
			||||||
	border: solid 1px var(--panel);
 | 
						border: solid 1px var(--panel);
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	outline: none;
 | 
						outline: none;
 | 
				
			||||||
	box-shadow: none;
 | 
						box-shadow: none;
 | 
				
			||||||
	box-sizing: border-box;
 | 
						box-sizing: border-box;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -66,7 +66,7 @@ onMounted(() => {
 | 
				
			||||||
	max-width: calc(100% - 32px);
 | 
						max-width: calc(100% - 32px);
 | 
				
			||||||
	width: min-content;
 | 
						width: min-content;
 | 
				
			||||||
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
 | 
						box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	overflow: clip;
 | 
						overflow: clip;
 | 
				
			||||||
	text-align: center;
 | 
						text-align: center;
 | 
				
			||||||
	pointer-events: none;
 | 
						pointer-events: none;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -231,7 +231,7 @@ onUnmounted(() => {
 | 
				
			||||||
	display: block;
 | 
						display: block;
 | 
				
			||||||
	font-size: 14px;
 | 
						font-size: 14px;
 | 
				
			||||||
	box-shadow: 0 0 0 1px var(--divider);
 | 
						box-shadow: 0 0 0 1px var(--divider);
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	overflow: clip;
 | 
						overflow: clip;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&:hover {
 | 
						&:hover {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -50,7 +50,7 @@ onMounted(() => {
 | 
				
			||||||
	align-items: center;
 | 
						align-items: center;
 | 
				
			||||||
	padding: 16px;
 | 
						padding: 16px;
 | 
				
			||||||
	background: var(--panel);
 | 
						background: var(--panel);
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	> :global(.avatar) {
 | 
						> :global(.avatar) {
 | 
				
			||||||
		display: block;
 | 
							display: block;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -100,7 +100,7 @@ defineProps<{
 | 
				
			||||||
	color: #fff;
 | 
						color: #fff;
 | 
				
			||||||
	background: rgba(0, 0, 0, 0.7);
 | 
						background: rgba(0, 0, 0, 0.7);
 | 
				
			||||||
	font-size: 0.7em;
 | 
						font-size: 0.7em;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.description {
 | 
					.description {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -145,7 +145,7 @@ onMounted(() => {
 | 
				
			||||||
	color: #fff;
 | 
						color: #fff;
 | 
				
			||||||
	background: rgba(0, 0, 0, 0.7);
 | 
						background: rgba(0, 0, 0, 0.7);
 | 
				
			||||||
	font-size: 0.7em;
 | 
						font-size: 0.7em;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.avatarBack {
 | 
					.avatarBack {
 | 
				
			||||||
| 
						 | 
					@ -226,7 +226,7 @@ onMounted(() => {
 | 
				
			||||||
	right: 44px;
 | 
						right: 44px;
 | 
				
			||||||
	padding: 6px;
 | 
						padding: 6px;
 | 
				
			||||||
	background: var(--panel);
 | 
						background: var(--panel);
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.follow {
 | 
					.follow {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -151,7 +151,7 @@ function exploreOtherServers() {
 | 
				
			||||||
	right: 16px;
 | 
						right: 16px;
 | 
				
			||||||
	width: 32px;
 | 
						width: 32px;
 | 
				
			||||||
	height: 32px;
 | 
						height: 32px;
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	font-size: 18px;
 | 
						font-size: 18px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -52,7 +52,7 @@ const props = defineProps<{
 | 
				
			||||||
	box-sizing: border-box;
 | 
						box-sizing: border-box;
 | 
				
			||||||
	padding: 10px 14px;
 | 
						padding: 10px 14px;
 | 
				
			||||||
	background: var(--buttonBg);
 | 
						background: var(--buttonBg);
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	font-size: 0.9em;
 | 
						font-size: 0.9em;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&:hover {
 | 
						&:hover {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -142,10 +142,10 @@ watch(() => props.user.avatarBlurhash, () => {
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.square {
 | 
					.square {
 | 
				
			||||||
	border-radius: 20%;
 | 
						border-radius: 5px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	> .inner {
 | 
						> .inner {
 | 
				
			||||||
		border-radius: 20%;
 | 
							border-radius: 5px;
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -44,6 +44,6 @@ const emit = defineEmits<{
 | 
				
			||||||
  width: 128px;
 | 
					  width: 128px;
 | 
				
			||||||
	height: 128px;
 | 
						height: 128px;
 | 
				
			||||||
	margin-bottom: 16px;
 | 
						margin-bottom: 16px;
 | 
				
			||||||
	border-radius: 16px;
 | 
						border-radius: 4px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
</style>
 | 
					</style>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -242,7 +242,7 @@ onUnmounted(() => {
 | 
				
			||||||
	bottom: 0;
 | 
						bottom: 0;
 | 
				
			||||||
	height: 3px;
 | 
						height: 3px;
 | 
				
			||||||
	background: var(--accent);
 | 
						background: var(--accent);
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
	transition: none;
 | 
						transition: none;
 | 
				
			||||||
	pointer-events: none;
 | 
						pointer-events: none;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -82,6 +82,6 @@ definePageMetadata({
 | 
				
			||||||
	vertical-align: bottom;
 | 
						vertical-align: bottom;
 | 
				
			||||||
	height: 128px;
 | 
						height: 128px;
 | 
				
			||||||
	margin-bottom: 24px;
 | 
						margin-bottom: 24px;
 | 
				
			||||||
	border-radius: 16px;
 | 
						border-radius: 4px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
</style>
 | 
					</style>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -206,7 +206,7 @@ definePageMetadata({
 | 
				
			||||||
				display: block;
 | 
									display: block;
 | 
				
			||||||
				width: 80px;
 | 
									width: 80px;
 | 
				
			||||||
				margin: 0 auto;
 | 
									margin: 0 auto;
 | 
				
			||||||
				border-radius: 16px;
 | 
									border-radius: 4px;
 | 
				
			||||||
				position: relative;
 | 
									position: relative;
 | 
				
			||||||
				z-index: 1;
 | 
									z-index: 1;
 | 
				
			||||||
			}
 | 
								}
 | 
				
			||||||
| 
						 | 
					@ -256,7 +256,7 @@ definePageMetadata({
 | 
				
			||||||
	align-items: center;
 | 
						align-items: center;
 | 
				
			||||||
	padding: 12px;
 | 
						padding: 12px;
 | 
				
			||||||
	background: var(--buttonBg);
 | 
						background: var(--buttonBg);
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&:hover {
 | 
						&:hover {
 | 
				
			||||||
		text-decoration: none;
 | 
							text-decoration: none;
 | 
				
			||||||
| 
						 | 
					@ -289,7 +289,7 @@ definePageMetadata({
 | 
				
			||||||
	align-items: center;
 | 
						align-items: center;
 | 
				
			||||||
	padding: 12px;
 | 
						padding: 12px;
 | 
				
			||||||
	background: var(--buttonBg);
 | 
						background: var(--buttonBg);
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.patronIcon {
 | 
					.patronIcon {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -164,7 +164,7 @@ definePageMetadata(computed(() => ({
 | 
				
			||||||
<style lang="scss" module>
 | 
					<style lang="scss" module>
 | 
				
			||||||
.banner {
 | 
					.banner {
 | 
				
			||||||
	text-align: center;
 | 
						text-align: center;
 | 
				
			||||||
	border-radius: 10px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	overflow: clip;
 | 
						overflow: clip;
 | 
				
			||||||
	background-size: cover;
 | 
						background-size: cover;
 | 
				
			||||||
	background-position: center center;
 | 
						background-position: center center;
 | 
				
			||||||
| 
						 | 
					@ -174,7 +174,7 @@ definePageMetadata(computed(() => ({
 | 
				
			||||||
	display: block;
 | 
						display: block;
 | 
				
			||||||
	margin: 16px auto 0 auto;
 | 
						margin: 16px auto 0 auto;
 | 
				
			||||||
	height: 64px;
 | 
						height: 64px;
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.bannerName {
 | 
					.bannerName {
 | 
				
			||||||
| 
						 | 
					@ -213,7 +213,7 @@ definePageMetadata(computed(() => ({
 | 
				
			||||||
		font-weight: bold;
 | 
							font-weight: bold;
 | 
				
			||||||
		align-items: center;
 | 
							align-items: center;
 | 
				
			||||||
		justify-content: center;
 | 
							justify-content: center;
 | 
				
			||||||
		border-radius: 999px;
 | 
							border-radius: 4px;
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -528,7 +528,7 @@ definePageMetadata(computed(() => ({
 | 
				
			||||||
			> .suspended, > .silenced, > .moderator {
 | 
								> .suspended, > .silenced, > .moderator {
 | 
				
			||||||
				display: inline-block;
 | 
									display: inline-block;
 | 
				
			||||||
				border: solid 1px;
 | 
									border: solid 1px;
 | 
				
			||||||
				border-radius: 6px;
 | 
									border-radius: 5px;
 | 
				
			||||||
				padding: 2px 6px;
 | 
									padding: 2px 6px;
 | 
				
			||||||
				font-size: 85%;
 | 
									font-size: 85%;
 | 
				
			||||||
			}
 | 
								}
 | 
				
			||||||
| 
						 | 
					@ -608,7 +608,7 @@ definePageMetadata(computed(() => ({
 | 
				
			||||||
.announcementItem {
 | 
					.announcementItem {
 | 
				
			||||||
	display: flex;
 | 
						display: flex;
 | 
				
			||||||
	padding: 8px 12px;
 | 
						padding: 8px 12px;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	cursor: pointer;
 | 
						cursor: pointer;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
</style>
 | 
					</style>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -286,7 +286,7 @@ onUnmounted(() => {
 | 
				
			||||||
			bottom: 0;
 | 
								bottom: 0;
 | 
				
			||||||
			height: 3px;
 | 
								height: 3px;
 | 
				
			||||||
			background: var(--accent);
 | 
								background: var(--accent);
 | 
				
			||||||
			border-radius: 999px;
 | 
								border-radius: 4px;
 | 
				
			||||||
			transition: all 0.2s ease;
 | 
								transition: all 0.2s ease;
 | 
				
			||||||
			pointer-events: none;
 | 
								pointer-events: none;
 | 
				
			||||||
		}
 | 
							}
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -344,7 +344,7 @@ defineExpose({
 | 
				
			||||||
					display: block;
 | 
										display: block;
 | 
				
			||||||
					margin: auto;
 | 
										margin: auto;
 | 
				
			||||||
					height: 42px;
 | 
										height: 42px;
 | 
				
			||||||
					border-radius: 8px;
 | 
										border-radius: 5px;
 | 
				
			||||||
				}
 | 
									}
 | 
				
			||||||
			}
 | 
								}
 | 
				
			||||||
		}
 | 
							}
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -111,7 +111,7 @@ const props = defineProps<{
 | 
				
			||||||
.diff {
 | 
					.diff {
 | 
				
			||||||
	background: #fff;
 | 
						background: #fff;
 | 
				
			||||||
	color: #000;
 | 
						color: #000;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	overflow: clip;
 | 
						overflow: clip;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
</style>
 | 
					</style>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -146,7 +146,7 @@ onMounted(async () => {
 | 
				
			||||||
					margin-right: 12px;
 | 
										margin-right: 12px;
 | 
				
			||||||
					background: var(--accentedBg);
 | 
										background: var(--accentedBg);
 | 
				
			||||||
					color: var(--accent);
 | 
										color: var(--accent);
 | 
				
			||||||
					border-radius: 10px;
 | 
										border-radius: 5px;
 | 
				
			||||||
				}
 | 
									}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
				&.sub {
 | 
									&.sub {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -115,7 +115,7 @@ onMounted(async () => {
 | 
				
			||||||
				margin-right: 12px;
 | 
									margin-right: 12px;
 | 
				
			||||||
				background: var(--accentedBg);
 | 
									background: var(--accentedBg);
 | 
				
			||||||
				color: var(--accent);
 | 
									color: var(--accent);
 | 
				
			||||||
				border-radius: 10px;
 | 
									border-radius: 5px;
 | 
				
			||||||
			}
 | 
								}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
			&.users {
 | 
								&.users {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -104,7 +104,7 @@ definePageMetadata({
 | 
				
			||||||
	height: 28px;
 | 
						height: 28px;
 | 
				
			||||||
	align-items: center;
 | 
						align-items: center;
 | 
				
			||||||
	justify-content: center;
 | 
						justify-content: center;
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
	margin-right: 8px;
 | 
						margin-right: 8px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -119,7 +119,7 @@ definePageMetadata({
 | 
				
			||||||
	height: 40px;
 | 
						height: 40px;
 | 
				
			||||||
	color: var(--error);
 | 
						color: var(--error);
 | 
				
			||||||
	margin-left: auto;
 | 
						margin-left: auto;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&:hover {
 | 
						&:hover {
 | 
				
			||||||
		background: var(--X5);
 | 
							background: var(--X5);
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -268,7 +268,7 @@ definePageMetadata(computed(() => channel ? {
 | 
				
			||||||
	padding: 8px 12px;
 | 
						padding: 8px 12px;
 | 
				
			||||||
	font-size: 80%;
 | 
						font-size: 80%;
 | 
				
			||||||
	background: rgba(0, 0, 0, 0.7);
 | 
						background: rgba(0, 0, 0, 0.7);
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	color: #fff;
 | 
						color: #fff;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -283,7 +283,7 @@ definePageMetadata(computed(() => channel ? {
 | 
				
			||||||
	left: 16px;
 | 
						left: 16px;
 | 
				
			||||||
	background: rgba(0, 0, 0, 0.7);
 | 
						background: rgba(0, 0, 0, 0.7);
 | 
				
			||||||
	color: var(--warn);
 | 
						color: var(--warn);
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	font-weight: bold;
 | 
						font-weight: bold;
 | 
				
			||||||
	font-size: 1em;
 | 
						font-size: 1em;
 | 
				
			||||||
	padding: 4px 7px;
 | 
						padding: 4px 7px;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -206,7 +206,7 @@ async function del() {
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.imgContainer {
 | 
					.imgContainer {
 | 
				
			||||||
	padding: 8px;
 | 
						padding: 8px;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.img {
 | 
					.img {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -61,7 +61,7 @@ function menu(ev) {
 | 
				
			||||||
	padding: 12px;
 | 
						padding: 12px;
 | 
				
			||||||
	text-align: left;
 | 
						text-align: left;
 | 
				
			||||||
	background: var(--panel);
 | 
						background: var(--panel);
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&:hover {
 | 
						&:hover {
 | 
				
			||||||
		border-color: var(--accent);
 | 
							border-color: var(--accent);
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -87,7 +87,7 @@ definePageMetadata(computed(() => ({
 | 
				
			||||||
			margin: 0 12px 0 0;
 | 
								margin: 0 12px 0 0;
 | 
				
			||||||
			width: 42px;
 | 
								width: 42px;
 | 
				
			||||||
			height: 42px;
 | 
								height: 42px;
 | 
				
			||||||
			border-radius: 8px;
 | 
								border-radius: 5px;
 | 
				
			||||||
		}
 | 
							}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
		> .body {
 | 
							> .body {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -242,7 +242,7 @@ definePageMetadata({
 | 
				
			||||||
		display: block;
 | 
							display: block;
 | 
				
			||||||
		margin: 0 16px 0 0;
 | 
							margin: 0 16px 0 0;
 | 
				
			||||||
		height: 64px;
 | 
							height: 64px;
 | 
				
			||||||
		border-radius: 8px;
 | 
							border-radius: 5px;
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	> .name {
 | 
						> .name {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -114,6 +114,6 @@ definePageMetadata({
 | 
				
			||||||
	width: 128px;
 | 
						width: 128px;
 | 
				
			||||||
	height: 128px;
 | 
						height: 128px;
 | 
				
			||||||
	margin-bottom: 16px;
 | 
						margin-bottom: 16px;
 | 
				
			||||||
	border-radius: 16px;
 | 
						border-radius: 4px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
</style>
 | 
					</style>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -141,7 +141,7 @@ definePageMetadata(computed(() => list ? {
 | 
				
			||||||
  width: 128px;
 | 
					  width: 128px;
 | 
				
			||||||
	height: 128px;
 | 
						height: 128px;
 | 
				
			||||||
	margin-bottom: 16px;
 | 
						margin-bottom: 16px;
 | 
				
			||||||
	border-radius: 16px;
 | 
						border-radius: 4px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.button {
 | 
					.button {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -74,7 +74,7 @@ onActivated(() => {
 | 
				
			||||||
	display: block;
 | 
						display: block;
 | 
				
			||||||
	padding: 16px;
 | 
						padding: 16px;
 | 
				
			||||||
	border: solid 1px var(--divider);
 | 
						border: solid 1px var(--divider);
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&:hover {
 | 
						&:hover {
 | 
				
			||||||
		border: solid 1px var(--accent);
 | 
							border: solid 1px var(--accent);
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -84,7 +84,7 @@ onActivated(() => {
 | 
				
			||||||
	display: block;
 | 
						display: block;
 | 
				
			||||||
	padding: 16px;
 | 
						padding: 16px;
 | 
				
			||||||
	border: solid 1px var(--divider);
 | 
						border: solid 1px var(--divider);
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	margin-bottom: 8px;
 | 
						margin-bottom: 8px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&:hover {
 | 
						&:hover {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -141,7 +141,7 @@ definePageMetadata(computed(() => note ? {
 | 
				
			||||||
.loadPrev {
 | 
					.loadPrev {
 | 
				
			||||||
	min-width: 0;
 | 
						min-width: 0;
 | 
				
			||||||
	margin: 0 auto;
 | 
						margin: 0 auto;
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.loadNext {
 | 
					.loadNext {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -63,7 +63,7 @@ function remove() {
 | 
				
			||||||
	overflow: hidden;
 | 
						overflow: hidden;
 | 
				
			||||||
	background: var(--panel);
 | 
						background: var(--panel);
 | 
				
			||||||
	border: solid 2px var(--X12);
 | 
						border: solid 2px var(--X12);
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&:hover {
 | 
						&:hover {
 | 
				
			||||||
		border: solid 2px var(--X13);
 | 
							border: solid 2px var(--X13);
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -104,7 +104,7 @@ definePageMetadata(computed(() => ({
 | 
				
			||||||
  width: 128px;
 | 
					  width: 128px;
 | 
				
			||||||
	height: 128px;
 | 
						height: 128px;
 | 
				
			||||||
	margin-bottom: 16px;
 | 
						margin-bottom: 16px;
 | 
				
			||||||
	border-radius: 16px;
 | 
						border-radius: 4px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
</style>
 | 
					</style>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -93,7 +93,7 @@ definePageMetadata({
 | 
				
			||||||
	margin: 0 12px 0 0;
 | 
						margin: 0 12px 0 0;
 | 
				
			||||||
	width: 50px;
 | 
						width: 50px;
 | 
				
			||||||
	height: 50px;
 | 
						height: 50px;
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.appBody {
 | 
					.appBody {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -152,7 +152,7 @@ definePageMetadata({
 | 
				
			||||||
	height: 12px;
 | 
						height: 12px;
 | 
				
			||||||
	background: rgba(0, 0, 0, 0.1);
 | 
						background: rgba(0, 0, 0, 0.1);
 | 
				
			||||||
	overflow: clip;
 | 
						overflow: clip;
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.meterValue {
 | 
					.meterValue {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -148,12 +148,12 @@ definePageMetadata({
 | 
				
			||||||
.meter {
 | 
					.meter {
 | 
				
			||||||
	height: 10px;
 | 
						height: 10px;
 | 
				
			||||||
	background: rgba(0, 0, 0, 0.1);
 | 
						background: rgba(0, 0, 0, 0.1);
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
	overflow: clip;
 | 
						overflow: clip;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.meterValue {
 | 
					.meterValue {
 | 
				
			||||||
	height: 100%;
 | 
						height: 100%;
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
</style>
 | 
					</style>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -267,7 +267,7 @@ definePageMetadata({
 | 
				
			||||||
	background-size: cover;
 | 
						background-size: cover;
 | 
				
			||||||
	background-position: center;
 | 
						background-position: center;
 | 
				
			||||||
	border: solid 1px var(--divider);
 | 
						border: solid 1px var(--divider);
 | 
				
			||||||
	border-radius: 10px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	overflow: clip;
 | 
						overflow: clip;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -7,7 +7,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 | 
				
			||||||
<div class="_gaps_m">
 | 
					<div class="_gaps_m">
 | 
				
			||||||
	<FromSlot>
 | 
						<FromSlot>
 | 
				
			||||||
		<template #label>{{ i18n.ts.reactionSettingDescription }}</template>
 | 
							<template #label>{{ i18n.ts.reactionSettingDescription }}</template>
 | 
				
			||||||
		<div v-panel style="border-radius: 6px;">
 | 
							<div v-panel style="border-radius: 5px;">
 | 
				
			||||||
			<Sortable v-model="reactions" :class="$style.reactions" :itemKey="item => item" :animation="150" :delay="100" :delayOnTouchOnly="true">
 | 
								<Sortable v-model="reactions" :class="$style.reactions" :itemKey="item => item" :animation="150" :delay="100" :delayOnTouchOnly="true">
 | 
				
			||||||
				<template #item="{element}">
 | 
									<template #item="{element}">
 | 
				
			||||||
					<button class="_button" :class="$style.reactionsItem" @click="remove(element, $event)">
 | 
										<button class="_button" :class="$style.reactionsItem" @click="remove(element, $event)">
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -172,7 +172,7 @@ definePageMetadata({
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<style lang="scss" scoped>
 | 
					<style lang="scss" scoped>
 | 
				
			||||||
.rfqxtzch {
 | 
					.rfqxtzch {
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	> .toggle {
 | 
						> .toggle {
 | 
				
			||||||
		position: relative;
 | 
							position: relative;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -244,7 +244,7 @@ definePageMetadata({
 | 
				
			||||||
				position: relative;
 | 
									position: relative;
 | 
				
			||||||
				width: 64px;
 | 
									width: 64px;
 | 
				
			||||||
				height: 64px;
 | 
									height: 64px;
 | 
				
			||||||
				border-radius: 8px;
 | 
									border-radius: 5px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
				> .preview {
 | 
									> .preview {
 | 
				
			||||||
					position: absolute;
 | 
										position: absolute;
 | 
				
			||||||
| 
						 | 
					@ -271,10 +271,10 @@ definePageMetadata({
 | 
				
			||||||
				}
 | 
									}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
				&.rounded {
 | 
									&.rounded {
 | 
				
			||||||
					border-radius: 999px;
 | 
										border-radius: 4px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
					> .preview {
 | 
										> .preview {
 | 
				
			||||||
						border-radius: 999px;
 | 
											border-radius: 4px;
 | 
				
			||||||
					}
 | 
										}
 | 
				
			||||||
				}
 | 
									}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -385,7 +385,7 @@ onUnmounted(() => {
 | 
				
			||||||
						color: #fff;
 | 
											color: #fff;
 | 
				
			||||||
						background: rgba(0, 0, 0, 0.7);
 | 
											background: rgba(0, 0, 0, 0.7);
 | 
				
			||||||
						font-size: 0.7em;
 | 
											font-size: 0.7em;
 | 
				
			||||||
						border-radius: 6px;
 | 
											border-radius: 5px;
 | 
				
			||||||
					}
 | 
										}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
					> .actions {
 | 
										> .actions {
 | 
				
			||||||
| 
						 | 
					@ -492,7 +492,7 @@ onUnmounted(() => {
 | 
				
			||||||
 | 
					
 | 
				
			||||||
					> .role {
 | 
										> .role {
 | 
				
			||||||
						border: solid 1px var(--color, var(--divider));
 | 
											border: solid 1px var(--color, var(--divider));
 | 
				
			||||||
						border-radius: 999px;
 | 
											border-radius: 4px;
 | 
				
			||||||
						margin-right: 4px;
 | 
											margin-right: 4px;
 | 
				
			||||||
						padding: 3px 8px;
 | 
											padding: 3px 8px;
 | 
				
			||||||
					}
 | 
										}
 | 
				
			||||||
| 
						 | 
					@ -507,7 +507,7 @@ onUnmounted(() => {
 | 
				
			||||||
					background: transparent;
 | 
										background: transparent;
 | 
				
			||||||
					color: var(--fg);
 | 
										color: var(--fg);
 | 
				
			||||||
					border: 1px solid var(--divider);
 | 
										border: 1px solid var(--divider);
 | 
				
			||||||
					border-radius: 8px;
 | 
										border-radius: 5px;
 | 
				
			||||||
					padding: 8px;
 | 
										padding: 8px;
 | 
				
			||||||
					line-height: 0;
 | 
										line-height: 0;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -713,9 +713,9 @@ onUnmounted(() => {
 | 
				
			||||||
	margin: calc(var(--margin) / 2) 0;
 | 
						margin: calc(var(--margin) / 2) 0;
 | 
				
			||||||
	padding: calc(var(--margin) / 2) 0;
 | 
						padding: calc(var(--margin) / 2) 0;
 | 
				
			||||||
	background: var(--bg);
 | 
						background: var(--bg);
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	> button {
 | 
						> button {
 | 
				
			||||||
		border-radius: 8px;
 | 
							border-radius: 5px;
 | 
				
			||||||
		margin-left: 0.4rem;
 | 
							margin-left: 0.4rem;
 | 
				
			||||||
		margin-right: 0.4rem;
 | 
							margin-right: 0.4rem;
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -93,7 +93,7 @@ onMounted(() => {
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.img {
 | 
					.img {
 | 
				
			||||||
	height: 128px;
 | 
						height: 128px;
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	overflow: clip;
 | 
						overflow: clip;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -45,7 +45,7 @@ const pagination = {
 | 
				
			||||||
	display: block;
 | 
						display: block;
 | 
				
			||||||
	padding: 16px;
 | 
						padding: 16px;
 | 
				
			||||||
	border: solid 1px var(--divider);
 | 
						border: solid 1px var(--divider);
 | 
				
			||||||
	border-radius: 6px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	margin-bottom: 8px;
 | 
						margin-bottom: 8px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&:hover {
 | 
						&:hover {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -155,7 +155,7 @@ os.apiGet('federation/instances', {
 | 
				
			||||||
		background: var(--acrylicPanel);
 | 
							background: var(--acrylicPanel);
 | 
				
			||||||
		-webkit-backdrop-filter: var(--blur, blur(15px));
 | 
							-webkit-backdrop-filter: var(--blur, blur(15px));
 | 
				
			||||||
		backdrop-filter: var(--blur, blur(15px));
 | 
							backdrop-filter: var(--blur, blur(15px));
 | 
				
			||||||
		border-radius: 999px;
 | 
							border-radius: 4px;
 | 
				
			||||||
		overflow: clip;
 | 
							overflow: clip;
 | 
				
			||||||
		width: 800px;
 | 
							width: 800px;
 | 
				
			||||||
		padding: 8px 0;
 | 
							padding: 8px 0;
 | 
				
			||||||
| 
						 | 
					@ -175,14 +175,14 @@ os.apiGet('federation/instances', {
 | 
				
			||||||
	padding: 6px 12px 6px 6px;
 | 
						padding: 6px 12px 6px 6px;
 | 
				
			||||||
	margin: 0 10px 0 0;
 | 
						margin: 0 10px 0 0;
 | 
				
			||||||
	background: var(--panel);
 | 
						background: var(--panel);
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	> :global(.icon) {
 | 
						> :global(.icon) {
 | 
				
			||||||
		display: inline-block;
 | 
							display: inline-block;
 | 
				
			||||||
		width: 20px;
 | 
							width: 20px;
 | 
				
			||||||
		height: 20px;
 | 
							height: 20px;
 | 
				
			||||||
		margin-right: 5px;
 | 
							margin-right: 5px;
 | 
				
			||||||
		border-radius: 999px;
 | 
							border-radius: 4px;
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
</style>
 | 
					</style>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -88,7 +88,7 @@ onUpdated(() => {
 | 
				
			||||||
	padding: 16px;
 | 
						padding: 16px;
 | 
				
			||||||
	margin: 0 0 0 auto;
 | 
						margin: 0 0 0 auto;
 | 
				
			||||||
	max-width: max-content;
 | 
						max-width: max-content;
 | 
				
			||||||
	border-radius: 16px;
 | 
						border-radius: 4px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.richcontent {
 | 
					.richcontent {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -391,7 +391,7 @@ hr {
 | 
				
			||||||
		vertical-align: bottom;
 | 
							vertical-align: bottom;
 | 
				
			||||||
		height: 128px;
 | 
							height: 128px;
 | 
				
			||||||
		margin-bottom: 16px;
 | 
							margin-bottom: 16px;
 | 
				
			||||||
		border-radius: 16px;
 | 
							border-radius: 4px;
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -146,7 +146,7 @@ function more() {
 | 
				
			||||||
		left: 0;
 | 
							left: 0;
 | 
				
			||||||
		right: 0;
 | 
							right: 0;
 | 
				
			||||||
		bottom: 0;
 | 
							bottom: 0;
 | 
				
			||||||
		border-radius: 999px;
 | 
							border-radius: 4px;
 | 
				
			||||||
		background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
 | 
							background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -233,7 +233,7 @@ function more() {
 | 
				
			||||||
			left: 0;
 | 
								left: 0;
 | 
				
			||||||
			right: 0;
 | 
								right: 0;
 | 
				
			||||||
			bottom: 0;
 | 
								bottom: 0;
 | 
				
			||||||
			border-radius: 999px;
 | 
								border-radius: 4px;
 | 
				
			||||||
			background: var(--accentedBg);
 | 
								background: var(--accentedBg);
 | 
				
			||||||
		}
 | 
							}
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -199,7 +199,7 @@ function more(ev: MouseEvent) {
 | 
				
			||||||
			left: 0;
 | 
								left: 0;
 | 
				
			||||||
			right: 0;
 | 
								right: 0;
 | 
				
			||||||
			bottom: 0;
 | 
								bottom: 0;
 | 
				
			||||||
			border-radius: 999px;
 | 
								border-radius: 4px;
 | 
				
			||||||
			background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
 | 
								background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
 | 
				
			||||||
		}
 | 
							}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -292,7 +292,7 @@ function more(ev: MouseEvent) {
 | 
				
			||||||
				left: 0;
 | 
									left: 0;
 | 
				
			||||||
				right: 0;
 | 
									right: 0;
 | 
				
			||||||
				bottom: 0;
 | 
									bottom: 0;
 | 
				
			||||||
				border-radius: 999px;
 | 
									border-radius: 4px;
 | 
				
			||||||
				background: var(--accentedBg);
 | 
									background: var(--accentedBg);
 | 
				
			||||||
			}
 | 
								}
 | 
				
			||||||
		}
 | 
							}
 | 
				
			||||||
| 
						 | 
					@ -445,7 +445,7 @@ function more(ev: MouseEvent) {
 | 
				
			||||||
				left: 0;
 | 
									left: 0;
 | 
				
			||||||
				right: 0;
 | 
									right: 0;
 | 
				
			||||||
				bottom: 0;
 | 
									bottom: 0;
 | 
				
			||||||
				border-radius: 999px;
 | 
									border-radius: 4px;
 | 
				
			||||||
				background: var(--accentedBg);
 | 
									background: var(--accentedBg);
 | 
				
			||||||
			}
 | 
								}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -22,7 +22,7 @@ defineProps<{
 | 
				
			||||||
<style lang="scss" module>
 | 
					<style lang="scss" module>
 | 
				
			||||||
.root {
 | 
					.root {
 | 
				
			||||||
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
 | 
						box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	overflow: clip;
 | 
						overflow: clip;
 | 
				
			||||||
	contain: content;
 | 
						contain: content;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -40,7 +40,7 @@ const zIndex = os.claimZIndex('high');
 | 
				
			||||||
	padding: 16px 20px;
 | 
						padding: 16px 20px;
 | 
				
			||||||
	pointer-events: none;
 | 
						pointer-events: none;
 | 
				
			||||||
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
 | 
						box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
.mk-uploader:empty {
 | 
					.mk-uploader:empty {
 | 
				
			||||||
  display: none;
 | 
					  display: none;
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -255,7 +255,7 @@ function onDrop(ev) {
 | 
				
			||||||
	height: 100%;
 | 
						height: 100%;
 | 
				
			||||||
	overflow: clip;
 | 
						overflow: clip;
 | 
				
			||||||
	contain: strict;
 | 
						contain: strict;
 | 
				
			||||||
	border-radius: 10px;
 | 
						border-radius: 5px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	&.draghover {
 | 
						&.draghover {
 | 
				
			||||||
		&:after {
 | 
							&:after {
 | 
				
			||||||
| 
						 | 
					@ -356,7 +356,7 @@ function onDrop(ev) {
 | 
				
			||||||
	width: 3px;
 | 
						width: 3px;
 | 
				
			||||||
	height: calc(100% - 24px);
 | 
						height: calc(100% - 24px);
 | 
				
			||||||
	background: var(--accent);
 | 
						background: var(--accent);
 | 
				
			||||||
	border-radius: 999px;
 | 
						border-radius: 4px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.tabShape {
 | 
					.tabShape {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -273,7 +273,7 @@ defineExpose({
 | 
				
			||||||
				padding: 10px;
 | 
									padding: 10px;
 | 
				
			||||||
				box-sizing: border-box;
 | 
									box-sizing: border-box;
 | 
				
			||||||
				text-align: center;
 | 
									text-align: center;
 | 
				
			||||||
				border-radius: 999px;
 | 
									border-radius: 4px;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
				&._button {
 | 
									&._button {
 | 
				
			||||||
					background: var(--panel);
 | 
										background: var(--panel);
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -208,7 +208,7 @@ defineExpose<WidgetComponentExpose>({
 | 
				
			||||||
	width: 100%;
 | 
						width: 100%;
 | 
				
			||||||
	overflow: hidden;
 | 
						overflow: hidden;
 | 
				
			||||||
	background: var(--X11);
 | 
						background: var(--X11);
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.meterVal {
 | 
					.meterVal {
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -66,7 +66,7 @@ defineExpose<WidgetComponentExpose>({
 | 
				
			||||||
	display: inline-block;
 | 
						display: inline-block;
 | 
				
			||||||
	width: 60px;
 | 
						width: 60px;
 | 
				
			||||||
	height: 60px;
 | 
						height: 60px;
 | 
				
			||||||
	border-radius: 8px;
 | 
						border-radius: 5px;
 | 
				
			||||||
	box-sizing: border-box;
 | 
						box-sizing: border-box;
 | 
				
			||||||
	border: solid 3px #fff;
 | 
						border: solid 3px #fff;
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -101,7 +101,7 @@ defineExpose<WidgetComponentExpose>({
 | 
				
			||||||
 | 
					
 | 
				
			||||||
	.img {
 | 
						.img {
 | 
				
			||||||
		border: solid 4px transparent;
 | 
							border: solid 4px transparent;
 | 
				
			||||||
		border-radius: 8px;
 | 
							border-radius: 5px;
 | 
				
			||||||
	}
 | 
						}
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
	Add table
		
		Reference in a new issue