move background & update position and overlay styles

BrandonWingerAir · Jan 19, 2024 · ae9cc6d · ae9cc6d
1 parent 35c4411
commit ae9cc6d
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 10 deletions.
diff --git a/app.vue b/app.vue
@@ -2,12 +2,4 @@
   <NuxtLayout>
     <NuxtPage></NuxtPage>
   </NuxtLayout>
-</template>
-
-<style>
-body {
-  background: linear-gradient(rgba(0, 0, 0, 0.85),rgba(0, 0, 0, 0.85)), url('/video-game-system.jpg');
-  background-size: cover;
-  background-repeat: no-repeat;
-}
-</style>
+</template>
diff --git a/pages/index.vue b/pages/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="background-img">
     <div class="flex flex-col">
       <div class="bg-red-500 pt-6 border-b border-neutral-400">
         <div class="mb-7 text-center">
@@ -75,6 +75,13 @@ const hideSuggestions = ref(true);
 </script>
 
 <style>
+.background-img {
+  background: linear-gradient(rgba(65, 65, 65, 0.35),rgba(125, 125, 125, 0.35)), url('/video-game-system.jpg');
+  background-size: cover;
+  background-repeat: no-repeat;
+  background-position: 100% 50%;
+}
+
 .min-content-height {
   min-height: 832px;
 }