Fix unsplash modal scrollbar issue and selected/active image outline

xwp · Jun 11, 2020 · 7b14078 · 7b14078
1 parent a63e5bb
commit 7b14078
Showing 1 changed file with 20 additions and 1 deletion.
diff --git a/assets/src/media-selector/style.css b/assets/src/media-selector/style.css
@@ -73,7 +73,7 @@
 	position: absolute !important;
 	height: auto !important;
 	top: 100px;
-	right: 310px;
+	right: 300px;
 	left: 20px;
 	padding: 0;
 }
@@ -99,6 +99,25 @@
 	margin-right: 8px;
 }
 
+.media-frame-content[data-columns="2"] .unsplash-attachment:nth-child(odd) .thumbnail,
+.media-frame-content[data-columns="3"] .unsplash-attachment:nth-child(3n+1) .thumbnail,
+.media-frame-content[data-columns="1"] .unsplash-attachment .thumbnail {
+
+	/* offset the first image in each row to ensure focus/active state has space */
+	margin-left: 3px;
+}
+
+.media-frame-content[data-columns="3"] .unsplash-attachment:nth-child(1) .thumbnail,
+.media-frame-content[data-columns="3"] .unsplash-attachment:nth-child(2) .thumbnail,
+.media-frame-content[data-columns="3"] .unsplash-attachment:nth-child(3) .thumbnail,
+.media-frame-content[data-columns="2"] .unsplash-attachment:nth-child(1) .thumbnail,
+.media-frame-content[data-columns="2"] .unsplash-attachment:nth-child(2) .thumbnail,
+.media-frame-content[data-columns="1"] .unsplash-attachment:nth-child(1) .thumbnail {
+
+	/* offset the images in the first row to ensure focus/active state has space */
+	margin-top: 3px;
+}
+
 @media only screen and (max-width: 900px) {
 
 	.media-frame .unsplash-browser .unsplash-error {