Fix a regression with galleries

ronilaukkarinen · Jan 12, 2024 · 567b6c2 · 567b6c2
1 parent 1943c02
commit 567b6c2
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 0 deletions.
diff --git a/layout-multiple-columns.css b/layout-multiple-columns.css
@@ -1567,6 +1567,28 @@ body.embed .detailed-status,
   margin-left: 0;
 }
 
+.layout-single-column .media-gallery__preview {
+  /* stylelint-disable-next-line */
+  margin-left: 0 !important;
+  /* stylelint-disable-next-line */
+  width: 100% !important;
+}
+
+.layout-single-column .media-gallery > .media-gallery__item:nth-of-type(odd),
+.layout-single-column .media-gallery > .media-gallery__item:nth-of-type(odd) > a,
+.layout-single-column .media-gallery__preview:nth-of-type(odd),
+ {
+  border-bottom-right-radius: 0;
+  border-top-right-radius: 0;
+}
+
+.layout-single-column .media-gallery > .media-gallery__item:nth-of-type(even),
+.layout-single-column .media-gallery > .media-gallery__item:nth-of-type(even) > a,
+.layout-single-column .media-gallery__preview:nth-of-type(even) {
+  border-bottom-left-radius: 0;
+  border-top-left-radius: 0;
+}
+
 /* End: Experimental Threads-like media proportions, if the height is tall, show smaller media */
 .layout-multiple-columns .status .status-card {
   margin-left: calc(var(--size-avatar) + var(--gap-default));

diff --git a/layout-single-column.css b/layout-single-column.css
@@ -1585,6 +1585,7 @@ body.embed .detailed-status .media-gallery__gifv,
 body.embed .detailed-status .media-gallery__preview,
 body.embed .detailed-status .video-player,
 .layout-single-column .media-gallery__gifv,
+.layout-single-column .media-gallery__preview,
 .layout-single-column .detailed-status .audio-player,
 .layout-single-column .detailed-status .media-gallery,
 .layout-single-column .detailed-status .media-gallery__gifv,
@@ -1593,6 +1594,28 @@ body.embed .detailed-status .video-player,
   margin-left: 0;
 }
 
+.layout-single-column .media-gallery__preview {
+  /* stylelint-disable-next-line */
+  margin-left: 0 !important;
+  /* stylelint-disable-next-line */
+  width: 100% !important;
+}
+
+.layout-single-column .media-gallery > .media-gallery__item:nth-of-type(odd),
+.layout-single-column .media-gallery > .media-gallery__item:nth-of-type(odd) > a,
+.layout-single-column .media-gallery__preview:nth-of-type(odd),
+ {
+  border-bottom-right-radius: 0;
+  border-top-right-radius: 0;
+}
+
+.layout-single-column .media-gallery > .media-gallery__item:nth-of-type(even),
+.layout-single-column .media-gallery > .media-gallery__item:nth-of-type(even) > a,
+.layout-single-column .media-gallery__preview:nth-of-type(even) {
+  border-bottom-left-radius: 0;
+  border-top-left-radius: 0;
+}
+
 /* End: Experimental Threads-like media proportions, if the height is tall, show smaller media */
 .layout-single-column .status .status-card {
   margin-left: calc(var(--size-avatar) + var(--gap-default));