events table sort/filter, menu polish, rtd page polish, dc week blurb

devcon/cms/pages/index.mdx

@@ -79,6 +79,9 @@ section5:
   title: |
     ## **Devcon Archive**
   button: View Full Archive →
+devcon_week:
+  body: "Devcon is a 4-day conference, all in one venue, happening between **12-15 November**. But as usual,\_**Devcon Week will span the entire week of November 9-17**, with events before and after Devcon, and side events during the nights, organized by the local and global Ethereum community.\n"
+  title: ''
 _template: index
 ---
 

devcon/src/components/common/layouts/header/useNavigationData.ts

@@ -260,11 +260,6 @@ const useNavigationData = () => {
           url: '/about',
           type: 'page',
         },
-        {
-          title: 'Get Involved',
-          url: '/dips',
-          type: 'page',
-        },
         {
           title: intl('navigation_forum'),
           url: 'https://forum.devcon.org/',
@@ -275,6 +270,11 @@ const useNavigationData = () => {
           url: '/blogs',
           type: 'page',
         },
+        {
+          title: 'Devconnect',
+          url: 'https://devconnect.org',
+          type: 'link',
+        },
         {
           title: intl('navigation_archive'),
           url: 'https://archive.devcon.org/archive/',

devcon/src/components/common/sort/Sort.tsx

@@ -73,7 +73,7 @@ export const useSort = (
   data: any[],
   fields: Field[],
   initialSort = 0,
-  resetOnThirdClick = true,
+  resetOnThirdClick = false,
   defaultDirection: 'asc' | 'desc' = 'asc'
 ): SortState => {
   const [sortBy, setSortBy] = React.useState<number>(initialSort)

devcon/src/components/domain/index/hero/Hero.tsx

@@ -29,7 +29,6 @@ import { motion, useSpring, useScroll } from 'framer-motion'
 
 import DC7OverlayLeft from './images/dc-7/overlay-left-dc7.png'
 import DC7OverlayRight from './images/dc-7/overlay-right-dc7.png'
-import DC7OverlayRightLeftAligned from './images/dc-7/overlay-right-dc7-left-aligned.png'
 import DC7Logo from './images/dc-7/logo.png'
 import DC7Left from './images/dc-7/left.png'
 // import DC7Left from 'assets/images/dc-7/logo-flowers.png'
@@ -264,12 +263,12 @@ export const Hero = () => {
                   <Butterflies2 />
                 </div>
                 <Image className={`${css['dc7-logo-text']} `} src={DC7OverlayRight} alt="Event location" priority />
-                <Image
+                {/* <Image
                   className={`${css['dc7-logo-text']} ${css['mobile']}`}
                   src={DC7OverlayRightLeftAligned}
                   alt="Event location"
                   priority
-                />
+                /> */}
               </div>
             </div>
           </div>

devcon/src/components/domain/index/hero/hero.module.scss

@@ -305,17 +305,6 @@ $logo-offset: 50px;
   height: 100%;
 }
 
-.clouds {
-  position: relative;
-  background-image: url('./images/clouds.png');
-  background-size: auto max(100px, 11%);
-  background-position: center bottom;
-  background-repeat: repeat-x;
-  bottom: 0px;
-  height: 100%;
-  width: 100%;
-}
-
 .date-calendar {
   display: flex;
   flex-direction: column;
@@ -1093,13 +1082,13 @@ $logo-offset: 50px;
       filter: drop-shadow(0px 0px 2px #000000);
       object-fit: cover;
 
-      &.mobile {
-        display: none !important;
+      // &.mobile {
+      //   display: none !important;
 
-        @media (max-width: $breakpoints-lg) {
-          display: block !important;
-        }
-      }
+      //   @media (max-width: $breakpoints-lg) {
+      //     display: block !important;
+      //   }
+      // }
 
       @media (max-width: $breakpoints-lg) {
         display: none;

devcon/src/pages/index.tsx

@@ -80,10 +80,13 @@ const videos = [
   },
 ]
 
-export const RoadToDevconGrants = ({ pages }: any) => {
+export const RoadToDevconGrants = ({ pages, down }: any) => {
   return (
-    <div className="flex-col md:flex-row flex relative pt-12 mb-8 gap-8 items-center">
-      <div className={`${css['scrolling-text-background']} ${css['alternate']}`}>
+    <div className="flex-col md:flex-row flex relative pt-12 gap-8 items-center">
+      <div
+        className={`${css['scrolling-text-background']} ${down ? '' : css['alternate']}`}
+        data-type="scrolling-background"
+      >
         <InfiniteScroller nDuplications={2} reverse speed="150s">
           <p className="bold rotate-x-180">ROAD TO DEVCON&nbsp;</p>
         </InfiniteScroller>
@@ -226,6 +229,11 @@ export default pageHOC(function Index(props: any) {
               </div>
             </div>
           </div>
+
+          <div className="relative flex flex-col items-start mb-8 pb-8 border-bottom gap-8 xl:gap-6">
+            <RichText content={pages.devcon_week?.body}></RichText>
+          </div>
+
           <div className="relative flex flex-col items-start pb-20 border-bottom gap-8 xl:gap-6">
             <div className={`${css['scrolling-text-background']}`}>
               <InfiniteScroller nDuplications={2} speed="120s">
@@ -280,7 +288,9 @@ export default pageHOC(function Index(props: any) {
             </Link>
           </div>
 
-          <RoadToDevconGrants pages={pages} />
+          <div className="mb-4">
+            <RoadToDevconGrants pages={pages} />
+          </div>
           {/* <div className="flex-col md:flex-row flex relative pt-12 mb-8 pb-8 gap-8 border-bottom items-center">
             <div className={`${css['scrolling-text-background']} ${css['alternate']}`}>
               <InfiniteScroller nDuplications={2} reverse speed="150s">

devcon/src/pages/road-to-devcon.module.scss

@@ -39,6 +39,16 @@
 
 .content {
     --custom-fade-color: rgb(202, 202, 255);
+
+    @media (min-width: 1000px) {
+      [data-type="scrolling-background"] {
+        mask-image: linear-gradient(to right, 
+        transparent, 
+        black 65%, 
+        black 90%, 
+        transparent) !important;
+      }
+    }
 }
 
 .drag-to-continue {
@@ -138,4 +148,18 @@
       color: black;
       border-left: 1px solid rgba(0, 0, 0, 0.1);
     }
-  }
+  }
+
+.location-col {
+
+}
+
+.team-col {
+  // @media (max-width: 1000px) {
+  //   display: none;
+  // }
+}
+
+.social-col {
+
+}