Merge pull request #60 from strapi/icons

Icons adaptation

Author: soupette

packages/buffetjs-icons/src/components/Plus/index.js

@@ -0,0 +1,43 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const Plus = props => (
+  <svg width="10px" height="10px" xmlns="http://www.w3.org/2000/svg" {...props}>
+    <g stroke="none" strokeWidth="1" fill={props.fill} fillRule="evenodd">
+      <g
+        transform="translate(-1165.000000, -189.000000)"
+        fill={props.fill}
+        fillRule="nonzero"
+      >
+        <g transform="translate(1150.154730, 179.000000)">
+          <g id="Add-button">
+            <g id="Group-4">
+              <g id="Group" transform="translate(14.421208, 8.787123)">
+                <path
+                  d="M8.9727187,3.66306178 C8.9727187,3.73229714 8.94608972,3.79354381 8.89283174,3.84680179 L5.17009936,7.56953417 C5.11684139,7.62279214 5.05559472,7.64942113 4.98635935,7.64942113 C4.91712399,7.64942113 4.85587732,7.62279214 4.80261934,7.56953417 L1.07988696,3.84680179 C1.02662899,3.79354381 1,3.73229714 1,3.66306178 C1,3.59382641 1.02662899,3.53257974 1.07988696,3.47932177 L1.47932177,3.07988696 C1.53257974,3.02662899 1.59382641,3 1.66306178,3 C1.73229714,3 1.79354381,3.02662899 1.84680179,3.07988696 L4.98635935,6.21944453 L8.12591692,3.07988696 C8.17917489,3.02662899 8.24042156,3 8.30965693,3 C8.37889229,3 8.44013896,3.02662899 8.49339694,3.07988696 L8.89283174,3.47932177 C8.94608972,3.53257974 8.9727187,3.59382641 8.9727187,3.66306178 Z"
+                  id="Path"
+                  transform="translate(4.986359, 5.324711) scale(-1, 1) rotate(45.000000) translate(-4.986359, -5.324711) "
+                ></path>
+                <path
+                  d="M11.2552783,5.94562132 C11.2552783,6.01485669 11.2286493,6.07610336 11.1753913,6.12936133 L7.45265891,9.85209371 C7.39940094,9.90535169 7.33815427,9.93198068 7.2689189,9.93198068 C7.19968353,9.93198068 7.13843686,9.90535169 7.08517889,9.85209371 L3.36244651,6.12936133 C3.30918853,6.07610336 3.28255955,6.01485669 3.28255955,5.94562132 C3.28255955,5.87638596 3.30918853,5.81513929 3.36244651,5.76188131 L3.76188131,5.36244651 C3.81513929,5.30918853 3.87638596,5.28255955 3.94562132,5.28255955 C4.01485669,5.28255955 4.07610336,5.30918853 4.12936133,5.36244651 L7.2689189,8.50200407 L10.4084765,5.36244651 C10.4617344,5.30918853 10.5229811,5.28255955 10.5922165,5.28255955 C10.6614518,5.28255955 10.7226985,5.30918853 10.7759565,5.36244651 L11.1753913,5.76188131 C11.2286493,5.81513929 11.2552783,5.87638596 11.2552783,5.94562132 Z"
+                  id="Path"
+                  transform="translate(7.268919, 7.607270) rotate(135.000000) translate(-7.268919, -7.607270) "
+                ></path>
+              </g>
+            </g>
+          </g>
+        </g>
+      </g>
+    </g>
+  </svg>
+);
+
+Plus.defaultProps = {
+  fill: '#fff',
+};
+
+Plus.propTypes = {
+  fill: PropTypes.string,
+};
+
+export default Plus;

packages/buffetjs-icons/src/components/Remove/Icon.js

@@ -1,7 +1,13 @@
 import React from 'react';
 
 const Icon = props => (
-  <svg width="12px" height="10px" xmlns="http://www.w3.org/2000/svg" {...props}>
+  <svg
+    viewBox="0 0 8 8"
+    width="8"
+    height="8"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
     <path
       d="M10.0719417,0.127226812 C10.1612888,0.127226812 10.2403266,0.161591074 10.3090551,0.230319596 L10.3090551,0.230319596 L10.8245191,0.745783513 C10.8932476,0.814512036 10.9276118,0.893549837 10.9276118,0.982896916 C10.9276118,1.07224399 10.8932476,1.1512818 10.8245191,1.22001032 L10.8245191,1.22001032 L6.77297267,5.27155671 L10.8245191,9.3231031 C10.8932476,9.39183162 10.9276118,9.47086942 10.9276118,9.5602165 C10.9276118,9.64956358 10.8932476,9.72860138 10.8245191,9.79732991 L10.8245191,9.79732991 L10.3090551,10.3127938 C10.2403266,10.3815223 10.1612888,10.4158866 10.0719417,10.4158866 C9.98259466,10.4158866 9.90355686,10.3815223 9.83482834,10.3127938 L9.83482834,10.3127938 L5.92809485,6.40509433 C4.98802554,7.34516364 3.68545904,8.64773014 2.02039535,10.3127938 C1.95166683,10.3815223 1.87262903,10.4158866 1.78328195,10.4158866 C1.69393487,10.4158866 1.61489707,10.3815223 1.54616855,10.3127938 L1.03070463,9.79732991 C0.961976106,9.72860138 0.927611845,9.64956358 0.927611845,9.5602165 C0.927611845,9.47086942 0.961976106,9.39183162 1.03070463,9.3231031 L5.08225102,5.27155671 L1.03070463,1.22001032 C0.961976106,1.1512818 0.927611845,1.07224399 0.927611845,0.982896916 C0.927611845,0.893549837 0.961976106,0.814512036 1.03070463,0.745783513 L1.54616855,0.230319596 C1.61489707,0.161591074 1.69393487,0.127226812 1.78328195,0.127226812 C1.87262903,0.127226812 1.95166683,0.161591074 2.02039535,0.230319596 L5.92761184,4.13822681 L9.83482834,0.230319596 C9.88637473,0.178773204 9.94372009,0.146556709 10.0068644,0.133670111 Z"
       fillRule="nonzero"

packages/buffetjs-icons/src/index.js

@@ -13,6 +13,7 @@ export { default as Media } from './components/Media';
 export { default as NumberIcon } from './components/NumberIcon';
 export { default as Password } from './components/Password';
 export { default as Pencil } from './components/Pencil';
+export { default as Plus } from './components/Plus';
 export { default as Relation } from './components/Relation';
 export { default as Remove } from './components/Remove';
 export { default as RichText } from './components/RichText';

packages/buffetjs-styles/src/components/List/index.js

@@ -69,11 +69,10 @@ const List = styled.div`
       vertical-align: middle;
       font-size: 1.3rem;
       line-height: 1.8rem;
-      &:first-of-type {
+      &:first-of-type:not(:last-of-type) {
         padding-left: calc(3rem + 0.75em);
-        padding-left: ${sizes.margin * 2.8}px;
       }
-      &:last-of-type {
+      &:last-of-type:not(:first-of-type) {
         padding-right: calc(3rem + 0.75em);
       }
     }