From 316367bec18b89ae8e4c5ace8abddfaa594c55bd Mon Sep 17 00:00:00 2001
From: Anton Kulyk <kuliks.anton@gmail.com>
Date: Fri, 17 Feb 2023 13:46:01 +0000
Subject: [PATCH] Fix public action page look (#28365)
* Fix unexpected `footerVariant` prop
* Fix `body` background color
* Fix horizontal scroll on mobile
---
.../metabase/public/components/EmbedFrame/EmbedFrame.css | 4 ++++
.../public/containers/PublicAction/PublicAction.styled.tsx | 6 ++++++
.../public/containers/PublicAction/PublicActionLoader.tsx | 2 +-
3 files changed, 11 insertions(+), 1 deletion(-)
diff --git a/frontend/src/metabase/public/components/EmbedFrame/EmbedFrame.css b/frontend/src/metabase/public/components/EmbedFrame/EmbedFrame.css
index 788b59230e8..fa4a830f0b3 100644
--- a/frontend/src/metabase/public/components/EmbedFrame/EmbedFrame.css
+++ b/frontend/src/metabase/public/components/EmbedFrame/EmbedFrame.css
@@ -1,3 +1,7 @@
+body {
+ background-color: transparent;
+}
+
.EmbedFrame {
background-color: white;
}
diff --git a/frontend/src/metabase/public/containers/PublicAction/PublicAction.styled.tsx b/frontend/src/metabase/public/containers/PublicAction/PublicAction.styled.tsx
index b8a832bd443..a9640c4d970 100644
--- a/frontend/src/metabase/public/containers/PublicAction/PublicAction.styled.tsx
+++ b/frontend/src/metabase/public/containers/PublicAction/PublicAction.styled.tsx
@@ -3,6 +3,7 @@ import { css } from "@emotion/react";
import FormSubmitButton from "metabase/core/components/FormSubmitButton";
import BaseLoadingAndErrorWrapper from "metabase/components/LoadingAndErrorWrapper";
import { color } from "metabase/lib/colors";
+import { breakpointMaxSmall } from "metabase/styled-components/theme";
export const LoadingAndErrorWrapper = styled(BaseLoadingAndErrorWrapper)`
display: flex;
@@ -25,6 +26,11 @@ export const FormContainer = styled.div`
${FormSubmitButton.Button} {
width: 100%;
}
+
+ ${breakpointMaxSmall} {
+ width: 100%;
+ padding: 0 0.5rem;
+ }
`;
const titleStyle = css`
diff --git a/frontend/src/metabase/public/containers/PublicAction/PublicActionLoader.tsx b/frontend/src/metabase/public/containers/PublicAction/PublicActionLoader.tsx
index 0299f214d0e..f7c2687acff 100644
--- a/frontend/src/metabase/public/containers/PublicAction/PublicActionLoader.tsx
+++ b/frontend/src/metabase/public/containers/PublicAction/PublicActionLoader.tsx
@@ -62,7 +62,7 @@ function PublicActionLoader({ params, setErrorPage }: Props) {
}, [action, params.uuid, setErrorPage]);
return (
- <EmbedFrame footerVariant="big">
+ <EmbedFrame footerVariant="large">
<LoadingAndErrorWrapper loading={!action}>
{renderContent}
</LoadingAndErrorWrapper>
--
GitLab