summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authoreug-vs <eug-vs@keemail.me>2021-03-18 13:58:16 +0300
committereug-vs <eug-vs@keemail.me>2021-03-18 13:58:16 +0300
commit1027bb6565b70c0bb2008f034c01db5605c6d129 (patch)
treee442bd4b3aa16bdacd9df266696f695f11d30e2a
parentdf89c4f1e2e3384aab28360cd04c2abebb741716 (diff)
downloadcommercel-ui-1027bb6565b70c0bb2008f034c01db5605c6d129.tar.gz
feat: make Page actions responsive
-rw-r--r--src/containers/Page.tsx4
1 files changed, 3 insertions, 1 deletions
diff --git a/src/containers/Page.tsx b/src/containers/Page.tsx
index 6282748..c4d4efd 100644
--- a/src/containers/Page.tsx
+++ b/src/containers/Page.tsx
@@ -12,9 +12,11 @@ interface Props {
className?: string;
}
+const style = 'mb-2 flex justify-between md:flex-row md:items-center';
+
const Page: React.FC<Props> = ({ title, actions, className, children }) => (
<Paper className="xl:m-5">
- <div className="mb-2 flex justify-between items-center">
+ <div className={`${style} ${actions?.length > 1 ? 'flex-col items-start' : 'flex-row items-center'}`}>
<span className="text-2xl font-bold">{title}</span>
<div>
{actions?.map(action => (<Button {...action} key={action.name} size="sm">{action.name}</Button>))}