sync icons (#573)

status-im · Jun 17, 2024 · a023653 · a023653
1 parent b636dfc
commit a023653
Show file tree

Hide file tree

Showing 14 changed files with 205 additions and 28 deletions.
diff --git a/.changeset/six-lemons-eat.md b/.changeset/six-lemons-eat.md
@@ -0,0 +1,5 @@
+---
+"@status-im/icons": patch
+---
+
+sync icons
diff --git a/packages/icons/src/android-icon.tsx b/packages/icons/src/android-icon.tsx
@@ -14,9 +14,37 @@ const SvgAndroidIcon = createIcon(props => {
     >
       <path
         fill={props.color}
-        fillRule="evenodd"
-        d="M4.86 6.183C4.105 7.866 4.1 9.748 4.1 10.5c0 .557.009 1.066.028 1.53.198.037.467.08.821.125.97.12 2.57.245 5.05.245 2.482 0 4.081-.124 5.051-.245.354-.045.624-.088.821-.125.02-.464.029-.973.029-1.53 0-.752-.005-2.634-.76-4.317-.373-.831-.92-1.594-1.724-2.15-.8-.555-1.896-.933-3.416-.933s-2.616.378-3.416.932c-.804.557-1.351 1.32-1.724 2.151Zm10.92 7.08c-.167.027-.36.055-.58.082-1.03.13-2.68.255-5.2.255s-4.17-.126-5.2-.255a17.213 17.213 0 0 1-.58-.082c.03.269.067.518.111.75.168.875.432 1.44.794 1.827.359.382.873.652 1.666.824.802.173 1.843.236 3.209.236s2.407-.063 3.209-.236c.793-.172 1.307-.442 1.666-.824.362-.387.626-.952.793-1.828.045-.231.082-.48.112-.749ZM5.9 3.046C6.929 2.334 8.27 1.9 10 1.9c1.73 0 3.071.434 4.1 1.146.28.194.534.407.765.634l1.155-1.54.96.72-1.33 1.772c.23.343.423.7.585 1.06.865 1.93.865 4.034.865 4.794v.014c0 1.508-.062 2.742-.253 3.738-.192 1-.522 1.81-1.097 2.422-.579.618-1.346.973-2.287 1.177-.933.201-2.08.263-3.463.263-1.384 0-2.53-.062-3.463-.264-.941-.203-1.709-.558-2.287-1.176-.575-.613-.906-1.423-1.097-2.422-.191-.995-.253-2.23-.253-3.738v-.014c0-.76 0-2.864.865-4.794.161-.36.354-.717.584-1.06L3.02 2.86l.96-.72 1.156 1.54c.23-.227.485-.44.766-.634ZM9 8c0 .828-.448 1.5-1 1.5S7 8.828 7 8s.448-1.5 1-1.5S9 7.172 9 8Zm3 1.5c.552 0 1-.672 1-1.5s-.448-1.5-1-1.5-1 .672-1 1.5.448 1.5 1 1.5Z"
-        clipRule="evenodd"
+        stroke="#fff"
+        strokeWidth={0.729}
+        d="M10 10.875c2.545 0 4.608-1.905 4.608-4.254 0-2.349-2.063-4.253-4.608-4.253-2.545 0-4.608 1.904-4.608 4.253 0 2.35 2.063 4.254 4.608 4.254Z"
+      />
+      <path
+        fill={props.color}
+        stroke="#fff"
+        strokeWidth={0.729}
+        d="M13.494 5.558H6.506c-.616 0-1.114.498-1.114 1.114v6.988c0 .615.498 1.114 1.114 1.114h6.988c.615 0 1.114-.5 1.114-1.114V6.672c0-.616-.5-1.114-1.114-1.114Z"
+      />
+      <path
+        fill={props.color}
+        stroke="#fff"
+        strokeWidth={0.365}
+        d="M6.852 1.686a.33.33 0 1 1 .576-.319L9.22 4.6a.33.33 0 0 1-.576.32L6.852 1.685Zm7.958 6.15a1.215 1.215 0 1 1 2.43 0v4.304a1.215 1.215 0 1 1-2.43 0V7.836Zm-4.303 4.912a1.215 1.215 0 0 1 2.43 0v4.305a1.215 1.215 0 0 1-2.43 0v-4.305Zm2.64-11.062a.33.33 0 0 0-.576-.319L10.78 4.6a.33.33 0 0 0 .576.32l1.792-3.234Zm-7.958 6.15a1.215 1.215 0 0 0-2.43 0v4.304a1.215 1.215 0 1 0 2.43 0V7.836Zm4.304 4.912a1.215 1.215 0 1 0-2.43 0v4.305a1.215 1.215 0 1 0 2.43 0v-4.305Z"
+      />
+      <path
+        fill={props.color}
+        d="M10 10.875c2.545 0 4.608-1.905 4.608-4.254 0-2.349-2.063-4.253-4.608-4.253-2.545 0-4.608 1.904-4.608 4.253 0 2.35 2.063 4.254 4.608 4.254Z"
+      />
+      <path
+        fill={props.color}
+        d="M13.494 5.558H6.506c-.616 0-1.114.498-1.114 1.114v6.988c0 .615.498 1.114 1.114 1.114h6.988c.615 0 1.114-.5 1.114-1.114V6.672c0-.616-.5-1.114-1.114-1.114Z"
+      />
+      <path fill="#fff" d="M5.189 6.798h9.621-9.62Z" />
+      <path stroke="#fff" strokeWidth={0.365} d="M5.189 6.798h9.621" />
+      <path
+        fill="#fff"
+        stroke="#fff"
+        strokeWidth={0.365}
+        d="M7.873 4.747a.203.203 0 1 0 0-.405.203.203 0 0 0 0 .405Zm4.253 0a.203.203 0 1 0 0-.405.203.203 0 0 0 0 .405Z"
       />
     </svg>
   )

diff --git a/packages/icons/src/book-icon.tsx b/packages/icons/src/book-icon.tsx
@@ -0,0 +1,25 @@
+import { createIcon } from '../lib/create-icon'
+
+const SvgBookIcon = createIcon(props => {
+  return (
+    <svg
+      {...props}
+      xmlns="http://www.w3.org/2000/svg"
+      width={props.width}
+      height={props.height}
+      fill="none"
+      viewBox="0 0 20 20"
+      focusable={false}
+      aria-hidden={true}
+    >
+      <path
+        fill={props.color}
+        fillRule="evenodd"
+        d="M10.6 5.256a5.369 5.369 0 0 1 4.155-1.378l.24.024c.144.015.19.02.226.025a1.4 1.4 0 0 1 1.177 1.3c.002.037.002.084.002.228V12.5c0 .474 0 .8-.018 1.053-.017.249-.048.384-.089.483a1.4 1.4 0 0 1-.757.757c-.099.041-.234.072-.483.09-.253.017-.579.017-1.053.017h-.053c-.61 0-.984 0-1.35.06-.489.079-.96.236-1.399.465a5.06 5.06 0 0 0-.598.38V5.256Zm-1.2 0a5.369 5.369 0 0 0-4.155-1.378l-.24.024c-.144.015-.19.02-.226.025a1.4 1.4 0 0 0-1.177 1.3 4.547 4.547 0 0 0-.002.228V12.5c0 .474 0 .8.018 1.053.016.249.048.384.088.483a1.4 1.4 0 0 0 .758.757c.099.041.234.072.482.09.254.017.58.017 1.054.017h.053c.609 0 .984 0 1.35.06.488.079.96.236 1.398.465.195.102.38.223.599.38V5.256ZM5.126 2.684A6.569 6.569 0 0 1 10 4.187a6.569 6.569 0 0 1 4.874-1.503l.24.024.02.002c.116.012.2.02.276.032a2.6 2.6 0 0 1 2.185 2.415c.005.077.005.161.005.279v7.084c0 .449 0 .816-.02 1.115-.022.31-.067.59-.178.86a2.6 2.6 0 0 1-1.407 1.407c-.27.112-.55.156-.86.178-.3.02-.666.02-1.114.02H14c-.678 0-.952.002-1.211.044-.361.058-.71.175-1.034.344-.233.122-.452.285-.995.692l-.4.3-.36.27-.36-.27-.4-.3c-.543-.407-.763-.57-.995-.692a3.399 3.399 0 0 0-1.034-.344c-.26-.042-.533-.044-1.211-.044h-.02c-.45 0-.816 0-1.115-.02a2.674 2.674 0 0 1-.86-.178 2.6 2.6 0 0 1-1.407-1.407 2.675 2.675 0 0 1-.178-.86 17.7 17.7 0 0 1-.02-1.114V5.435c0-.117 0-.201.004-.278A2.6 2.6 0 0 1 4.59 2.742c.076-.012.16-.02.276-.032l.02-.002.24-.024Z"
+        clipRule="evenodd"
+      />
+    </svg>
+  )
+})
+
+export default SvgBookIcon
diff --git a/packages/icons/src/discord-icon.tsx b/packages/icons/src/discord-icon.tsx
@@ -0,0 +1,23 @@
+import { createIcon } from '../lib/create-icon'
+
+const SvgDiscordIcon = createIcon(props => {
+  return (
+    <svg
+      {...props}
+      xmlns="http://www.w3.org/2000/svg"
+      width={props.width}
+      height={props.height}
+      fill="none"
+      viewBox="0 0 20 20"
+      focusable={false}
+      aria-hidden={true}
+    >
+      <path
+        fill={props.color}
+        d="M16.248 3.84a14.66 14.66 0 0 0-3.714-1.168c-.16.29-.347.678-.476.988a13.635 13.635 0 0 0-4.115 0 10.61 10.61 0 0 0-.481-.988 14.612 14.612 0 0 0-3.717 1.17C1.395 7.393.758 10.857 1.076 14.271a14.847 14.847 0 0 0 4.555 2.333c.367-.504.694-1.04.975-1.606a9.592 9.592 0 0 1-1.536-.748c.13-.095.255-.195.377-.298 2.962 1.386 6.18 1.386 9.106 0 .123.103.25.203.377.298a9.558 9.558 0 0 1-1.54.75c.282.563.608 1.101.976 1.606a14.818 14.818 0 0 0 4.558-2.335c.373-3.958-.639-7.39-2.676-10.432ZM7.01 12.17c-.89 0-1.618-.83-1.618-1.84 0-1.012.713-1.843 1.618-1.843.905 0 1.634.83 1.618 1.842.002 1.011-.713 1.841-1.618 1.841Zm5.98 0c-.889 0-1.618-.83-1.618-1.84 0-1.012.713-1.843 1.618-1.843.905 0 1.634.83 1.618 1.842 0 1.011-.713 1.841-1.618 1.841Z"
+      />
+    </svg>
+  )
+})
+
+export default SvgDiscordIcon
diff --git a/packages/icons/src/index.ts b/packages/icons/src/index.ts
@@ -32,6 +32,7 @@ export { default as BackspaceIcon } from './backspace-icon'
 export { default as BanUserIcon } from './ban-user-icon'
 export { default as BlockIcon } from './block-icon'
 export { default as BoldIcon } from './bold-icon'
+export { default as BookIcon } from './book-icon'
 export { default as BrazilIcon } from './brazil-icon'
 export { default as BridgeBlurIcon } from './bridge-blur-icon'
 export { default as BridgeIcon } from './bridge-icon'
@@ -101,6 +102,7 @@ export { default as DerivatedPathIcon } from './derivated-path-icon'
 export { default as DesktopIcon } from './desktop-icon'
 export { default as DestroyIcon } from './destroy-icon'
 export { default as DisconnectIcon } from './disconnect-icon'
+export { default as DiscordIcon } from './discord-icon'
 export { default as DockIcon } from './dock-icon'
 export { default as DominicanIcon } from './dominican-icon'
 export { default as DoneIcon } from './done-icon'
@@ -265,6 +267,7 @@ export { default as PositiveStateIcon } from './positive-state-icon'
 export { default as PrivacyIcon } from './privacy-icon'
 export { default as ProfileIcon } from './profile-icon'
 export { default as PullupIcon } from './pullup-icon'
+export { default as PuzzleIcon } from './puzzle-icon'
 export { default as QrCodeIcon } from './qr-code-icon'
 export { default as QuillPenIcon } from './quill-pen-icon'
 export { default as RaribleIcon } from './rarible-icon'

diff --git a/packages/icons/src/puzzle-icon.tsx b/packages/icons/src/puzzle-icon.tsx
@@ -0,0 +1,25 @@
+import { createIcon } from '../lib/create-icon'
+
+const SvgPuzzleIcon = createIcon(props => {
+  return (
+    <svg
+      {...props}
+      xmlns="http://www.w3.org/2000/svg"
+      width={props.width}
+      height={props.height}
+      fill="none"
+      viewBox="0 0 20 20"
+      focusable={false}
+      aria-hidden={true}
+    >
+      <path
+        fill={props.color}
+        fillRule="evenodd"
+        d="M9.5 2.4a2.6 2.6 0 0 0-2.53 2H6.5v1.2h1.6V5a1.4 1.4 0 1 1 2.8 0v.6h1.6c.479 0 .797 0 1.04.023.237.021.343.059.41.098a.9.9 0 0 1 .33.329c.039.068.076.174.098.41A13 13 0 0 1 14.4 7.5v1.6h.6a1.4 1.4 0 0 1 0 2.8h-.6V13c0 .724-.001 1.207-.05 1.566-.045.342-.124.48-.213.57-.09.09-.229.169-.57.215-.36.048-.843.049-1.567.049H6.5c-.478 0-.797 0-1.04-.023-.236-.021-.343-.059-.41-.098a.9.9 0 0 1-.33-.329c-.038-.067-.076-.173-.097-.41A12.908 12.908 0 0 1 4.6 13.5v-.47a2.595 2.595 0 0 0 1.802-1.535A2.6 2.6 0 0 0 4.6 7.97V7.5c0-.478 0-.797.023-1.04.021-.236.059-.343.098-.41a.9.9 0 0 1 .329-.33c.067-.038.174-.076.41-.097A12.91 12.91 0 0 1 6.5 5.6V4.4h-.027c-.444 0-.818 0-1.122.028-.319.029-.62.091-.901.253a2.1 2.1 0 0 0-.768.769c-.163.28-.225.582-.254.9-.028.305-.028.679-.028 1.123V7.5h.605H3.4v1.6H4a1.4 1.4 0 0 1 0 2.8h-.6v1.6h.59-.59v.027c0 .444 0 .818.028 1.122.029.32.091.62.254.901a2.1 2.1 0 0 0 .768.769c.28.162.582.225.9.253.305.028.679.028 1.123.028h5.568c.672 0 1.236 0 1.685-.06.475-.064.91-.205 1.26-.555.349-.35.49-.784.554-1.26.06-.448.06-1.012.06-1.684v-.011a2.6 2.6 0 0 0 0-5.06v-.497c0-.444 0-.818-.027-1.122-.03-.319-.092-.62-.254-.901a2.1 2.1 0 0 0-.769-.769c-.28-.162-.582-.225-.9-.253-.305-.028-.679-.028-1.123-.028h-.497a2.606 2.606 0 0 0-1.535-1.802A2.6 2.6 0 0 0 9.5 2.4Z"
+        clipRule="evenodd"
+      />
+    </svg>
+  )
+})
+
+export default SvgPuzzleIcon
diff --git a/packages/icons/src/receive-icon.tsx b/packages/icons/src/receive-icon.tsx
@@ -15,15 +15,15 @@ const SvgReceiveIcon = createIcon(props => {
       <path
         fill={props.color}
         fillRule="evenodd"
-        d="m9.597 15.948-5.5-5 .807-.888 5.097 4.633 5.096-4.633.807.888-5.5 5-.403.367-.404-.367Z"
+        d="m9.597 14.948-5.5-5 .807-.888 5.097 4.633 5.096-4.633.807.888-5.5 5-.403.367-.404-.367Z"
         clipRule="evenodd"
       />
       <mask
         id="receive-icon_svg__b"
         width={2}
         height={13}
         x={9}
-        y={3}
+        y={2}
         maskUnits="userSpaceOnUse"
         style={{
           maskType: 'alpha',
@@ -32,11 +32,11 @@ const SvgReceiveIcon = createIcon(props => {
         <path
           fill="url(#receive-icon_svg__a)"
           d="M0 0h2v12H0z"
-          transform="matrix(-1 0 0 1 11 3.5)"
+          transform="matrix(-1 0 0 1 11 2.5)"
         />
       </mask>
       <g mask="url(#receive-icon_svg__b)">
-        <path stroke={props.color} strokeWidth={1.2} d="M10 3.5V15" />
+        <path stroke={props.color} strokeWidth={1.2} d="M10 2.5V14" />
       </g>
       <defs>
         <linearGradient

diff --git a/packages/icons/src/send-icon.tsx b/packages/icons/src/send-icon.tsx
@@ -15,36 +15,36 @@ const SvgSendIcon = createIcon(props => {
       <path
         fill={props.color}
         fillRule="evenodd"
-        d="m10 3.69.404.366 5.5 5-.807.888-5.096-4.633-5.097 4.633-.807-.888 5.5-5 .404-.367Z"
+        d="m10 4.69.404.366 5.5 5-.807.888-5.096-4.633-5.097 4.633-.807-.888 5.5-5 .404-.367Z"
         clipRule="evenodd"
       />
       <mask
         id="send-icon_svg__b"
         width={2}
         height={13}
         x={9}
-        y={4}
+        y={5}
         maskUnits="userSpaceOnUse"
         style={{
           maskType: 'alpha',
         }}
       >
         <path
           fill="url(#send-icon_svg__a)"
-          d="M11 16.5h2v12h-2z"
-          transform="rotate(-180 11 16.5)"
+          d="M11 17.5h2v12h-2z"
+          transform="rotate(-180 11 17.5)"
         />
       </mask>
       <g mask="url(#send-icon_svg__b)">
-        <path stroke={props.color} strokeWidth={1.2} d="M10 16.5V5" />
+        <path stroke={props.color} strokeWidth={1.2} d="M10 17.5V6" />
       </g>
       <defs>
         <linearGradient
           id="send-icon_svg__a"
           x1={12}
           x2={12}
-          y1={17}
-          y2={22.5}
+          y1={18}
+          y2={23.5}
           gradientUnits="userSpaceOnUse"
         >
           <stop stopColor={props.color} stopOpacity={0} />

diff --git a/packages/icons/svg/android-icon.svg b/packages/icons/svg/android-icon.svg
diff --git a/packages/icons/svg/book-icon.svg b/packages/icons/svg/book-icon.svg
diff --git a/packages/icons/svg/discord-icon.svg b/packages/icons/svg/discord-icon.svg
diff --git a/packages/icons/svg/puzzle-icon.svg b/packages/icons/svg/puzzle-icon.svg
diff --git a/packages/icons/svg/receive-icon.svg b/packages/icons/svg/receive-icon.svg