Merge pull request #7 from panoptic-labs/main

latest round of fixes

src/components/HomePage/RecentUpdates.css

@@ -73,6 +73,18 @@
   width: 320px;
   padding: 0 20px;
   cursor: pointer;
+  padding: 5px;
+}
+
+a:hover {
+  text-decoration: none;
+}
+
+.recent-updates__card:hover  .recent-updates__card__image{
+  transform: scale(1.05);
+  cursor: pointer;
+  border-radius: 50px;
+  transition: transform 300ms ease, box-shadow 600ms 60ms ease, border-radius 600ms ease;
 }
 
 .recent-updates__card__content {
@@ -163,6 +175,11 @@
 
   .recent-updates__card {
     width: 100%;
+    /* max-width: 350px; */
+  }
+
+  .recent-updates__card__content {
+    height: auto;
   }
 
   .recent-updates__card__title {

src/components/NewHomePage/LoadingScreen/LoadingScreen.css

@@ -1,3 +1,7 @@
+html, body {
+  overflow-x: hidden;
+}
+
 .loading-logo {
   position: absolute;
   left: 50%;
@@ -19,7 +23,7 @@
 .curtain-left {
   animation: swipe-left 1500ms linear forwards;
 
-	width: 100vw;
+	width: 102vw;
   height: 80vh;
   background-color: #4E14D0;
   transform:skew(315deg);
@@ -62,7 +66,7 @@
   }
 
   100% {
-    transform: translate(-100%, -40%) skew(315deg);
+    transform: translate(-100vw, -40vh) skew(315deg);
   }
 }
 
@@ -76,7 +80,7 @@
   }
 
   100% {
-    transform: translate(100%, 40%);
+    transform: translate(100vw, 40vh);
   }
 }
 

src/components/NewHomePage/PartnerPage/PartnerPage.css

@@ -18,8 +18,10 @@
 
 .investor {
   margin: 0 12.5px 20px 12.5px;
-  height: 56px;
-  width: auto;
+  width: 122px;
+  height: auto;
+  max-height: 56px;
+
   mix-blend-mode: multiply;
   filter: grayscale(100%)
 }

src/components/NewHomePage/TitlePage/TitlePage.css

@@ -45,7 +45,7 @@
   font-size: 92px;
   font-weight: 400;
   color: #4E14D0;
-  line-height: 100%;
+  line-height: 110%;
   margin-bottom: 40px;
 }
 
@@ -63,10 +63,11 @@
 }
 
 .app-screenshot {
-  box-shadow: 0px 4px 180px 3px rgba(0, 0, 0, 0.20);
+  box-shadow: 0px 4px 180px 3px rgba(0, 0, 0, 0.30);
   max-width: 735px;
   width: 40vw;
   height: auto;
+  border-radius: 8px 0px 0px 8px;
 }
 
 .join-button-text {

src/components/NewHomePage/TitlePage/TitlePage.js

@@ -1,6 +1,4 @@
 import "./TitlePage.css"
-import AppScreenshot from '/img/new-home-page/AppScreenshot.png'
-import LaptopMockup from '/img/new-home-page/LaptopMockup.svg'
 import CheckMark from "/img/new-home-page/CheckMark.png"
 import Button from "../Button/Button"
 import Arrow from "/img/new-home-page/Arrow.png"

src/components/other/Footer.js

@@ -65,9 +65,9 @@ const Footer = () => {
             <div className="community-part__title">Community</div>
             <div className="community-part__links">
               <a className="community-part__link" href="https://discord.gg/7fE8SN9pRT" aria-label="Discord" />
-              <a className="community-part__link" href="https://www.linkedin.com/company/panoptic-xyz" aria-label="Linked In" />
               <a className="community-part__link" href="https://twitter.com/panoptic_xyz" aria-label="Twitter" />
               <a className="community-part__link" href="https://t.me/panoptic" aria-label="Telegram" />
+              <a className="community-part__link" href="https://www.linkedin.com/company/panoptic-xyz" aria-label="Linked In" />
             </div>
           </div>
           <div className="more-part">

src/components/other/Sidebar.js

@@ -13,13 +13,13 @@ const Sidebar = ({ isOpenedSidebar, onClose, onToggle }) => {
 
   useEffect(() => {
     if (isOpenedSidebar && isTabletWidth) {
-      document.documentElement.style.overflow = "hidden";
+      document.documentElement.style.overflowY = "hidden";
     } else {
-      document.documentElement.style.overflow = "auto";
+      document.documentElement.style.overflowY = "auto";
     }
 
     return () => {
-      document.documentElement.style.overflow = "auto";
+      document.documentElement.style.overflowY = "auto";
     };
   }, [isTabletWidth, isOpenedSidebar]);
 

src/css/custom.css

@@ -69,6 +69,20 @@ button[class^="clean-btn"] {
   }
 }
 
+html, body {
+  animation: lock-scroll 2300ms;
+}
+
+@keyframes lock-scroll {
+  0% {
+    overflow-y: hidden;
+  }
+
+  100% {
+    overflow-y: hidden;
+  }
+}
+
 body[data-is_landing_page="true"] nav[aria-label="Main"],
 body[data-is_landing_page="true"] footer:not(.custom-footer) {
   display: none;

src/pages/index.js

@@ -17,6 +17,10 @@ import LoadingScreen from '../components/NewHomePage/LoadingScreen/LoadingScreen
 export default function Home() {
   const { siteConfig } = useDocusaurusContext();
 
+  window.onunload = () => {
+    window.scrollTo(0, 0);
+  }
+
   useEffect(() => {
     document.body.dataset.is_landing_page = true;