Change header and footer cmpnts with App prefix

Author: realstoman

src/App.vue

@@ -1,7 +1,7 @@
 <template>
 	<div :class="appTheme" class="pt-0.5">
 		<!-- App header -->
-		<Header></Header>
+		<AppHeader />
 
 		<!-- Render active component contents with transition -->
 		<transition name="fade" mode="out-in">
@@ -18,19 +18,19 @@
 		</back-to-top>
 
 		<!-- App footer -->
-		<Footer></Footer>
+		<AppFooter />
 	</div>
 </template>
 
 <script>
 import feather from 'feather-icons';
-import Header from './components/shared/Header';
-import Footer from './components/shared/Footer';
+import AppHeader from './components/AppHeader';
+import AppFooter from './components/AppFooter';
 
 export default {
 	components: {
-		Header,
-		Footer,
+		AppHeader,
+		AppFooter,
 	},
 	data: () => {
 		return {

src/components/shared/Footer.vue renamed to src/components/AppFooter.vue

@@ -11,13 +11,13 @@
 					<router-link to="/"
 						><img
 							v-if="theme === 'light'"
-							src="../../assets/images/logo-dark.svg"
+							src="@/assets/images/logo-dark.svg"
 							class="w-36"
 							alt="Dark Logo"
 						/>
 						<img
 							v-else
-							src="../../assets/images/logo-light.svg"
+							src="@/assets/images/logo-light.svg"
 							class="w-36"
 							alt="Light Logo"
 						/>
@@ -254,7 +254,7 @@
 </template>
 
 <script>
-import ThemeSwitcher from '../ThemeSwitcher';
+import ThemeSwitcher from '@/components/ThemeSwitcher';
 import feather from 'feather-icons';
 
 export default {