Skip to content

Fix nav highlight #10

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 12 commits into from
Jul 15, 2024
Merged

Fix nav highlight #10

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
bb48e32
Let nav title text wrap.
WebsByTodd Jul 12, 2024
3b9f6b0
VisibleSectionHighlight has dynamic position and height based on elem…
WebsByTodd Jul 12, 2024
1514831
Section highlight mostly works, but it's a little buggy when using ne…
WebsByTodd Jul 12, 2024
bb3ab19
I hate linters.
WebsByTodd Jul 12, 2024
ff884c0
More color saturation.
WebsByTodd Jul 15, 2024
e8dc4a7
Nav highlight logic is more stable.
WebsByTodd Jul 15, 2024
8fcb77d
Refs don't reliably update, so use document.getElementById instead.
WebsByTodd Jul 15, 2024
57dfdf4
Remove more unreliable refs.
WebsByTodd Jul 15, 2024
b1cf35a
Don't disable SSR everywhere because hashlinks stop working (although…
WebsByTodd Jul 15, 2024
d10608b
When navigating from a page with lots of sections to a page without s…
WebsByTodd Jul 15, 2024
49d83f3
Remove active page marker and fix the position of the inset line.
WebsByTodd Jul 15, 2024
fcf3ebf
Not sure why this stopped working. But motion.div isn't necessary, ju…
WebsByTodd Jul 15, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Don't disable SSR everywhere because hashlinks stop working (although… 
… they would probably still work in static builds).
  • Loading branch information
@WebsByTodd
WebsByTodd committed Jul 15, 2024
commit b1cf35a27eb598a6ed46ec35b080a410ae5232c0
11 changes: 9 additions & 2 deletions next/src/components/Navigation/NavGroup.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,20 @@ import { lora, spectral } from '@/lib/fonts'
import { useInitialValue } from '@/lib/useInitialValue'
import clsx from 'clsx/lite'
import { AnimatePresence, motion } from 'framer-motion'
import dynamic from 'next/dynamic'
import Link from 'next/link'
import { useRouter } from 'next/router'
import { useState } from 'react'
import { ActivePageMarker } from './ActivePageMarker'
import { NavigationGroup } from './config'
import NavLink from './NavLink'
import { VisibleSectionHighlight } from './VisibleSectionHighlight'

const VisibleSectionHighlight = dynamic(
() =>
import('./VisibleSectionHighlight').then(
(module) => module.VisibleSectionHighlight,
),
{ ssr: false },
)

interface NavGroupProps {
group: NavigationGroup
Expand Down
8 changes: 1 addition & 7 deletions next/src/pages/_app.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@ import { Layout } from '@/components/Layout'
import * as mdxComponents from '@/components/mdx'
import { useMobileNavigationStore } from '@/components/MobileNavigation'
import { MDXProvider } from '@mdx-js/react'
import dynamic from 'next/dynamic'
import Head from 'next/head'
import { Router } from 'next/router'

Expand All @@ -16,7 +15,7 @@ function onRouteChange() {
Router.events.on('routeChangeStart', onRouteChange)
Router.events.on('hashChangeStart', onRouteChange)

function App({ Component, pageProps }) {
export default function App({ Component, pageProps }) {
return (
<>
<Head>
Expand All @@ -31,8 +30,3 @@ function App({ Component, pageProps }) {
</>
)
}

// Disable SSR everywhere so we can use the document object normally
export default dynamic(() => Promise.resolve(App), {
ssr: false,
})