diff --git a/next.config.js b/next.config.js index c52c000a..ad3a092e 100755 --- a/next.config.js +++ b/next.config.js @@ -13,6 +13,16 @@ async function redirects() { destination: '/authentication/building-todo-app', permanent: true, }, + { + source: '/develop/zero_to_dapp_1.html', + destination: '/authentication/building-todo-app', + permanent: true, + }, + { + source: '/browser/hello-blockstack.html', + destination: '/authentication/building-todo-app', + permanent: true, + }, { source: '/develop/connect/get-started.html', destination: '/authentication/connect', @@ -182,6 +192,11 @@ async function redirects() { destination: '/storage-hubs/overview', permanent: true, }, + { + source: '/storage/hello-hub-choice.html', + destination: '/storage-hubs/overview', + permanent: true, + }, { source: '/storage/amazon-s3-deploy.html', destination: '/storage-hubs/amazon-s3-deploy', @@ -220,7 +235,12 @@ async function redirects() { { source: '/org/overview.html', destination: '/ecosystem/overview', permanent: true }, { source: '/faqs/allFAQS.html', - destination: 'https://blockstack.zendesk.com/hc/en-us', + destination: '/references/faqs', + permanent: true, + }, + { + source: '/core/faq_technical.html', + destination: '/references/faqs', permanent: true, }, { source: '/org/token.html', destination: '/ecosystem/stacks-token', permanent: true }, diff --git a/src/components/content-wrapper.tsx b/src/components/content-wrapper.tsx index 3c6ee3ac..a4210bfe 100644 --- a/src/components/content-wrapper.tsx +++ b/src/components/content-wrapper.tsx @@ -5,7 +5,6 @@ const ContentWrapper: React.FC = props => ( { export const FAQs = React.memo(({ articles, sections }: any) => { return ( {sections.map(section => { return ; diff --git a/src/components/layouts/base-layout.tsx b/src/components/layouts/base-layout.tsx index 9bda7cc2..c6ca909c 100644 --- a/src/components/layouts/base-layout.tsx +++ b/src/components/layouts/base-layout.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import { Flex, Box, FlexProps, color, space, CloseIcon, Fade, Transition } from '@blockstack/ui'; +import { Flex } from '@blockstack/ui'; import { SideNav } from '../side-nav'; import { Header } from '../header'; import { Main } from '../main'; @@ -7,125 +7,8 @@ import { Footer } from '../footer'; import NotFoundPage from '@pages/404'; import { PAGE_WIDTH, SIDEBAR_WIDTH } from '@common/constants'; import { useWatchActiveHeadingChange } from '@common/hooks/use-active-heading'; -import { useLockBodyScroll } from '@common/hooks/use-lock-body-scroll'; -import { useMobileMenuState } from '@common/hooks/use-mobile-menu'; -import { border } from '@common/utils'; import { useRouter } from 'next/router'; - -const MobileMenu: React.FC = props => { - const { isOpen, handleClose } = useMobileMenuState(); - const [slideIn, setSlideIn] = React.useState(false); - React.useEffect(() => { - if (isOpen && !slideIn) { - setTimeout(() => { - setSlideIn(true); - }, 0); - } else if (slideIn && !isOpen) { - setSlideIn(false); - } - }, [isOpen]); - - useLockBodyScroll(isOpen); - return ( - - - {styles => ( - - - - {slideStyles => ( - - - - - - - - - - - )} - - - )} - - - ); -}; +import { MobileMenu } from '@components/mobile-menu'; const BaseLayout: React.FC<{ isHome?: boolean }> = ({ children }) => { const router = useRouter(); diff --git a/src/components/mdx/components/code.tsx b/src/components/mdx/components/code.tsx index dd6ba0e0..8273840c 100644 --- a/src/components/mdx/components/code.tsx +++ b/src/components/mdx/components/code.tsx @@ -138,9 +138,10 @@ export const Code: React.FC< ); const preProps = { - display: 'inline-block', + display: 'inline', border: border(), borderRadius: '4px', + wordBreak: ['break-all', 'break-all', 'unset', 'unset'], padding: '2px 6px', boxShadow: '0 1px 2px rgba(0, 0, 0, 0.04)', bg: color('bg'), diff --git a/src/components/mdx/components/link.tsx b/src/components/mdx/components/link.tsx index 0249b394..64e5e030 100644 --- a/src/components/mdx/components/link.tsx +++ b/src/components/mdx/components/link.tsx @@ -42,6 +42,8 @@ const Card = ({ route, styles, ...rest }) => { style={{ userSelect: 'none', pointerEvents: 'none', ...styles }} transition={transition()} pt={space('tight')} + as="span" + display="block" {...rest} > { borderRadius="12px" overflow="hidden" boxShadow="0px 2px 4px rgba(0, 0, 0, 0.02), 0px 24px 40px rgba(0, 0, 0, 0.08)" + as="span" + display="block" > - + + = props => { + const { isOpen, handleClose } = useMobileMenuState(); + const [slideIn, setSlideIn] = React.useState(false); + React.useEffect(() => { + if (isOpen && !slideIn) { + setTimeout(() => { + setSlideIn(true); + }, 0); + } else if (slideIn && !isOpen) { + setSlideIn(false); + } + }, [isOpen]); + + useLockBodyScroll(isOpen); + return ( + + + {styles => ( + + + + {slideStyles => ( + + + + + + + + + + + )} + + + )} + + + ); +}; diff --git a/src/components/side-nav.tsx b/src/components/side-nav.tsx index c3f43ed4..f373e898 100644 --- a/src/components/side-nav.tsx +++ b/src/components/side-nav.tsx @@ -12,6 +12,7 @@ import { getCapsizeStyles } from '@components/mdx/typography'; import { Text } from '@components/typography'; import { css } from '@styled-system/css'; import { SmartLink } from '@components/mdx'; +import { useMobileMenuState } from '@common/hooks/use-mobile-menu'; const Wrapper: React.FC = ({ width = `${SIDEBAR_WIDTH}px`, @@ -95,13 +96,19 @@ const getRoutePath = (path, routes) => routes.find(route => route.path.endsWith( const ChildPages = ({ items, handleClick }: any) => { const { routes } = useAppState(); + const { handleClose } = useMobileMenuState(); return items?.pages ? items?.pages?.map((page, key) => { if (page.external) { return ( - + handleClose()} + target="_blank" + > {page.external.title} @@ -125,7 +132,14 @@ const ChildPages = ({ items, handleClick }: any) => { handleClick(page) : undefined} + onClick={ + page.pages + ? () => { + handleClick(page); + handleClose(); + } + : handleClose + } as="a" > {items.usePageTitles ? getTitle(route) : convertToTitle(page.path)} @@ -181,6 +195,7 @@ const Navigation = () => { items: nav.sections, selected: undefined, }); + const { handleClose } = useMobileMenuState(); const router = useRouter(); @@ -229,6 +244,7 @@ const Navigation = () => { items: page, }); } + handleClose(); }; const handleBack = () => diff --git a/src/pages/authentication/building-todo-app.md b/src/pages/authentication/building-todo-app.md index 2386ac28..f6fa72ab 100644 --- a/src/pages/authentication/building-todo-app.md +++ b/src/pages/authentication/building-todo-app.md @@ -8,9 +8,6 @@ tags: images: large: /images/pages/todo-app.svg sm: /images/pages/todo-app-sm.svg -redirect_from: - - /develop/zero_to_dapp_1.html - - /browser/hello-blockstack.html --- # Building a Todo app @@ -269,9 +266,7 @@ This triggers an event, which calls the [`signUserOut` method](https://blockstack.github.io/blockstack.js/classes/usersession.html#signuserout) of the `UserSession` object. -Now, visit the URL that was provided to you when you made your tasks public. This url is of the format `/todos/:username`, -so if your username is `jane_doe.id.blockstack`, the URL would be -[`localhost:3000/todos/jane_doe.id.blockstack`](http://localhost:3000/todos/jane_doe.id.blockstack). +Now, visit the URL that was provided to you when you made your tasks public. This url is of the format `/todos/:username`, so if your username is `jane_doe.id.blockstack`, the URL would be [`localhost:3000/todos/jane_doe.id.blockstack`](http://localhost:3000/todos/jane_doe.id.blockstack). When you visit this page, the `TodoList.jsx` component detects that there is a username in the URL. When there is a username, it calls `fetchTasks`, this time providing the `username` argument. This `username` diff --git a/src/pages/references/faqs/[slug].tsx b/src/pages/references/faqs/[slug].tsx index 9bf7f7d2..576203cb 100644 --- a/src/pages/references/faqs/[slug].tsx +++ b/src/pages/references/faqs/[slug].tsx @@ -104,7 +104,10 @@ const FaqItems = ({ articles }) => { }; return ( - + {articles diff --git a/src/pages/stacks-blockchain/overview.md b/src/pages/stacks-blockchain/overview.md index 63b96da4..194a47cd 100644 --- a/src/pages/stacks-blockchain/overview.md +++ b/src/pages/stacks-blockchain/overview.md @@ -12,7 +12,7 @@ To unpack this definition: _A replicated state machine_ is two or more copies ("replicas") of a given set of rules (a "machine") that, in processing a common input (such as the same sequence of transactions), will arrive at the same configuration ("state"). Bitcoin is a replicated state machine — its state is the set of UTXOs, which each peer has a full copy of, and given a block, -all peers will independently calculate the same new UTXO set from the existing one. +all peers will independently calculate the same new unspent output (UTXO) set from the existing one. _Open-membership_ means that any host on the Internet can join the blockchain and independently calculate the same full replica as all other peers. @@ -78,9 +78,6 @@ Anyone can be a Stacks Miner. There are no special hardware or software requirem of spending energy, Stacks miners transfer Bitcoin to holders of Stacks Token (STX) to mine a block. This mechanism is called Proof of Transfer (PoX). -[@page-reference | inline] -| /stacks-blockchain/testnet-node - [@page-reference | inline] | /mining diff --git a/src/pages/storage-hubs/overview.md b/src/pages/storage-hubs/overview.md index 91d73c8c..c1410667 100644 --- a/src/pages/storage-hubs/overview.md +++ b/src/pages/storage-hubs/overview.md @@ -1,14 +1,10 @@ --- -title: Overview -redirect_from: - - /storage/hello-hub-choice.html +title: Storage hubs overview --- ## Configuration files -You should store a JSON configuration file either in the top-level directory of -the hub server. Alternatively, you can specify a file location using the -`CONFIG_PATH` environment variable. The following is an example configuration file for Amazon S3: +You should store a JSON configuration file either in the top-level directory of the hub server. Alternatively, you can specify a file location using the `CONFIG_PATH` environment variable. The following is an example configuration file for Amazon S3: ```json {