From 1760424ec15bfb8e52bcff6808f6664613527f9e Mon Sep 17 00:00:00 2001
From: Freeplay <Freeplay@duck.com>
Date: Sat, 7 Jan 2023 15:53:51 -0500
Subject: [PATCH] Change avatar size var to camelCase, more tweaks

---
 packages/client/src/components/MkMediaList.vue      |  2 ++
 packages/client/src/components/MkNote.vue           | 13 ++++++-------
 packages/client/src/components/MkNoteDetailed.vue   |  4 ++--
 packages/client/src/components/MkNoteSub.vue        |  6 +++---
 packages/client/src/components/MkSubNoteContent.vue |  2 +-
 packages/client/src/style.scss                      |  2 +-
 6 files changed, 15 insertions(+), 14 deletions(-)

diff --git a/packages/client/src/components/MkMediaList.vue b/packages/client/src/components/MkMediaList.vue
index 2c7682f123..b721fe2e8b 100644
--- a/packages/client/src/components/MkMediaList.vue
+++ b/packages/client/src/components/MkMediaList.vue
@@ -143,6 +143,8 @@ const previewable = (file: misskey.entities.DriveFile): boolean => {
 		position: relative;
 		width: 100%;
 		margin-top: 4px;
+		border-radius: var(--radius);
+		overflow: hidden;
 
 		&:before {
 			content: '';
diff --git a/packages/client/src/components/MkNote.vue b/packages/client/src/components/MkNote.vue
index 4d1048402e..f7fa633624 100644
--- a/packages/client/src/components/MkNote.vue
+++ b/packages/client/src/components/MkNote.vue
@@ -373,7 +373,7 @@ function readPromo() {
 			line-height: 28px;
 		}
 		> .line {
-			width: var(--avatar-size);
+			width: var(--avatarSize);
 			display: flex;
 			margin-right: 14px;
 			margin-top: 0;
@@ -448,7 +448,7 @@ function readPromo() {
 	}
 
 	> .article {
-		padding: 28px 32px 10px;
+		padding: 28px 32px 16px;
 		cursor: pointer;
 
 		@media (pointer: coarse) {
@@ -461,8 +461,8 @@ function readPromo() {
 				flex-shrink: 0;
 				display: block;
 				margin: 0 14px 0 0;
-				width: var(--avatar-size);
-				height: var(--avatar-size);
+				width: var(--avatarSize);
+				height: var(--avatarSize);
 				position: relative;
 				top: 0;
 				left: 0;
@@ -627,11 +627,10 @@ function readPromo() {
 
 	&.max-width_500px {
 		font-size: 0.9em;
-		// --avatar-size: 50px;
 	}
 
 	&.max-width_450px {
-		--avatar-size: 46px;
+		--avatarSize: 46px;
 		> .note-context {
 			padding-inline: 16px;
 			margin-top: 0;
@@ -664,7 +663,7 @@ function readPromo() {
 	}
 
 	&.max-width_300px {
-		--avatar-size: 40px;
+		--avatarSize: 40px;
 		> .article {
 
 			> .main {
diff --git a/packages/client/src/components/MkNoteDetailed.vue b/packages/client/src/components/MkNoteDetailed.vue
index 020e373039..c61847afa8 100644
--- a/packages/client/src/components/MkNoteDetailed.vue
+++ b/packages/client/src/components/MkNoteDetailed.vue
@@ -414,8 +414,8 @@ if (appearNote.replyId) {
 			> .avatar {
 				display: block;
 				flex-shrink: 0;
-				width: var(--avatar-size);
-				height: var(--avatar-size);
+				width: var(--avatarSize);
+				height: var(--avatarSize);
 			}
 
 			> .body {
diff --git a/packages/client/src/components/MkNoteSub.vue b/packages/client/src/components/MkNoteSub.vue
index bde41e13c7..d8bae4e233 100644
--- a/packages/client/src/components/MkNoteSub.vue
+++ b/packages/client/src/components/MkNoteSub.vue
@@ -148,10 +148,10 @@ const replies: misskey.entities.Note[] = props.conversation?.filter(item => item
 			flex-direction: column;
 			align-items: center;
 			margin-right: 14px;
-			width: var(--avatar-size);
+			width: var(--avatarSize);
 			> .avatar {
-				width: var(--avatar-size);
-				height: var(--avatar-size);
+				width: var(--avatarSize);
+				height: var(--avatarSize);
 				margin: 0;
 			}
 			> .line {
diff --git a/packages/client/src/components/MkSubNoteContent.vue b/packages/client/src/components/MkSubNoteContent.vue
index 8b40bca7f0..b7978e2d76 100644
--- a/packages/client/src/components/MkSubNoteContent.vue
+++ b/packages/client/src/components/MkSubNoteContent.vue
@@ -2,7 +2,7 @@
 <div class="wrmlmaau" :class="{ collapsed, isLong }">
 	<div class="body">
 		<span v-if="note.deletedAt" style="opacity: 0.5">({{ i18n.ts.deleted }})</span>
-		<!-- <MkA v-if="note.replyId" class="reply" :to="`/notes/${note.replyId}`"><i class="ph-arrow-bend-up-left-bold ph-lg"></i></MkA> -->
+		<MkA v-if="note.replyId" class="reply" :to="`/notes/${note.replyId}`"><i class="ph-arrow-bend-up-left-bold ph-lg"></i></MkA>
 		<Mfm v-if="note.text" :text="note.text" :author="note.user" :i="$i" :custom-emojis="note.emojis"/>
 		<MkA v-if="note.renoteId" class="rp" :to="`/notes/${note.renoteId}`">RN: ...</MkA>
 	</div>
diff --git a/packages/client/src/style.scss b/packages/client/src/style.scss
index 9a66999bbf..ca8bd8b435 100644
--- a/packages/client/src/style.scss
+++ b/packages/client/src/style.scss
@@ -4,7 +4,7 @@
 	--radius: 12px;
 	--marginFull: 16px;
 	--marginHalf: 10px;
-	--avatar-size: 48px;
+	--avatarSize: 48px;
 
 	--margin: var(--marginFull);