Restore square preview images and Safari fix

Automattic · Feb 27, 2020 · c034682 · c034682
1 parent f804fe3
commit c034682
Showing 1 changed file with 5 additions and 0 deletions.
diff --git a/...ugin/starter-page-templates/page-template-modal/styles/starter-page-templates-editor.scss b/...ugin/starter-page-templates/page-template-modal/styles/starter-page-templates-editor.scss
@@ -204,6 +204,11 @@ body.admin-bar:not( .is-fullscreen-mode ) .page-template-modal-screen-overlay {
 	position: relative;
 	pointer-events: none;
 	opacity: 1;
+	transform: translateZ( 0 ); // Fix for Safari rounded border overflow (2/2).
+
+	@media screen and ( min-width: $breakpoint-mobile ) {
+		padding-top: 100%; // Aspect radio boxes. It will take the 100% of width.
+	}
 
 	&.is-rendering {
 		opacity: 0.5;