diff --git a/e2e/tests/ui-driven/src/globalHelpers.ts b/e2e/tests/ui-driven/src/globalHelpers.ts
index a6f8552b90..52be7509c0 100644
--- a/e2e/tests/ui-driven/src/globalHelpers.ts
+++ b/e2e/tests/ui-driven/src/globalHelpers.ts
@@ -139,7 +139,7 @@ export async function clickContinue({
 
 export async function clickBack({ page }: { page: Page }) {
   const waitPromise = waitForDebugLog(page); // assume debug message is triggered on state transition
-  await page.getByRole("button", { name: "Back", exact: true }).click();
+  await page.getByTestId("backButton").click();
   await waitPromise;
 }
 
@@ -193,7 +193,7 @@ export async function answerChecklist({
   });
   await expect(checklist).toBeVisible();
   for (const answer of answers) {
-    await page.locator("label", { hasText: answer }).click();
+    await page.getByLabel(answer, { exact: true }).click();
   }
 }
 
diff --git a/editor.planx.uk/src/@planx/components/shared/Preview/MoreInfo.tsx b/editor.planx.uk/src/@planx/components/shared/Preview/MoreInfo.tsx
index f2e135bec9..2d6bd4edec 100644
--- a/editor.planx.uk/src/@planx/components/shared/Preview/MoreInfo.tsx
+++ b/editor.planx.uk/src/@planx/components/shared/Preview/MoreInfo.tsx
@@ -1,8 +1,11 @@
 import CloseIcon from "@mui/icons-material/Close";
+import Box from "@mui/material/Box";
 import Container from "@mui/material/Container";
 import Drawer, { DrawerProps } from "@mui/material/Drawer";
 import IconButton from "@mui/material/IconButton";
 import { styled } from "@mui/material/styles";
+import MoreInfoFeedbackComponent from "components/MoreInfoFeedback";
+import { hasFeatureFlag } from "lib/featureFlags";
 import React from "react";
 
 const PREFIX = "MoreInfo";
@@ -34,22 +37,22 @@ const Root = styled(Drawer, {
   [`& .${classes.drawerPaper}`]: {
     width: "100%",
     maxWidth: drawerWidth,
-    backgroundColor: theme.palette.background.default,
+    backgroundColor: theme.palette.background.paper,
     border: 0,
     boxShadow: "-4px 0 0 rgba(0,0,0,0.1)",
   },
 }));
 
-const DrawerContent = styled("div")(({ theme }) => ({
-  padding: theme.spacing(2.5, 4, 6, 0),
+const DrawerContent = styled(Box)(({ theme }) => ({
+  padding: theme.spacing(2.5, 4, 2, 0),
   fontSize: "1rem",
   lineHeight: "1.5",
   [theme.breakpoints.up("sm")]: {
-    padding: theme.spacing(6, 4, 6, 1),
+    padding: theme.spacing(6, 4, 4, 1),
   },
 }));
 
-const CloseButton = styled("div")(({ theme }) => ({
+const CloseButton = styled(Box)(({ theme }) => ({
   display: "flex",
   alignItems: "center",
   justifyContent: "flex-end",
@@ -59,6 +62,8 @@ const CloseButton = styled("div")(({ theme }) => ({
   color: theme.palette.text.primary,
 }));
 
+const isUsingFeatureFlag = hasFeatureFlag("SHOW_INTERNAL_FEEDBACK");
+
 interface IMoreInfo {
   open: boolean;
   children: (JSX.Element | string | undefined)[] | JSX.Element;
@@ -90,9 +95,10 @@ const MoreInfo: React.FC<IMoreInfo> = ({ open, children, handleClose }) => (
         <CloseIcon />
       </IconButton>
     </CloseButton>
-    <Container maxWidth={false} role="main">
+    <Container maxWidth={false} role="main" sx={{ bgcolor: "white" }}>
       <DrawerContent>{children}</DrawerContent>
     </Container>
+    {isUsingFeatureFlag && <MoreInfoFeedbackComponent />}
   </Root>
 );
 
diff --git a/editor.planx.uk/src/components/Feedback.tsx b/editor.planx.uk/src/components/Feedback.tsx
new file mode 100644
index 0000000000..55623756f5
--- /dev/null
+++ b/editor.planx.uk/src/components/Feedback.tsx
@@ -0,0 +1,260 @@
+import ArrowBackIcon from "@mui/icons-material/ArrowBack";
+import CloseIcon from "@mui/icons-material/Close";
+import LightbulbIcon from "@mui/icons-material/Lightbulb";
+import MoreHorizIcon from "@mui/icons-material/MoreHoriz";
+import WarningIcon from "@mui/icons-material/Warning";
+import Box from "@mui/material/Box";
+import Button from "@mui/material/Button";
+import Container from "@mui/material/Container";
+import IconButton from "@mui/material/IconButton";
+import { styled } from "@mui/material/styles";
+import Typography from "@mui/material/Typography";
+import { contentFlowSpacing } from "@planx/components/shared/Preview/Card";
+import FeedbackPhaseBanner from "components/FeedbackPhaseBanner";
+import { BackButton } from "pages/Preview/Questions";
+import React from "react";
+import FeedbackDisclaimer from "ui/public/FeedbackDisclaimer";
+import FeedbackOption from "ui/public/FeedbackOption";
+import InputLabel from "ui/public/InputLabel";
+import Input from "ui/shared/Input";
+
+const FeedbackWrapper = styled(Box)(({ theme }) => ({
+  backgroundColor: theme.palette.background.paper,
+  borderTop: `1px solid ${theme.palette.border.main}`,
+}));
+
+const FeedbackRow = styled(Box)(({ theme }) => ({
+  maxWidth: theme.breakpoints.values.formWrap,
+  padding: theme.spacing(2, 0, 4),
+}));
+
+const FeedbackHeader = styled(Box)(({ theme }) => ({
+  padding: theme.spacing(1, 0),
+  position: "relative",
+  display: "flex",
+  justifyContent: "space-between",
+  alignItems: "center",
+}));
+
+const FeedbackTitle = styled(Box)(({ theme }) => ({
+  position: "relative",
+  display: "flex",
+  alignItems: "center",
+  "& svg": {
+    width: "28px",
+    height: "auto",
+    color: theme.palette.primary.dark,
+    marginRight: theme.spacing(1),
+  },
+}));
+
+const CloseButton = styled("div")(({ theme }) => ({
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "flex-end",
+  color: theme.palette.text.primary,
+}));
+
+const FeedbackBody = styled(Box)(({ theme }) => ({
+  maxWidth: theme.breakpoints.values.formWrap,
+}));
+
+const FeedbackForm = styled("form")(({ theme }) => ({
+  "& > *": {
+    ...contentFlowSpacing(theme),
+  },
+}));
+
+const FeedbackComponent: React.FC = () => {
+  return (
+    <>
+      <FeedbackWrapper>
+        <FeedbackPhaseBanner />
+      </FeedbackWrapper>
+
+      <FeedbackWrapper>
+        <Container maxWidth="contentWrap">
+          <FeedbackRow>
+            <FeedbackHeader>
+              <Typography variant="h3" component="h2">
+                What would you like to share?
+              </Typography>
+              <CloseButton>
+                <IconButton
+                  role="button"
+                  title="Close panel"
+                  aria-label="Close panel"
+                  size="large"
+                  color="inherit"
+                >
+                  <CloseIcon />
+                </IconButton>
+              </CloseButton>
+            </FeedbackHeader>
+            <FeedbackBody>
+              <FeedbackOption icon={WarningIcon} label="Issue" showArrow />
+              <FeedbackOption icon={LightbulbIcon} label="Idea" showArrow />
+              <FeedbackOption icon={MoreHorizIcon} label="Comment" showArrow />
+            </FeedbackBody>
+          </FeedbackRow>
+        </Container>
+      </FeedbackWrapper>
+
+      <FeedbackWrapper>
+        <Container maxWidth="contentWrap">
+          <FeedbackRow>
+            <FeedbackHeader>
+              <BackButton>
+                <ArrowBackIcon fontSize="small" />
+                Back
+              </BackButton>
+              <CloseButton>
+                <IconButton
+                  role="button"
+                  title="Close panel"
+                  aria-label="Close panel"
+                  size="large"
+                  color="inherit"
+                >
+                  <CloseIcon />
+                </IconButton>
+              </CloseButton>
+            </FeedbackHeader>
+            <FeedbackTitle>
+              <WarningIcon />
+              <Typography variant="h3" component="h2">
+                Report an issue
+              </Typography>
+            </FeedbackTitle>
+            <FeedbackBody>
+              <FeedbackForm>
+                <InputLabel
+                  label="What were you doing?"
+                  htmlFor="issue-input-1"
+                >
+                  <Input multiline bordered id="issue-input-1" />
+                </InputLabel>
+                <InputLabel label="What went wrong?" htmlFor="issue-input-2">
+                  <Input multiline bordered id="issue-input-2" />
+                </InputLabel>
+                <FeedbackDisclaimer />
+                <Button variant="contained" sx={{ marginTop: 2.5 }}>
+                  Send feedback
+                </Button>
+              </FeedbackForm>
+            </FeedbackBody>
+          </FeedbackRow>
+        </Container>
+      </FeedbackWrapper>
+
+      <FeedbackWrapper>
+        <Container maxWidth="contentWrap">
+          <FeedbackRow>
+            <FeedbackHeader>
+              <BackButton>
+                <ArrowBackIcon fontSize="small" />
+                Back
+              </BackButton>
+              <CloseButton>
+                <IconButton
+                  role="button"
+                  title="Close panel"
+                  aria-label="Close panel"
+                  size="large"
+                  color="inherit"
+                >
+                  <CloseIcon />
+                </IconButton>
+              </CloseButton>
+            </FeedbackHeader>
+            <FeedbackTitle>
+              <LightbulbIcon />
+              <Typography variant="h3" component="h2" id="idea-title">
+                Share an idea
+              </Typography>
+            </FeedbackTitle>
+            <FeedbackBody>
+              <FeedbackForm>
+                <Input multiline bordered aria-describedby="idea-title" />
+                <FeedbackDisclaimer />
+                <Button variant="contained" sx={{ marginTop: 2.5 }}>
+                  Send feedback
+                </Button>
+              </FeedbackForm>
+            </FeedbackBody>
+          </FeedbackRow>
+        </Container>
+      </FeedbackWrapper>
+
+      <FeedbackWrapper>
+        <Container maxWidth="contentWrap">
+          <FeedbackRow>
+            <FeedbackHeader>
+              <BackButton>
+                <ArrowBackIcon fontSize="small" />
+                Back
+              </BackButton>
+              <CloseButton>
+                <IconButton
+                  role="button"
+                  title="Close panel"
+                  aria-label="Close panel"
+                  size="large"
+                  color="inherit"
+                >
+                  <CloseIcon />
+                </IconButton>
+              </CloseButton>
+            </FeedbackHeader>
+            <FeedbackTitle>
+              <MoreHorizIcon />
+              <Typography variant="h3" component="h2" id="comment-title">
+                Share a comment
+              </Typography>
+            </FeedbackTitle>
+            <FeedbackBody>
+              <FeedbackForm>
+                <Input multiline bordered aria-describedby="comment-title" />
+                <FeedbackDisclaimer />
+                <Button variant="contained" sx={{ marginTop: 2.5 }}>
+                  Send feedback
+                </Button>
+              </FeedbackForm>
+            </FeedbackBody>
+          </FeedbackRow>
+        </Container>
+      </FeedbackWrapper>
+
+      <FeedbackWrapper>
+        <Container maxWidth="contentWrap">
+          <FeedbackRow>
+            <FeedbackHeader>
+              <Typography variant="h3" component="h2">
+                Thank you for sharing feedback
+              </Typography>
+              <CloseButton>
+                <IconButton
+                  role="button"
+                  title="Close panel"
+                  aria-label="Close panel"
+                  size="large"
+                  color="inherit"
+                >
+                  <CloseIcon />
+                </IconButton>
+              </CloseButton>
+            </FeedbackHeader>
+            <FeedbackBody>
+              <Typography variant="body1">
+                We appreciate it lorem ipsum dolor sit amet, consectetuer
+                adipiscing elit. Aenean commodo ligula eget dolor.
+              </Typography>
+            </FeedbackBody>
+          </FeedbackRow>
+        </Container>
+      </FeedbackWrapper>
+    </>
+  );
+};
+
+export default FeedbackComponent;
diff --git a/editor.planx.uk/src/components/FeedbackPhaseBanner.tsx b/editor.planx.uk/src/components/FeedbackPhaseBanner.tsx
new file mode 100644
index 0000000000..37809ce5e0
--- /dev/null
+++ b/editor.planx.uk/src/components/FeedbackPhaseBanner.tsx
@@ -0,0 +1,83 @@
+import Box from "@mui/material/Box";
+import Button from "@mui/material/Button";
+import Container from "@mui/material/Container";
+import Link from "@mui/material/Link";
+import { styled } from "@mui/material/styles";
+import Typography from "@mui/material/Typography";
+import React from "react";
+
+const Root = styled(Box)(({ theme }) => ({
+  width: "100%",
+  backgroundColor: theme.palette.background.paper,
+}));
+
+const ReportButton = styled(Button)(({ theme }) => ({
+  backgroundColor: theme.palette.common.white,
+  color: theme.palette.primary.main,
+  padding: "0.7em 1em",
+}));
+
+const Inner = styled(Box)(({ theme }) => ({
+  width: "100%",
+  display: "flex",
+  justifyContent: "space-between",
+  alignItems: "center",
+  flexWrap: "wrap",
+  padding: theme.spacing(0.75, 0),
+}));
+
+const PhaseWrap = styled(Box)(({ theme }) => ({
+  display: "flex",
+  justifyContent: "start",
+  alignItems: "start",
+  padding: theme.spacing(0.5, 1, 0.5, 0),
+}));
+
+const BetaFlag = styled(Box)(({ theme }) => ({
+  betaIcon: {
+    width: "100%",
+    [theme.breakpoints.up("sm")]: {
+      width: "auto",
+      marginRight: theme.spacing(2),
+    },
+  },
+}));
+
+export default function FeedbackPhaseBanner(): FCReturn {
+  return (
+    <Root>
+      <Container maxWidth="contentWrap">
+        <Inner>
+          <PhaseWrap>
+            <BetaFlag
+              bgcolor="primary.dark"
+              color="white"
+              display="flex"
+              alignItems="flex-start"
+              flexBasis={0}
+              px={1}
+              mr={1}
+              py={0.5}
+              fontSize={14}
+              textAlign="center"
+              whiteSpace="nowrap"
+              fontWeight={600}
+            >
+              PUBLIC BETA
+            </BetaFlag>
+            <Typography
+              variant="body2"
+              color="textPrimary"
+              textAlign="left"
+              mt="0.2em"
+            >
+              This is a new service. Your <Link>feedback</Link> will help us
+              improve it.
+            </Typography>
+          </PhaseWrap>
+          <ReportButton>Report an issue with this page</ReportButton>
+        </Inner>
+      </Container>
+    </Root>
+  );
+}
diff --git a/editor.planx.uk/src/components/MoreInfoFeedback.tsx b/editor.planx.uk/src/components/MoreInfoFeedback.tsx
new file mode 100644
index 0000000000..530f56a721
--- /dev/null
+++ b/editor.planx.uk/src/components/MoreInfoFeedback.tsx
@@ -0,0 +1,82 @@
+import CancelIcon from "@mui/icons-material/Cancel";
+import CheckCircleIcon from "@mui/icons-material/CheckCircle";
+import Box from "@mui/material/Box";
+import Button from "@mui/material/Button";
+import Container from "@mui/material/Container";
+import { styled } from "@mui/material/styles";
+import Typography from "@mui/material/Typography";
+import { contentFlowSpacing } from "@planx/components/shared/Preview/Card";
+import React from "react";
+import FeedbackDisclaimer from "ui/public/FeedbackDisclaimer";
+import FeedbackOption from "ui/public/FeedbackOption";
+import Input from "ui/shared/Input";
+
+const MoreInfoFeedback = styled(Box)(({ theme }) => ({
+  borderTop: `2px solid ${theme.palette.border.main}`,
+  padding: theme.spacing(2.5, 4, 8, 0),
+  [theme.breakpoints.up("sm")]: {
+    padding: theme.spacing(3, 4, 8, 1),
+  },
+}));
+
+const FeedbackBody = styled(Box)(({ theme }) => ({
+  padding: theme.spacing(1, 0),
+  "& form > * + *": {
+    ...contentFlowSpacing(theme),
+  },
+}));
+
+const MoreInfoFeedbackComponent: React.FC = () => {
+  return (
+    <>
+      <MoreInfoFeedback>
+        <Container maxWidth={false}>
+          <Typography variant="h4" component="h3" gutterBottom>
+            Did this help to answer your question?
+          </Typography>
+          <FeedbackBody>
+            <FeedbackOption
+              icon={CheckCircleIcon}
+              label="Yes"
+              format="positive"
+            />
+            <FeedbackOption icon={CancelIcon} label="No" format="negative" />
+          </FeedbackBody>
+        </Container>
+      </MoreInfoFeedback>
+
+      <MoreInfoFeedback>
+        <Container maxWidth={false}>
+          <Typography variant="h4" component="h3" gutterBottom>
+            Please help us to improve this service by sharing feedback
+          </Typography>
+          <FeedbackBody>
+            <form>
+              <Input multiline bordered aria-describedby="comment-title" />
+              <FeedbackDisclaimer />
+              <Button variant="contained" sx={{ marginTop: 2.5 }}>
+                Send feedback
+              </Button>
+            </form>
+          </FeedbackBody>
+        </Container>
+      </MoreInfoFeedback>
+
+      <MoreInfoFeedback>
+        <Container maxWidth={false}>
+          <Typography variant="h4" component="h3" gutterBottom>
+            Thank you for sharing feedback
+          </Typography>
+          <FeedbackBody>
+            <Typography variant="body2">
+              We appreciate it lorem ipsum dolor sit amet, consectetuer
+              adipiscing elit. Aenean commodo ligula eget dolor.
+            </Typography>
+          </FeedbackBody>
+        </Container>
+      </MoreInfoFeedback>
+    </>
+  );
+};
+
+export default MoreInfoFeedbackComponent;
diff --git a/editor.planx.uk/src/lib/featureFlags.ts b/editor.planx.uk/src/lib/featureFlags.ts
index 7bf56fbe6f..d676604615 100644
--- a/editor.planx.uk/src/lib/featureFlags.ts
+++ b/editor.planx.uk/src/lib/featureFlags.ts
@@ -2,6 +2,7 @@
 const AVAILABLE_FEATURE_FLAGS = [
   "DISABLE_SAVE_AND_RETURN",
   "SHOW_TEAM_SETTINGS",
+  "SHOW_INTERNAL_FEEDBACK",
 ] as const;
 
 type featureFlag = (typeof AVAILABLE_FEATURE_FLAGS)[number];
diff --git a/editor.planx.uk/src/pages/Preview/Questions.tsx b/editor.planx.uk/src/pages/Preview/Questions.tsx
index 58b1dafaf7..5f83ef110a 100644
--- a/editor.planx.uk/src/pages/Preview/Questions.tsx
+++ b/editor.planx.uk/src/pages/Preview/Questions.tsx
@@ -23,7 +23,7 @@ const BackBar = styled(Box)(() => ({
   zIndex: "1000",
 }));
 
-const BackButton = styled(ButtonBase)(({ theme, hidden }) => ({
+export const BackButton = styled(ButtonBase)(({ theme, hidden }) => ({
   visibility: "visible",
   pointerEvents: "auto",
   display: "flex",
@@ -170,7 +170,11 @@ const Questions = ({ previewEnvironment }: QuestionsProps) => {
     <Box width="100%" role="main">
       <BackBar hidden={!showBackBar}>
         <Container maxWidth={false}>
-          <BackButton hidden={!showBackButton} onClick={() => goBack()}>
+          <BackButton
+            hidden={!showBackButton}
+            data-testid="backButton"
+            onClick={() => goBack()}
+          >
             <ArrowBackIcon fontSize="small" />
             Back
           </BackButton>
diff --git a/editor.planx.uk/src/pages/layout/PublicLayout.tsx b/editor.planx.uk/src/pages/layout/PublicLayout.tsx
index 9aa2c552b9..f0b4be5d3c 100644
--- a/editor.planx.uk/src/pages/layout/PublicLayout.tsx
+++ b/editor.planx.uk/src/pages/layout/PublicLayout.tsx
@@ -7,7 +7,9 @@ import {
 } from "@mui/material/styles";
 import Typography from "@mui/material/Typography";
 import ErrorFallback from "components/ErrorFallback";
+import Feedback from "components/Feedback";
 import PhaseBanner from "components/PhaseBanner";
+import { hasFeatureFlag } from "lib/featureFlags";
 import { useStore } from "pages/FlowEditor/lib/store";
 import React, { PropsWithChildren } from "react";
 import { ErrorBoundary } from "react-error-boundary";
@@ -62,9 +64,12 @@ const PublicFooter: React.FC = () => {
     (item): item is { title: string; href: string; bold: boolean } =>
       Boolean(item),
   );
+
+  const isUsingFeatureFlag = hasFeatureFlag("SHOW_INTERNAL_FEEDBACK");
+
   return (
     <Box>
-      <PhaseBanner />
+      {isUsingFeatureFlag ? <Feedback /> : <PhaseBanner />}
       <Footer items={[...footerItems]}>
         <Box display="flex" alignItems="center">
           <Box pr={2} display="flex">
diff --git a/editor.planx.uk/src/theme.ts b/editor.planx.uk/src/theme.ts
index 1681bcf3e1..ad56ad3331 100644
--- a/editor.planx.uk/src/theme.ts
+++ b/editor.planx.uk/src/theme.ts
@@ -284,7 +284,7 @@ const getThemeOptions = ({ primaryColour, linkColour, actionColour}: TeamTheme):
           root: {
             borderRadius: 0,
             textTransform: "none",
-            boxShadow: "inset 0 -2px 0 rgba(0,0,0,0.5)",
+            boxShadow: "inset 0 -2px 0 rgba(0,0,0,0.25)",
             padding: "0.7em 1.25em",
             lineHeight: LINE_HEIGHT_BASE,
             minWidth: "3em",
diff --git a/editor.planx.uk/src/ui/public/FeedbackDisclaimer.tsx b/editor.planx.uk/src/ui/public/FeedbackDisclaimer.tsx
new file mode 100644
index 0000000000..3029fc5c2c
--- /dev/null
+++ b/editor.planx.uk/src/ui/public/FeedbackDisclaimer.tsx
@@ -0,0 +1,16 @@
+import Box from "@mui/material/Box";
+import Link from "@mui/material/Link";
+import Typography from "@mui/material/Typography";
+import React from "react";
+
+export default function FeedbackDisclaimer(): FCReturn {
+  return (
+    <Box>
+      <Typography variant="body2">
+        Please do not include any personal or financial information in your
+        feedback. If you choose to do so we will process your personal data
+        according to our <Link href="#">privacy policy (TODO)</Link>.
+      </Typography>
+    </Box>
+  );
+}
diff --git a/editor.planx.uk/src/ui/public/FeedbackOption.tsx b/editor.planx.uk/src/ui/public/FeedbackOption.tsx
new file mode 100644
index 0000000000..b380249eaa
--- /dev/null
+++ b/editor.planx.uk/src/ui/public/FeedbackOption.tsx
@@ -0,0 +1,79 @@
+import EastIcon from "@mui/icons-material/East";
+import Button from "@mui/material/Button";
+import { styled } from "@mui/material/styles";
+import Typography from "@mui/material/Typography";
+import React from "react";
+
+interface Props {
+  label: string;
+  icon?: any;
+  showArrow?: boolean;
+  format?: "positive" | "negative";
+}
+
+const Root = styled(Button, {
+  shouldForwardProp: (prop) =>
+    !["fullWidth", "format"].includes(prop.toString()),
+})<Props>(({ theme, showArrow, format }) => ({
+  backgroundColor: theme.palette.common.white,
+  color: theme.palette.text.primary,
+  padding: "0.75em",
+  margin: theme.spacing(0.75, 0.75, 0.75, 0),
+  justifyContent: "flex-start",
+  ...(showArrow && {
+    width: "100%",
+    maxWidth: "460px",
+  }),
+  ...(format === "positive" && {
+    "& .buttonIcon": {
+      color: theme.palette.success.main,
+    },
+  }),
+  ...(format === "negative" && {
+    "& .buttonIcon": {
+      color: theme.palette.error.main,
+    },
+  }),
+}));
+
+const Icon = styled("span")(({ theme }) => ({
+  display: "flex",
+  alignItems: "center",
+  color: theme.palette.primary.main,
+}));
+
+const Label = styled(Typography)(({ theme }) => ({
+  padding: theme.spacing(0, 1),
+})) as typeof Typography;
+
+const ArrowButton = styled("span")(({ theme }) => ({
+  marginLeft: "auto",
+  display: "flex",
+  justifyContent: "center",
+  alignItems: "center",
+  backgroundColor: theme.palette.primary.main,
+  color: theme.palette.common.white,
+  width: "36px",
+  height: "36px",
+  flexShrink: "0",
+}));
+
+export default function FeedbackOption(props: Props): FCReturn {
+  return (
+    <Root {...props}>
+      {props.icon && (
+        <Icon className="buttonIcon">
+          <props.icon />
+        </Icon>
+      )}
+      <Label variant="h4" component="span">
+        {props.label}
+      </Label>
+      {props.showArrow && (
+        <ArrowButton>
+          <EastIcon />
+        </ArrowButton>
+      )}
+    </Root>
+  );
+}