mirror of
https://github.com/upscayl/upscayl.git
synced 2024-11-27 17:00:52 +01:00
Fixed react-select coloring
This commit is contained in:
parent
268a1e1503
commit
3539867290
@ -33,7 +33,7 @@ function LeftPaneSteps(props) {
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="animate-step-in animate flex h-screen flex-col gap-7 overflow-auto p-5">
|
||||
<div className="animate-step-in animate flex h-screen flex-col gap-7 overflow-auto rounded-r-lg p-5">
|
||||
{/* BATCH OPTION */}
|
||||
<div className="flex flex-row items-center gap-2">
|
||||
<input
|
||||
@ -87,42 +87,10 @@ function LeftPaneSteps(props) {
|
||||
DropdownIndicator: () => null,
|
||||
}}
|
||||
onChange={props.handleModelChange}
|
||||
className="react-select-container select"
|
||||
className="react-select-container"
|
||||
classNamePrefix="react-select"
|
||||
defaultValue={modelOptions[0]}
|
||||
theme={(theme) => ({
|
||||
...theme,
|
||||
colors: {
|
||||
...theme.colors,
|
||||
primary: "rgb(71 85 105)",
|
||||
primary25: "#f5f5f5",
|
||||
primary50: "#f5f5f5",
|
||||
},
|
||||
})}
|
||||
styles={{
|
||||
input: (provided, state) => ({
|
||||
...provided,
|
||||
color: "rgb(100 100 100)",
|
||||
}),
|
||||
dropdownIndicator: (provided, state) => ({
|
||||
...provided,
|
||||
color: "rgb(15 15 15)",
|
||||
}),
|
||||
placeholder: (provided, state) => ({
|
||||
...provided,
|
||||
color: "rgb(15 15 15)",
|
||||
fontWeight: "500",
|
||||
}),
|
||||
singleValue: (provided, state) => ({
|
||||
...provided,
|
||||
color: "rgb(15 15 15)",
|
||||
fontWeight: "500",
|
||||
}),
|
||||
menu: (provided, state) => ({
|
||||
...provided,
|
||||
background: "#f5f5f5",
|
||||
}),
|
||||
}}
|
||||
defaultMenuIsOpen={true}
|
||||
/>
|
||||
|
||||
{props.model !== "models-DF2K" && !props.batchMode && (
|
||||
|
@ -264,7 +264,7 @@ const Home = () => {
|
||||
|
||||
return (
|
||||
<div className="flex h-screen w-screen flex-row overflow-hidden bg-base-300">
|
||||
<div className="flex h-screen w-96 flex-col bg-base-100">
|
||||
<div className="flex h-screen w-96 flex-col rounded-r-2xl bg-base-100">
|
||||
{((!batchMode && imagePath.length > 0) ||
|
||||
(batchMode && batchFolderPath.length > 0)) && (
|
||||
<ResetButton resetImagePaths={resetImagePaths} />
|
||||
|
@ -48,17 +48,36 @@
|
||||
.step-heading {
|
||||
@apply mb-2 font-semibold;
|
||||
}
|
||||
|
||||
.react-select-container {
|
||||
@apply w-40 text-black;
|
||||
@apply w-40;
|
||||
}
|
||||
.react-select-container .react-select__control {
|
||||
@apply cursor-pointer rounded-lg p-1;
|
||||
@apply h-12 cursor-pointer rounded-lg !border-0 !border-none !border-transparent bg-primary shadow-none;
|
||||
}
|
||||
|
||||
.react-select-container .react-select__control--menu-is-open {
|
||||
@apply bg-primary-focus;
|
||||
}
|
||||
|
||||
.react-select-container .react-select__single-value {
|
||||
@apply text-sm font-semibold uppercase text-primary-content;
|
||||
}
|
||||
|
||||
.react-select-container .react-select__input-container {
|
||||
@apply text-sm font-semibold uppercase text-primary-content;
|
||||
}
|
||||
|
||||
.react-select-container .react-select__menu {
|
||||
@apply rounded-lg bg-slate-300 p-1;
|
||||
@apply rounded-lg bg-primary p-1;
|
||||
}
|
||||
|
||||
.react-select-container .react-select__option {
|
||||
@apply cursor-pointer rounded-md;
|
||||
@apply cursor-pointer rounded-md bg-primary text-slate-50 hover:bg-primary-focus;
|
||||
}
|
||||
|
||||
.react-select-container .react-select__option--is-selected {
|
||||
@apply bg-accent;
|
||||
}
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user