[MOL-16700][RL] Update LocalNav documentation

stories/local-nav/doc-elements.tsx

@@ -0,0 +1,30 @@
+import { MediaQuery } from "src/media";
+import { Text } from "src/text";
+import styled from "styled-components";
+
+export const Page = styled.div`
+    height: 200vh;
+
+    display: grid;
+    gap: 1rem;
+    grid-template-columns: 1fr 2fr;
+
+    ${MediaQuery.MaxWidth.mobileL} {
+        grid-template-columns: 1fr;
+    }
+
+    > main {
+        padding: 1rem;
+    }
+`;
+
+export const Content = () => (
+    <Text.Body style={{ margin: "1rem 0" }}>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus a
+        tortor vitae magna sagittis bibendum. Proin dui risus, rhoncus eget
+        ligula non, tincidunt volutpat erat. Suspendisse vitae mauris pharetra,
+        ullamcorper massa id, luctus elit. Aliquam at vestibulum nisi. In hac
+        habitasse platea dictumst. Vestibulum sit amet mollis justo, in iaculis
+        sem. Vivamus eu blandit sem.
+    </Text.Body>
+);

stories/local-nav/local-nav.mdx

@@ -0,0 +1,43 @@
+import { Canvas, Meta } from "@storybook/blocks";
+import { Heading3, Secondary, Title } from "../storybook-common";
+import * as LocalNavStories from "./local-nav.stories";
+import { PropsTable } from "./props-table";
+
+<Meta of={LocalNavStories} />
+
+<Title>LocalNav</Title>
+
+Components for navigation to different sections within a page.
+
+<Secondary>Overview</Secondary>
+
+```tsx
+import {
+    LocalNavMenu,
+    LocalNavDropdown,
+} from "@lifesg/react-design-system/local-nav";
+```
+
+<Heading3>Menu</Heading3>
+
+The `LocalNavMenu` displays navigation items in a vertical list.
+
+<Canvas of={LocalNavStories.Menu} />
+
+<Heading3>Dropdown</Heading3>
+
+The `LocalNavDropdown` displays navigation items in a dropdown. It becomes
+sticky when it reaches the top of the screen.
+
+<Canvas of={LocalNavStories.Dropdown} />
+
+<Heading3>Combined usage</Heading3>
+
+A common use case to to use the menu on desktop, and switch to the dropdown on
+smaller screens.
+
+<Canvas of={LocalNavStories.CombinedUsage} />
+
+<Secondary>Component API</Secondary>
+
+<PropsTable />