diff --git a/public/App.css b/public/App.css
index c21c6878..6c4fa420 100644
--- a/public/App.css
+++ b/public/App.css
@@ -11,3 +11,37 @@ body {
.cell-viewer-app {
width: 100vw;
}
+
+#onetrust-consent-sdk {
+ & #onetrust-banner-sdk {
+ border-radius: 5px;
+
+ & #onetrust-pc-btn-handler {
+ font-weight: 400;
+ padding: 12px 10px;
+ }
+ }
+
+ /* Darken all text for increased contrast */
+ & h1,
+ & h2,
+ & h3,
+ & h4,
+ & p,
+ & #onetrust-policy-text {
+ color: #323233 !important;
+ }
+
+ /* Add margin to top of cookie banner popup's header for visual consistency */
+ & #onetrust-pc-sdk {
+ & #ot-pc-title {
+ margin-top: 20px;
+ }
+ }
+
+ & #accept-recommended-btn-handler,
+ & #onetrust-accept-btn-handler,
+ & .save-preference-btn-handler {
+ border-radius: 6px;
+ }
+}
diff --git a/src/aics-image-viewer/components/StyleProvider/index.tsx b/src/aics-image-viewer/components/StyleProvider/index.tsx
index 092886ae..e689d132 100644
--- a/src/aics-image-viewer/components/StyleProvider/index.tsx
+++ b/src/aics-image-viewer/components/StyleProvider/index.tsx
@@ -422,6 +422,10 @@ export default function StyleProvider(props: PropsWithChildren<{}>): ReactElemen
borderRadiusLG: 0,
colorTextHeading: theme.colors.text.section,
},
+ Divider: {
+ colorSplit: theme.colors.layout.dividers,
+ marginLG: 0,
+ },
Layout: {
siderBg: theme.colors.controlPanel.bg,
},
diff --git a/website/components/LandingPage/index.tsx b/website/components/LandingPage/index.tsx
index a1e20f98..8c4ea1ab 100644
--- a/website/components/LandingPage/index.tsx
+++ b/website/components/LandingPage/index.tsx
@@ -1,6 +1,6 @@
import { faUpRightFromSquare } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { Button, Tooltip } from "antd";
+import { Button, Divider, Tooltip } from "antd";
import React, { ReactElement, useEffect, useState } from "react";
import { useNavigate } from "react-router";
import { useSearchParams } from "react-router-dom";
@@ -222,6 +222,14 @@ const InReviewFlag = styled(FlexRowAlignCenter)`
}
`;
+const CookieSettingsButton = styled(Button)`
+ color: var(--color-text-body);
+ &:focus-visible > span,
+ &:hover > span {
+ text-decoration: underline;
+ }
+`;
+
export default function LandingPage(): ReactElement {
// Rendering
const navigation = useNavigate();
@@ -396,6 +404,16 @@ export default function LandingPage(): ReactElement {
{landingPageContent.map(renderProject)}
+
+
+
+
+
+ Cookie settings
+ (opens popup menu)
+
+
+
);
}