Merge pull request #273 from strapi/fix/popup-design

Center popupwarning and remove confirm button border

packages/strapi-admin/admin/src/components/LeftMenuHeader/index.js

@@ -9,8 +9,7 @@ import { Link } from 'react-router-dom';
 
 import styles from './styles.scss';
 
-class LeftMenuHeader extends React.Component { // eslint-disable-line react/prefer-stateless-function
+function LeftMenuHeader() {
-  render() {
   return (
     <div className={styles.leftMenuHeader}>
       <Link to="/" className={styles.leftMenuHeaderLink}>
@@ -19,6 +18,5 @@ class LeftMenuHeader extends React.Component { // eslint-disable-line react/pref
     </div>
   );
 }
-}
 
 export default LeftMenuHeader;

packages/strapi-admin/admin/src/components/LeftMenuLinkContainer/index.js

@@ -7,18 +7,23 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
-import { map } from 'lodash';
+import { get, map, size } from 'lodash';
 
 import LeftMenuLink from 'components/LeftMenuLink';
 
 import styles from './styles.scss';
 import messages from './messages.json';
 
-class LeftMenuLinkContainer extends React.Component { // eslint-disable-line react/prefer-stateless-function
+function LeftMenuLinkContainer({ plugins }) {
-  render() {
   // Generate the list of sections
-    const linkSections = map(this.props.plugins.toJS(), plugin => (
+  const linkSections = map(plugins.toJS(), plugin => (
-      plugin.leftMenuSections.map((leftMenuSection, j) => (
+    plugin.leftMenuSections.map((leftMenuSection, j) => {
+
+      if (size(get(leftMenuSection, 'links')) === 0) {
+        return <div />
+      }
+
+      return (
         <div key={j}>
           <p className={styles.title}>{leftMenuSection.name}</p>
           <ul className={styles.list}>
@@ -27,12 +32,13 @@ class LeftMenuLinkContainer extends React.Component { // eslint-disable-line rea
             )}
           </ul>
         </div>
-      ))
+      );
+    })
   ));
 
   // Check if the plugins list is empty or not
-    const pluginsLinks = this.props.plugins.size
+  const pluginsLinks = plugins.size
-      ? this.props.plugins.valueSeq().map((plugin) => (
+    ? plugins.valueSeq().map((plugin) => (
       <LeftMenuLink
         key={plugin.get('id')}
         icon={plugin.get('icon') || 'plug'}
@@ -78,7 +84,6 @@ class LeftMenuLinkContainer extends React.Component { // eslint-disable-line rea
     </div>
   );
 }
-}
 
 LeftMenuLinkContainer.propTypes = {
   plugins: PropTypes.object.isRequired,

packages/strapi-helper-plugin/lib/src/components/PopUpWarning/styles.scss

@@ -17,6 +17,7 @@
 }
 .modalPosition {
   top: 16.8rem;
+  left: 18.2rem;
   margin-top: 0 !important;
 
   > div {
@@ -52,7 +53,6 @@
     position: relative;
     border-radius: 0.3rem;
     text-transform: capitalize;
-    // margin-right: 1.8rem;
     cursor: pointer;
     font-family: Lato;
     &:focus {
@@ -81,6 +81,7 @@
   background: linear-gradient(315deg, #0097F6 0%, #005EEA 100%);
   -webkit-font-smoothing: antialiased;
   color: white !important;
+  border: none;
   &:active {
    box-shadow: inset 1px 1px 3px rgba(0,0,0,.15);
  }

packages/strapi-plugin-content-type-builder/admin/src/components/PopUpWarning/styles.scss

@@ -41,7 +41,7 @@
 }
 
 .modalPosition {
-  // top: 16.8rem;
+  left: 18.2rem;
   > div {
     border:none;
     border-radius: 2px;
@@ -80,7 +80,6 @@
     position: relative;
     border-radius: 0.3rem;
     text-transform: capitalize;
-    // margin-right: 1.8rem;
     cursor: pointer;
     font-family: Lato;
     &:focus {
@@ -110,6 +109,7 @@
   background: linear-gradient(315deg, #0097F6 0%, #005EEA 100%);
   -webkit-font-smoothing: antialiased;
   color: white !important;
+  border: none;
   &:active {
    box-shadow: inset 1px 1px 3px rgba(0,0,0,.15);
  }