mirror of
https://github.com/strapi/strapi.git
synced 2025-10-30 17:37:26 +00:00
Apply desgin feedback
This commit is contained in:
parent
8e672abc78
commit
c1464f73be
@ -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;
|
||||||
|
|||||||
@ -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;
|
||||||
|
|||||||
@ -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 {
|
||||||
|
|||||||
@ -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>
|
||||||
);
|
);
|
||||||
|
|||||||
@ -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' }}>
|
||||||
|
|||||||
@ -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"
|
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user