diff --git a/src/App.vue b/src/App.vue
index d6e1430..8d44dae 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -3,21 +3,36 @@ import NavBar from '@/components/Navbar/NavBar.vue'
 </script>
 
 <template>
-  <NavBar />
+  <n-config-provider>
+    <n-message-provider>
+      <n-dialog-provider>
+        <n-notification-provider>
+          <NavBar />
 
-  <n-grid responsive="screen" item-responsive cols="24" :x-gap="16" :y-gap="16" class="shift">
-    <n-gi span="xs:1 s:1 m:2 l:2 xl:3 xxl:3" />
+          <n-grid
+            responsive="screen"
+            item-responsive
+            cols="24"
+            :x-gap="16"
+            :y-gap="16"
+            class="shift"
+          >
+            <n-gi span="xs:1 s:1 m:2 l:2 xl:3 xxl:3" />
 
-    <n-gi span="xs:22 s:22 m:20 l:20 xl:18 xxl:18">
-      <router-view />
-    </n-gi>
+            <n-gi span="xs:22 s:22 m:20 l:20 xl:18 xxl:18">
+              <router-view />
+            </n-gi>
 
-    <n-gi span="xs:1 s:1 m:2 l:2 xl:3 xxl:3" />
-  </n-grid>
+            <n-gi span="xs:1 s:1 m:2 l:2 xl:3 xxl:3" />
+          </n-grid>
+        </n-notification-provider>
+      </n-dialog-provider>
+    </n-message-provider>
+  </n-config-provider>
 </template>
 
 <style scoped>
-.shift{
+.shift {
   padding-top: 10px;
 }
 </style>