# Footer

`Footer` places an identity and notice at the end of the page, wrapping and stacking on small screens, with the privacy control when statistics are configured.

## Usage

Load `@dg/ui/styles.css` once in the root layout.

```svelte
<script>
  import { Footer } from "@dg/ui";
</script>

<Footer identity="Collection" notice="Copy, remix, reuse." />

{#snippet legalNotice()}<a href="/legal">Legal information</a>{/snippet}
<Footer identity="Collection" notice={legalNotice} />
```

## Notes

- Native HTML attributes, DOM callbacks, class and style are forwarded to the footer element.
- Forwarding uses native attribute types; unknown props are not supported. Pass class as a string. `Footer` does not render a children snippet.
- The footer draws its top rule, side rails and top corner crosses, without a bottom rule or bottom crosses. Its top crosses coincide with the preceding section's bottom crosses when both are present.
- When a mounted [`Analytics`](analytics.md) has loaded its configuration, a privacy and statistics control follows the notice, in its typography, and opens the privacy dialog. It wraps after the notice as a whole.

## Parameters

| Name       | Type                | Default                    | Description                                                                                                       |
| ---------- | ------------------- | -------------------------- | ----------------------------------------------------------------------------------------------------------------- |
| `identity` | `string`            | `"distributed·gallery"`    | Identity text on the left.                                                                                        |
| `notice`   | `string \| Snippet` | `"Copy, remix, whatever."` | Secondary notice, right-aligned on desktop and stacked on mobile. Accepts a snippet for inline links and actions. |

## Accessibility

Compose `Footer` after `Main`. Identity uses UI typography and notice uses metadata typography; source strings retain their case. The privacy control is a native button named in the `Page` language, with the shared control target height.