Prettier

src/index.css

@@ -48,7 +48,7 @@ body {
 
 .hidden-animate {
   display: none;
-  animation: hide-animation 0.5s
+  animation: hide-animation 0.5s;
 }
 
 .slide-right {
@@ -87,7 +87,7 @@ body {
 .easter-egg {
   text-align: center;
   margin: auto 20px;
-  animation: fade-slide-left 0.5s
+  animation: fade-slide-left 0.5s;
 }
 
 .profile-picture:hover {

src/keyframes.css

@@ -25,7 +25,7 @@
 @keyframes zoom-in {
   0% {
     transform: scale(1.12, 1.12);
-    opacity: 0;  
+    opacity: 0;
   }
   100% {
     transform: scale(1, 1);

src/pages/Main.tsx

@@ -55,18 +55,29 @@ export function Main() {
   const [timesClicked, changeTimesClicked] = useState(0);
   const handlePictureClick = () => {
     changeTimesClicked((timesClicked) => timesClicked + 1);
-  }
+  };
   const checkTimesClicked = () => {
     return timesClicked >= 10;
-  }
+  };
 
   return (
     <>
       <Header links={links} />
 
       <div className="easter-egg-box">
-        <img className={checkTimesClicked() ? "profile-picture slide-right" : "profile-picture"} onClick={handlePictureClick} height={130} src="/potato.png" />
-        <p className={checkTimesClicked() ? "easter-egg" : "easter-egg hidden"}>Stop that!</p>
+        <img
+          className={
+            checkTimesClicked()
+              ? "profile-picture slide-right"
+              : "profile-picture"
+          }
+          onClick={handlePictureClick}
+          height={130}
+          src="/potato.png"
+        />
+        <p className={checkTimesClicked() ? "easter-egg" : "easter-egg hidden"}>
+          Stop that!
+        </p>
       </div>
 
       <div className="head">