diff --git a/public/locales/en/gamepage.json b/public/locales/en/gamepage.json index f18c112488..859cfb6051 100644 --- a/public/locales/en/gamepage.json +++ b/public/locales/en/gamepage.json @@ -198,7 +198,9 @@ "title": "Select components to Install" }, "setting": { + "show-wine-settings": "Show Wine settings", "use-default-wine-settings": "Use Default Wine Settings", + "warn-use-default-wine-settings": "Only use this option if you know what you are doing.
Sharing the same prefix for multiple games can create problems if their dependencies are incompatible.", "winecrossoverbottle": "CrossOver Bottle" }, "sideload": { diff --git a/src/frontend/components/UI/PathSelectionBox/index.tsx b/src/frontend/components/UI/PathSelectionBox/index.tsx index 6c55725f0b..a63cb830a8 100644 --- a/src/frontend/components/UI/PathSelectionBox/index.tsx +++ b/src/frontend/components/UI/PathSelectionBox/index.tsx @@ -27,6 +27,7 @@ interface Props { noDeleteButton?: boolean label?: string afterInput?: ReactNode + disabled?: boolean } const PathSelectionBox = ({ @@ -41,7 +42,8 @@ const PathSelectionBox = ({ noDeleteButton = false, htmlId, label, - afterInput + afterInput, + disabled = false }: Props) => { const { t } = useTranslation() // We only send `onPathChange` updates when the user is done editing, so we @@ -83,7 +85,7 @@ const PathSelectionBox = ({ onIconClick={handleIconClick} placeholder={placeholder} icon={!noDeleteButton && path ? : } - disabled={!canEditPath} + disabled={!canEditPath || disabled} htmlId={htmlId} label={label} afterInput={afterInput} diff --git a/src/frontend/components/UI/TextInputField/index.css b/src/frontend/components/UI/TextInputField/index.css index 173e5c4622..c3088da7c8 100644 --- a/src/frontend/components/UI/TextInputField/index.css +++ b/src/frontend/components/UI/TextInputField/index.css @@ -24,6 +24,11 @@ -moz-box-sizing: border-box; box-sizing: border-box; min-width: 100px; + + &:disabled { + opacity: 0.7; + cursor: not-allowed; + } } .textInputFieldWrapper label { @@ -45,6 +50,12 @@ background: none; color: var(--text-default); padding: var(--space-3xs) var(--space-2xs); + &:disabled { + opacity: 0.7; + .MuiSvgIcon-root { + cursor: not-allowed; + } + } } .textInputFieldWrapper .inputIcon ~ input { diff --git a/src/frontend/components/UI/TextInputWithIconField/index.tsx b/src/frontend/components/UI/TextInputWithIconField/index.tsx index fd088f4ef1..22aa2ce7e4 100644 --- a/src/frontend/components/UI/TextInputWithIconField/index.tsx +++ b/src/frontend/components/UI/TextInputWithIconField/index.tsx @@ -19,13 +19,19 @@ interface TextInputWithIconFieldProps { const TextInputWithIconField = ({ icon, onIconClick, + disabled = false, ...props }: TextInputWithIconFieldProps) => { return ( + {icon} } diff --git a/src/frontend/screens/Library/components/InstallModal/DownloadDialog/index.tsx b/src/frontend/screens/Library/components/InstallModal/DownloadDialog/index.tsx index af160403d7..ad9410cac2 100644 --- a/src/frontend/screens/Library/components/InstallModal/DownloadDialog/index.tsx +++ b/src/frontend/screens/Library/components/InstallModal/DownloadDialog/index.tsx @@ -654,7 +654,6 @@ export default function DownloadDialog({ /> )} - {children} {(haveDLCs || haveSDL) && (
{t('sdl.title', 'Select components to Install')}: @@ -686,6 +685,7 @@ export default function DownloadDialog({ setDlcsToInstall={setDlcsToInstall} /> )} + {children}