UI: add back button to header
This commit is contained in:
@@ -1,14 +1,17 @@
|
|||||||
import { JSX } from "solid-js";
|
import { JSX } from "solid-js";
|
||||||
import { Typography } from "../components/Typography";
|
import { Typography } from "../components/Typography";
|
||||||
|
import { BackButton } from "../components/BackButton";
|
||||||
|
|
||||||
interface HeaderProps {
|
interface HeaderProps {
|
||||||
title: string;
|
title: string;
|
||||||
toolbar?: JSX.Element;
|
toolbar?: JSX.Element;
|
||||||
|
showBack?: boolean;
|
||||||
}
|
}
|
||||||
export const Header = (props: HeaderProps) => {
|
export const Header = (props: HeaderProps) => {
|
||||||
return (
|
return (
|
||||||
<div class="navbar border-b px-6 py-4 border-def-3">
|
<div class="navbar border-b px-6 py-4 border-def-3">
|
||||||
<div class="flex-none">
|
<div class="flex-none">
|
||||||
|
{props.showBack && <BackButton />}
|
||||||
<span class="tooltip tooltip-bottom lg:hidden" data-tip="Menu">
|
<span class="tooltip tooltip-bottom lg:hidden" data-tip="Menu">
|
||||||
<label
|
<label
|
||||||
class="btn btn-square btn-ghost drawer-button"
|
class="btn btn-square btn-ghost drawer-button"
|
||||||
@@ -19,7 +22,7 @@ export const Header = (props: HeaderProps) => {
|
|||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex-1">
|
<div class="flex-1">
|
||||||
<Typography hierarchy="title" size="m" weight="medium">
|
<Typography hierarchy="title" size="m" weight="medium" class="">
|
||||||
{props.title}
|
{props.title}
|
||||||
</Typography>
|
</Typography>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user