Might make clip path working in Safari

backdrop-contrib · Jun 10, 2021 · 0a522b8 · 0a522b8
1 parent e21d9ad
commit 0a522b8
Showing 1 changed file with 5 additions and 1 deletion.
diff --git a/css/gallery-tiler-media.css b/css/gallery-tiler-media.css
@@ -205,6 +205,7 @@
   grid-template-columns: repeat(4, 1fr);
 }
 .gallery-tiler-circles .field-item {
+  -webkit-clip-path: circle();
   clip-path: circle();
 }
 .gallery-tiler-circles .tile-1 {
@@ -223,9 +224,11 @@
   grid-template-columns: repeat(5, 1fr);
 }
 .gallery-tiler-octagon .field-item {
-  clip-path: polygon(25% 0, 0 25%,0 75%, 25% 100%, 75% 100%, 100% 75%,100% 25%, 75% 0%);
+  -webkit-clip-path: polygon(25% 0, 0 25%, 0 75%, 25% 100%, 75% 100%, 100% 75%, 100% 25%, 75% 0%);
+  clip-path: polygon(25% 0, 0 25%, 0 75%, 25% 100%, 75% 100%, 100% 75%, 100% 25%, 75% 0%);
 }
 .gallery-tiler-octagon .tile-2 {
+  -webkit-clip-path: none;
   clip-path: none;
   grid-column: 2 / 4;
   grid-row: 1 / 3;
@@ -239,6 +242,7 @@
   padding-bottom: var(--height);
 }
 .gallery-tiler-hexagon .field-item {
+  -webkit-clip-path: polygon(25% 0, 0 50%, 25% 100%, 75% 100%, 100% 50%, 75% 0%);
   clip-path: polygon(25% 0, 0 50%, 25% 100%, 75% 100%, 100% 50%, 75% 0%);
   transform: scale(1.33);
   margin-top: calc(var(--height) / 4);