mirror of
https://github.com/strapi/strapi.git
synced 2025-12-27 23:24:03 +00:00
Create specific loader for the WYSIWYG
This commit is contained in:
parent
4268f788c9
commit
b76574714c
@ -7,7 +7,6 @@
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import { isEmpty, merge } from 'lodash';
|
||||
import Loadable from 'react-loadable';
|
||||
// Design
|
||||
import InputAddonWithErrors from 'components/InputAddonWithErrors';
|
||||
import InputCheckboxWithErrors from 'components/InputCheckboxWithErrors';
|
||||
@ -21,12 +20,8 @@ import InputPasswordWithErrors from 'components/InputPasswordWithErrors';
|
||||
import InputTextAreaWithErrors from 'components/InputTextAreaWithErrors';
|
||||
import InputTextWithErrors from 'components/InputTextWithErrors';
|
||||
import InputToggleWithErrors from 'components/InputToggleWithErrors';
|
||||
// import WysiwygWithErrors from 'components/WysiwygWithErrors';
|
||||
const Loading = () => <div>Loading ...</div>;
|
||||
const LoadableWysiwyg = Loadable({
|
||||
loader: () => import('components/WysiwygWithErrors'),
|
||||
loading: Loading,
|
||||
});
|
||||
import WysiwygWithErrors from 'components/WysiwygWithErrors/Loadable';
|
||||
|
||||
|
||||
const DefaultInputError = ({ type }) => <div>Your input type: <b>{type}</b> does not exist</div>;
|
||||
|
||||
@ -44,7 +39,7 @@ const inputs = {
|
||||
text: InputTextWithErrors,
|
||||
textarea: InputTextAreaWithErrors,
|
||||
toggle: InputToggleWithErrors,
|
||||
wysiwyg: LoadableWysiwyg,
|
||||
wysiwyg: WysiwygWithErrors,
|
||||
};
|
||||
|
||||
function InputsIndex(props) {
|
||||
|
||||
@ -0,0 +1,7 @@
|
||||
import Loadable from 'react-loadable';
|
||||
import Loader from './Loader';
|
||||
|
||||
export default Loadable({
|
||||
loader: () => import('./index'),
|
||||
loading: Loader,
|
||||
});
|
||||
@ -0,0 +1,11 @@
|
||||
import React from 'react';
|
||||
|
||||
import styles from './styles.scss';
|
||||
|
||||
const Loader = () => (
|
||||
<div className="col-md-12">
|
||||
<div className={styles.wysLoader}><div /></div>
|
||||
</div>
|
||||
);
|
||||
|
||||
export default Loader;
|
||||
@ -3,3 +3,22 @@
|
||||
font-size: 1.3rem;
|
||||
font-family: 'Lato';
|
||||
}
|
||||
|
||||
.wysLoader {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
width: 100%;
|
||||
> div {
|
||||
border: 4px solid #f3f3f3; /* Light grey */
|
||||
border-top: 4px solid #3498db; /* Blue */
|
||||
border-radius: 50%;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
animation: spin 2s linear infinite;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user