Apply desgin feedback

This commit is contained in:
soupette 2019-03-23 08:15:06 +01:00
parent 8e672abc78
commit c1464f73be
6 changed files with 51 additions and 31 deletions

View File

@ -49,6 +49,7 @@
.modalPosition { .modalPosition {
max-width: 37.5rem !important; max-width: 37.5rem !important;
margin: 16rem auto !important;
> div { > div {
width: 37.5rem; width: 37.5rem;
padding: 0 !important; padding: 0 !important;

View File

@ -1,8 +1,8 @@
/** /**
* *
* CustomCheckbox * CustomCheckbox
* *
*/ */
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
@ -12,7 +12,8 @@ import InputNumber from 'components/InputNumberWithErrors';
// import styles from './styles.scss'; // import styles from './styles.scss';
class CustomCheckbox extends React.Component { // eslint-disable-line react/prefer-stateless-function class CustomCheckbox extends React.Component {
// eslint-disable-line react/prefer-stateless-function
state = { isChecked: this.props.value !== null && this.props.value !== undefined }; state = { isChecked: this.props.value !== null && this.props.value !== undefined };
handleChange = ({ target: { checked } }) => { handleChange = ({ target: { checked } }) => {
@ -23,7 +24,7 @@ class CustomCheckbox extends React.Component { // eslint-disable-line react/pref
const target = { name, value }; const target = { name, value };
onChange({ target }); onChange({ target });
} };
handleInputNumberChange = ({ target: { value } }) => { handleInputNumberChange = ({ target: { value } }) => {
const { name, onChange } = this.props; const { name, onChange } = this.props;
@ -34,17 +35,17 @@ class CustomCheckbox extends React.Component { // eslint-disable-line react/pref
}; };
onChange({ target }); onChange({ target });
} };
render() { render() {
const { isChecked } = this.state; const { isChecked } = this.state;
const { didCheckErrors, errors, label, name, value} = this.props; const { didCheckErrors, errors, label, name, value } = this.props;
return ( return (
<div className="col-md-12" style={{ marginTop: -4, marginBottom: 9 }}> <div className="col-md-12" style={{ marginTop: -4, marginBottom: 9 }}>
<FormattedMessage id={label.id}> <FormattedMessage id={label.id}>
{msg => ( {msg => (
<label htmlFor={name} style={{ fontWeight: '500', cursor: 'pointer' }}> <label htmlFor={name} style={{ fontWeight: '500', fontSize: 12, cursor: 'pointer' }}>
<input <input
style={{ marginLeft: 0, marginRight: 13 }} style={{ marginLeft: 0, marginRight: 13 }}
checked={isChecked} checked={isChecked}
@ -90,10 +91,7 @@ CustomCheckbox.propTypes = {
}), }),
name: PropTypes.string, name: PropTypes.string,
onChange: PropTypes.func.isRequired, onChange: PropTypes.func.isRequired,
value: PropTypes.oneOfType([ value: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
PropTypes.number,
PropTypes.string,
]),
}; };
export default CustomCheckbox; export default CustomCheckbox;

View File

@ -5,6 +5,7 @@
padding-top: .6rem; padding-top: .6rem;
color: #9EA7B8; color: #9EA7B8;
font-size: 1.2rem; font-size: 1.2rem;
font-weight: 500;
letter-spacing: 0.7px; letter-spacing: 0.7px;
text-transform: uppercase; text-transform: uppercase;
>div:last-child { >div:last-child {

View File

@ -16,7 +16,11 @@ import styles from './styles.scss';
/* istanbul ignore next */ /* istanbul ignore next */
function HeaderNavLink({ custom, id, isActive, onClick }) { function HeaderNavLink({ custom, id, isActive, onClick }) {
return ( return (
<div className={cn(isActive && styles.headerNavLink)} onClick={() => onClick(id)}> <div
className={cn(isActive && styles.headerNavLink)}
style={{ cursor: 'pointer' }}
onClick={() => onClick(id)}
>
<FormattedMessage id={`${pluginId}.popUpForm.navContainer.${custom || id}`} /> <FormattedMessage id={`${pluginId}.popUpForm.navContainer.${custom || id}`} />
</div> </div>
); );

View File

@ -17,6 +17,7 @@ import pluginId from '../../pluginId';
import styles from '../TableList/styles.scss'; import styles from '../TableList/styles.scss';
/* eslint-disable jsx-a11y/no-static-element-interactions */ /* eslint-disable jsx-a11y/no-static-element-interactions */
/* eslint-disable react/jsx-curly-brace-presence */ /* eslint-disable react/jsx-curly-brace-presence */
/* eslint-disable indent */
class TableListRow extends React.Component { class TableListRow extends React.Component {
// eslint-disable-line react/prefer-stateless-function // eslint-disable-line react/prefer-stateless-function
@ -46,6 +47,18 @@ class TableListRow extends React.Component {
this.setState({ showWarning: false }); this.setState({ showWarning: false });
}; };
handleEdit = () => {
const {
push,
rowItem: { name, source },
} = this.props;
push({
pathname: `/plugins/content-type-builder/models/${name}${source ? `&source=${source}` : ''}`,
search: `modalType=model&settingType=base&actionType=edit&modelName=${name}`,
});
};
handleGoTo = () => { handleGoTo = () => {
const { push } = this.props; const { push } = this.props;
@ -88,7 +101,10 @@ class TableListRow extends React.Component {
const spanStyle = this.props.rowItem.isTemporary ? '60%' : '100%'; const spanStyle = this.props.rowItem.isTemporary ? '60%' : '100%';
const icons = this.props.rowItem.source const icons = this.props.rowItem.source
? [] ? []
: [{ icoType: 'trash', onClick: this.handleShowModalWarning, id: `delete${name}` }]; : [
{ icoType: 'pencil', onClick: this.handleEdit },
{ icoType: 'trash', onClick: this.handleShowModalWarning, id: `delete${name}` },
];
return ( return (
<ListRow onClick={this.handleGoTo} style={{ height: '5.4rem' }}> <ListRow onClick={this.handleGoTo} style={{ height: '5.4rem' }}>

View File

@ -1,4 +1,16 @@
[ [
{
"type": "string",
"description": "content-type-builder.popUpForm.attributes.string.description"
},
{
"type": "text",
"description": "content-type-builder.popUpForm.attributes.text.description"
},
{
"type": "number",
"description": "content-type-builder.popUpForm.attributes.number.description"
},
{ {
"type": "boolean", "type": "boolean",
"description": "content-type-builder.popUpForm.attributes.boolean.description" "description": "content-type-builder.popUpForm.attributes.boolean.description"
@ -12,8 +24,8 @@
"description": "content-type-builder.popUpForm.attributes.email.description" "description": "content-type-builder.popUpForm.attributes.email.description"
}, },
{ {
"type": "enumeration", "type": "password",
"description": "content-type-builder.popUpForm.attributes.enumeration.description" "description": "content-type-builder.popUpForm.attributes.password.description"
}, },
{ {
"type": "json", "type": "json",
@ -23,24 +35,12 @@
"type": "media", "type": "media",
"description": "content-type-builder.popUpForm.attributes.media.description" "description": "content-type-builder.popUpForm.attributes.media.description"
}, },
{
"type": "number",
"description": "content-type-builder.popUpForm.attributes.number.description"
},
{
"type": "password",
"description": "content-type-builder.popUpForm.attributes.password.description"
},
{ {
"type": "relation", "type": "relation",
"description": "content-type-builder.popUpForm.attributes.relation.description" "description": "content-type-builder.popUpForm.attributes.relation.description"
}, },
{ {
"type": "string", "type": "enumeration",
"description": "content-type-builder.popUpForm.attributes.string.description" "description": "content-type-builder.popUpForm.attributes.enumeration.description"
},
{
"type": "text",
"description": "content-type-builder.popUpForm.attributes.text.description"
} }
] ]