diff --git a/src/components/Backdrop/backdrop.css b/src/components/Backdrop/backdrop.css
index 9e0c51e..b208cbf 100644
--- a/src/components/Backdrop/backdrop.css
+++ b/src/components/Backdrop/backdrop.css
@@ -11,8 +11,6 @@
z-index: 10;
}
-@media (min-width: 800px) {
- .document-noOverflow {
- overflow: hidden;
- }
+.document-noOverflow {
+ overflow: hidden;
}
diff --git a/src/components/Menu/Menu.tsx b/src/components/Menu/Menu.tsx
index 0fa9fcf..105d73e 100644
--- a/src/components/Menu/Menu.tsx
+++ b/src/components/Menu/Menu.tsx
@@ -38,9 +38,21 @@ type Props = {
items: MenuItem[];
className?: string;
+
+ /**
+ * The application version
+ */
+ version?: string;
};
-export function Menu({ expanded, onClose, onOpen, items, className }: Props) {
+export function Menu({
+ expanded,
+ onClose,
+ onOpen,
+ items,
+ className,
+ version = "",
+}: Props) {
useEffect(() => {
if (expanded && onOpen) {
onOpen();
@@ -77,9 +89,18 @@ export function Menu({ expanded, onClose, onOpen, items, className }: Props) {
|
Codex
- ALPHA
+ ALPHA
+
+
+
+ {items.map((item, index) => renderItem(item, index))}
+
+
+
+ {version && (
+ Version: {version}
+ )}
- {items.map((item, index) => renderItem(item, index))}
>
diff --git a/src/components/Menu/menu.css b/src/components/Menu/menu.css
index 58b1610..efaa90e 100644
--- a/src/components/Menu/menu.css
+++ b/src/components/Menu/menu.css
@@ -15,13 +15,20 @@
}
.menu-container {
+ display: flex;
+ flex-direction: column;
padding: 0.75rem;
+ flex: 1;
}
.menu-backdrop {
display: none;
}
+.menu-items {
+ flex: 1;
+}
+
.menu[aria-expanded] {
transform: translatex(0);
min-width: 200px;
@@ -64,7 +71,7 @@
width: 100%;
}
-.menu-version {
+.menu-state {
font-size: 0.6rem;
background-color: var(--codex-background-light);
padding: 0.25rem;
@@ -73,6 +80,14 @@
top: 1px;
}
+.menu-footer {
+ text-align: center;
+}
+
+.menu-version {
+ padding: 0;
+}
+
@media (min-width: 1000px) {
.menu {
transform: translatex(0px);
diff --git a/src/components/Page/Page.tsx b/src/components/Page/Page.tsx
index f6fddce..cc13822 100644
--- a/src/components/Page/Page.tsx
+++ b/src/components/Page/Page.tsx
@@ -9,9 +9,11 @@ type Props = {
Right: ReactNode;
items: MenuItem[];
+
+ version?: string;
};
-export function Page({ children, Right, items }: Props) {
+export function Page({ children, Right, items, version = "" }: Props) {
const [open, setOpen] = useState(false);
const onClose = () => {
@@ -24,7 +26,12 @@ export function Page({ children, Right, items }: Props) {
return (
-
+
diff --git a/stories/Menu.stories.tsx b/stories/Menu.stories.tsx
index 78c822a..f3e88d5 100644
--- a/stories/Menu.stories.tsx
+++ b/stories/Menu.stories.tsx
@@ -126,6 +126,7 @@ const Template = (p: Props) => {
onOpen={p.onOpen}
items={items}
className="menu-noSticky"
+ version="1.0.0"
>
);
diff --git a/stories/Page.stories.tsx b/stories/Page.stories.tsx
index 1c908ae..1494381 100644
--- a/stories/Page.stories.tsx
+++ b/stories/Page.stories.tsx
@@ -98,5 +98,6 @@ export const Default: Story = {
},
] satisfies MenuItem[],
Right: ,
+ version: "1.0.0",
},
};