From 37a74aca5c18c93ddeb6fe4418608f7456b54c0d Mon Sep 17 00:00:00 2001
From: Florian Herrengt <contact@florianherrengt.com>
Date: Fri, 4 Aug 2023 19:04:58 +0100
Subject: [PATCH] Fix dropdown position (#3)
* display site name
* fix dropdown position absolute
---
index.html | 2 +-
src/components/Dropdown/Dropdown.tsx | 13 ++++++++++++-
src/theme.ts | 2 +-
3 files changed, 14 insertions(+), 3 deletions(-)
diff --git a/index.html b/index.html
index 083a701..d7360f6 100644
--- a/index.html
+++ b/index.html
@@ -9,5 +9,5 @@
}
</style>
<div id="root"></div>
-<!-- <script src="https://d3e54v103j8qbb.cloudfront.net/gen/js/entrypoint-designer-extensions-client.e4ef1682e412a922c7e4.js"></script> -->
+<script src="https://d3e54v103j8qbb.cloudfront.net/gen/js/entrypoint-designer-extensions-client.e4ef1682e412a922c7e4.js"></script>
<script type="module" src="src/main.tsx"></script>
diff --git a/src/components/Dropdown/Dropdown.tsx b/src/components/Dropdown/Dropdown.tsx
index a6aa5df..4219dff 100644
--- a/src/components/Dropdown/Dropdown.tsx
+++ b/src/components/Dropdown/Dropdown.tsx
@@ -11,7 +11,18 @@ export interface DropdownProps {
const DropdownOptions: React.FC<DropdownProps> = (props) => {
return (
- <div style={{}}>
+ <div
+ style={{
+ position: "absolute",
+ zIndex: 100,
+ ...theme.background.secondary,
+ ...theme.border.primary,
+ borderTop: 0,
+ top: 25,
+ width: "100%",
+ left: -1,
+ }}
+ >
{props.options.map(({ label, value }) => (
<div
style={{ display: "flex", padding: "4px 8px", cursor: "pointer" }}
diff --git a/src/theme.ts b/src/theme.ts
index 4b60070..c00e420 100644
--- a/src/theme.ts
+++ b/src/theme.ts
@@ -26,7 +26,7 @@ export const theme: Theme = {
primary: {
borderColor: "#363636",
borderWidth: 1,
- borderRadius: 1,
+ borderRadius: 2,
borderStyle: "solid",
},
},