src/App.vue

@@ -17,9 +17,13 @@ limitations under the License.
 <script setup>
 import Navbar from './features/nav/components/Navbar.vue';
 import Footer from './features/footer/components/Footer.vue';
+import { ref, provide } from 'vue';
+const isDark = ref(false);
+provide('isDark', isDark);
 </script>
 
 <template>
+    <div :class="{ dark: isDark }">
         <Navbar />
 
         <div class="main-content">
@@ -27,6 +31,7 @@ import Footer from './features/footer/components/Footer.vue';
         </div>
 
         <Footer />
+    </div>
 </template>
 
 <style scoped>