Fix css

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

@@ -3,11 +3,11 @@
   justify-content: space-around;
   width: 100%;
   > div {
-    border: 6px solid #f3f3f3; /* Light grey */
+    border: 4px solid #f3f3f3; /* Light grey */
-    border-top: 6px solid #3498db; /* Blue */
+    border-top: 4px solid #555555 !important; /* Blue */
     border-radius: 50%;
-    width: 50px;
+    width: 26px;
-    height: 50px;
+    height: 26px;
     animation: spin 2s linear infinite;
   }
 }

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

@@ -7,7 +7,7 @@
   > div {
     margin: auto;
     border: 6px solid #f3f3f3; /* Light grey */
-    border-top: 6px solid #3498db; /* Blue */
+    border-top: 6px solid #1C91E7; /* Blue */
     border-radius: 50%;
     width: 50px;
     height: 50px;

packages/strapi-plugin-content-manager/admin/src/containers/ListPage/actions.js

@@ -72,10 +72,11 @@ export function deleteSeveralDataSuccess() {
   };
 }
 
-export function getData(currentModel, source) {
+export function getData(currentModel, source, setUpdatingParams = false) {
   return {
     type: GET_DATA,
     currentModel,
+    setUpdatingParams,
     source,
   };
 }

packages/strapi-plugin-content-manager/admin/src/containers/ListPage/index.js

@@ -87,7 +87,7 @@ export class ListPage extends React.Component {
     }
 
     if (search !== this.props.location.search) {
-      this.getData(this.props);
+      this.getData(this.props, true);
     }
 
     if (prevProps.listPage.filtersUpdated !== filtersUpdated) {
@@ -120,7 +120,7 @@ export class ListPage extends React.Component {
    * Function to fetch data
    * @param  {Object} props
    */
-  getData = props => {
+  getData = (props, setUpdatingParams = false) => {
     const source = getQueryParameters(props.location.search, 'source');
     const _limit = toInteger(getQueryParameters(props.location.search, '_limit')) || 10;
     const _page = toInteger(getQueryParameters(props.location.search, '_page')) || 1;
@@ -130,7 +130,7 @@ export class ListPage extends React.Component {
     const filters = generateFiltersFromSearch(props.location.search);
 
     this.props.setParams(params, filters);
-    this.props.getData(props.match.params.slug, source);
+    this.props.getData(props.match.params.slug, source, setUpdatingParams);
   };
 
   /**
@@ -306,9 +306,9 @@ export class ListPage extends React.Component {
   };
 
   showLoaders = () => {
-    const { listPage: { isLoading, records } } = this.props;
+    const { listPage: { isLoading, records, updatingParams } } = this.props;
 
-    return isLoading && get(records, this.getCurrentModelName()) === undefined;
+    return updatingParams || isLoading && get(records, this.getCurrentModelName()) === undefined;
   }
 
   render() {

packages/strapi-plugin-content-manager/admin/src/containers/ListPage/reducer.js

@@ -43,10 +43,10 @@ const initialState = fromJS({
     _sort: '',
     _q: '',
   }),
-  // records: List([]),
   records: fromJS({}),
   showFilter: false,
   showWarningDeleteAll: false,
+  updatingParams: false,
 });
 
 function listPageReducer(state = initialState, action) {
@@ -86,17 +86,25 @@ function listPageReducer(state = initialState, action) {
           }
 
           return v;
-        });
+        })
+        .update('updatingParams', () => true);
     case GET_DATA:
       return state
         .update('isLoading', () => true)
-        .update('currentModel', () => action.currentModel);
+        .update('currentModel', () => action.currentModel)
+        .update('updatingParams', v => {
+          if (action.setUpdatingParams) {
+            return true;
+          }
+          return v;
+        });
     case GET_DATA_SUCCEEDED:
       return state
         .update('entriesToDelete', () => List([]))
         .updateIn(['count', state.get('currentModel')], () => action.data[0].count)
         .update('isLoading', () => false)
-        .updateIn(['records', state.get('currentModel')], () => List(action.data[1]));
+        .updateIn(['records', state.get('currentModel')], () => List(action.data[1]))
+        .update('updatingParams', () => false);
     case ON_CHANGE:
       return state.updateIn(['appliedFilters', action.index, action.key], () => action.value);
     case ON_CLICK_REMOVE:

packages/strapi-plugin-content-manager/config/layout.json

@@ -1,9 +1 @@
-{
+{}
-  "product": {
-    "attributes": {
-      "description": {
-        "appearance": "WYSIWYG"
-      }
-    }
-  }
-}

packages/strapi-plugin-users-permissions/admin/src/components/EditForm/index.js

@@ -7,6 +7,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { get } from 'lodash';
+import cn from 'classnames';
 
 import LoadingIndicator from 'components/LoadingIndicator';
 import Input from 'components/InputsIndex';
@@ -28,7 +29,7 @@ class EditForm extends React.Component { // eslint-disable-line react/prefer-sta
   render() {
     if (this.props.showLoaders) {
       return (
-        <div className={styles.editForm}>
+        <div className={cn(styles.editForm, this.props.showLoaders && styles.loadIndicatorContainer)}>
           <LoadingIndicator />
         </div>
       );

packages/strapi-plugin-users-permissions/admin/src/components/EditForm/styles.scss

@@ -13,3 +13,11 @@
   margin-bottom: 2.1rem;
   background: #F6F6F6;
 }
+
+.loadIndicatorContainer {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-around;
+  min-height: 209px;
+  padding-top: 88px;
+}

packages/strapi-plugin-users-permissions/admin/src/components/List/index.js

@@ -72,7 +72,7 @@ function List({ data, deleteData, noButton, onButtonClick, settingType, showLoad
           )}
         </div>
       </div>
-      <div className={cn(styles.ulContainer, showLoaders && styles.loadingContainer)}>
+      <div className={cn(styles.ulContainer, showLoaders && styles.loadingContainer, showLoaders && settingType === 'roles' && styles.loadingContainerRole )}>
         {showLoaders ? <LoadingIndicator /> : (
           <ul className={noButton ? styles.listPadded : ''}>
             {map(object, item => (

packages/strapi-plugin-users-permissions/admin/src/components/List/styles.scss

@@ -39,6 +39,12 @@
 .loadingContainer {
   display: flex;
   flex-direction: column;
-  justify-content: center;
+  justify-content: space-around;
-  min-height: 150px;
+  min-height: 162px;
+  padding-top: 20px;
+}
+
+.loadingContainerRole {
+  min-height: 142px !important;
+  padding-top: 0;
 }

packages/strapi-plugin-users-permissions/admin/src/containers/HomePage/index.js

@@ -158,7 +158,7 @@ export class HomePage extends React.Component {
   showLoaders = () => {
     const { data, isLoading, modifiedData } = this.props;
     const isAdvanded = this.getEndPoint() === 'advanced';
-
+    
     return isLoading && get(data, this.getEndPoint()) === undefined && !isAdvanded || isLoading && isAdvanded &&  get(modifiedData, this.getEndPoint()) === undefined;
   }