Inline and prune

This commit is contained in:
Manav Rathi
2024-09-09 17:13:41 +05:30
parent 32601826c1
commit b3016dffca
4 changed files with 67 additions and 97 deletions

View File

@@ -57,7 +57,7 @@ import {
getDefaultOptions,
} from "services/searchService";
import { Collection } from "types/collection";
import { SelectStyles } from "../styles/search";
const { Option, ValueContainer, Menu } = components;
@@ -291,6 +291,72 @@ const SearchInputWrapper = styled(CenteredFlex, {
`}
`;
export const SelectStyles = {
container: (style) => ({
...style,
flex: 1,
}),
control: (style, { isFocused }) => ({
...style,
backgroundColor: "rgba(255, 255, 255, 0.1)",
borderColor: isFocused ? "#1dba54" : "transparent",
boxShadow: "none",
":hover": {
borderColor: "#1dba54",
cursor: "text",
},
}),
input: (style) => ({
...style,
color: "#fff",
}),
menu: (style) => ({
...style,
marginTop: "1px",
backgroundColor: "#1b1b1b",
}),
option: (style, { isFocused }) => ({
...style,
padding: 0,
backgroundColor: "transparent !important",
"& :hover": {
cursor: "pointer",
},
"& .main": {
backgroundColor: isFocused && "#202020",
},
"&:last-child .MuiDivider-root": {
display: "none",
},
}),
dropdownIndicator: (style) => ({
...style,
display: "none",
}),
indicatorSeparator: (style) => ({
...style,
display: "none",
}),
clearIndicator: (style) => ({
...style,
display: "none",
}),
singleValue: (style) => ({
...style,
backgroundColor: "transparent",
color: "#d1d1d1",
marginLeft: "36px",
}),
placeholder: (style) => ({
...style,
color: "rgba(255, 255, 255, 0.7)",
wordSpacing: "2px",
whiteSpace: "nowrap",
marginLeft: "40px",
}),
};
const OptionWithInfo = (props) => (
<Option {...props}>
<LabelWithInfo data={props.data} />

View File

@@ -1,20 +0,0 @@
import { SelectStyles } from "./search";
export const DropdownStyle = {
...SelectStyles,
dropdownIndicator: (style) => ({
...style,
margin: "0px",
}),
singleValue: (style) => ({
...style,
color: "#d1d1d1",
width: "240px",
}),
control: (style, { isFocused }) => ({
...style,
...SelectStyles.control(style, { isFocused }),
minWidth: "240px",
paddingLeft: "8px",
}),
};

View File

@@ -1,11 +0,0 @@
import { DropdownStyle } from "./dropdown";
export const linkExpiryStyle = {
...DropdownStyle,
placeholder: (style) => ({
...style,
color: "#d1d1d1",
width: "100%",
textAlign: "center",
}),
};

View File

@@ -1,65 +0,0 @@
export const SelectStyles = {
container: (style) => ({
...style,
flex: 1,
}),
control: (style, { isFocused }) => ({
...style,
backgroundColor: "rgba(255, 255, 255, 0.1)",
borderColor: isFocused ? "#1dba54" : "transparent",
boxShadow: "none",
":hover": {
borderColor: "#1dba54",
cursor: "text",
},
}),
input: (style) => ({
...style,
color: "#fff",
}),
menu: (style) => ({
...style,
marginTop: "1px",
backgroundColor: "#1b1b1b",
}),
option: (style, { isFocused }) => ({
...style,
padding: 0,
backgroundColor: "transparent !important",
"& :hover": {
cursor: "pointer",
},
"& .main": {
backgroundColor: isFocused && "#202020",
},
"&:last-child .MuiDivider-root": {
display: "none",
},
}),
dropdownIndicator: (style) => ({
...style,
display: "none",
}),
indicatorSeparator: (style) => ({
...style,
display: "none",
}),
clearIndicator: (style) => ({
...style,
display: "none",
}),
singleValue: (style) => ({
...style,
backgroundColor: "transparent",
color: "#d1d1d1",
marginLeft: "36px",
}),
placeholder: (style) => ({
...style,
color: "rgba(255, 255, 255, 0.7)",
wordSpacing: "2px",
whiteSpace: "nowrap",
marginLeft: "40px",
}),
};