style: Align with the design

visualize-admin · Nov 26, 2024 · 2bf18ae · 2bf18ae
1 parent 649862e
commit 2bf18ae
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 17 deletions.
diff --git a/app/components/form.tsx b/app/components/form.tsx
@@ -548,6 +548,7 @@ export const MinimalisticSelect = (props: MinimalisticSelectProps) => {
     onChange,
     smaller = false,
     disabled,
+    sx,
     ...rest
   } = props;
 
@@ -559,21 +560,6 @@ export const MinimalisticSelect = (props: MinimalisticSelectProps) => {
         </Label>
       )}
       <MUISelect
-        sx={{
-          borderColor: "transparent",
-          fontSize: smaller ? ["0.625rem", "0.75rem", "0.75rem"] : "inherit",
-          lineHeight: "normal !important",
-
-          backgroundColor: "transparent",
-          p: 0,
-          pr: 2,
-          pl: 1,
-          mr: 1, // Fix for Chrome which cuts of the label otherwise
-          ":focus": {
-            outline: "none",
-            borderColor: "primary.main",
-          },
-        }}
         size={smaller ? "small" : "medium"}
         variant="standard"
         id={id}
@@ -586,13 +572,28 @@ export const MinimalisticSelect = (props: MinimalisticSelectProps) => {
             {...props}
             style={{
               ...props.style,
-              right: 12,
               transition: "transform 0.1s",
             }}
           >
             <Icon name="chevronDown" size={16} />
           </span>
         )}
+        sx={{
+          borderColor: "transparent",
+          fontSize: smaller ? ["0.625rem", "0.75rem", "0.75rem"] : "inherit",
+          lineHeight: "normal !important",
+          backgroundColor: "transparent",
+          p: 0,
+          pl: 1,
+          ":focus": {
+            outline: "none",
+            borderColor: "primary.main",
+          },
+          "& .MuiInput-input": {
+            paddingRight: "1.25rem !important",
+          },
+          ...sx,
+        }}
         {...rest}
       >
         {options.map((opt) => (

diff --git a/app/configurator/components/add-dataset-dialog.tsx b/app/configurator/components/add-dataset-dialog.tsx
@@ -901,7 +901,7 @@ export const DatasetDialog = ({
               display="flex"
               alignItems="center"
               component="form"
-              gap="0.25rem"
+              gap="0.5rem"
               mb="1rem"
               onSubmit={handleSubmit}
             >