2 files changed, 37 insertions, 10 deletions
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index cd0dbbab8..ba1c36d07 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -3422,8 +3422,12 @@ a.status-card {
   img,
   canvas,
   video {
-    max-width: 100vw;
-    max-height: 100vh;
+    max-width: 100%;
+    /*
+    put margins on top and bottom of image to avoid the screen coverd by
+    image.
+     */
+    max-height: 80%;
     width: auto;
     height: auto;
     margin: auto;
@@ -3435,11 +3439,6 @@ a.status-card {
     background: url('~images/void.png') repeat;
     object-fit: contain;
   }
-
-  .react-swipeable-view-container {
-    width: 100vw;
-    height: 100%;
-  }
 }
 
 .media-modal__closer {
@@ -4315,18 +4314,16 @@ a.status-card {
   display: block;
   text-decoration: none;
   color: $ui-secondary-color;
-  height: 100%;
   line-height: 0;
 
   &,
   img {
+    height: 100%;
     width: 100%;
   }
 
   img {
-    position: relative;
     object-fit: cover;
-    height: auto;
   }
 }
 
@@ -5076,6 +5073,12 @@ noscript {
   }
 }
 
+.focal-point-modal {
+  max-width: 80vw;
+  max-height: 80vh;
+  position: relative;
+}
+
 .focal-point {
   position: relative;
   cursor: pointer;
@@ -5085,6 +5088,14 @@ noscript {
     cursor: move;
   }
 
+  img {
+    max-width: 80vw;
+    max-height: 80vh;
+    width: auto;
+    height: auto;
+    margin: auto;
+  }
+
   &__reticle {
     position: absolute;
     width: 100px;
diff --git a/app/javascript/styles/mastodon/rtl.scss b/app/javascript/styles/mastodon/rtl.scss
index 77420c84b..e9099a9e9 100644
--- a/app/javascript/styles/mastodon/rtl.scss
+++ b/app/javascript/styles/mastodon/rtl.scss
@@ -1,6 +1,22 @@
 body.rtl {
   direction: rtl;
 
+  .column-header > button {
+    text-align: right;
+    padding-left: 0;
+    padding-right: 15px;
+  }
+
+  .landing-page__logo {
+    margin-right: 0;
+    margin-left: 20px;
+  }
+
+  .landing-page .features-list .features-list__row .visual {
+    margin-left: 0;
+    margin-right: 15px;
+  }
+
   .column-link__icon,
   .column-header__icon {
     margin-right: 0;