fix intra page 2

Signed-off-by: Rajesh-Nagarajan-11 <rajeshnagarajan36@gmail.com>

Author: Rajesh-Nagarajan-11

src/components/handbook-navigation/intra-page.js

@@ -3,28 +3,33 @@ import { Link } from "gatsby";
 import styled from "styled-components";
 
 const JoinCommunityWrapper = styled.div`
-  @media screen and (min-width: 300px) and (max-width: 1279px) {
+  position: fixed;
+  right: 2rem;
+  top: 15rem;
+  width: 15rem;
+  z-index: 10;
+
+  @media screen and (max-width: 1279px) {
     display: none;
   }
+
   .intra-page {
     position: sticky;
     top: 10rem;
-    right: 0rem;
-    margin-right: 1rem;
     padding-bottom: 5rem;
-    padding-right: 2rem;
     align-items: left;
     justify-content: space-around;
     display: flex;
     flex-direction: column;
     overflow: hidden;
 
     .list {
-      color: #000000;
+      color: ${(props) => props.theme.text || "#000000"};
+      transition: 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
     }
     .active {
-      font-weight: 5000;
-      color: #000000;
+      font-weight: 500;
+      color: ${(props) => props.theme.secondaryColor || "#00b39f"};
     }
 
     ul {
@@ -39,7 +44,7 @@ const JoinCommunityWrapper = styled.div`
       padding-right: 0rem;
       margin-right: 0rem;
     }
-    @media only screen and (max-width: 950px) {
+    @media only screen and (max-width: 1279px) {
       width: 0;
       opacity: 0;
       height: 0;

src/sections/Community/Handbook/handbook-single/index.js

@@ -30,6 +30,7 @@ const HandbookSingle = ({ data, children }) => {
         <h1>{mdx.frontmatter.title}</h1>
       </div>
       <HandbookTOC pages={allHandbookPages.nodes} currentSlug={currentSlug} />
+      {intraPageComponent}
       <div className="page-section">
         <Container>
           <div className="content">
@@ -40,7 +41,6 @@ const HandbookSingle = ({ data, children }) => {
             currentSlug={currentSlug}
           />
         </Container>
-        {intraPageComponent}
       </div>
     </HandbookWrapper>
   );