From 3909812423c32285939cc0f2d9be5658f560ee1d Mon Sep 17 00:00:00 2001
From: ThatOneCalculator <kainoa@t1c.dev>
Date: Tue, 15 Nov 2022 00:30:35 -0800
Subject: [PATCH] use max-width instead of width for dm images

---
 README.md                                                   | 2 +-
 packages/client/src/components/MkMediaList.vue              | 6 +++---
 .../client/src/pages/messaging/messaging-room.message.vue   | 2 +-
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/README.md b/README.md
index a520e5ef6c..a5da9e1ba8 100644
--- a/README.md
+++ b/README.md
@@ -13,7 +13,7 @@
 
 # ✨ About Calckey
 
-- Calckey is based off of Misskey, a powerful microblogging server on ActivityPub with features such as emoji reactions, a customizable web ui, rich chatting, and much more!
+- Calckey is based off of Misskey, a powerful microblogging server on ActivityPub with features such as emoji reactions, a customizable web UI, rich chatting, and much more!
 - Calckey adds many quality of life changes and bug fixes for users and instance admins alike.
 - Read **[this document](./CALCKEY.md)** all for current and future differences.
 - Notable differences:
diff --git a/packages/client/src/components/MkMediaList.vue b/packages/client/src/components/MkMediaList.vue
index f38a65c2ec..eea33c43db 100644
--- a/packages/client/src/components/MkMediaList.vue
+++ b/packages/client/src/components/MkMediaList.vue
@@ -1,7 +1,7 @@
 <template>
 <div class="hoawjimk">
 	<XBanner v-for="media in mediaList.filter(media => !previewable(media))" :key="media.id" :media="media"/>
-	<div v-if="mediaList.filter(media => previewable(media)).length > 0" class="gird-container" :class="{ width400: inDm }">
+	<div v-if="mediaList.filter(media => previewable(media)).length > 0" class="gird-container" :class="{ dmWidth: inDm }">
 		<div ref="gallery" :data-count="mediaList.filter(media => previewable(media)).length">
 			<template v-for="media in mediaList.filter(media => previewable(media))">
 				<XVideo v-if="media.type.startsWith('video')" :key="media.id" :video="media"/>
@@ -105,8 +105,8 @@ const previewable = (file: misskey.entities.DriveFile): boolean => {
 <style lang="scss" scoped>
 .hoawjimk {
 
-	> .width400 {
-		width: 400px !important;
+	> .dmWidth {
+		max-width: 400px;
 	}
 
 	> .gird-container {
diff --git a/packages/client/src/pages/messaging/messaging-room.message.vue b/packages/client/src/pages/messaging/messaging-room.message.vue
index 7a8ef615c9..c56ebed36a 100644
--- a/packages/client/src/pages/messaging/messaging-room.message.vue
+++ b/packages/client/src/pages/messaging/messaging-room.message.vue
@@ -267,7 +267,7 @@ function del(): void {
 				::selection {
 					color: var(--accent);
 					background-color: #fff;
-				} 
+				}
 
 				&.noText {
 					background: transparent;