From a06e34e27201739926887d9b453c6eee8cdb16e6 Mon Sep 17 00:00:00 2001
From: powermaker450 <contact@povario.com>
Date: Thu, 15 Aug 2024 18:47:48 -0400
Subject: [PATCH] Add page enter transition for body and pfp

---
 src/index.css     |  6 +++++-
 src/keyframes.css | 25 ++++++++++++++++++++++++-
 2 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/src/index.css b/src/index.css
index 736dc57..89428fe 100644
--- a/src/index.css
+++ b/src/index.css
@@ -18,6 +18,10 @@
   --text-color: rgb(255, 255, 255);
 }
 
+body {
+  animation: zoom-in 0.3s;
+}
+
 .header {
   margin: 10px auto;
   text-align: center;
@@ -69,6 +73,7 @@
   margin: 0;
   cursor: pointer;
   transition: transform 0.15s;
+  animation: zoom-in-large 0.3s;
 }
 
 .easter-egg-box {
@@ -131,7 +136,6 @@
   transition:
     background-color 0.25s,
     transform 0.25s;
-  animation: fade-in 0.3s;
 }
 
 .social-link-button:hover {
diff --git a/src/keyframes.css b/src/keyframes.css
index 2dcd5cd..23b2a69 100644
--- a/src/keyframes.css
+++ b/src/keyframes.css
@@ -1,6 +1,6 @@
 @keyframes fade-in {
   0% {
-    transform: scale(0.8, 0.8);
+    transform: scale(0.7, 0.7);
     opacity: 0;
   }
 
@@ -10,6 +10,29 @@
   }
 }
 
+@keyframes zoom-in-large {
+  0% {
+    transform: scale(1.5, 1.5);
+    opacity: 0;
+  }
+
+  100% {
+    transform: scale(1, 1);
+    opacity: 1;
+  }
+}
+
+@keyframes zoom-in {
+  0% {
+    transform: scale(1.12, 1.12);
+    opacity: 0;  
+  }
+  100% {
+    transform: scale(1, 1);
+    opacity: 1;
+  }
+}
+
 @keyframes fade-slide-left {
   0% {
     transform: translateX(-30px);