diff --git a/public/resources/styles/themes/default.css b/public/resources/styles/themes/default.css
index 3e79da5..e0ebf01 100644
--- a/public/resources/styles/themes/default.css
+++ b/public/resources/styles/themes/default.css
@@ -807,8 +807,7 @@ body {
 	}
 }
 
-/* bruh pls find a fix for this */
-@keyframes article-1 {
+@keyframes article {
 	0% {
 		opacity: 0;
 		scale: 0;
@@ -822,7 +821,9 @@ body {
 	}
 }
 
-@keyframes article-2 {
+/* bruh pls find a fix for this
+right now i have to change the animation to play it */
+@keyframes article-tempfix {
 	0% {
 		opacity: 0;
 		scale: 0;
diff --git a/src/resources/scripts/main.ts b/src/resources/scripts/main.ts
index d8c604f..9218342 100644
--- a/src/resources/scripts/main.ts
+++ b/src/resources/scripts/main.ts
@@ -159,7 +159,7 @@ const article = {
 		const modalContent = document.querySelector(`#article-${articleId} .article-content`) as HTMLElement | null;
 		if (!articleAnimationLock && modal && modalContent) {
 			articleAnimationLock = true;
-			modal.style.animation = 'article-1 0.5s ease-in-out alternate 1';
+			modal.style.animation = '0.5s ease-in-out 1 normal article';
 			modal.style.display = 'flex';
 			modalContent.scroll({ top: 0, left: 0, behavior: 'instant' });
 			modal.addEventListener(
@@ -182,7 +182,7 @@ const article = {
 		const modal = document.querySelector(`#article-${articleId}`) as HTMLElement | null;
 		if (!articleAnimationLock && modal) {
 			articleAnimationLock = true;
-			modal.style.animation = 'article-2 0.5s ease-in-out alternate 1';
+			modal.style.animation = '0.5s ease-in-out 1 reverse article-tempfix';
 			modal.addEventListener(
 				'animationend',
 				() => {