@akemona-org/strapi-plugin-content-manager 3.13.2 → 3.14.1

package/admin/src/components/AddDropdown/components.js

@@ -7,7 +7,7 @@ const Wrapper = styled.div`
     height: 30px;
     width: 100%;
     justify-content: space-between;
-    background: #ffffff;
+    background: #fff;
     color: #333740;
     border-radius: 2px;
     border: solid 1px #007eff;
@@ -19,7 +19,7 @@ const Wrapper = styled.div`
       width: 100%;
       color: #333740;
       text-align: left;
-      background-color: #ffffff;
+      background-color: #fff;
       border: none;
       font-size: 13px;
       font-weight: 500;
@@ -59,8 +59,7 @@ const Wrapper = styled.div`
       border-top-right-radius: 0;
       border-color: #e3e9f3 !important;
       border-top-color: #aed4fb !important;
-      box-shadow: 0 2px 3px rgba(227, 233, 245, 0.5);
-
+      box-shadow: 0 2px 3px rgb(227 233 245 / 50%);
       overflow: scroll;
 
       button {

package/admin/src/components/Block/components.js

@@ -2,7 +2,7 @@ import styled from 'styled-components';
 
 const Wrapper = styled.div`
   margin-bottom: 35px;
-  background: #ffffff;
+  background: #fff;
   padding: 22px 28px 18px;
   padding-bottom: 13px;
   border-radius: 2px;
@@ -11,7 +11,7 @@ const Wrapper = styled.div`
 `;
 
 const Sub = styled.div`
-  padding-top: 0px;
+  padding-top: 0;
   line-height: 18px;
   > p:first-child {
     margin-bottom: 1px;

package/admin/src/components/Block/index.js

@@ -11,19 +11,21 @@ import { Wrapper, Sub } from './components';
 const renderMsg = (msg) => <p>{msg}</p>;
 
 function Block({ children, description, style, title }) {
-  return <div className="col-md-12">
-    <Wrapper style={style}>
-      <Sub>
-        {!!title && (
-          <p>
-            <FormattedMessage id={title} />
-          </p>
-        )}
-        {!!description && <FormattedMessage id={description}>{renderMsg}</FormattedMessage>}
-      </Sub>
-      {children}
-    </Wrapper>
-  </div>
+  return (
+    <div className="col-md-12">
+      <Wrapper style={style}>
+        <Sub>
+          {!!title && (
+            <p>
+              <FormattedMessage id={title} />
+            </p>
+          )}
+          {!!description && <FormattedMessage id={description}>{renderMsg}</FormattedMessage>}
+        </Sub>
+        {children}
+      </Wrapper>
+    </div>
+  );
 }
 
 Block.defaultProps = {

package/admin/src/components/Container/index.js

@@ -1,7 +1,7 @@
 import styled from 'styled-components';
 
 const Container = styled.div`
-  padding: 18px 30px 66px 30px;
+  padding: 18px 30px 66px;
 `;
 
 export default Container;

package/admin/src/components/CustomInputCheckbox/components.js

@@ -8,14 +8,14 @@ const Label = styled.label`
   > input {
     display: none;
   }
-  &:before {
+  &::before {
     content: '';
     position: absolute;
     left: 15px;
     top: calc(50% - 8px);
     width: 14px;
     height: 14px;
-    border: 1px solid rgba(16, 22, 34, 0.15);
+    border: 1px solid rgb(16 22 34 / 15%);
     background-color: #fdfdfd;
     border-radius: 3px;
   }
@@ -23,13 +23,13 @@ const Label = styled.label`
   ${({ shouldDisplaySomeChecked }) => {
     if (shouldDisplaySomeChecked) {
       return css`
-        &:after {
+        &::after {
           content: '\f068';
           position: absolute;
           top: calc(50% - 8px);
           left: 18px;
           font-size: 10px;
-          font-family: 'FontAwesome';
+          font-family: FontAwesome;
           font-weight: 100;
           color: #1c5de7;
         }
@@ -40,13 +40,13 @@ const Label = styled.label`
   ${({ shouldDisplayAllChecked }) => {
     if (shouldDisplayAllChecked) {
       return css`
-        &:after {
+        &::after {
           content: '\f00c';
           position: absolute;
           top: calc(50% - 9px);
           left: 17px;
           font-size: 10px;
-          font-family: 'FontAwesome';
+          font-family: FontAwesome;
           font-weight: 100;
           color: #1c5de7;
           transition: all 0.2s;
@@ -58,13 +58,13 @@ const Label = styled.label`
   ${({ isChecked }) => {
     if (isChecked) {
       return css`
-        &:after {
+        &::after {
           content: '\f00c';
           position: absolute;
           top: calc(50% - 11px);
           left: 17px;
           font-size: 10px;
-          font-family: 'FontAwesome';
+          font-family: FontAwesome;
           font-weight: 100;
           color: #1c5de7;
           transition: all 0.2s;

package/admin/src/components/CustomTable/ActionCollapse/Delete.js

@@ -3,7 +3,7 @@ import styled from 'styled-components';
 const Delete = styled.span`
   font-weight: 600;
   -webkit-font-smoothing: antialiased;
-  &:after {
+  &::after {
     content: '—';
     margin: 0 7px;
     font-size: 13px;

package/admin/src/components/CustomTable/ActionCollapse/DeleteAll.js

@@ -5,7 +5,7 @@ const DeleteAll = styled.span`
   color: #f64d0a;
   font-weight: 500;
   cursor: pointer;
-  &:after {
+  &::after {
     position: relative;
     top: -1px;
     content: '\f2ed';

package/admin/src/components/CustomTable/Row/ActionContainer.js

@@ -7,11 +7,10 @@ const ActionContainer = styled.td`
   svg {
     margin-left: 15px;
     font-size: 1rem;
-
     color: #333740;
 
     &:first-of-type {
-      margin-left: 0px;
+      margin-left: 0;
     }
   }
 `;

package/admin/src/components/CustomTable/styledComponents.js

@@ -29,7 +29,7 @@ const Table = styled.table`
 const TableEmpty = styled.tr`
   width: 100%;
   height: 108px;
-  background: #ffffff;
+  background: #fff;
 
   td {
     height: 106px;
@@ -45,7 +45,7 @@ const TableEmpty = styled.tr`
 
 const TableRow = styled.tr`
   height: 54px;
-  background: #ffffff;
+  background: #fff;
 
   &:hover {
     cursor: pointer;
@@ -75,7 +75,7 @@ const LoadingWrapper = styled.div`
   display: flex;
   background: ${(props) => props.theme.main.colors.white};
   box-shadow: 0 2px 4px ${(props) => props.theme.main.colors.darkGrey};
-  clip-path: inset(0px -5px -5px -5px);
+  clip-path: inset(0 -5px -5px -5px);
 `;
 
 LoadingWrapper.propTypes = {

package/admin/src/components/DraggedField/GrabWrapper.js

@@ -8,8 +8,8 @@ const GrabWrapper = styled.div`
   flex-direction: column;
   justify-content: center;
   position: absolute;
-  top: 0px;
-  bottom: 0px;
+  top: 0;
+  bottom: 0;
   left: 0;
   padding-left: 10px;
   border-right: 1px solid

package/admin/src/components/DraggedField/RemoveWrapper.js

@@ -7,8 +7,8 @@ const RemoveWrapper = styled.div`
   flex-direction: column;
   justify-content: center;
   position: absolute;
-  top: 0px;
-  bottom: 0px;
+  top: 0;
+  bottom: 0;
   right: 0;
   width: 30px;
   text-align: center;

package/admin/src/components/DraggedField/SubWrapper.js

@@ -14,10 +14,8 @@ const SubWrapper = styled.div`
     `;
     }
   }};
-
   line-height: ${({ withLongerHeight }) => getHeight(withLongerHeight)};
   cursor: pointer;
-
   background: ${({ isOverEditBlock, isOverRemove, isSelected }) => {
     if (isOverRemove) {
       return '#ffe9e0';

package/admin/src/components/DraggedFieldWithPreview/Carret.js

@@ -9,7 +9,7 @@ const Carret = styled.div`
       right: -4px;
     `;
     }
-
+    // eslint-disable-next-line newline-before-return
     return `
     left: -1px;
   `;

package/admin/src/components/DraggedFieldWithPreview/DynamicZoneWrapper.js

@@ -2,7 +2,7 @@ import styled from 'styled-components';
 
 const DynamicZoneWrapper = styled.div`
   display: flex;
-  margin: 5px 0 0px 0;
+  margin: 5px 0 0;
   overflow: auto;
   height: 119px;
 `;

package/admin/src/components/DraggedFieldWithPreview/Tooltip.js

@@ -8,7 +8,7 @@ const Tooltip = styled.div`
   line-height: 20px;
   height: 20px;
   padding: 0 10px;
-  background-color: #000000;
+  background-color: #000;
   font-size: 12px;
   color: #fff;
   opacity: 0.5;

package/admin/src/components/DynamicComponentCard/Wrapper.js

@@ -6,12 +6,12 @@ const Wrapper = styled.div`
   width: 139px !important;
   margin: 0 10px 10px 0;
   padding: 18px 10px;
-  background-color: #ffffff;
+  background-color: #fff;
   color: #919bae;
   text-align: center;
   border-radius: 2px;
   cursor: pointer;
-  border: 1px solid #ffffff;
+  border: 1px solid #fff;
 
   button {
     outline: 0;

package/admin/src/components/DynamicZone/Button.js

@@ -8,8 +8,8 @@ const Button = styled(PlusButton)`
   transition: transform 0.1s ease-in-out;
   &:hover {
     background-color: #aed4fb;
-    :before,
-    :after {
+    ::before,
+    ::after {
       background-color: #007eff;
     }
   }

package/admin/src/components/DynamicZone/Component/RoundCTA.js

@@ -5,7 +5,7 @@ const RoundCTA = styled.div`
   width: 31px;
   border-radius: 50%;
   background-color: #f2f3f4;
-  border: 2px solid #ffffff;
+  border: 2px solid #fff;
   cursor: pointer;
   display: flex;
   z-index: 9;
@@ -27,8 +27,8 @@ const RoundCTA = styled.div`
   &.arrow-btn {
     height: 22px;
     width: 22px;
-    background-color: #ffffff;
-    border: 2px solid #ffffff;
+    background-color: #fff;
+    border: 2px solid #fff;
     svg {
       font-size: 10px;
       line-height: 22px;

package/admin/src/components/DynamicZone/ComponentWrapper.js

@@ -21,7 +21,7 @@ const ComponentWrapper = styled.div`
     }
     &:not(:first-of-type) {
       margin-top: 32px;
-      &:before {
+      &::before {
         content: '&';
         position: absolute;
         top: -30px;

package/admin/src/components/DynamicZone/Label.js

@@ -6,7 +6,7 @@ const Label = styled.div`
   font-weight: 600;
   position: relative;
   min-height: 64px;
-  &:after {
+  &::after {
     content: '•';
     position: absolute;
     top: 15px;
@@ -19,7 +19,7 @@ const Label = styled.div`
     border-radius: 4px;
     border: 1px solid white;
   }
-  &:before {
+  &::before {
     content: '&';
     position: absolute;
     top: 22px;

package/admin/src/components/DynamicZone/Picker/Category/Banner/Wrapper.js

@@ -8,7 +8,7 @@ const BannerWrapper = styled.button`
   width: 100%;
   padding: 0 15px;
   border-bottom: 0;
-  border: 1px solid rgba(227, 233, 243, 0.75);
+  border: 1px solid rgb(227 233 243 / 75%);
   background-color: ${({ theme }) => theme.main.colors.white};
   font-size: ${({ theme }) => theme.main.sizes.fonts.md};
   font-weight: ${({ theme }) => theme.main.fontWeights.semiBold};

package/admin/src/components/DynamicZone/Picker/Wrapper.js

@@ -5,7 +5,7 @@ const Wrapper = styled.div`
 
   > div {
     margin-top: 15px;
-    padding: 23px 18px 21px 18px;
+    padding: 23px 18px 21px;
     background-color: #f2f3f4;
   }
 

package/admin/src/components/DynamicZone/utils/connect.js

@@ -1,7 +1,7 @@
 import React from 'react';
 
 function connect(WrappedComponent, select) {
-  return function(props) {
+  return function (props) {
     // eslint-disable-next-line react/prop-types
     const selectors = select(props.name);
 

package/admin/src/components/FieldComponent/EmptyComponent.js

@@ -2,7 +2,7 @@ import styled from 'styled-components';
 
 const EmptyComponent = styled.div`
   height: 72px;
-  border: 1px solid rgba(227, 233, 243, 0.75);
+  border: 1px solid rgb(227 233 243 / 75%);
   border-top-left-radius: 2px;
   border-top-right-radius: 2px;
   border-bottom: 0;

package/admin/src/components/FieldComponent/ResetComponent.js

@@ -5,7 +5,6 @@ const ResetComponent = styled.div`
   top: 0;
   right: 15px;
   display: flex;
-
   cursor: pointer;
   color: #4b515a;
 
@@ -18,6 +17,7 @@ const ResetComponent = styled.div`
     > div {
       background-color: #faa684;
     }
+
     color: #f64d0a;
     > span {
       display: initial;
@@ -30,7 +30,7 @@ const ResetComponent = styled.div`
     background-color: #f3f4f4;
     text-align: center;
     border-radius: 2px;
-    &:after {
+    &::after {
       content: '\f2ed';
       font-size: 10px;
       font-family: FontAwesome;

package/admin/src/components/FieldComponent/utils/connect.js

@@ -1,7 +1,7 @@
 import React from 'react';
 
 function connect(WrappedComponent, select) {
-  return function(props) {
+  return function (props) {
     // eslint-disable-next-line react/prop-types
     const selectors = select(props);
 

package/admin/src/components/FilterOptionsCTA/index.js

@@ -5,7 +5,7 @@ const FilterOptionsCTA = styled.button`
   justify-content: center;
   height: 20px;
   width: 20px;
-  margin: 8px 5px 0px 0px;
+  margin: 8px 5px 0 0;
   border-radius: 50%;
   border: 1px solid #e3e9f3;
   cursor: pointer;

package/admin/src/components/FilterPicker/components.js

@@ -19,7 +19,7 @@ const Span = styled.span`
   vertical-align: text-top;
   cursor: pointer;
 
-  &:after {
+  &::after {
     margin-left: 2px;
     content: '\f077';
     font-family: FontAwesome;
@@ -41,7 +41,7 @@ const Div = styled.div`
   margin: ${(props) => (props.show ? '-100px -30px 30px' : `-${props.number}px -30px 103px`)};
   background: #fff;
   box-shadow: 3px 2px 4px #e3e9f3;
-  padding: 18px 30px 0px 30px;
+  padding: 18px 30px 0;
   transition: ${(props) => {
     if (props.anim) {
       return props.show

package/admin/src/components/FilterPickerOption/components.js

@@ -6,14 +6,14 @@ const Wrapper = styled.div`
   min-height: 38px;
   border-left: ${(props) => props.borderLeft && '3px solid #007EFF'};
   padding-left: ${(props) => (props.borderLeft ? '10px' : '13px')};
-  margin-bottom: 0px !important;
+  margin-bottom: 0 !important;
 `;
 
 const InputWrapper = styled.div`
   display: flex;
   input,
   select {
-    margin: 0px 5px !important;
+    margin: 0 5px !important;
   }
 `;
 
@@ -54,7 +54,7 @@ const Input = styled.input`
   border-radius: 0.25rem;
   line-height: 3.4rem;
   font-size: 1.3rem;
-  font-family: 'Lato' !important;
-  box-shadow: 0px 1px 1px rgba(104, 118, 142, 0.05);
+  font-family: Lato !important;
+  box-shadow: 0 1px 1px rgb(104 118 142 / 5%);
 `;
 export { InputWrapper, Wrapper, InputWrapperDate, Input };

package/admin/src/components/FormTitle/index.js

@@ -3,10 +3,14 @@ import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 
 function FormTitle({ description, title }) {
-  return <>
-    {!!title && <FormattedMessage id={title} />}
-    {!!description && <FormattedMessage id={description}>{(msg) => <p>{msg}</p>}</FormattedMessage>}
-  </>
+  return (
+    <>
+      {!!title && <FormattedMessage id={title} />}
+      {!!description && (
+        <FormattedMessage id={description}>{(msg) => <p>{msg}</p>}</FormattedMessage>
+      )}
+    </>
+  );
 }
 
 FormTitle.propTypes = {

package/admin/src/components/FormWrapper/index.js

@@ -1,8 +1,8 @@
 import styled from 'styled-components';
 
 const FormWrapper = styled.div`
-  padding: 22px 10px 0 10px;
-  background: #ffffff;
+  padding: 22px 10px 0;
+  background: #fff;
   border-radius: 2px;
   box-shadow: 0 2px 4px #e3e9f3;
   margin-bottom: 17px;

package/admin/src/components/InputUID/Options/index.js

@@ -9,17 +9,19 @@ import OptionsTitle from './OptionsTitle';
 import RightOptionLabel from './RightOptionLabel';
 
 function Options({ options, title }) {
-  return <OptionsWrapper>
-    {title && <OptionsTitle>{title}</OptionsTitle>}
-    {options.map((option) => (
-      <Option key={option.id} onClick={option.onClick}>
-        <div>{option.label}</div>
-        <FormattedMessage id={getTrad('components.uid.apply')}>
-          {(msg) => <RightOptionLabel className="right-label">{msg}</RightOptionLabel>}
-        </FormattedMessage>
-      </Option>
-    ))}
-  </OptionsWrapper>
+  return (
+    <OptionsWrapper>
+      {title && <OptionsTitle>{title}</OptionsTitle>}
+      {options.map((option) => (
+        <Option key={option.id} onClick={option.onClick}>
+          <div>{option.label}</div>
+          <FormattedMessage id={getTrad('components.uid.apply')}>
+            {(msg) => <RightOptionLabel className="right-label">{msg}</RightOptionLabel>}
+          </FormattedMessage>
+        </Option>
+      ))}
+    </OptionsWrapper>
+  );
 }
 
 Options.propTypes = {

package/admin/src/components/Inputs/utils/connect.js

@@ -1,7 +1,7 @@
 import React from 'react';
 
 function connect(WrappedComponent, select) {
-  return function(props) {
+  return function (props) {
     // eslint-disable-next-line react/prop-types
     const selectors = select(props.keys);
 

package/admin/src/components/MediaPreviewList/StyledMediaPreviewList.js

@@ -80,7 +80,7 @@ const MediaPreviewFile = styled(MediaPreviewItem)`
       font-size: 15px;
       width: 100%;
       height: 100%;
-      &:before {
+      &::before {
         width: 100%;
         height: 100%;
         padding: 10px;
@@ -145,7 +145,7 @@ const MediaPreviewImage = styled(MediaPreviewItem)`
     border-radius: calc(${sizes.big} / 2);
     margin-top: calc(${`-${sizes.big}`} - ${sizes.small} - 5px);
     margin-left: calc((${sizes.small} - ${sizes.big}) / 2);
-    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05);
+    box-shadow: 0 2px 4px 0 rgb(0 0 0 / 5%);
   }
 
   &.hoverable {

package/admin/src/components/PlusButton/index.js

@@ -36,15 +36,15 @@ const Button = styled.button`
     outline: 0;
   }
 
-  :before {
+  ::before {
     ${beforeStyle}
   }
-  :after {
+  ::after {
     ${afterStyle}
   }
 
-  :before,
-  :after {
+  ::before,
+  ::after {
     background-color: #b4b6ba;
   }
 `;

package/admin/src/components/PreviewCarret/components.js

@@ -8,14 +8,12 @@ const Wrapper = styled.div`
   height: 30px;
   width: 100%;
   padding: 0 5px;
-
   ${({ isComponent }) =>
     isComponent &&
     `
     height: 34px;
     padding: 0;
   `}
-
   border-radius: 2px;
   > div {
     width: 100%;

package/admin/src/components/PreviewCarret/index.js

@@ -4,9 +4,11 @@ import PropTypes from 'prop-types';
 import Wrapper from './components';
 
 function PreviewCarret({ isComponent, style }) {
-  return <Wrapper isComponent={isComponent} style={style}>
-    <div />
-  </Wrapper>
+  return (
+    <Wrapper isComponent={isComponent} style={style}>
+      <div />
+    </Wrapper>
+  );
 }
 
 PreviewCarret.defaultProps = {