Improve background

src/layouts/Basic.astro

@@ -23,10 +23,10 @@ const { title, description } = Astro.props
             class="relative flex min-h-screen w-screen flex-col bg-background font-main text-font"
         >
             <div
-                class="absolute h-full w-full bg-contain bg-repeat opacity-20 heropattern-circuitboard-font/10"
+                class="h-full min-h-screen w-full bg-contain bg-repeat heropattern-circuitboard-pattern"
             >
+                <slot />
             </div>
-            <slot />
         </div>
     </body>
 </html>

tailwind.config.cjs

@@ -8,12 +8,13 @@ module.exports = {
         heroPatterns: {
             circuitboard: heropatterns.circuitboard,
         },
-        heroPatternsOpacities: ['10'],
+        heroPatternsOpacities: ['100'],
         heroPatternColors: ['font'],
         colors: {
             background: '#dbf6db',
             'background-dark': '#bbd8bb',
             font: '#000000',
+            pattern: 'rgba(0,0,0,.02)',
         },
         fontFamily: {
             main: ['JetBrainsMono-Regular', 'monospace'],