Overall design changes

Author: zlrundefined

src/components/home/Banner.vue

@@ -1,7 +1,7 @@
 <template>
 	<!-- Banner start -->
 	<section
-		class="flex flex-col sm:justify-between items-center sm:flex-row mt-8 sm:mt-20"
+		class="flex flex-col sm:justify-between items-center sm:flex-row mt-12 sm:mt-20"
 	>
 		<div class="w-full sm:w-1/3 text-left">
 			<h1
@@ -17,7 +17,7 @@
 			<div class="flex justify-center sm:block">
 				<a
 					href="#"
-					class="flex justify-center items-center w-36 sm:w-48 mt-10 mb-6 sm:mb-0 text-lg border border-indigo-200 dark:border-ternary-dark py-2.5 sm:py-3 shadow-lg rounded-xl bg-indigo-50 hover:bg-indigo-500 text-gray-500 hover:text-white"
+					class="flex justify-center items-center w-36 sm:w-48 mt-12 mb-6 sm:mb-0 text-lg border border-indigo-200 dark:border-ternary-dark py-2.5 sm:py-3 shadow-lg rounded-xl bg-indigo-50 hover:bg-indigo-500 text-gray-500 hover:text-white"
 				>
 					<i
 						data-feather="arrow-down-circle"

src/components/project/SingleProjectInfo.vue

@@ -58,27 +58,33 @@
 				</p>
 				<div class="flex items-center gap-3 mt-5">
 					<a
-						href="#"
+						href="https://twitter.com/NangialaiStoman"
+						target="__blank"
 						class="bg-ternary-light dark:bg-ternary-dark text-gray-400 hover:text-primary-dark dark:hover:text-primary-light p-2 rounded-lg shadow-sm"
 						><i data-feather="twitter" class="w-5 h-5"></i
 					></a>
 					<a
-						href="#"
+						href="https://instagram.com/NangialaiStoman"
+						target="__blank"
 						class="bg-ternary-light dark:bg-ternary-dark text-gray-400 hover:text-primary-dark dark:hover:text-primary-light p-2 rounded-lg shadow-sm"
-						><i data-feather="facebook" class="w-5 h-5"></i
+						><i data-feather="instagram" class="w-5 h-5"></i
 					></a>
 					<a
-						href="#"
+						href="https://facebook.com/nangialai.stoman"
+						target="__blank"
 						class="bg-ternary-light dark:bg-ternary-dark text-gray-400 hover:text-primary-dark dark:hover:text-primary-light p-2 rounded-lg shadow-sm"
-						><i data-feather="instagram" class="w-5 h-5"></i
+						><i data-feather="facebook" class="w-5 h-5"></i
 					></a>
+
 					<a
-						href="#"
+						href="https://linkedin.com/"
+						target="__blank"
 						class="bg-ternary-light dark:bg-ternary-dark text-gray-400 hover:text-primary-dark dark:hover:text-primary-light p-2 rounded-lg shadow-sm"
 						><i data-feather="linkedin" class="w-5 h-5"></i
 					></a>
 					<a
-						href="#"
+						href="https://www.youtube.com/c/StomanStudio"
+						target="__blank"
 						class="bg-ternary-light dark:bg-ternary-dark text-gray-400 hover:text-primary-dark dark:hover:text-primary-light p-2 rounded-lg shadow-sm"
 						><i data-feather="youtube" class="w-5 h-5"></i
 					></a>

src/components/shared/Footer.vue

@@ -7,39 +7,44 @@
 				Follow me
 			</p>
 			<ul class="flex gap-4 sm:gap-8">
-				<li
+				<a
+					href="https://github.com/NangialaiStoman"
+					target="__blank"
 					class="text-gray-400 hover:text-indigo-500 dark:hover:text-indigo-400 cursor-pointer rounded-lg bg-gray-50 dark:bg-ternary-dark hover:bg-gray-100 shadow-sm∫ p-4"
 				>
 					<i data-feather="github" class="w-6 sm:w-8 h-6 sm:h-8"></i>
-				</li>
-				<li
+				</a>
+				<a
+					href="https://twitter.com/NangialaiStoman"
+					target="__blank"
 					class="text-gray-400 hover:text-indigo-500 dark:hover:text-indigo-400 cursor-pointer rounded-lg bg-gray-50 dark:bg-ternary-dark hover:bg-gray-100 shadow-sm∫ p-4"
 				>
 					<i data-feather="twitter" class="w-6 sm:w-8 h-6 sm:h-8"></i>
-				</li>
-				<li
+				</a>
+				<a
+					href="https://instagram.com/NangialaiStoman"
+					target="__blank"
 					class="text-gray-400 hover:text-indigo-500 dark:hover:text-indigo-400 cursor-pointer rounded-lg bg-gray-50 dark:bg-ternary-dark hover:bg-gray-100 shadow-sm∫ p-4"
 				>
 					<i
 						data-feather="instagram"
 						class="w-6 sm:w-8 h-6 sm:h-8"
 					></i>
-				</li>
-				<li
+				</a>
+				<a
+					href="https://behance.net/NangialaiStoman"
+					target="__blank"
 					class="text-gray-400 hover:text-indigo-500 dark:hover:text-indigo-400 cursor-pointer rounded-lg bg-gray-50 dark:bg-ternary-dark hover:bg-gray-100 shadow-sm∫ p-4"
 				>
-					<i
-						data-feather="dribbble"
-						class="w-6 sm:w-8 h-6 sm:h-8"
-					></i>
-				</li>
+					<i data-feather="feather" class="w-6 sm:w-8 h-6 sm:h-8"></i>
+				</a>
 			</ul>
 		</div>
 		<div class="flex justify-center items-center text-center">
 			<div class="text-lg text-ternary-dark dark:text-ternary-light">
 				&copy; Copyright 2021.
 				<a
-					href="https://stoman.me"
+					href="http://stoman.me"
 					target="__blank"
 					class="text-secondary-dark dark:text-secondary-light font-medium"
 					>Stoman</a