From 35d50b69e870dd0397e04b654c11a0002d4ef041 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tom=C3=A1s=20Santos?= <ts1227.gamer@gmail.com>
Date: Sat, 4 Apr 2026 19:19:23 +0100
Subject: [PATCH] fix: Modify onMounted to use nextTick for DOM updates

Updated onMounted lifecycle hook to wait for DOM updates before initializing particles.
---
 src/content/Backgrounds/Particles/Particles.vue | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/content/Backgrounds/Particles/Particles.vue b/src/content/Backgrounds/Particles/Particles.vue
index ed70345..a72c8c8 100644
--- a/src/content/Backgrounds/Particles/Particles.vue
+++ b/src/content/Backgrounds/Particles/Particles.vue
@@ -3,7 +3,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, onUnmounted, watch, useTemplateRef } from 'vue';
+import { ref, onMounted, onUnmounted, watch, useTemplateRef, nextTick } from 'vue';
 import { Renderer, Camera, Geometry, Program, Mesh } from 'ogl';
 
 interface ParticlesProps {
@@ -296,8 +296,10 @@ const cleanup = () => {
   program = null;
 };
 
-onMounted(() => {
-  initParticles();
+// CHANGED onMounted
+onMounted(async () => {
+  await nextTick(); // wait for Vue to flush its DOM updates first
+  initParticles(); 
 });
 
 onUnmounted(() => {