fixed all blur effects

3 files changed, 26 insertions, 28 deletions

diff --git a/src/css/ghrepo.css b/src/css/ghrepo.css
index acdcb6fe..4496f66f 100644
--- a/src/css/ghrepo.css
+++ b/src/css/ghrepo.css
@@ -28,24 +28,36 @@
 
 
 body {
-    display: flex;
-    align-items: center;
-    justify-content: center;
     margin: 0;
     margin-top: (3em);
     font-family: 'Open Sans', sans-serif;
+}
+
+main {
+  margin-top: 3em
+}
+
+.bgWrap {
+      overflow: hidden;
+    top: 0;
+    left: 0;
+    margin: 0;
+    padding: 0;
+    width: 100%;
+    height: 100%;
     background-color: rgb(48, 60, 100);
     background-image: url(/images/heigh-grass.jpg);
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
+    align-items: center;
+    display: flex;
+    justify-content: center;
+    color: #F4E8C1;
+    z-index: 1;
     font-size: 16px;
 }
 
-main {
-  margin-top: 3em
-}
-
 .container {
     display: flex;
     justify-content: center;
@@ -55,9 +67,7 @@ main {
     width: 90%;
     max-width: 1280px;
     /* background: transparent; */
-    background-position: center;
-    background-repeat: no-repeat;
-    background-size: cover;
+    position: center;
 }
 
 .container small, h1 {
@@ -212,11 +222,11 @@ input:active,
     flex-wrap: wrap;
     justify-content: center;
     background: rgba(128, 128, 128, 0.2);
-    /* backdrop-filter:     -webkit-filter: blur(32px);
     -moz-filter: blur(32px);
     -o-filter: blur(32px);
     -ms-filter: blur(32px);
-    blur(2px); */
+    -webkit-backdrop-filter: blur(32px);
+    backdrop-filter: blur(32px);
     margin-top: 0;
     padding: 2em;
     /* border-bottom-left-radius: 20px; */
@@ -260,7 +270,6 @@ h3 {
     padding: 1em;
     text-align: center;
     background: transparent;
-    -webkit-filter: blur(20px);
     -moz-filter: blur(20px);
     -o-filter: blur(20px);
     -ms-filter: blur(20px);
@@ -312,7 +321,6 @@ h3 {
 
 .intro:hover,
 .user-info:hover {
-  -webkit-filter: blur(8px);
   -moz-filter: blur(8px);
   -o-filter: blur(8px);
   -ms-filter: blur(8px);
@@ -325,7 +333,6 @@ h3 {
 .user-info {
   /* background: transparent; */
   background: rgba(128, 128, 128, 0.2);
-  -webkit-filter: blur(2px);
   -moz-filter: blur(2px);
   -o-filter: blur(2px);
   -ms-filter: blur(2px);
@@ -352,7 +359,6 @@ h3 {
 }
 
 .repo {
-    -webkit-filter: blur(20px);
     -moz-filter: blur(20px);
     -o-filter: blur(20px);
     -ms-filter: blur(20px);
diff --git a/src/css/index.css b/src/css/index.css
index 05b0d2c1..1f1e240c 100644
--- a/src/css/index.css
+++ b/src/css/index.css
@@ -75,7 +75,10 @@
     height: 100%;
     border: 1px solid rgba(255,255,255, .15);
     border-radius: 1em;
-    -webkit-backdrop-filter: blur(16px);
+    -moz-filter: blur(16px);
+    -o-filter: blur(16px);
+    -ms-filter: blur(16px);
+     -webkit-backdrop-filter: blur(16px);
     backdrop-filter: blur(16px);
     box-shadow: 0 0 10mm rgba(0,0,0,1);
     display: flex;
diff --git a/src/css/style.css b/src/css/style.css
index f027cbf2..c5d35704 100644
--- a/src/css/style.css
+++ b/src/css/style.css
@@ -92,15 +92,6 @@ body::-webkit-scrollbar {
     backdrop-filter: blur(32px);
     transform: scale(2);
   }
-  100% {
-    -webkit-filter: blur(0px);
-    -moz-filter: blur(0px);
-    -o-filter: blur(0px);
-    -ms-filter: blur(0px);
-    -webkit-backdrop-filter: blur(0px);
-    backdrop-filter: blur(0px);
-    transform: scale(1);
-  }
 }
 
 /* animation: name duration timing-function delay iteration-count direction fill-mode; */
@@ -226,7 +217,6 @@ header {
 .navBar a:hover {
   /* background: rgba(255, 255, 255, 0.2); */
   /* outline: ridge rgba(128, 128, 128, .6); */
-  -webkit-filter: blur(5px);
   -moz-filter: blur(5px);
   -o-filter: blur(5px);
   -ms-filter: blur(5px);
@@ -255,7 +245,6 @@ header:hover,
 #navBarHeader:active
 {
   transform: scale(1.005);
-  -webkit-filter: blur(5px);
   -moz-filter: blur(5px);
   -o-filter: blur(5px);
   -ms-filter: blur(5px);