diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/BodyModal/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/BodyModal/index.js index 7760fbee70..3b9be32856 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/BodyModal/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/BodyModal/index.js @@ -1,8 +1,8 @@ /** -* -* BodyModal -* -*/ + * + * BodyModal + * + */ import React from 'react'; import PropTypes from 'prop-types'; @@ -14,9 +14,7 @@ function BodyModal({ children, ...rest }) { return (
-
- {children} -
+
{children}
); diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/BodyModal/styles.scss b/packages/strapi-plugin-content-type-builder/admin/src/components/BodyModal/styles.scss index 9284377c1c..1eb730d8a9 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/BodyModal/styles.scss +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/BodyModal/styles.scss @@ -1,3 +1,3 @@ .bodyModal { - padding: 2.2rem 1.4rem 0 1.4rem; + padding: 2.2rem 1.5rem 0 1.5rem; } diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/CustomCheckbox/StyledCustomCheckbox.js b/packages/strapi-plugin-content-type-builder/admin/src/components/CustomCheckbox/StyledCustomCheckbox.js new file mode 100644 index 0000000000..dba628cf7f --- /dev/null +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/CustomCheckbox/StyledCustomCheckbox.js @@ -0,0 +1,37 @@ +/** + * + * StyledCustomCheckbox + * + */ + +import styled from 'styled-components'; + +const StyledCustomCheckbox = styled.div` + width: 100%; + padding: 0 15px; + margin-top: -6px; + margin-bottom: 16px; + label { + cursor: pointer; + input[type='checkbox'] { + margin-left: 0; + margin-right: 13px; + } + input[type='checkbox'], + span { + display: inline-block; + vertical-align: bottom; + } + span { + font-weight: 500; + font-size: 12px; + line-height: 10px; + } + } + input[type='number'] { + margin-top: -10px; + margin-bottom: -4px; + } +`; + +export default StyledCustomCheckbox; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/CustomCheckbox/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/CustomCheckbox/index.js index da75bcb867..4583aa249e 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/CustomCheckbox/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/CustomCheckbox/index.js @@ -10,6 +10,8 @@ import { FormattedMessage } from 'react-intl'; import { InputNumberWithErrors as InputNumber } from 'strapi-helper-plugin'; +import StyledCustomCheckbox from './StyledCustomCheckbox'; + class CustomCheckbox extends React.Component { // eslint-disable-line react/prefer-stateless-function state = { @@ -43,22 +45,18 @@ class CustomCheckbox extends React.Component { // TODO: remove inline after migrating to Buffet return ( -
+ {msg => ( - @@ -69,10 +67,9 @@ class CustomCheckbox extends React.Component { name={name} onChange={this.handleInputNumberChange} value={value || ''} - style={{ marginTop: -15 }} /> )} -
+ ); } } diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/FormModal/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/FormModal/index.js new file mode 100644 index 0000000000..fdf0d1cbe2 --- /dev/null +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/FormModal/index.js @@ -0,0 +1,20 @@ +/** + * + * FormModal + * + */ + +import styled from 'styled-components'; + +const FormModal = styled.div` + width: 100%; + .form-check { + label { + input[type='checkbox'] + p { + margin-bottom: 0; + } + } + } +`; + +export default FormModal; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/ListRow/StyledListRow.js b/packages/strapi-plugin-content-type-builder/admin/src/components/ListRow/StyledListRow.js index 2763e70089..dc80b34c30 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/ListRow/StyledListRow.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/ListRow/StyledListRow.js @@ -1,6 +1,6 @@ /** * - * StyedListRow + * StyledListRow * */ @@ -8,7 +8,7 @@ import styled from 'styled-components'; import { colors } from 'strapi-helper-plugin'; -const StyedListRow = styled.tr` +const StyledListRow = styled.tr` background-color: transparent; p { margin-bottom: 0; @@ -59,4 +59,4 @@ const StyedListRow = styled.tr` } `; -export default StyedListRow; +export default StyledListRow; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/RelationsWrapper/index.js b/packages/strapi-plugin-content-type-builder/admin/src/components/RelationsWrapper/index.js index bd9d002138..110cf15fe5 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/RelationsWrapper/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/RelationsWrapper/index.js @@ -13,7 +13,7 @@ const RelationsWrapper = styled.div` } hr { width: 100%; - margin: 1.3rem 1.5rem 2.1rem 1.5rem; + margin: 1.4rem 1.5rem 2.1rem 1.5rem; height: 1px; background-color: rgba(14, 22, 34, 0.04); border: 0; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/components/WrapperModal/styles.scss b/packages/strapi-plugin-content-type-builder/admin/src/components/WrapperModal/styles.scss index aa2d1590a2..ac527d507d 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/components/WrapperModal/styles.scss +++ b/packages/strapi-plugin-content-type-builder/admin/src/components/WrapperModal/styles.scss @@ -4,7 +4,7 @@ .modal { background-color: white; - max-width: 92.1rem !important; + max-width: 92rem !important; margin-left: auto !important; margin-right: auto !important; margin-top: 12.7rem !important; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/AttributeForm/StyledAttributeForm.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/AttributeForm/StyledAttributeForm.js new file mode 100644 index 0000000000..92df46eeca --- /dev/null +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/AttributeForm/StyledAttributeForm.js @@ -0,0 +1,20 @@ +/** + * + * StyledAttributeForm + * + */ + +import styled from 'styled-components'; + +const StyledAttributeForm = styled.div` + width: 100%; + .form-check { + label { + input[type='checkbox'] + p { + margin-bottom: 0; + } + } + } +`; + +export default StyledAttributeForm; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/AttributeForm/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/AttributeForm/index.js index b6ed761c0a..fa1c07c005 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/AttributeForm/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/AttributeForm/index.js @@ -19,6 +19,7 @@ import ButtonModalSecondary from '../../components/ButtonModalSecondary'; import ButtonModalSuccess from '../../components/ButtonModalSuccess'; import CustomCheckbox from '../../components/CustomCheckbox'; import FooterModal from '../../components/FooterModal'; +import FormModal from '../../components/FormModal'; import HeaderModal from '../../components/HeaderModal'; import HeaderModalTitle from '../../components/HeaderModalTitle'; import HeaderModalNavContainer from '../../components/HeaderModalNavContainer'; @@ -286,7 +287,11 @@ class AttributeForm extends React.Component {
- {showForm && currentForm.map(this.renderInput)} + + + {showForm && currentForm.map(this.renderInput)} + +
{ const { featureType } = this.props; const { isDisplayed, nodeToFocus } = this.state; - console.log(this.props); + if (attribute.type === featureType) { return null; } diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/RelationForm/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/RelationForm/index.js index 3ace60b71b..e1cfbe30e5 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/RelationForm/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/RelationForm/index.js @@ -18,6 +18,7 @@ import ButtonModalPrimary from '../../components/ButtonModalPrimary'; import ButtonModalSecondary from '../../components/ButtonModalSecondary'; import ButtonModalSuccess from '../../components/ButtonModalSuccess'; import FooterModal from '../../components/FooterModal'; +import FormModal from '../../components/FormModal'; import HeaderModal from '../../components/HeaderModal'; import HeaderModalNavContainer from '../../components/HeaderModalNavContainer'; import HeaderModalTitle from '../../components/HeaderModalTitle'; @@ -312,7 +313,9 @@ class RelationForm extends React.Component {
- {showForm && content} + + {showForm && content} +
span:nth-child(1), span:nth-child(3) { + > span:nth-child(1), + span:nth-child(3) { text-transform: capitalize; } > span:nth-child(2) { - color: #1C5DE7; + color: #1c5de7; } } - .divider { width: 100%; margin-top: 1.3rem; diff --git a/packages/strapi-plugin-content-type-builder/admin/src/containers/RelationFormGroup/index.js b/packages/strapi-plugin-content-type-builder/admin/src/containers/RelationFormGroup/index.js index d0ba32194d..dd069cc621 100644 --- a/packages/strapi-plugin-content-type-builder/admin/src/containers/RelationFormGroup/index.js +++ b/packages/strapi-plugin-content-type-builder/admin/src/containers/RelationFormGroup/index.js @@ -18,6 +18,7 @@ import ButtonModalPrimary from '../../components/ButtonModalPrimary'; import ButtonModalSecondary from '../../components/ButtonModalSecondary'; import ButtonModalSuccess from '../../components/ButtonModalSuccess'; import FooterModal from '../../components/FooterModal'; +import FormModal from '../../components/FormModal'; import HeaderModal from '../../components/HeaderModal'; import HeaderModalNavContainer from '../../components/HeaderModalNavContainer'; import HeaderModalTitle from '../../components/HeaderModalTitle'; @@ -320,9 +321,11 @@ class RelationFormGroup extends React.Component {
- - {showForm && content} - + + + {showForm && content} + +