Added a block on the right side, does not work with resizing yet

WISVCH · Dec 4, 2023 · c24fbdf · c24fbdf
1 parent 1168cc0
commit c24fbdf
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 3 deletions.
diff --git a/src/components/photos/index.tsx b/src/components/photos/index.tsx
@@ -58,11 +58,13 @@ export const Photos: FunctionalComponent = () => {
                 class={style.gallery}
                 onClick={() => (shouldAnimate.current = false)}
             >
-                <div class={style.block}></div>
-                
+                <div class={style.blockleft}></div>
+
                 {photosMap.map((url) => (
                     <Photo url={url} />
                 ))}
+
+                <div class={style.blockright}></div>
             </div>
         </section>
     );

diff --git a/src/components/photos/style.scss b/src/components/photos/style.scss
@@ -20,7 +20,7 @@
     }
 }
 
-.block {
+.blockleft {
     position: absolute; 
     margin-top: -120px;
     margin-left: 120px;
@@ -32,6 +32,18 @@
     transform: rotate(-90deg);
   }
 
+.blockright {
+    position: absolute; 
+    margin-top: -120px;
+    margin-left: 775px;
+    display: block;
+    width: 260px; 
+    height: 500px; 
+    background: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, 0.00) 50%);
+    z-index: 2; 
+    transform: rotate(90deg);
+  }
+
 
 .gallery {
     display: flex;