From 36b2d7d09031450a1dafe100bd4bf81007b89390 Mon Sep 17 00:00:00 2001
From: Matiss Janis Aboltins <matiss@mja.lv>
Date: Sun, 23 Apr 2023 07:16:42 +0100
Subject: [PATCH] :art: (autocomplete) set min-width for the tooltip (#933)
---
.../components/autocomplete/Autocomplete.js | 1 +
.../autocomplete/autocomplete-styles.js | 87 -------------------
upcoming-release-notes/933.md | 6 ++
3 files changed, 7 insertions(+), 87 deletions(-)
delete mode 100644 packages/desktop-client/src/components/autocomplete/autocomplete-styles.js
create mode 100644 upcoming-release-notes/933.md
diff --git a/packages/desktop-client/src/components/autocomplete/Autocomplete.js b/packages/desktop-client/src/components/autocomplete/Autocomplete.js
index e2d880539..d6b3a4ea7 100644
--- a/packages/desktop-client/src/components/autocomplete/Autocomplete.js
+++ b/packages/desktop-client/src/components/autocomplete/Autocomplete.js
@@ -424,6 +424,7 @@ function SingleAutocomplete({
padding: 0,
backgroundColor: colors.n1,
color: 'white',
+ minWidth: 200,
...tooltipStyle,
}}
{...tooltipProps}
diff --git a/packages/desktop-client/src/components/autocomplete/autocomplete-styles.js b/packages/desktop-client/src/components/autocomplete/autocomplete-styles.js
deleted file mode 100644
index ae16c2827..000000000
--- a/packages/desktop-client/src/components/autocomplete/autocomplete-styles.js
+++ /dev/null
@@ -1,87 +0,0 @@
-import { styles as actualStyles, colors } from '../../style';
-
-const colourStyles = {
- ...actualStyles.lightScrollbar,
- control: styles => ({
- ...styles,
- backgroundColor: 'white',
- border: '1px solid rgb(208, 208, 208)',
- borderRadius: 4,
- outline: 0,
- marginLeft: -1,
- marginRight: 1,
- padding: '5px 2px',
- fontSize: '13px',
- minHeight: 'auto',
- }),
- input: styles => ({
- ...styles,
- padding: '0 2px',
- margin: 0,
- overflow: 'hidden',
- }),
- menuPortal: styles => ({
- ...styles,
- zIndex: 5000,
- minWidth: 200,
- }),
- menu: (styles, { selectProps }) => ({
- ...styles,
- minWidth: 200,
- backgroundColor: colors.n1,
- marginTop: 2,
- marginBottom: 2,
- position: selectProps['data-embedded'] ? 'relative' : styles.position,
- overflow: 'hidden',
- }),
- menuList: styles => ({
- ...styles,
- padding: 0,
-
- // Custom scrollbar styling
- ...Object.entries(actualStyles.lightScrollbar).reduce(
- (carry, [key, value]) => ({
- ...carry,
- [key.replace('& ', '')]: value,
- }),
- {},
- ),
- }),
- group: styles => ({
- ...styles,
- padding: '5px 0 0',
- }),
- groupHeading: styles => ({
- ...styles,
- color: colors.y9,
- textTransform: 'none',
- paddingLeft: '9px',
- fontSize: '100%',
- fontWeight: 'normal',
- }),
- option: (styles, { isFocused }) => ({
- ...styles,
- backgroundColor: isFocused ? colors.n5 : undefined,
- color: 'white',
- padding: '3px 20px',
- fontSize: 13,
- }),
- valueContainer: (styles, { isMulti, selectProps }) => ({
- ...styles,
- padding: 'none',
- overflow: 'visible',
- marginTop: isMulti && selectProps.value?.length ? -4 : undefined,
- marginBottom: isMulti && selectProps.value?.length ? -4 : undefined,
- }),
- clearIndicator: styles => ({
- ...styles,
- padding: 'none',
- '> svg': { height: 15, width: 15 },
- }),
- multiValue: styles => ({
- ...styles,
- backgroundColor: colors.b9,
- }),
-};
-
-export default colourStyles;
diff --git a/upcoming-release-notes/933.md b/upcoming-release-notes/933.md
new file mode 100644
index 000000000..d162e46cf
--- /dev/null
+++ b/upcoming-release-notes/933.md
@@ -0,0 +1,6 @@
+---
+category: Enhancements
+authors: [MatissJanis]
+---
+
+Autocomplete: set min-width for the tooltip
--
GitLab