💄 improve text visibility in browse section (#38)

uwu-labs · Oct 25, 2023 · fdb112e · fdb112e
1 parent affce9f
commit fdb112e
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 0 deletions.
diff --git a/src/components/Browse.css b/src/components/Browse.css
@@ -38,6 +38,17 @@
   z-index: 2;
 }
 
+.browse-highlight {
+  position: absolute;
+  bottom: -5rem;
+  left: 6rem;
+  width: 50%;
+  height: 50%;
+  background: rgba(255, 255, 255, 0.4);
+  border-radius: 50%;
+  filter: blur(200px);
+}
+
 .browse-header {
   color: var(--main);
   font-size: 8.8rem;

diff --git a/src/components/Browse.tsx b/src/components/Browse.tsx
@@ -97,6 +97,7 @@ const Browse = () => {
     <Section id="browse">
       <div className="browse" ref={containerRef}>
         <div className="browse-content" style={fixedStyles}>
+          <div className="browse-highlight" />
           <h2 className="browse-header">Browse anime art from the community</h2>
           <Button
             link="https://uwucrew.art/derivatives"