Fix reorder

packages/strapi-plugin-content-manager/admin/src/components/FieldItem/components.js

@@ -28,7 +28,7 @@ const Carret = styled.div`
   ${({ right }) => {
     if (right) {
       return css`
-        right: -4px;
+        right: -5px;
       `;
     }
 
@@ -49,7 +49,7 @@ const FullWidthCarret = styled.div`
   justify-content: space-around;
   height: 30px;
   width: 100%;
-  padding: 0 10px;
+  padding: 0 5px;
   margin-bottom: 6px;
   border-radius: 2px;
   > div {
@@ -65,7 +65,7 @@ const NameWrapper = styled.div`
   width: 100%;
 
   display: flex;
-  padding-left: 10px;
+  padding-left: 5px;
   justify-content: space-between;
   > div {
     width: calc(100% - 30px);
@@ -115,7 +115,7 @@ const Wrapper = styled.div`
   position: relative;
   .sub_wrapper {
     width: 100%;
-    padding: 0 10px;
+    padding: 0 5px;
   }
 `;
 

packages/strapi-plugin-content-manager/admin/src/components/FieldItem/index.js

@@ -38,6 +38,7 @@ const FieldItem = forwardRef(
     ref
   ) => {
     const [isOver, setIsOver] = useState(false);
+    const [dragStart, setDragStart] = useState(false);
     const isHidden = name === '_TEMP_';
     const withLongerHeight = [
       'json',
@@ -71,13 +72,23 @@ const FieldItem = forwardRef(
     return (
       <div
         onClick={isHidden ? () => {} : onClickEdit}
+        onDrag={() => {
+          if (size === 12) {
+            setDragStart(true);
+          }
+        }}
+        onDragEnd={() => {
+          if (size === 12) {
+            setDragStart(false);
+          }
+        }}
         onMouseEnter={() => setIsOver(true)}
         onMouseLeave={() => setIsOver(false)}
         style={{ width: `${(1 / 12) * size * 100}%`, ...style }}
         ref={ref}
       >
         <Wrapper>
-          {isDragging && size === 12 ? (
+          {dragStart && size === 12 ? (
             <FullWidthCarret>
               <div />
             </FullWidthCarret>

packages/strapi-plugin-content-manager/admin/src/components/FieldsReorder/components.js

@@ -2,7 +2,7 @@ import styled from 'styled-components';
 
 const Wrapper = styled.div`
   display: flex;
-  margin-bottom: 24px;
+  margin-bottom: 6px;
 `;
 
 export { Wrapper };

packages/strapi-plugin-content-manager/admin/src/components/FieldsReorder/index.js

@@ -40,7 +40,7 @@ const FieldsReorder = ({ className }) => {
 
   return (
     <div className={className}>
-      <SortWrapper>
+      <SortWrapper style={{ paddingLeft: 5, paddingRight: 5 }}>
         {layout.map((row, rowIndex) => {
           return (
             <Wrapper key={row.rowId} style={{}}>
@@ -69,7 +69,7 @@ const FieldsReorder = ({ className }) => {
           <Add
             data={buttonData}
             onClick={onAddData}
-            style={{ width: '100%', margin: '0 10px' }}
+            style={{ width: '100%', margin: '0 5px' }}
             pStyle={{ marginTop: '-2px' }}
           />
         </Wrapper>

packages/strapi-plugin-content-manager/admin/src/components/SelectWrapper/index.js

@@ -33,7 +33,7 @@ function SelectWrapper({
   } = useEditView();
   const [state, setState] = useState({
     _q: '',
-    _limit: 8,
+    _limit: 20,
     _start: 0,
     source: isEmpty(plugin) ? 'content-manager' : plugin,
   });