Added grain background texture

skyeto · Jan 4, 2024 · 2ec188d · 2ec188d
1 parent 272df87
commit 2ec188d
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 5 deletions.
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
@@ -112,9 +112,10 @@ const { title, description, pubDate } = Astro.props;
     font-family: "Roboto Slab", system-ui, sans-serif;
     background-color: var(--background);
     /*background: linear-gradient(339deg, rgba(28,28,32,1) 0%, rgba(42,42,48,1) 100%);*/
-    background-attachment: fixed;
-    background-repeat: no-repeat;
-
+    background-attachment: scroll;
+    background-repeat: repeat;
+    background-size: 800px 800px;
+background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.dev/svgjs' viewBox='0 0 700 700' width='700' height='700' opacity='0.05'%3E%3Cdefs%3E%3Cfilter id='nnnoise-filter' x='-20%25' y='-20%25' width='140%25' height='140%25' filterUnits='objectBoundingBox' primitiveUnits='userSpaceOnUse' color-interpolation-filters='linearRGB'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.125' numOctaves='4' seed='15' stitchTiles='stitch' x='0%25' y='0%25' width='100%25' height='100%25' result='turbulence'%3E%3C/feTurbulence%3E%3CfeSpecularLighting surfaceScale='15' specularConstant='1.3' specularExponent='20' lighting-color='%237957A8' x='0%25' y='0%25' width='100%25' height='100%25' in='turbulence' result='specularLighting'%3E%3CfeDistantLight azimuth='3' elevation='39'%3E%3C/feDistantLight%3E%3C/feSpecularLighting%3E%3CfeColorMatrix type='saturate' values='0' x='0%25' y='0%25' width='100%25' height='100%25' in='specularLighting' result='colormatrix'%3E%3C/feColorMatrix%3E%3C/filter%3E%3C/defs%3E%3Crect width='700' height='700' fill='transparent'%3E%3C/rect%3E%3Crect width='700' height='700' fill='%237957a8' filter='url(%23nnnoise-filter)'%3E%3C/rect%3E%3C/svg%3E");
     color: var(--body);
   }
 
@@ -125,6 +126,7 @@ const { title, description, pubDate } = Astro.props;
     mix-blend-mode: luminosity;
     background-blend-mode: luminosity;
 
+
     /*color: #00b5e2;
     background-image: linear-gradient(90deg, rgba(0,181,226,1) 0%, rgba(68,224,255,1) 100%);
     -webkit-background-clip: text;

diff --git a/src/pages/index.astro b/src/pages/index.astro
@@ -21,8 +21,7 @@ const posts = await Astro.glob("./p/*.{md,mdx}");
       <div class="w-full text-base text-center">
         <a href="https://twitter.com/skyetothefox" class="hover:text-cyan-300">twitter</a> |
         <a href="https://github.com/skyeto" class="hover:text-gray-300">github</a> |
-        <a href="https://keybase.io/skyeto" class="hover:text-orange-300">keybase</a> |
-        <a href="https://discord.gg/gfc2mZpfaz" class="hover:text-purple-300">discord</a>
+        <a href="https://keybase.io/skyeto" class="hover:text-orange-300">keybase</a>
       </div>
     </p>