Dark UI for react-select

frontend/src/components/Form/DNSProviderFields.tsx

@@ -46,6 +46,8 @@ export function DNSProviderFields() {
 							DNS Provider
 						</label>
 						<Select
+							className="react-select-container"
+							classNamePrefix="react-select"
 							name={field.name}
 							id="dnsProvider"
 							closeMenuOnSelect={true}

frontend/src/components/Form/DomainNamesField.tsx

@@ -91,6 +91,8 @@ export function DomainNamesField({
 						{intl.formatMessage({ id: label })}
 					</label>
 					<CreatableSelect
+						className="react-select-container"
+						classNamePrefix="react-select"
 						name={field.name}
 						id={id}
 						closeMenuOnSelect={true}

frontend/src/components/Form/SSLCertificateField.tsx

@@ -103,6 +103,8 @@ export function SSLCertificateField({
 					{isError ? <div className="invalid-feedback">{`${error}`}</div> : null}
 					{!isLoading && !isError ? (
 						<Select
+							className="react-select-container"
+							classNamePrefix="react-select"
 							defaultValue={options[0]}
 							options={options}
 							components={{ Option }}

frontend/src/components/Form/SSLOptionsFields.tsx

@@ -107,7 +107,7 @@ export function SSLOptionsFields() {
 
 					<Field name="letsencryptEmail">
 						{({ field }: any) => (
-							<div className="row mt-5">
+							<div className="mt-5">
 								<label htmlFor="letsencryptEmail" className="form-label">
 									Email Address for Let's Encrypt
 								</label>