diff --git a/packages/strapi-plugin-settings-manager/admin/src/components/InputNumber/index.js b/packages/strapi-plugin-settings-manager/admin/src/components/InputNumber/index.js index 3251d7a637..12f4723ba0 100644 --- a/packages/strapi-plugin-settings-manager/admin/src/components/InputNumber/index.js +++ b/packages/strapi-plugin-settings-manager/admin/src/components/InputNumber/index.js @@ -140,8 +140,10 @@ class InputNumber extends React.Component { // eslint-disable-line react/prefer- placeholder={placeholder} />; + const requiredClass = this.props.validations.required && this.props.addRequiredInputDesign ? this.props.styles.requiredClass : ''; + return ( -
+
{input} {this.props.inputDescription} @@ -152,6 +154,7 @@ class InputNumber extends React.Component { // eslint-disable-line react/prefer- } InputNumber.propTypes = { + addRequiredInputDesign: React.PropTypes.bool, customBootstrapClass: React.PropTypes.string, deactivateErrorHighlight: React.PropTypes.bool, errors: React.PropTypes.oneOfType([ diff --git a/packages/strapi-plugin-settings-manager/admin/src/components/InputSelect/index.js b/packages/strapi-plugin-settings-manager/admin/src/components/InputSelect/index.js index aac922ccc7..6e809021e0 100644 --- a/packages/strapi-plugin-settings-manager/admin/src/components/InputSelect/index.js +++ b/packages/strapi-plugin-settings-manager/admin/src/components/InputSelect/index.js @@ -20,9 +20,10 @@ class InputSelect extends React.Component { // eslint-disable-line react/prefer- render() { const bootStrapClass = this.props.customBootstrapClass ? this.props.customBootstrapClass : 'col-md-6'; + const requiredClass = this.props.validations.required && this.props.addRequiredInputDesign ? styles.requiredClass : ''; return ( -
+
@@ -49,6 +50,7 @@ class InputSelect extends React.Component { // eslint-disable-line react/prefer- } InputSelect.propTypes = { + addRequiredInputDesign: React.PropTypes.bool, customBootstrapClass: React.PropTypes.string, handleChange: React.PropTypes.func.isRequired, name: React.PropTypes.string.isRequired, @@ -57,6 +59,7 @@ InputSelect.propTypes = { React.PropTypes.object, // TODO remove ]), target: React.PropTypes.string, + validations: React.PropTypes.object, value: React.PropTypes.string, }; diff --git a/packages/strapi-plugin-settings-manager/admin/src/components/InputSelect/styles.scss b/packages/strapi-plugin-settings-manager/admin/src/components/InputSelect/styles.scss index a3a8c7e076..d8d985e256 100644 --- a/packages/strapi-plugin-settings-manager/admin/src/components/InputSelect/styles.scss +++ b/packages/strapi-plugin-settings-manager/admin/src/components/InputSelect/styles.scss @@ -14,3 +14,13 @@ border-radius: 0rem!important; } } + +.requiredClass { + > label:after { + color: red; + font-family: Lato; + font-weight: bold; + margin-left: 5px; + content: "*"; + } +} diff --git a/packages/strapi-plugin-settings-manager/admin/src/components/InputText/index.js b/packages/strapi-plugin-settings-manager/admin/src/components/InputText/index.js index a018386480..33382fff7a 100644 --- a/packages/strapi-plugin-settings-manager/admin/src/components/InputText/index.js +++ b/packages/strapi-plugin-settings-manager/admin/src/components/InputText/index.js @@ -158,8 +158,11 @@ class InputText extends React.Component { // eslint-disable-line react/prefer-st placeholder={placeholder} />; + + const requiredClass = this.props.validations.required && this.props.addRequiredInputDesign ? this.props.styles.requiredClass : ''; + return ( -
+
{label} {input} {this.props.inputDescription} @@ -170,6 +173,7 @@ class InputText extends React.Component { // eslint-disable-line react/prefer-st } InputText.propTypes = { + addRequiredInputDesign: React.PropTypes.bool, customBootstrapClass: React.PropTypes.string, deactivateErrorHighlight: React.PropTypes.bool, errors: React.PropTypes.array, diff --git a/packages/strapi-plugin-settings-manager/admin/src/components/List/styles.scss b/packages/strapi-plugin-settings-manager/admin/src/components/List/styles.scss index efa23c9945..2346a80e24 100644 --- a/packages/strapi-plugin-settings-manager/admin/src/components/List/styles.scss +++ b/packages/strapi-plugin-settings-manager/admin/src/components/List/styles.scss @@ -93,12 +93,20 @@ color: white; width: 15rem; margin-left: 1.9rem!important; + &:hover { + color: white; + } } .secondary { font-family: Lato; color: #F64D0A; border: 0.1rem solid #F64D0A; + &:hover { + color: #F64D0A; + background-color: white; + border: 0.1rem solid #F64D0A; + } } .bordered { @@ -152,6 +160,11 @@ > input { margin-top: 1.3rem!important; } + > button { + &:focus { + outline: 0; + } + } } .padded { diff --git a/packages/strapi-plugin-settings-manager/admin/src/components/PopUpForm/styles.scss b/packages/strapi-plugin-settings-manager/admin/src/components/PopUpForm/styles.scss index bd161594b2..792019bc16 100644 --- a/packages/strapi-plugin-settings-manager/admin/src/components/PopUpForm/styles.scss +++ b/packages/strapi-plugin-settings-manager/admin/src/components/PopUpForm/styles.scss @@ -11,7 +11,7 @@ bottom: -5.4rem; left: 3rem; display: flex; - + color: #27B710; } .rounded { @@ -22,7 +22,7 @@ border-radius: 50%; padding-left: .1rem; padding-bottom: .1rem; - border: 1px solid black; + border: 1px solid #27B710; font-size: .4rem; vertical-align: middle; display: flex; diff --git a/packages/strapi-plugin-settings-manager/admin/src/components/WithFormSection/index.js b/packages/strapi-plugin-settings-manager/admin/src/components/WithFormSection/index.js index fb17c56353..5ae63783f5 100644 --- a/packages/strapi-plugin-settings-manager/admin/src/components/WithFormSection/index.js +++ b/packages/strapi-plugin-settings-manager/admin/src/components/WithFormSection/index.js @@ -19,6 +19,7 @@ import styles from './styles.scss'; const WithFormSection = (InnerComponent) => class extends React.Component { static propTypes = { + addRequiredInputDesign: React.PropTypes.bool, cancelAction: React.PropTypes.bool, handleChange: React.PropTypes.func.isRequired, section: React.PropTypes.oneOfType([ @@ -113,6 +114,7 @@ const WithFormSection = (InnerComponent) => class extends React.Component { selectOptions={selectOptions} validations={props.validations} value={inputValue} + addRequiredInputDesign={this.props.addRequiredInputDesign} /> ); } diff --git a/packages/strapi-plugin-settings-manager/admin/src/components/WithInput/styles.scss b/packages/strapi-plugin-settings-manager/admin/src/components/WithInput/styles.scss index 1b518aa13c..88a1ab1b51 100644 --- a/packages/strapi-plugin-settings-manager/admin/src/components/WithInput/styles.scss +++ b/packages/strapi-plugin-settings-manager/admin/src/components/WithInput/styles.scss @@ -52,3 +52,13 @@ .insideInput:hover { color: black!important; } + +.requiredClass { + > label:after { + color: red; + font-family: Lato; + font-weight: bold; + margin-left: 5px; + content: "*"; + } +} diff --git a/packages/strapi-plugin-settings-manager/admin/src/containers/Home/index.js b/packages/strapi-plugin-settings-manager/admin/src/containers/Home/index.js index e63ef223b1..048e84896c 100644 --- a/packages/strapi-plugin-settings-manager/admin/src/containers/Home/index.js +++ b/packages/strapi-plugin-settings-manager/admin/src/containers/Home/index.js @@ -304,6 +304,7 @@ export class Home extends React.Component { // eslint-disable-line react/prefer- clearable={false} /> +
) }) @@ -332,7 +333,7 @@ export class Home extends React.Component { // eslint-disable-line react/prefer- const specificComponent = findKey(this.customComponents, (value) => includes(value, this.props.params.slug)) || 'defaultComponent'; // if custom view display render specificComponent const Component = this.components[specificComponent]; - + const addRequiredInputDesign = this.props.params.slug === 'databases'; const listTitle = this.props.params.slug === 'languages' || 'databases' ? this.renderListTitle() : ''; const listButtonLabel = this.props.params.slug === 'languages' || 'databases' ? this.renderListButtonLabel() : ''; @@ -390,6 +391,7 @@ export class Home extends React.Component { // eslint-disable-line react/prefer- renderListComponent={renderListComponent} cancelAction={this.props.home.cancelAction} actionBeforeOpenPopUp={actionBeforeOpenPopUp} + addRequiredInputDesign={addRequiredInputDesign} /> ); } diff --git a/packages/strapi-plugin-settings-manager/admin/src/containers/Home/styles.scss b/packages/strapi-plugin-settings-manager/admin/src/containers/Home/styles.scss index b4d2426da4..cab4a4f181 100644 --- a/packages/strapi-plugin-settings-manager/admin/src/containers/Home/styles.scss +++ b/packages/strapi-plugin-settings-manager/admin/src/containers/Home/styles.scss @@ -34,3 +34,7 @@ .modalLanguageLabel { padding-bottom: 10px; } + +.popUpSpacer { + height: 1rem; +}