From 551e6cbd0eef983662ee4a718a6543b4beae7c55 Mon Sep 17 00:00:00 2001
From: timothypidashev <pidashev.tim@gmail.com>
Date: Thu, 15 Jul 2021 04:24:38 +0000
Subject: [PATCH] update

---
 components/Background.vue | 14 -------------
 pages/index.vue           | 42 ++++++++++++++++++++++++++++++++++-----
 2 files changed, 37 insertions(+), 19 deletions(-)
 delete mode 100644 components/Background.vue

diff --git a/components/Background.vue b/components/Background.vue
deleted file mode 100644
index e9aab4b..0000000
--- a/components/Background.vue
+++ /dev/null
@@ -1,14 +0,0 @@
-<template>
-  <div>
-    <div class="backgroundImage" :style="{ backgroundImage: `url(${backgroundImagePath})` }">
-  </div>
-</template>
-
-<script>
-import backgroundImagePath from '~/assets/background.jpg'
-export default {
-  data() {
-    return { backgroundImagePath }
-  }
-}
-</script>
\ No newline at end of file
diff --git a/pages/index.vue b/pages/index.vue
index 4a2a3ec..c029449 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -1,7 +1,6 @@
 <template>
   <div class="container">
     <div>
-      <Background />
       <h1 class="title">
         Timothy Pidashev
       </h1>
@@ -32,6 +31,12 @@
 
 <style>
 .container {
+  background-color: transparent !important;
+  background-image: linear-gradient(to bottom, #200933 75%, #3d0b43);
+  background-size: auto 100vh;
+  background-position: top;
+  background-repeat: no-repeat;
+  position: relative;
   margin: 0 auto;
   min-height: 100vh;
   display: flex;
@@ -39,19 +44,46 @@
   align-items: center;
   text-align: center;
 }
+.container:after{
+  content:'';
+  height:300px;
+  width:100%;
+  display:block;
+  background-image:linear-gradient(90deg, rgba(252,25,154,.1) 1px, rgba(0,0,0,0) 1px), linear-gradient(0deg, rgba(252,25,154,.1) 1px, rgba(0,0,0,0) 1px);
+  background-position:bottom;
+  background-repeat:repeat;
+  background-size:20px 20px;
+  left: -25px;
+  position: fixed;
+  pointer-events: none;
+  bottom: 0;
+  transform: perspective(100px) rotateX(60deg);
+  z-index: 0;
+}
+.container::backdrop {
+    background-image: repeating-linear-gradient(to bottom, transparent 0 ,transparent 2px, #FFF 2px, #FFF 4px);
+    background-size: 100% 4px cover;
+    transform-origin: 50% 50%;
+    content: '';
+    opacity: 0.02;
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+}
 .title {
-  font-family: 'Quicksand', 'Source Sans Pro', -apple-system, BlinkMacSystemFont,
-    'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+  font-family: 'New_Zelek' 'Arial';
   display: block;
   font-weight: 300;
   font-size: 100px;
-  color: #35495e;
+  color: #FF2965;
   letter-spacing: 1px;
 }
 .subtitle {
   font-weight: 300;
   font-size: 42px;
-  color: #526488;
+  color: #FF2965;
   word-spacing: 5px;
   padding-bottom: 15px;
 }