Adding a Spread & Bottom Reflect to the Images

NewmanAdesan · Dec 15, 2023 · d8b69ee · d8b69ee
1 parent 8ca2a27
commit d8b69ee
Showing 1 changed file with 3 additions and 1 deletion.
diff --git a/styles.css b/styles.css
@@ -9,6 +9,7 @@ img {
  width: 200px;
  height: 200px;
  object-fit: cover;
+ user-select: none;
 }
 
 body {
@@ -37,5 +38,6 @@ body {
  height: 100%;
  transform-origin: center;
  transform-style: preserve-3d;
- transform: rotateY(calc(var(--i) * 45deg))
+ transform: rotateY(calc(var(--i) * 45deg)) translateZ(300px);
+ -webkit-box-reflect: below 0px linear-gradient(transparent, transparent, #0004);
 }