fix read only page menu (#2356)

This PR fixes pages in the pages menu being squished in read only rooms

### Change Type

- [x] `patch` — Bug fix
- [ ] `minor` — New feature
- [ ] `major` — Breaking change
- [ ] `dependencies` — Changes to package dependencies[^1]
- [ ] `documentation` — Changes to the documentation only[^2]
- [ ] `tests` — Changes to any test code only[^2]
- [ ] `internal` — Any other changes that don't affect the published
package[^2]
- [ ] I don't know

[^1]: publishes a `patch` release, for devDependencies use `internal`
[^2]: will not publish a new version

### Test Plan

1. Add a step-by-step description of how to test your PR here.
2.

- [ ] Unit Tests
- [ ] End to end tests

### Release Notes

- Add a brief release note for your PR here.

---------

Co-authored-by: Lu[ke] Wilson <l2wilson94@gmail.com>

packages/tldraw/src/lib/ui.css

@@ -1263,6 +1263,7 @@
 	flex-direction: row;
 	align-items: center;
 	width: 100%;
+	height: 40px;
 	padding-left: var(--space-4);
 	border-bottom: 1px solid var(--color-divider);
 }
@@ -1307,6 +1308,10 @@
 	margin-top: -4px;
 }
 
+.tlui-page-menu__item__button {
+	width: 100%;
+}
+
 .tlui-page-menu__item__button:not(:only-child) {
 	flex-grow: 2;
 	margin-right: -2px;

packages/tldraw/src/lib/ui/components/PageMenu/PageMenu.tsx

@@ -370,7 +370,7 @@ export const PageMenu = function PageMenu() {
 									className="tlui-page-menu__item"
 								>
 									<Button
-										type="icon"
+										type="normal"
 										className="tlui-page-menu__item__button tlui-page-menu__item__button__checkbox"
 										onClick={() => editor.setCurrentPage(page.id)}
 										onDoubleClick={toggleEditing}