a
/
badguardhome
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge: + client: Use monospace font in coding-like inputs 

Close #1650

Squashed commit of the following:

commit 0956b77d2675bf569ab8413bf1a905167f068fbd
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Tue May 12 18:22:55 2020 +0300

    Replace css variable

commit 7c65954e3727c09404999d4d029276f78a8d0ffe
Author: ArtemBaskal <a.baskal@adguard.com>
Date:   Tue May 12 18:06:31 2020 +0300

    + client: Use monospace font in coding-like inputs
This commit is contained in:
Artem Baskal 2020-05-13 15:34:56 +03:00
parent 4d66d25fda
commit 1f954ab673
4 changed files with 56 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
client/src/components/App/index.css
View File

@ -1,3 +1,7 @@
:root {
font-family-monospace: Monaco, Menlo, "Ubuntu Mono", Consolas, source-code-pro, monospace;
}
body { body {
margin: 0; margin: 0;
padding: 0; padding: 0;
@ -30,3 +34,7 @@ body {
.hidden { .hidden {
display: none; display: none;
} }
.font-monospace {
font-family: var(--font-family-monospace);
}

2
client/src/components/Filters/CustomRules.js
View File

@ -54,7 +54,7 @@ class CustomRules extends Component {
> >
<form onSubmit={this.handleSubmit}> <form onSubmit={this.handleSubmit}>
<textarea <textarea
className="form-control form-control--textarea-large" className="form-control form-control--textarea-large font-monospace"
value={userRules} value={userRules}
onChange={this.handleChange} onChange={this.handleChange}
/> />

93
client/src/components/Settings/Dns/Access/Form.js
View File

@ -5,61 +5,58 @@ import { Trans, withNamespaces } from 'react-i18next';
import flow from 'lodash/flow'; import flow from 'lodash/flow';
import { renderTextareaField } from '../../../../helpers/form'; import { renderTextareaField } from '../../../../helpers/form';
const fields = [
{
id: 'allowed_clients',
title: 'access_allowed_title',
subtitle: 'access_allowed_desc',
},
{
id: 'disallowed_clients',
title: 'access_disallowed_title',
subtitle: 'access_disallowed_desc',
},
{
id: 'blocked_hosts',
title: 'access_blocked_title',
subtitle: 'access_blocked_desc',
},
];
const Form = (props) => { const Form = (props) => {
const { const {
handleSubmit, submitting, invalid, processingSet, handleSubmit, submitting, invalid, processingSet,
} = props; } = props;
const renderField = ({
id, title, subtitle, disabled = processingSet,
}) => <div key={id} className="form__group mb-5">
<label className="form__label form__label--with-desc" htmlFor={id}>
<Trans>{title}</Trans>
</label>
<div className="form__desc form__desc--top">
<Trans>{subtitle}</Trans>
</div>
<Field
id={id}
name={id}
component={renderTextareaField}
type="text"
className="form-control form-control--textarea font-monospace"
disabled={disabled}
/>
</div>;
renderField.propTypes = {
id: PropTypes.string,
title: PropTypes.string,
subtitle: PropTypes.string,
disabled: PropTypes.bool,
};
return ( return (
<form onSubmit={handleSubmit}> <form onSubmit={handleSubmit}>
<div className="form__group mb-5"> {fields.map(renderField)}
<label className="form__label form__label--with-desc" htmlFor="allowed_clients">
<Trans>access_allowed_title</Trans>
</label>
<div className="form__desc form__desc--top">
<Trans>access_allowed_desc</Trans>
</div>
<Field
id="allowed_clients"
name="allowed_clients"
component={renderTextareaField}
type="text"
className="form-control form-control--textarea"
disabled={processingSet}
/>
</div>
<div className="form__group mb-5">
<label className="form__label form__label--with-desc" htmlFor="disallowed_clients">
<Trans>access_disallowed_title</Trans>
</label>
<div className="form__desc form__desc--top">
<Trans>access_disallowed_desc</Trans>
</div>
<Field
id="disallowed_clients"
name="disallowed_clients"
component={renderTextareaField}
type="text"
className="form-control form-control--textarea"
disabled={processingSet}
/>
</div>
<div className="form__group mb-5">
<label className="form__label form__label--with-desc" htmlFor="blocked_hosts">
<Trans>access_blocked_title</Trans>
</label>
<div className="form__desc form__desc--top">
<Trans>access_blocked_desc</Trans>
</div>
<Field
id="blocked_hosts"
name="blocked_hosts"
component={renderTextareaField}
type="text"
className="form-control form-control--textarea"
disabled={processingSet}
/>
</div>
<div className="card-actions"> <div className="card-actions">
<div className="btn-list"> <div className="btn-list">
<button <button

4
client/src/components/Settings/Dns/Upstream/Form.js
View File

@ -17,7 +17,7 @@ const getInputFields = (parallel_requests_selected, fastest_addr_selected) => [{
name: 'upstream_dns', name: 'upstream_dns',
type: 'text', type: 'text',
component: 'textarea', component: 'textarea',
className: 'form-control form-control--textarea', className: 'form-control form-control--textarea font-monospace',
placeholder: 'upstream_dns', placeholder: 'upstream_dns',
}, },
{ {
@ -96,7 +96,7 @@ let Form = (props) => {
name="bootstrap_dns" name="bootstrap_dns"
component="textarea" component="textarea"
type="text" type="text"
className="form-control form-control--textarea form-control--textarea-small" className="form-control form-control--textarea form-control--textarea-small font-monospace"
placeholder={t('bootstrap_dns')} placeholder={t('bootstrap_dns')}
disabled={processingSetConfig} disabled={processingSetConfig}
/> />