style(http-proxy): fix margin for responsive design (#1194)
This commit is contained in:
@@ -563,151 +563,157 @@ const SettingsMain = () => {
|
|||||||
</div>
|
</div>
|
||||||
{values.proxyEnabled && (
|
{values.proxyEnabled && (
|
||||||
<>
|
<>
|
||||||
<div className="form-row">
|
<div className="mr-2 ml-4">
|
||||||
<label htmlFor="proxyHostname" className="checkbox-label">
|
<div className="form-row">
|
||||||
<span className="mr-2 ml-4">
|
<label
|
||||||
|
htmlFor="proxyHostname"
|
||||||
|
className="checkbox-label"
|
||||||
|
>
|
||||||
{intl.formatMessage(messages.proxyHostname)}
|
{intl.formatMessage(messages.proxyHostname)}
|
||||||
</span>
|
</label>
|
||||||
</label>
|
<div className="form-input-area">
|
||||||
<div className="form-input-area">
|
<div className="form-input-field">
|
||||||
<div className="form-input-field">
|
<Field
|
||||||
<Field
|
id="proxyHostname"
|
||||||
id="proxyHostname"
|
name="proxyHostname"
|
||||||
name="proxyHostname"
|
type="text"
|
||||||
type="text"
|
/>
|
||||||
/>
|
</div>
|
||||||
|
{errors.proxyHostname &&
|
||||||
|
touched.proxyHostname &&
|
||||||
|
typeof errors.proxyHostname === 'string' && (
|
||||||
|
<div className="error">
|
||||||
|
{errors.proxyHostname}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
{errors.proxyHostname &&
|
|
||||||
touched.proxyHostname &&
|
|
||||||
typeof errors.proxyHostname === 'string' && (
|
|
||||||
<div className="error">{errors.proxyHostname}</div>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div className="form-row">
|
||||||
<div className="form-row">
|
<label htmlFor="proxyPort" className="checkbox-label">
|
||||||
<label htmlFor="proxyPort" className="checkbox-label">
|
|
||||||
<span className="mr-2 ml-4">
|
|
||||||
{intl.formatMessage(messages.proxyPort)}
|
{intl.formatMessage(messages.proxyPort)}
|
||||||
</span>
|
</label>
|
||||||
</label>
|
<div className="form-input-area">
|
||||||
<div className="form-input-area">
|
<div className="form-input-field">
|
||||||
<div className="form-input-field">
|
<Field
|
||||||
<Field id="proxyPort" name="proxyPort" type="text" />
|
id="proxyPort"
|
||||||
|
name="proxyPort"
|
||||||
|
type="text"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
{errors.proxyPort &&
|
||||||
|
touched.proxyPort &&
|
||||||
|
typeof errors.proxyPort === 'string' && (
|
||||||
|
<div className="error">{errors.proxyPort}</div>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
{errors.proxyPort &&
|
|
||||||
touched.proxyPort &&
|
|
||||||
typeof errors.proxyPort === 'string' && (
|
|
||||||
<div className="error">{errors.proxyPort}</div>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div className="form-row">
|
||||||
<div className="form-row">
|
<label htmlFor="proxySsl" className="checkbox-label">
|
||||||
<label htmlFor="proxySsl" className="checkbox-label">
|
|
||||||
<span className="mr-2 ml-4">
|
|
||||||
{intl.formatMessage(messages.proxySsl)}
|
{intl.formatMessage(messages.proxySsl)}
|
||||||
</span>
|
</label>
|
||||||
</label>
|
<div className="form-input-area">
|
||||||
<div className="form-input-area">
|
<Field
|
||||||
<Field
|
type="checkbox"
|
||||||
type="checkbox"
|
id="proxySsl"
|
||||||
id="proxySsl"
|
name="proxySsl"
|
||||||
name="proxySsl"
|
onChange={() => {
|
||||||
onChange={() => {
|
setFieldValue('proxySsl', !values.proxySsl);
|
||||||
setFieldValue('proxySsl', !values.proxySsl);
|
}}
|
||||||
}}
|
/>
|
||||||
/>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div className="form-row">
|
||||||
<div className="form-row">
|
<label htmlFor="proxyUser" className="checkbox-label">
|
||||||
<label htmlFor="proxyUser" className="checkbox-label">
|
|
||||||
<span className="mr-2 ml-4">
|
|
||||||
{intl.formatMessage(messages.proxyUser)}
|
{intl.formatMessage(messages.proxyUser)}
|
||||||
</span>
|
</label>
|
||||||
</label>
|
<div className="form-input-area">
|
||||||
<div className="form-input-area">
|
<div className="form-input-field">
|
||||||
<div className="form-input-field">
|
<Field
|
||||||
<Field id="proxyUser" name="proxyUser" type="text" />
|
id="proxyUser"
|
||||||
|
name="proxyUser"
|
||||||
|
type="text"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
{errors.proxyUser &&
|
||||||
|
touched.proxyUser &&
|
||||||
|
typeof errors.proxyUser === 'string' && (
|
||||||
|
<div className="error">{errors.proxyUser}</div>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
{errors.proxyUser &&
|
|
||||||
touched.proxyUser &&
|
|
||||||
typeof errors.proxyUser === 'string' && (
|
|
||||||
<div className="error">{errors.proxyUser}</div>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div className="form-row">
|
||||||
<div className="form-row">
|
<label
|
||||||
<label htmlFor="proxyPassword" className="checkbox-label">
|
htmlFor="proxyPassword"
|
||||||
<span className="mr-2 ml-4">
|
className="checkbox-label"
|
||||||
|
>
|
||||||
{intl.formatMessage(messages.proxyPassword)}
|
{intl.formatMessage(messages.proxyPassword)}
|
||||||
</span>
|
</label>
|
||||||
</label>
|
<div className="form-input-area">
|
||||||
<div className="form-input-area">
|
<div className="form-input-field">
|
||||||
<div className="form-input-field">
|
<Field
|
||||||
<Field
|
id="proxyPassword"
|
||||||
id="proxyPassword"
|
name="proxyPassword"
|
||||||
name="proxyPassword"
|
type="password"
|
||||||
type="password"
|
/>
|
||||||
/>
|
</div>
|
||||||
|
{errors.proxyPassword &&
|
||||||
|
touched.proxyPassword &&
|
||||||
|
typeof errors.proxyPassword === 'string' && (
|
||||||
|
<div className="error">
|
||||||
|
{errors.proxyPassword}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
{errors.proxyPassword &&
|
|
||||||
touched.proxyPassword &&
|
|
||||||
typeof errors.proxyPassword === 'string' && (
|
|
||||||
<div className="error">{errors.proxyPassword}</div>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div className="form-row">
|
||||||
<div className="form-row">
|
<label
|
||||||
<label
|
htmlFor="proxyBypassFilter"
|
||||||
htmlFor="proxyBypassFilter"
|
className="checkbox-label"
|
||||||
className="checkbox-label"
|
>
|
||||||
>
|
|
||||||
<span className="mr-2 ml-4">
|
|
||||||
{intl.formatMessage(messages.proxyBypassFilter)}
|
{intl.formatMessage(messages.proxyBypassFilter)}
|
||||||
</span>
|
<span className="label-tip">
|
||||||
<span className="label-tip ml-4">
|
{intl.formatMessage(messages.proxyBypassFilterTip)}
|
||||||
{intl.formatMessage(messages.proxyBypassFilterTip)}
|
</span>
|
||||||
</span>
|
</label>
|
||||||
</label>
|
<div className="form-input-area">
|
||||||
<div className="form-input-area">
|
<div className="form-input-field">
|
||||||
<div className="form-input-field">
|
<Field
|
||||||
<Field
|
id="proxyBypassFilter"
|
||||||
id="proxyBypassFilter"
|
name="proxyBypassFilter"
|
||||||
name="proxyBypassFilter"
|
type="text"
|
||||||
type="text"
|
/>
|
||||||
/>
|
</div>
|
||||||
|
{errors.proxyBypassFilter &&
|
||||||
|
touched.proxyBypassFilter &&
|
||||||
|
typeof errors.proxyBypassFilter === 'string' && (
|
||||||
|
<div className="error">
|
||||||
|
{errors.proxyBypassFilter}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
{errors.proxyBypassFilter &&
|
|
||||||
touched.proxyBypassFilter &&
|
|
||||||
typeof errors.proxyBypassFilter === 'string' && (
|
|
||||||
<div className="error">
|
|
||||||
{errors.proxyBypassFilter}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div className="form-row">
|
||||||
<div className="form-row">
|
<label
|
||||||
<label
|
htmlFor="proxyBypassLocalAddresses"
|
||||||
htmlFor="proxyBypassLocalAddresses"
|
className="checkbox-label"
|
||||||
className="checkbox-label"
|
>
|
||||||
>
|
|
||||||
<span className="mr-2 ml-4">
|
|
||||||
{intl.formatMessage(
|
{intl.formatMessage(
|
||||||
messages.proxyBypassLocalAddresses
|
messages.proxyBypassLocalAddresses
|
||||||
)}
|
)}
|
||||||
</span>
|
</label>
|
||||||
</label>
|
<div className="form-input-area">
|
||||||
<div className="form-input-area">
|
<Field
|
||||||
<Field
|
type="checkbox"
|
||||||
type="checkbox"
|
id="proxyBypassLocalAddresses"
|
||||||
id="proxyBypassLocalAddresses"
|
name="proxyBypassLocalAddresses"
|
||||||
name="proxyBypassLocalAddresses"
|
onChange={() => {
|
||||||
onChange={() => {
|
setFieldValue(
|
||||||
setFieldValue(
|
'proxyBypassLocalAddresses',
|
||||||
'proxyBypassLocalAddresses',
|
!values.proxyBypassLocalAddresses
|
||||||
!values.proxyBypassLocalAddresses
|
);
|
||||||
);
|
}}
|
||||||
}}
|
/>
|
||||||
/>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
|
|||||||
Reference in New Issue
Block a user