npm - be-components - Versions diffs - 3.9.8 → 3.9.9 - Mend

be-components 3.9.8 → 3.9.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (169) hide show

package/src/Components/Icons.tsx CHANGED Viewed

@@ -14,8 +14,8 @@ type IconProps = {
 const AlertIcon = ({ color, size }:IconProps) => {
     return (
         <Svg width={`${size}px`} height={`${size}px`} viewBox="0 0 22 22">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="alert-circle" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="alert-circle" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                     <Circle id="Oval" cx="10" cy="10" r="10"></Circle>
                     <Line x1="10" y1="6" x2="10" y2="10" id="Path"></Line>
                     <Line x1="10" y1="14" x2="10.01" y2="14" id="Path"></Line>
@@ -25,14 +25,29 @@ const AlertIcon = ({ color, size }:IconProps) => {
     )
 }
+const LeaderboardIcon = ({ color, size }:IconProps) => {
+    return (
+        <Svg width={`${size??34}px`} height={`${size??34}px`} viewBox="0 0 34 34">
+        <G id="Page-1" stroke="none" strokeWidth="2" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+            <G id="leaderboard-star-svgrepo-com" transform="translate(2.000000, 2.000000)" stroke={color??Colors.brand.midnight} strokeWidth="2">
+                <Path d="M20,30.0000042 L10,30.0000042 L10,16.0000042 C10,15.4476708 10.4477167,15.0000042 11,15.0000042 L19,15.0000042 C19.5523333,15.0000042 20,15.4476708 20,16.0000042 L20,30.0000042 Z" id="Path"></Path>
+                <Path d="M29,30.0000042 L20,30.0000042 L20,25.1666708 C20,24.6143375 20.4476667,24.1666708 21,24.1666708 L29,24.1666708 C29.5523333,24.1666708 30,24.6143375 30,25.1666708 L30,29.0000042 C30,29.5523375 29.5523333,30.0000042 29,30.0000042 Z" id="Path"></Path>
+                <Path d="M10,30.0000042 L10,21.8333375 C10,21.2810042 9.55228333,20.8333375 9,20.8333375 L1,20.8333375 C0.447716667,20.8333375 0,21.2810042 0,21.8333375 L0,29.0000042 C0,29.5523375 0.447716667,30.0000042 1,30.0000042 L10,30.0000042 Z" id="Path"></Path>
+                <Path d="M13.0093333,3.5220875 L14.5245,0.3093375 C14.719,-0.1031125 15.281,-0.1031125 15.4755,0.3093375 L16.9906667,3.5220875 L20.3791667,4.04045417 C20.814,4.10697083 20.9871667,4.6662875 20.6725,4.98715417 L18.221,7.48617083 L18.7995,11.0166542 C18.8738333,11.4700375 18.4191667,11.8158375 18.0301667,11.6016542 L15,9.93385417 L11.9698333,11.6016542 C11.58085,11.8158375 11.1261333,11.4700375 11.2004333,11.0166542 L11.779,7.48617083 L9.32751667,4.98715417 C9.01276667,4.6662875 9.18605,4.10697083 9.6208,4.04045417 L13.0093333,3.5220875 Z" id="Path"></Path>
+            </G>
+        </G>
+    </Svg>
+    )
+}
 const RefreshIcon = ({ color, size }:IconProps) => {
     const ratio = .8214
     const height = size??24
     const width = height * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 23 28">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="refresh-cw-alt-2-svgrepo-com" transform="translate(2.000000, 2.000000)" stroke={color??Colors.brand.midnight} stroke-width="3">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="refresh-cw-alt-2-svgrepo-com" transform="translate(2.000000, 2.000000)" stroke={color??Colors.brand.midnight} strokeWidth="3">
                     <Path d="M8.399958,0 L10.799946,2.39452803 L10.7289064,2.46567567 M10.799946,19.200024 L8.399958,21.4928525 L8.43559782,21.5299324 M10.7289064,2.46567567 L8.399958,4.799976 M10.7289064,2.46567567 C10.3587082,2.42229589 9.98191009,2.399988 9.599952,2.399988 C4.29804251,2.399988 0,6.69803051 0,11.99994 C0,15.0316048 1.40527697,17.7350713 3.599982,19.4943825 M15.599922,4.50553347 C17.794591,6.26486868 19.199904,8.96829916 19.199904,11.99994 C19.199904,17.3018735 14.9018855,21.599892 9.599952,21.599892 C9.20587397,21.599892 8.81719591,21.5761321 8.43559782,21.5299324 M10.799946,24 L8.43559782,21.5299324" id="Shape"></Path>
                 </G>
             </G>
@@ -43,8 +58,8 @@ const RefreshIcon = ({ color, size }:IconProps) => {
 const ContactsIcon = ({color, size}:IconProps) => {
     return (
         <Svg width={`${size??24}px`} height={`${size??24}px`}  viewBox="0 0 28 28">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                <G id="contacts-svgrepo-com" transform="translate(2.000000, 2.000000)" stroke={color??Colors.brand.midnight} stroke-width="3">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
+                <G id="contacts-svgrepo-com" transform="translate(2.000000, 2.000000)" stroke={color??Colors.brand.midnight} strokeWidth="3">
                     <Path d="M2.66666667,5.33333333 L2.66666667,2.66666667 C2.66666667,1.19390667 3.86057333,0 5.33333333,0 L13.3333333,0 L21.3333333,0 C22.8061333,0 24,1.19390667 24,2.66666667 L24,5.33333333 L24,18.6666667 L24,21.3333333 C24,22.8061333 22.8061333,24 21.3333333,24 L13.3333333,24 L5.33333333,24 C3.86057333,24 2.66666667,22.8061333 2.66666667,21.3333333 L2.66666667,18.6666667 L2.66666667,5.33333333 Z" id="Path" stroke-linecap="round" stroke-linejoin="round"></Path>
                     <Path d="M17.3333333,12 C17.3333333,14.2092 15.5425333,16 13.3333333,16 C11.1241333,16 9.33333333,14.2092 9.33333333,12 C9.33333333,9.7908 11.1241333,8 13.3333333,8 C15.5425333,8 17.3333333,9.7908 17.3333333,12 Z" id="Path"></Path>
                     <Path d="M8,24 C8.56728,20.9237333 10.0266667,20 13.3333333,20 C16.64,20 18.0993333,20.8566667 18.6666667,23.9329333" id="Path" stroke-linecap="round"></Path>
@@ -61,7 +76,7 @@ const ContactsIcon = ({color, size}:IconProps) => {
     const icon_size = size ?? 19
     return (
         <Svg width={`${icon_size}px`} height={`${icon_size}px`} viewBox="0 0 19 19">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="Vector-(2)" transform="translate(0.000000, 0.000000)" fill={color??Colors.brand.midnight} fill-rule="nonzero">
                     <Path d="M8.00050802,14.000488 C8.78843802,14.000488 9.56868802,13.845288 10.296588,13.543788 C11.024588,13.242288 11.685988,12.800288 12.243188,12.243188 C12.800288,11.685988 13.242288,11.024588 13.543788,10.296588 C13.845288,9.56868802 14.000488,8.78843802 14.000488,8.00050802 C14.000488,7.21256802 13.845288,6.43235802 13.543788,5.70439802 C13.242288,4.97644802 12.800288,4.31501802 12.243188,3.75785802 C11.685988,3.20070802 11.024588,2.75875802 10.296588,2.45722802 C9.56868802,2.15569802 8.78843802,2.00050802 8.00050802,2.00050802 C6.40920802,2.00050802 4.88307802,2.63264802 3.75785802,3.75785802 C2.63264802,4.88307802 2.00050802,6.40920802 2.00050802,8.00050802 C2.00050802,9.59178802 2.63264802,11.117888 3.75785802,12.243188 C4.88307802,13.368388 6.40920802,14.000488 8.00050802,14.000488 Z M14.320488,12.906488 L17.900488,16.486488 C17.995988,16.578788 18.072088,16.689188 18.124388,16.811288 C18.176688,16.933288 18.204188,17.064488 18.2053164,17.197288 C18.206288,17.330088 18.180888,17.461788 18.130488,17.584588 C18.080188,17.707488 18.005788,17.819088 17.911888,17.912888 C17.817888,18.006688 17.706188,18.080888 17.583288,18.131088 C17.460388,18.181288 17.328688,18.206488 17.195888,18.2053289 C17.063088,18.203988 16.931888,18.176288 16.809988,18.123788 C16.687988,18.071288 16.577688,17.995088 16.485488,17.899488 L12.905488,14.319488 C11.297988,15.567388 9.27529802,16.155688 7.24925802,15.964688 C5.22321802,15.773688 3.34610802,14.817788 2.00005802,13.291588 C0.653998017,11.765288 -0.0598119827,9.78348802 0.00392901727,7.74942802 C0.0676700173,5.71540802 0.904168017,3.78212802 2.34314802,2.34314802 C3.78212802,0.904168017 5.71540802,0.0676700173 7.74942802,0.00392901727 C9.78348802,-0.0598119827 11.765288,0.653998017 13.291588,2.00005802 C14.817788,3.34610802 15.773688,5.22321802 15.964688,7.24925802 C16.155688,9.27529802 15.567388,11.297988 14.319488,12.905488 L14.320488,12.906488 Z" id="Shape"></Path>
                 </G>
@@ -76,7 +91,7 @@ const EmbedIcon = ({ color, size }:IconProps) => {
     const height = width * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 24 14">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="embed-svgrepo-com-(1)" fill={color ?? Colors.brand.midnight} fill-rule="nonzero">
                     <Path d="M7.19657813,1.1409375 C7.18298438,1.1409375 7.16934375,1.1450625 7.15785938,1.15303125 L0.030046875,6.01879688 C0.01115625,6.0316875 0,6.05282813 0,6.07589062 L0,7.3846875 C0,7.407375 0.01115625,7.42889063 0.030046875,7.44140625 L7.15785938,12.3075469 C7.16939063,12.3155156 7.18298438,12.3196406 7.19657813,12.3196406 C7.20773438,12.3196406 7.21851563,12.3166406 7.22873438,12.3117187 C7.25142188,12.299625 7.26539063,12.2761875 7.26539063,12.2505 L7.26539063,10.1655937 C7.26539063,10.1432812 7.25423438,10.1217188 7.23534375,10.10925 L2.28604688,6.7299375 L7.23534375,3.35175 C7.25423437,3.33853125 7.26539063,3.31734375 7.26539063,3.29428125 L7.26539063,1.210125 C7.26539063,1.1844375 7.25142188,1.16095312 7.22873437,1.14923437 C7.21851563,1.14360938 7.20773438,1.1409375 7.19657813,1.1409375 Z" id="Path"></Path>
                     <Path d="M23.9699063,6.01879688 L16.8420938,1.15303125 C16.8305625,1.14510938 16.8169687,1.1409375 16.8033281,1.1409375 C16.7921719,1.1409375 16.7814375,1.1435625 16.7712187,1.14923437 C16.7485312,1.16095312 16.7345625,1.1844375 16.7345625,1.210125 L16.7345625,3.29503125 C16.7345625,3.31771875 16.7457187,3.33890625 16.7646094,3.35175 L21.7139531,6.7299375 L16.7646094,10.10925 C16.7457187,10.1217188 16.7345625,10.1432344 16.7345625,10.1662969 L16.7345625,12.2504531 C16.7345625,12.2761406 16.7485312,12.299625 16.7712187,12.3116719 C16.7814375,12.3165937 16.7922187,12.3195937 16.8033281,12.3195937 C16.8169687,12.3195937 16.8305625,12.3154687 16.8420938,12.3075 L23.9699063,7.44135937 C23.9888438,7.42884375 24,7.40732812 24,7.38464062 L24,6.07584375 C24,6.05282813 23.9888438,6.0316875 23.9699063,6.01879688 Z" id="Path"></Path>
@@ -93,7 +108,7 @@ const PlayIcon = ({ size, color }:IconProps) => {
     const width = height * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 20 22">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="play-svgrepo-com" fill={color ?? Colors.brand.midnight} fill-rule="nonzero">
                     <Path d="M18.324818,7.73954731 C20.558394,8.95419835 20.558394,12.0984047 18.324818,13.3130347 L4.838541,20.6468145 C2.66773333,21.8273393 0,20.290815 0,17.8600814 L0,3.19252172 C0,0.76176702 2.66773333,-0.774715169 4.83853048,0.405767488 L18.324818,7.73954731 Z" id="Path"></Path>
                 </G>
@@ -106,7 +121,7 @@ const PauseIcon = ({ size, color }:IconProps) => {
     const icon_size = size ?? 20
     return (
         <Svg width={`${icon_size}px`} height={`${icon_size}px`} viewBox="0 0 20 20">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="pause-svgrepo-com" transform="translate(0.000000, -0.000000)" fill={color ?? Colors.brand.midnight} fill-rule="nonzero">
                     <Path d="M0,4 C0,2.11438 0,1.17157 0.58579,0.58579 C1.17157,0 2.11438,0 4,0 C5.88562,0 6.82843,0 7.41421,0.58579 C8,1.17157 8,2.11438 8,4 L8,16 C8,17.8856 8,18.8284 7.41421,19.4142 C6.82843,20 5.88562,20 4,20 C2.11438,20 1.17157,20 0.58579,19.4142 C0,18.8284 0,17.8856 0,16 L0,4 Z" id="Path"></Path>
                     <Path d="M12,4 C12,2.11438 12,1.17157 12.5858,0.58579 C13.1716,0 14.1144,0 16,0 C17.8856,0 18.8284,0 19.4142,0.58579 C20,1.17157 20,2.11438 20,4 L20,16 C20,17.8856 20,18.8284 19.4142,19.4142 C18.8284,20 17.8856,20 16,20 C14.1144,20 13.1716,20 12.5858,19.4142 C12,18.8284 12,17.8856 12,16 L12,4 Z" id="Path"></Path>
@@ -122,7 +137,7 @@ const TwitterXIcon = ({ size }:IconProps) => {
     const height = width * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 24 22">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="x-social-media-black-icon" fill="#000000">
                     <Path d="M18.9013594,0 L22.5813281,0 L14.5415156,9.189375 L24,21.6937031 L16.5938438,21.6937031 L10.7934844,14.1097031 L4.15635938,21.6937031 L0.473859375,21.6937031 L9.0733125,11.8648125 L0,0 L7.59370312,0 L12.8369531,6.931875 L18.9013594,0 Z M17.6096719,19.4908594 L19.6489688,19.4908594 L6.48576562,2.08720313 L4.29764062,2.08720313 L17.6096719,19.4908594 Z" id="Shape"></Path>
                 </G>
@@ -137,7 +152,7 @@ const FacebookIcon = ({ size }:IconProps) => {
     const width = height * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 15 24">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="facebook-svgrepo-com" fill={'#1877F2'} fill-rule="nonzero">
                     <Path d="M9.6,4.8 L13.2,4.8 C13.8627417,4.8 14.4,4.2627417 14.4,3.6 L14.4,1.2 C14.4,0.5372583 13.8627417,0 13.2,0 L9.6,0 C6.2862915,0 3.6,2.6862915 3.6,6 L3.6,9.6 L1.2,9.6 C0.5372583,9.6 0,10.1372583 0,10.8 L0,13.2 C0,13.8627417 0.5372583,14.4 1.2,14.4 L3.6,14.4 L3.6,22.8 C3.6,23.4627417 4.1372583,24 4.8,24 L7.2,24 C7.8627417,24 8.4,23.4627417 8.4,22.8 L8.4,14.4 L11.064,14.4 C11.6288366,14.4164563 12.1286214,14.0366199 12.264,13.488 L12.864,11.088 C12.9542216,10.7237571 12.8688603,10.3382804 12.633296,10.0461807 C12.3977316,9.7540809 12.0390889,9.58899256 11.664,9.6 L8.4,9.6 L8.4,6 C8.4,5.3372583 8.9372583,4.8 9.6,4.8 Z" id="primary"></Path>
                 </G>
@@ -151,8 +166,8 @@ const PodiumIcon = ({ color, size, secondary_color }:IconProps) => {
     return (
         <Svg width={`${icon_size}px`} height={`${icon_size}px`} viewBox="0 0 22 22">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="podium-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke-width="2">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="podium-svgrepo-com" transform="translate(1.000000, 1.000000)" strokeWidth="2">
                     <Polygon id="secondary" stroke={secondary_color ?? Colors.incentive.gold} points="9.48888889 1.04444444 8.33333333 1.21111111 9.16666667 2.02222222 8.96666667 3.16666667 10 2.63333333 11.0333333 3.16666667 10.8333333 2.02222222 11.6666667 1.21111111 10.5111111 1.04444444 10 0"></Polygon>
                     <Path d="M6.66666667,20 L0,20 L0,14.4444444 L6.66666667,14.4444444 L6.66666667,20 Z M13.3333333,7.77777778 L6.66666667,7.77777778 L6.66666667,20 L13.3333333,20 L13.3333333,7.77777778 Z M20,12.2222222 L13.3333333,12.2222222 L13.3333333,20 L20,20 L20,12.2222222 Z" id="primary" stroke={color ?? Colors.brand.midnight}></Path>
                 </G>
@@ -166,7 +181,7 @@ const TwitterIcon = ({ size }:IconProps) => {
     const icon_size = size ?? 20
     return (
         <Svg width={`${icon_size}px`} height={`${icon_size}px`} viewBox="0 0 24 24">
-            <G id="ss" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="ss" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="twitter-svgrepo-com">
                     <Circle id="Oval" fill="#1DA1F2" fill-rule="nonzero" cx="12" cy="12" r="12"></Circle>
                     <Path d="M19.2,7.38516 C18.67062,7.62036 18.10086,7.77876 17.50332,7.85028 C18.11334,7.48452 18.58182,6.9057 18.80208,6.216 C18.2319,6.55482 17.59884,6.8001 16.92642,6.93306 C16.38738,6.35904 15.61896,6 14.7699,6 C13.1385,6 11.81568,7.32282 11.81568,8.95422 C11.81568,9.18552 11.84208,9.41112 11.89248,9.6276 C9.43698,9.50472 7.2603,8.3283 5.80314,6.5409 C5.54874,6.97722 5.4033,7.48452 5.4033,8.02596 C5.4033,9.0507 5.9241,9.95496 6.71748,10.48482 C6.23268,10.46946 5.7777,10.3365 5.37882,10.11522 L5.37882,10.15218 C5.37882,11.58396 6.3978,12.7776 7.74846,13.04976 C7.50078,13.11696 7.23966,13.15344 6.97044,13.15344 C6.77988,13.15344 6.5946,13.13472 6.41412,13.10016 C6.78996,14.2737 7.88142,15.12804 9.17394,15.15204 C8.16312,15.94398 6.88932,16.41672 5.50506,16.41672 C5.26602,16.41672 5.03088,16.4028 4.8,16.37496 C6.10746,17.21304 7.66014,17.70258 9.3285,17.70258 C14.76222,17.70258 17.73372,13.20096 17.73372,9.29736 C17.73372,9.1692 17.73132,9.04158 17.72508,8.91534 C18.30294,8.49774 18.804,7.97748 19.2,7.38516 Z" id="Path" fill="#FFFFFF"></Path>
@@ -181,7 +196,7 @@ const LinkedInIcon = ({ size }:IconProps) => {
     return (
         <Svg width={`${icon_size}px`} height={`${icon_size}px`} viewBox="0 0 24 24">
-            <G id="ss" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="ss" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="linkedin-svgrepo-com">
                     <Circle id="Oval" fill="#0077B5" fill-rule="nonzero" cx="12" cy="12" r="12"></Circle>
                     <Path d="M8.86482,6.17034 C8.86482,6.9174 8.29602,7.52196 7.40652,7.52196 C6.55164,7.52196 5.98278,6.9174 6.00042,6.17034 C5.98278,5.38698 6.55158,4.8 7.42356,4.8 C8.29602,4.8 8.84778,5.38698 8.86482,6.17034 Z M6.07194,17.29146 L6.07194,8.58972 L8.77626,8.58972 L8.77626,17.29086 L6.07194,17.29086 L6.07194,17.29146 Z" id="Shape" fill="#FFFFFF"></Path>
@@ -196,7 +211,7 @@ const LinkIcon = ({ size, color }:IconProps) => {
     const icon_size = size ?? 20
     return (
         <Svg width={`${icon_size}px`} height={`${icon_size}px`} viewBox="0 0 24 24">
-            <G id="ss" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="ss" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="link-circle-svgrepo-com" fill={color ?? Colors.brand.midnight}>
                     <Path d="M1.757364,22.2426 C3.514716,24 6.34314,24 12,24 C17.6568,24 20.48532,24 22.2426,22.2426 C24,20.48532 24,17.6568 24,12 C24,6.34314 24,3.514716 22.2426,1.757364 C20.48532,0 17.6568,0 12,0 C6.34314,0 3.514716,0 1.757364,1.757364 C0,3.514716 0,6.34314 0,12 C0,17.6568 0,20.48532 1.757364,22.2426 Z M9,8.1 C6.846084,8.1 5.1,9.84612 5.1,12 C5.1,14.15388 6.846084,15.9 9,15.9 C11.15388,15.9 12.9,14.15388 12.9,12 C12.9,11.50296 13.30296,11.1 13.8,11.1 C14.29704,11.1 14.7,11.50296 14.7,12 C14.7,15.14808 12.14808,17.7 9,17.7 C5.85198,17.7 3.3,15.14808 3.3,12 C3.3,8.85198 5.85198,6.3 9,6.3 C9.497052,6.3 9.9,6.702948 9.9,7.2 C9.9,7.697052 9.497052,8.1 9,8.1 Z M18.9,12 C18.9,14.15388 17.15388,15.9 15,15.9 C14.50296,15.9 14.1,16.30296 14.1,16.8 C14.1,17.29704 14.50296,17.7 15,17.7 C18.14808,17.7 20.7,15.14808 20.7,12 C20.7,8.85198 18.14808,6.3 15,6.3 C11.85192,6.3 9.3,8.85198 9.3,12 C9.3,12.49704 9.70296,12.9 10.2,12.9 C10.69704,12.9 11.1,12.49704 11.1,12 C11.1,9.84612 12.84612,8.1 15,8.1 C17.15388,8.1 18.9,9.84612 18.9,12 Z" id="Shape"></Path>
                 </G>
@@ -211,8 +226,8 @@ const FlameIcon = ({ size, color }:IconProps) => {
     const width = height * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 18 21">
-            <G id="ss" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                <G id="flame-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color??Colors.brand.midnight} stroke-width="2">
+            <G id="ss" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
+                <G id="flame-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color??Colors.brand.midnight} strokeWidth="2">
                     <Path d="M15.060385,11.624539 C15.060385,15.6291895 12.5960354,17.3865482 10.6917438,17.9790802 C10.2856782,18.1054933 10.0187329,17.6320325 10.2616757,17.283008 C11.0903734,16.092014 12.048308,14.2750727 12.048308,12.5658131 C12.048308,10.7297639 10.5007593,8.56210386 9.29235166,7.22511819 C9.01608773,6.9194865 8.53424953,7.12176629 8.51918915,7.53347957 C8.4692075,8.89757394 8.25393812,10.7226102 7.32574777,12.1529703 C7.17636757,12.3832059 6.85925234,12.4022197 6.68897586,12.1869503 C6.39896932,11.8202299 6.10896279,11.3671006 5.81895625,11.009134 C5.66270475,10.8163611 5.38036019,10.8137255 5.20017209,10.9842844 C4.49764278,11.6494828 3.51408669,12.6868609 3.51408669,13.9777242 C3.51408669,14.9089266 3.95785976,16.0679174 4.41530013,16.9654222 C4.62303931,17.3729938 4.23765348,17.8510669 3.84173478,17.6218667 C2.11370621,16.6215748 0,14.5489834 0,11.624539 C0,8.66291432 4.05716417,4.56012659 5.60627537,0.68405413 C5.85067718,0.0724142449 6.60407294,-0.214984964 7.12798609,0.184152889 C10.3012092,2.60140116 15.060385,7.27406444 15.060385,11.624539 Z" id="Path"></Path>
                 </G>
             </G>
@@ -224,7 +239,7 @@ const UnbidSquare = ({ color, size, secondary_color }:IconProps) => {
     const icon_size = size ?? 50
     return (
         <Svg width={`${icon_size}px`} height={`${icon_size}px`} viewBox="0 0 53 53">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="Group-8" transform="translate(0.775541, 0.625106)">
                     <Polygon id="Triangle" fill={color ?? Colors.brand.midnight} points="0 1.72803993e-11 52 52 1.63236091e-12 52 0 23.2594708"></Polygon>
                     <Polygon id="Triangle" fill={secondary_color ?? Colors.brand.cyan} transform="translate(26.000000, 26.000000) rotate(-180.000000) translate(-26.000000, -26.000000) " points="2.18278728e-11 -1.18234311e-11 52 52 2.34602338e-11 52 2.18278728e-11 23.2594708"></Polygon>
@@ -247,9 +262,9 @@ const DiscoverCardIcon = ({ size }:IconProps) => {
                     <Stop stop-color="#D36002" offset="100%"></Stop>
                 </LinearGradient>
             </Defs>
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="discover-svgrepo-com" transform="translate(1.896552, 1.000000)">
-                    <Rect id="Rectangle" stroke="#F3F3F3" stroke-width="2" fill="#FFFFFF" fill-rule="nonzero" x="0" y="0" width="50" height="34.2105263" rx="4"></Rect>
+                    <Rect id="Rectangle" stroke="#F3F3F3" strokeWidth="2" fill="#FFFFFF" fill-rule="nonzero" x="0" y="0" width="50" height="34.2105263" rx="4"></Rect>
                     <Path d="M16.2885088,17.3880702 C16.2885088,19.5302632 17.970614,21.1912281 20.1353509,21.1912281 C20.747193,21.1912281 21.2714035,21.0709649 21.9176316,20.7665789 L21.9176316,19.0932456 C21.3494737,19.6620175 20.8459649,19.8914912 20.2014912,19.8914912 C18.7697368,19.8914912 17.7535088,18.8533333 17.7535088,17.3773684 C17.7535088,15.9782456 18.8018421,14.8744737 20.1353509,14.8744737 C20.8133333,14.8744737 21.3266667,15.1164035 21.9176316,15.694386 L21.9176316,14.0219298 C21.2936842,13.7054386 20.7807018,13.5742105 20.1688596,13.5742105 C18.0150877,13.5742105 16.2885088,15.2689474 16.2885088,17.3880702 Z M12.6403509,15.6180702 C12.6403509,16.0119298 12.8907018,16.22 13.7438596,16.5357018 C15.3608772,17.1272807 15.8400877,17.6512281 15.8400877,18.8092982 C15.8400877,20.22 14.8036842,21.2023684 13.3265789,21.2023684 C12.2447368,21.2023684 11.4580702,20.7764035 10.8031579,19.8148246 L11.7215789,18.9304386 C12.0487719,19.5633333 12.595,19.9026316 13.2730702,19.9026316 C13.9074561,19.9026316 14.3768421,19.4650877 14.3768421,18.8746491 C14.3768421,18.5685965 14.2346491,18.3058772 13.9505263,18.1203509 C13.8077193,18.0324561 13.5244737,17.9018421 12.967807,17.7052632 C11.6326316,17.2249123 11.1748246,16.7107895 11.1748246,15.7067544 C11.1748246,14.5140351 12.1583333,13.6185965 13.4478947,13.6185965 C14.2470175,13.6185965 14.9782456,13.8917544 15.5894737,14.4264035 L14.845614,15.4003509 C14.4753509,14.9853509 14.1250877,14.8101754 13.699386,14.8101754 C13.0866667,14.8101754 12.6403509,15.1591228 12.6403509,15.6180702 Z M8.84614035,21.0271053 L10.267807,21.0271053 L10.267807,13.7390351 L8.84614035,13.7390351 L8.84614035,21.0271053 Z M5.94036842,19.2138596 C5.49380702,19.6173684 4.91349123,19.7933333 3.99501754,19.7933333 L3.61349123,19.7933333 L3.61349123,14.9736842 L3.99501754,14.9736842 C4.91349123,14.9736842 5.471,15.1381579 5.94036842,15.5633333 C6.43199123,16.0008772 6.72764035,16.6794737 6.72764035,17.3774561 C6.72764035,18.077193 6.43199123,18.7763158 5.94036842,19.2138596 Z M4.27968421,13.7390351 L2.19298246,13.7390351 L2.19298246,21.0268421 L4.26870175,21.0268421 C5.37244737,21.0268421 6.16928947,20.7666667 6.86898246,20.1855263 C7.70045614,19.4977193 8.19207018,18.4607018 8.19207018,17.3881579 C8.19207018,15.2372807 6.58516667,13.7390351 4.27968421,13.7390351 Z M31.2458772,13.7390351 L33.1892105,18.634386 L35.1579825,13.7390351 L36.6989474,13.7390351 L33.5505263,21.2141228 L32.7854386,21.2141228 L29.6927193,13.7390351 L31.2458772,13.7390351 Z M37.3418421,21.0270175 L41.3733333,21.0270175 L41.3733333,19.7931579 L38.7622807,19.7931579 L38.7622807,17.8258772 L41.2772807,17.8258772 L41.2772807,16.5914035 L38.7622807,16.5914035 L38.7622807,14.9738596 L41.3733333,14.9738596 L41.3733333,13.7388596 L37.3418421,13.7388596 L37.3418421,21.0270175 Z M43.7347368,17.0942105 L44.15,17.0942105 C45.0580702,17.0942105 45.5392982,16.6997368 45.5392982,15.9671053 C45.5392982,15.2578947 45.0580702,14.8870175 44.1725439,14.8870175 L43.7347368,14.8870175 L43.7347368,17.0942105 Z M44.4228947,13.7387719 C46.062193,13.7387719 47.0020175,14.5260526 47.0020175,15.8905263 C47.0020175,17.0064035 46.4124561,17.7390351 45.3416667,17.9566667 L47.6361404,21.0269298 L45.8878947,21.0269298 L43.9202632,18.0991228 L43.7347368,18.0991228 L43.7347368,21.0269298 L42.3147368,21.0269298 L42.3147368,13.7387719 L44.4228947,13.7387719 Z" id="Shape" fill="#1D1D1B"></Path>
                     <Path d="M29.525,19.497193 C30.6787719,17.6929825 30.1518421,15.2961404 28.3478947,14.1424561 L28.3478947,14.1424561 C26.5438596,12.9887719 24.1465789,13.5154386 22.9927193,15.3196491 L22.9927193,15.3196491 C21.8392105,17.1233333 22.3664035,19.5209649 24.1703509,20.6746491 L24.1703509,20.6746491 C25.9742982,21.8283333 28.3714035,21.3008772 29.525,19.497193 Z" id="Path" fill="url(#LinearGradient-1)"></Path>
                 </G>
@@ -264,9 +279,9 @@ const VisaCardIcon = ({ size }:IconProps) => {
     const height = width * ratio
     return (
     <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 53 37">
-        <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
             <G id="visa-classic-svgrepo-com" transform="translate(1.896552, 1.000000)">
-                <Rect id="Rectangle" stroke="#F3F3F3" stroke-width="2" fill="#FFFFFF" fill-rule="nonzero" x="0" y="0" width="50" height="34.2105263" rx="4"></Rect>
+                <Rect id="Rectangle" stroke="#F3F3F3" strokeWidth="2" fill="#FFFFFF" fill-rule="nonzero" x="0" y="0" width="50" height="34.2105263" rx="4"></Rect>
                 <Polygon id="Path" fill="#15195A" fill-rule="nonzero" points="22.1505263 23.625614 18.7632456 23.625614 20.8819298 11.3442982 24.2690351 11.3442982"></Polygon>
                 <Path d="M34.4297368,11.6445614 C33.7615789,11.3960526 32.7019298,11.1216667 31.3916667,11.1216667 C28.0465789,11.1216667 25.6910526,12.7939474 25.6765789,15.1847368 C25.6487719,16.9486842 27.3630702,17.9284211 28.6452632,18.5165789 C29.9557018,19.1176316 30.4012281,19.5099123 30.4012281,20.045614 C30.3878947,20.8684211 29.3422807,21.2476316 28.3670175,21.2476316 C27.0146491,21.2476316 26.2900877,21.0521053 25.1888596,20.594386 L24.7428947,20.3981579 L24.2688596,23.155 C25.0633333,23.4942982 26.5270175,23.7954386 28.0465789,23.8086842 C31.6007895,23.8086842 33.9146491,22.1622807 33.9420175,19.6144737 C33.9555263,18.2164035 33.0503509,17.1450877 31.0987719,16.2697368 C29.9140351,15.707807 29.1885088,15.3288596 29.1885088,14.7539474 C29.2024561,14.2312281 29.802193,13.6958772 31.1395614,13.6958772 C32.2407018,13.6696491 33.0498246,13.917807 33.6627193,14.1661404 L33.9690351,14.2965789 L34.4297368,11.6445614 L34.4297368,11.6445614 L34.4297368,11.6445614 Z" id="Path" fill="#15195A" fill-rule="nonzero"></Path>
                 <Path d="M40.492807,11.3442982 L43.112807,11.3442982 L45.8455263,23.6254386 L42.7092105,23.6254386 C42.7092105,23.6254386 42.4022807,22.214386 42.3050877,21.7831579 L37.9560526,21.7831579 C37.8303509,22.1096491 37.2451754,23.6254386 37.2451754,23.6254386 L33.6910526,23.6254386 L38.7223684,12.3632456 C39.0709649,11.5662281 39.6848246,11.3442982 40.492807,11.3442982 Z M40.2840351,15.8385965 C40.2840351,15.8385965 39.210614,18.5692105 38.9316667,19.2747368 L41.747193,19.2747368 C41.6078947,18.6607895 40.9664035,15.7209649 40.9664035,15.7209649 L40.7297368,14.662807 C40.63,14.9352632 40.4858772,15.3099123 40.3885965,15.5626316 C40.3227193,15.7338596 40.2783333,15.8491228 40.2840351,15.8385965 Z" id="Shape" fill="#15195A"></Path>
@@ -283,9 +298,9 @@ const MasterCardIcon = ({ size }:IconProps) => {
     const height = width * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`}  viewBox="0 0 53 37">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="mastercard-full-svgrepo-com" transform="translate(1.896552, 1.000000)">
-                    <Rect id="Rectangle" stroke="#F3F3F3" stroke-width="2" fill="#FFFFFF" fill-rule="nonzero" x="0" y="0" width="50" height="34.2105263" rx="6"></Rect>
+                    <Rect id="Rectangle" stroke="#F3F3F3" strokeWidth="2" fill="#FFFFFF" fill-rule="nonzero" x="0" y="0" width="50" height="34.2105263" rx="6"></Rect>
                     <Path d="M18.2007895,26.6584211 L18.2007895,27.9538596 L18.2007895,29.249386 L17.6329825,29.249386 L17.6329825,28.9348246 C17.4528947,29.1681579 17.1796491,29.3145614 16.8082456,29.3145614 C16.0759649,29.3145614 15.5019298,28.745614 15.5019298,27.9538596 C15.5019298,27.162807 16.0759649,26.5932456 16.8082456,26.5932456 C17.1796491,26.5932456 17.4528947,26.7396491 17.6329825,26.9729825 L17.6329825,26.6584211 L18.2007895,26.6584211 Z M16.8788596,27.124386 C16.3873684,27.124386 16.0865789,27.4985088 16.0865789,27.9538596 C16.0865789,28.4092982 16.3873684,28.7834211 16.8788596,28.7834211 C17.3485088,28.7834211 17.6655263,28.4254386 17.6655263,27.9538596 C17.6655263,27.4823684 17.3485088,27.124386 16.8788596,27.124386 Z M37.3884211,27.9538596 C37.3884211,27.4985088 37.6892105,27.124386 38.1807018,27.124386 C38.6509649,27.124386 38.9673684,27.4823684 38.9673684,27.9538596 C38.9673684,28.4254386 38.6509649,28.7834211 38.1807018,28.7834211 C37.6892105,28.7834211 37.3884211,28.4092982 37.3884211,27.9538596 Z M39.5033333,25.6178947 L39.5033333,27.9538596 L39.5033333,29.249386 L38.9349123,29.249386 L38.9349123,28.9348246 C38.7547368,29.1681579 38.4814912,29.3145614 38.1100877,29.3145614 C37.377807,29.3145614 36.8037719,28.745614 36.8037719,27.9538596 C36.8037719,27.162807 37.377807,26.5932456 38.1100877,26.5932456 C38.4814912,26.5932456 38.7547368,26.7396491 38.9349123,26.9729825 L38.9349123,25.6178947 L39.5033333,25.6178947 Z M25.2489474,27.0977193 C25.6147368,27.0977193 25.8498246,27.3253509 25.9099123,27.7262281 L24.5548246,27.7262281 C24.6154386,27.3521053 24.8442982,27.0977193 25.2489474,27.0977193 Z M23.9594737,27.9538596 C23.9594737,27.1460526 24.4947368,26.5932456 25.2601754,26.5932456 C25.9918421,26.5932456 26.4945614,27.1460526 26.5001754,27.9538596 C26.5001754,28.0295614 26.4945614,28.1003509 26.4889474,28.1704386 L24.5498246,28.1704386 C24.6317544,28.6370175 24.965,28.8051754 25.3307895,28.8051754 C25.592807,28.8051754 25.8717544,28.7071053 26.090614,28.5340351 L26.3688596,28.9515789 C26.0518421,29.2171053 25.6916667,29.3145614 25.2983333,29.3145614 C24.5166667,29.3145614 23.9594737,28.7778947 23.9594737,27.9538596 Z M32.1163158,27.9538596 C32.1163158,27.4985088 32.4171053,27.124386 32.9085965,27.124386 C33.3781579,27.124386 33.6952632,27.4823684 33.6952632,27.9538596 C33.6952632,28.4254386 33.3781579,28.7834211 32.9085965,28.7834211 C32.4171053,28.7834211 32.1163158,28.4092982 32.1163158,27.9538596 Z M34.2305263,26.6584211 L34.2305263,27.9538596 L34.2305263,29.249386 L33.6627193,29.249386 L33.6627193,28.9348246 C33.4820175,29.1681579 33.209386,29.3145614 32.8378947,29.3145614 C32.105614,29.3145614 31.5315789,28.745614 31.5315789,27.9538596 C31.5315789,27.162807 32.105614,26.5932456 32.8378947,26.5932456 C33.209386,26.5932456 33.4820175,26.7396491 33.6627193,26.9729825 L33.6627193,26.6584211 L34.2305263,26.6584211 Z M28.9095614,27.9538596 C28.9095614,28.74 29.4611404,29.3145614 30.302807,29.3145614 C30.6961404,29.3145614 30.9581579,29.2277193 31.2421053,29.0055263 L30.969386,28.5501754 C30.7562281,28.702193 30.5322807,28.7834211 30.2859649,28.7834211 C29.8325439,28.7778947 29.4992982,28.4527193 29.4992982,27.9538596 C29.4992982,27.4550877 29.8325439,27.1299123 30.2859649,27.124386 C30.5322807,27.124386 30.7562281,27.205614 30.969386,27.3576316 L31.2421053,26.902193 C30.9581579,26.6800877 30.6961404,26.5932456 30.302807,26.5932456 C29.4611404,26.5932456 28.9095614,27.167807 28.9095614,27.9538596 Z M35.5418421,26.9729825 C35.689386,26.7452632 35.9026316,26.5932456 36.2303509,26.5932456 C36.3453509,26.5932456 36.5092105,26.615 36.6349123,26.6639474 L36.4598246,27.1950877 C36.3397368,27.1460526 36.2196491,27.1299123 36.1046491,27.1299123 C35.7331579,27.1299123 35.5474561,27.3681579 35.5474561,27.7969298 L35.5474561,29.249386 L34.9790351,29.249386 L34.9790351,26.6584211 L35.5418421,26.6584211 L35.5418421,26.9729825 Z M21.0092105,26.864386 C20.7358772,26.6857018 20.3594737,26.5932456 19.9442105,26.5932456 C19.2826316,26.5932456 18.8567544,26.907807 18.8567544,27.422807 C18.8567544,27.8453509 19.1738596,28.1058772 19.7578947,28.187193 L20.0261404,28.225 C20.3375439,28.2685088 20.4845614,28.3497368 20.4845614,28.4961404 C20.4845614,28.6965789 20.2769298,28.8107018 19.8892105,28.8107018 C19.4958772,28.8107018 19.2120175,28.6860526 19.020614,28.5395614 L18.7529825,28.9782456 C19.064386,29.2059649 19.4577193,29.3145614 19.8835965,29.3145614 C20.6377193,29.3145614 21.0748246,28.9621053 21.0748246,28.4688596 C21.0748246,28.0134211 20.7308772,27.7751754 20.1624561,27.6939474 L19.8948246,27.6554386 C19.6491228,27.6231579 19.4521053,27.5748246 19.4521053,27.4010526 C19.4521053,27.2112281 19.637807,27.0977193 19.9492105,27.0977193 C20.2825439,27.0977193 20.6051754,27.2223684 20.7634211,27.3198246 L21.0092105,26.864386 Z M27.6477193,26.9729825 C27.7946491,26.7452632 28.0078947,26.5932456 28.3355263,26.5932456 C28.450614,26.5932456 28.6144737,26.615 28.7400877,26.6639474 L28.565,27.1950877 C28.445,27.1460526 28.3249123,27.1299123 28.2098246,27.1299123 C27.8384211,27.1299123 27.6527193,27.3681579 27.6527193,27.7969298 L27.6527193,29.249386 L27.0849123,29.249386 L27.0849123,26.6584211 L27.6477193,26.6584211 L27.6477193,26.9729825 Z M23.4898246,26.6584211 L22.5612281,26.6584211 L22.5612281,25.8722807 L21.987193,25.8722807 L21.987193,26.6584211 L21.4575439,26.6584211 L21.4575439,27.1733333 L21.987193,27.1733333 L21.987193,28.3553509 C21.987193,28.9565789 22.2222807,29.3145614 22.8939474,29.3145614 C23.1402632,29.3145614 23.4242105,29.2388596 23.6042982,29.1141228 L23.4404386,28.6314035 C23.2709649,28.7288596 23.0852632,28.7778947 22.9377193,28.7778947 C22.6537719,28.7778947 22.5612281,28.6041228 22.5612281,28.3441228 L22.5612281,27.1733333 L23.4898246,27.1733333 L23.4898246,26.6584211 Z M14.9997368,27.6231579 L14.9997368,29.249386 L14.4257018,29.249386 L14.4257018,27.8074561 C14.4257018,27.3681579 14.24,27.124386 13.8522807,27.124386 C13.4751754,27.124386 13.2131579,27.3632456 13.2131579,27.8130702 L13.2131579,29.249386 L12.6391228,29.249386 L12.6391228,27.8074561 C12.6391228,27.3681579 12.4484211,27.124386 12.0713158,27.124386 C11.6829825,27.124386 11.4316667,27.3632456 11.4316667,27.8130702 L11.4316667,29.249386 L10.8582456,29.249386 L10.8582456,26.6584211 L11.4266667,26.6584211 L11.4266667,26.9778947 C11.6399123,26.6745614 11.9125439,26.5932456 12.1914035,26.5932456 C12.5903509,26.5932456 12.8742982,26.7670175 13.054386,27.0542105 C13.2950877,26.6907018 13.6390351,26.5876316 13.9723684,26.5932456 C14.6064035,26.5988596 14.9997368,27.0107895 14.9997368,27.6231579 Z" id="Shape" fill="#231F20"></Path>
                     <Polygon id="Path" fill="#FF5F00" fill-rule="nonzero" points="29.4267544 22.2557018 20.8209649 22.2557018 20.8209649 6.91078947 29.4267544 6.91078947"></Polygon>
                     <Path d="M21.3669298,14.5835965 C21.3669298,11.4707895 22.8357895,8.69798246 25.1232456,6.91111404 C23.4505263,5.60444737 21.339386,4.82454386 19.0450877,4.82454386 C13.6135088,4.82454386 9.21052632,9.19377193 9.21052632,14.5835965 C9.21052632,19.9734211 13.6135088,24.3426316 19.0450877,24.3426316 C21.339386,24.3426316 23.4505263,23.5627193 25.1232456,22.2560526 C22.8357895,20.4692105 21.3669298,17.6964035 21.3669298,14.5835965" id="Path" fill="#EB001B" fill-rule="nonzero"></Path>
@@ -302,7 +317,7 @@ const AmexCardIcon = ({ size }:IconProps) => {
     const height = width * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 50 35">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="american-express-svgrepo-com-(1)" transform="translate(0.000000, 0.245636)" fill-rule="nonzero">
                     <Path d="M50,31.5263672 C50,33.1587891 48.6767578,34.4821289 47.0444336,34.4821289 L2.95556641,34.4821289 C1.32324219,34.4821289 0,33.1587891 0,31.5263672 L0,2.95566406 C0,1.32333984 1.32324219,0 2.95556641,0 L47.0444336,0 C48.6768555,0 50,1.32333984 50,2.95566406 L50,31.5263672 L50,31.5263672 Z" id="Path" fill="#306FC5"></Path>
                     <Path d="M2.10126953,31.5263672 L2.10126953,2.95566406 C2.10126953,1.32333984 3.42470703,0 5.05703125,0 L2.95546875,0 C1.32324219,0 0,1.32324219 0,2.95566406 L0,31.5264648 C0,33.1588867 1.32324219,34.4822266 2.95556641,34.4822266 L5.05712891,34.4822266 C3.42480469,34.4822266 2.10126953,33.1587891 2.10126953,31.5263672 Z" id="Path" fill="#202121" opacity="0.15"></Path>
@@ -330,8 +345,8 @@ const AmexCardIcon = ({ size }:IconProps) => {
     let height = width * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 24 18">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="eye" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="eye" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                     <Path d="M0,8 C0,8 4,0 11,0 C18,0 22,8 22,8 C22,8 18,16 11,16 C4,16 0,8 0,8 Z" id="Path"></Path>
                     <Circle id="Oval" cx="11" cy="8" r="3"></Circle>
                 </G>
@@ -347,7 +362,7 @@ const PlaidIcon = ({ size }:IconProps) => {
     let width = height * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`}  viewBox="0 0 50 52">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="Plaid_(company)-Vertical-Logo.wine-(1)" fill="#111212" fill-rule="nonzero">
                     <Path d="M37.0521625,26.381365 L32.705422,22.0347244 L36.121831,18.6185151 L38.4456123,20.9423964 L37.0521625,26.381365 Z M36.121831,14.5189642 L32.705422,11.1027549 L37.0521625,6.75621419 L38.4456123,12.1953826 L36.121831,14.5189642 Z M29.563668,3.31293895 L35.0025368,4.70618903 L30.6558962,9.0530294 L27.239687,5.63682015 L29.563668,3.31293895 Z M23.1402359,5.63692003 L19.7239267,9.0530294 L15.377386,4.70638878 L20.8163547,3.31293895 L23.1402359,5.63692003 Z M13.327261,6.7558147 L17.6742012,11.1028548 L14.2580918,14.5189642 L11.9338111,12.1946835 L13.327261,6.7558147 Z M14.2580918,18.6183154 L17.6742012,22.0344248 L13.327261,26.381365 L11.9338111,20.9424962 L14.2580918,18.6183154 Z M20.8161549,29.8245404 L15.3769865,28.4310906 L19.7239267,24.0842502 L23.140136,27.5005593 L20.8161549,29.8245404 Z M28.6060708,22.0346245 L25.1898615,25.4508338 L21.7735524,22.0346245 L25.1898615,18.6183154 L28.6060708,22.0346245 Z M30.6557963,13.1523806 L34.0720056,16.5686897 L30.6557963,19.984899 L27.2394872,16.5686897 L30.6557963,13.1523806 Z M23.140136,16.5686897 L19.7239267,19.984899 L16.3078174,16.5686897 L19.7239267,13.1525804 L23.140136,16.5686897 Z M21.7737522,11.1028548 L25.1899614,7.68664557 L28.6060708,11.1027549 L25.1898615,14.5189642 L21.7737522,11.1028548 Z M27.2394872,27.5005593 L30.6557963,24.0844499 L35.0023371,28.4310906 L29.5633684,29.8243406 L27.2394872,27.5005593 Z M39.1108767,30.4897049 L41.7585513,20.1556845 L38.1715565,16.5687896 L41.7585513,12.9815951 L39.1107769,2.64747477 L28.7766565,0 L25.1899614,3.58709461 L21.6025672,0 L11.2685467,2.6477744 L8.62107193,12.9817949 L12.2083663,16.5686897 L8.62107193,20.1558842 L11.2685467,30.4899047 L21.6027669,33.1374793 L25.1898615,29.550185 L28.7767564,33.1374793 L39.1108767,30.4897049 Z M48.8647259,41.2489913 C48.4431554,40.6529399 47.9401871,40.1758391 47.3574191,39.8157914 C46.4012201,39.2196401 45.0980568,38.9215146 43.4473302,38.9215146 L39.2775674,38.9215146 L39.2775674,51.3383191 L44.1550413,51.3383191 C45.9167286,51.3383191 47.3322507,50.7680353 48.3995102,49.6261695 C49.4666699,48.4843037 50,46.970505 50,45.0837748 C50,43.5823606 49.6212757,42.3044656 48.8647259,41.2489913 M43.8014853,48.5279489 L42.4421926,48.5279489 L42.4421926,41.7327836 L43.820062,41.7327836 C44.7881461,41.7327836 45.5321117,42.0323074 46.0534569,42.6306559 C46.5750018,43.2296036 46.8352749,44.0786372 46.8352749,45.1761587 C46.8352749,47.4111516 45.8236455,48.5279489 43.8014853,48.5279489 M33.4143316,51.3388184 L36.5789568,51.3388184 L36.5789568,38.9221138 L33.4143316,38.9221138 L33.4143316,51.3388184 Z M24.3856716,38.9219141 L19.415614,51.3388184 L22.8220355,51.3388184 L23.4736171,49.5334859 L27.7918934,49.5334859 L28.3874454,51.3388184 L31.8323186,51.3388184 L26.8985155,38.9219141 L24.3856716,38.9219141 Z M24.3486181,47.0204423 L25.6517814,42.7759734 L26.9356688,47.0204423 L24.3486181,47.0204423 Z M14.5197632,38.9219141 L11.3552378,38.9219141 L11.3552378,51.3388184 L18.1874566,51.3388184 L18.1874566,48.5275494 L14.5197632,48.5275494 L14.5197632,38.9219141 Z M7.87440974,39.8528448 C7.12954529,39.2323242 5.85744305,38.9224134 4.05810302,38.9224134 L0,38.9224134 L0,51.3386187 L3.03448868,51.3386187 L3.03448868,47.4484048 L4.39318216,47.4484048 C6.04390885,47.4484048 7.25378924,47.0881573 8.02302308,46.3677621 C8.89123261,45.5617744 9.32598656,44.4885224 9.32598656,43.1477065 C9.32598656,41.757952 8.84239395,40.6597314 7.87440974,39.8528448 M4.31847599,44.6371358 L3.03448868,44.6371358 L3.03448868,41.7328835 L4.18823957,41.7328835 C5.59047836,41.7328835 6.29159775,42.2202713 6.29159775,43.1941481 C6.29159775,44.1564395 5.63412354,44.6371358 4.31847599,44.6371358" id="Shape"></Path>
                 </G>
@@ -362,8 +377,8 @@ const GiftIcon = ({color, size}:IconProps) => {
     let height = width * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 22 21">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linejoin="round">
-                <G id="gift-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color ?? Colors.brand.midnight} stroke-width="2">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linejoin="round">
+                <G id="gift-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color ?? Colors.brand.midnight} strokeWidth="2">
                     <Path d="M0,7.22751235 C0,6.71122347 0,6.45309013 0.0427,6.23842347 C0.218044444,5.35689013 0.907155556,4.66777902 1.78868889,4.49243458 C2.00335556,4.44973458 2.26148889,4.44973458 2.77777778,4.44973458 L10,4.44973458 L17.2222222,4.44973458 C17.7385556,4.44973458 17.9966667,4.44973458 18.2113333,4.49243458 C19.0928889,4.66777902 19.782,5.35689013 19.9573333,6.23842347 C20,6.45309013 20,6.71122347 20,7.22751235 L20,7.22751235 L20,7.22751235 C20,7.74380124 20,8.0019568 19.9573333,8.21662347 C19.782,9.09817902 19.0928889,9.78729013 18.2113333,9.96262347 C17.9966667,10.0052901 17.7385556,10.0052901 17.2222222,10.0052901 L10,10.0052901 L2.77777778,10.0052901 C2.26148889,10.0052901 2.00335556,10.0052901 1.78868889,9.96262347 C0.907155556,9.78729013 0.218044444,9.09817902 0.0427,8.21662347 C0,8.0019568 0,7.74380124 0,7.22751235 L0,7.22751235 L0,7.22751235 Z" id="Path"></Path>
                     <Path d="M1.11111111,10.0052901 L1.11111111,14.4497346 C1.11111111,16.5448457 1.11111111,17.5924012 1.76198889,18.2432901 C2.41285556,18.894179 3.46042222,18.894179 5.55555556,18.894179 L6.66666667,18.894179 L13.3333333,18.894179 L14.4444444,18.894179 C16.5395556,18.894179 17.5871111,18.894179 18.238,18.2432901 C18.8888889,17.5924012 18.8888889,16.5448457 18.8888889,14.4497346 L18.8888889,10.0052901" id="Path" stroke-linecap="round"></Path>
                     <Line x1="10" y1="4.44973458" x2="10" y2="18.894179" id="Path" stroke-linecap="round"></Line>
@@ -386,9 +401,9 @@ const TransactionSuccessIcon = ({ size }:IconProps) => {
                     <Stop stop-color="#AB9F5E" stop-opacity="0.5" offset="100%"></Stop>
                 </LinearGradient>
             </Defs>
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="success-filled-svgrepo-com" transform="translate(14.818182, 14.909091)">
-                    <Circle id="Oval" stroke="url(#LinearGradient-1)" stroke-width="30" cx="125.181818" cy="125.090909" r="125"></Circle>
+                    <Circle id="Oval" stroke="url(#LinearGradient-1)" strokeWidth="30" cx="125.181818" cy="125.090909" r="125"></Circle>
                     <Path d="M125,0 C194.035594,0 250,55.9644063 250,125 C250,194.035594 194.035594,250 125,250 C55.9644063,250 0,194.035594 0,125 C0,55.9644063 55.9644063,0 125,0 Z M109.428571,149.660714 L81.6607143,121.875 C78.9525135,119.166799 75.0052249,118.109126 71.3057539,119.100397 C67.6062828,120.091667 64.716667,122.981283 63.7253967,126.680754 C62.7341264,130.380225 63.7917992,134.327514 66.5,137.035714 L101.857143,172.392857 C103.862111,174.413566 106.590895,175.550121 109.4375,175.550121 C112.284105,175.550121 115.012889,174.413566 117.017857,172.392857 L190.232143,99.1607143 C192.977104,96.4631674 194.064403,92.5006372 193.080578,88.77993 C192.096752,85.0592229 189.192965,82.152011 185.47342,81.1638015 C181.753875,80.1755921 177.790066,81.2582195 175.089286,84 L109.428571,149.660714 Z" id="Shape" fill="#7DCD85" fill-rule="nonzero"></Path>
                 </G>
             </G>
@@ -407,10 +422,10 @@ const TransactionErrorIcon = ({size}:IconProps) => {
                     <Stop stop-color="#6E8894" stop-opacity="0.64" offset="100%"></Stop>
                 </LinearGradient>
             </Defs>
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="error-filled-svgrepo-com" transform="translate(10.000000, 10.000000)">
                     <Path d="M125,0 C194.025,0 250,55.975 250,125 C250,194.025 194.025,250 125,250 C55.975,250 0,194.025 0,125 C0,55.975 55.975,0 125,0 Z M153.6625,78.6625001 L125,107.325 L96.3374999,78.6625001 L78.6625001,96.3374999 L107.325,125 L78.6625001,153.6625 L96.3374999,171.3375 L125,142.675 L153.6625,171.3375 L171.3375,153.6625 L142.675,125 L171.3375,96.3374999 L153.6625,78.6625001 Z" id="Combined-Shape" fill="#D5573B" fill-rule="nonzero"></Path>
-                    <Circle id="Oval" stroke="url(#LinearGradient-1)" stroke-width="20" cx="125" cy="125" r="125"></Circle>
+                    <Circle id="Oval" stroke="url(#LinearGradient-1)" strokeWidth="20" cx="125" cy="125" r="125"></Circle>
                 </G>
             </G>
         </Svg>
@@ -421,7 +436,7 @@ const LogoutIcon = ({color, size}:IconProps) => {
     const icon_size = size ?? 20
     return (
         <Svg width={`${icon_size}px`} height={`${icon_size}px`} viewBox="0 0 20 20">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="logout-svgrepo-com" transform="translate(-0.000000, 0.000000)" fill={color ?? Colors.brand.midnight}>
                     <Path d="M0,4.28571939 C0,1.91878324 1.91878324,0 4.28571939,0 L9.52382086,0 C11.6277281,0 13.3333492,1.70558298 13.3333492,3.80952834 L13.3333492,4.76191043 C13.3333492,5.28789201 12.9069677,5.71429252 12.3809671,5.71429252 C11.8549665,5.71429252 11.428585,5.28789201 11.428585,4.76191043 L11.428585,3.80952834 C11.428585,2.75755566 10.5758221,1.90476417 9.52382086,1.90476417 L4.28571939,1.90476417 C2.97075592,1.90476417 1.90476417,2.97075592 1.90476417,4.28571939 L1.90476417,14.7619223 C1.90476417,16.0768763 2.97075592,17.1428776 4.28571939,17.1428776 L9.52382086,17.1428776 C10.5758221,17.1428776 11.428585,16.2901146 11.428585,15.2381134 L11.428585,14.2857313 C11.428585,13.7597307 11.8549665,13.3333492 12.3809671,13.3333492 C12.9069677,13.3333492 13.3333492,13.7597307 13.3333492,14.2857313 L13.3333492,15.2381134 C13.3333492,17.3420206 11.6277281,19.0476417 9.52382086,19.0476417 L4.28571939,19.0476417 C1.91878324,19.0476417 0,17.1288775 0,14.7619223 L0,4.28571939 Z M15.5170661,5.99323571 C15.8889713,5.62131145 16.4920196,5.62131145 16.8639248,5.99323571 L19.7210711,8.85039149 C20.0929763,9.22229669 20.0929763,9.82534503 19.7210711,10.1972502 L16.8639248,13.0543965 C16.4920196,13.4263017 15.8889713,13.4263017 15.5170661,13.0543965 C15.1451609,12.6824913 15.1451609,12.079443 15.5170661,11.7075377 L16.7484009,10.4762029 L8.57143878,10.4762029 C8.04543815,10.4762029 7.61905669,10.0498215 7.61905669,9.52382086 C7.61905669,8.99782024 8.04543815,8.57143878 8.57143878,8.57143878 L16.7484009,8.57143878 L15.5170661,7.3401135 C15.1451609,6.96817972 15.1451609,6.36516948 15.5170661,5.99323571 Z" id="Shape"></Path>
                 </G>
@@ -436,8 +451,8 @@ const LogoutIcon = ({color, size}:IconProps) => {
     let height = width * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 24 24">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="eye-off" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="eye-off" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                     <Path d="M16.94,16.94 C15.23059,18.2430022 13.1491075,18.9648632 11,19 C4,19 0,11 0,11 C1.2438899,8.68189567 2.96913545,6.65660741 5.06,5.06 M8.9,3.24 C9.5883323,3.07887951 10.2930641,2.99833874 11,2.99997482 C18,2.99997482 22,11 22,11 C21.3929796,12.1356074 20.6690554,13.2047361 19.84,14.19 M13.12,13.12 C12.3721177,13.9226127 11.2457778,14.2529967 10.1828444,13.9815422 C9.1199109,13.7100876 8.28991239,12.8800891 8.01845783,11.8171556 C7.74700327,10.7542222 8.07738729,9.62788232 8.88,8.88" id="Shape"></Path>
                     <Line x1="0" y1="0" x2="22" y2="22" id="Path"></Line>
                 </G>
@@ -452,8 +467,8 @@ const NotificationIcon = ({color, size}:IconProps) => {
     let width = height * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 19 22">
-        <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linejoin="round">
-            <G id="notification-bell-on-svgrepo-com-(1)" transform="translate(1.887826, 1.000000)" stroke={color ?? Colors.brand.midnight} stroke-width="2">
+        <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linejoin="round">
+            <G id="notification-bell-on-svgrepo-com-(1)" transform="translate(1.887826, 1.000000)" stroke={color ?? Colors.brand.midnight} strokeWidth="2">
                 <Path d="M5.09214307,16.8717414 C4.4618511,16.8717414 2.49815976,16.8717414 1.04327967,16.8717414 C0.26810762,16.8717414 -0.235114486,16.0559958 0.111548704,15.3626694 L1.00216393,13.581439 C1.29174683,13.0022941 1.44250804,12.3643379 1.44250804,11.7167883 C1.44250804,10.9141814 1.44250804,9.72200209 1.44250804,8.52971846 C1.44250804,6.44421272 2.4852609,2.27320125 7.69902524,2.27320125 C12.9127896,2.27320125 13.9555424,6.44421272 13.9555424,8.52971846 C13.9555424,9.72200209 13.9555424,10.9141814 13.9555424,11.7167883 C13.9555424,12.3643379 14.1063245,13.0022941 14.395897,13.581439 L15.2865122,15.3626694 C15.6331233,16.0559958 15.1289522,16.8717414 14.353874,16.8717414 L10.3059074,16.8717414 M5.09214307,16.8717414 C5.09214307,18.9572471 6.13489594,20 7.69902524,20 C9.26315454,20 10.3059074,18.9572471 10.3059074,16.8717414 M5.09214307,16.8717414 C6.72102733,16.8717414 10.3059074,16.8717414 10.3059074,16.8717414" id="Shape"></Path>
                 <Line x1="7.69902524" y1="2.08550574" x2="7.69902524" y2="0" id="Path" stroke-linecap="round"></Line>
             </G>
@@ -466,7 +481,7 @@ const NotificationIcon = ({color, size}:IconProps) => {
     let icon_size = size ?? 17
     return (
         <Svg width={`${icon_size}px`} height={`${icon_size}px`} viewBox="0 0 17 17">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="Group" transform="translate(-0.000000, -0.000000)" fill={color} fill-rule="nonzero">
                     <Path d="M7.500003,10.833313 L7.500003,9.166663 C6.836963,9.166663 6.201073,8.903273 5.732233,8.434433 C5.263393,7.965593 5.000003,7.329713 5.000003,6.666663 C5.000003,6.003623 5.263393,5.367743 5.732233,4.898903 C6.201073,4.430063 6.836963,4.166663 7.500003,4.166663 L7.500003,3.333333 C7.500003,3.112323 7.587803,2.900363 7.744083,2.744073 C7.900363,2.587793 8.112323,2.500003 8.333333,2.500003 C8.554343,2.500003 8.766313,2.587793 8.922593,2.744073 C9.078873,2.900363 9.166663,3.112323 9.166663,3.333333 L9.166663,4.166663 L9.185003,4.166663 C9.843213,4.166663 10.474413,4.428123 10.939813,4.893533 C11.405213,5.358933 11.666713,5.990153 11.666713,6.648333 C11.666713,6.869343 11.578913,7.081313 11.422613,7.237593 C11.266313,7.393873 11.054313,7.481663 10.833313,7.481663 C10.612313,7.481663 10.400313,7.393873 10.244113,7.237593 C10.087813,7.081313 10.000013,6.869343 10.000013,6.648333 C10.000013,6.432183 9.914113,6.224883 9.761313,6.072043 C9.608413,5.919203 9.401113,5.833333 9.185003,5.833333 L9.166663,5.833333 L9.166663,7.500003 C9.829713,7.500003 10.465613,7.763393 10.934413,8.232233 C11.403313,8.701073 11.666713,9.336963 11.666713,10.000013 C11.666713,10.663013 11.403313,11.298913 10.934413,11.767813 C10.465613,12.236613 9.829713,12.500013 9.166663,12.500013 L9.166663,13.333313 C9.166663,13.554313 9.078873,13.766313 8.922593,13.922613 C8.766313,14.078913 8.554343,14.166713 8.333333,14.166713 C8.112323,14.166713 7.900363,14.078913 7.744083,13.922613 C7.587803,13.766313 7.500003,13.554313 7.500003,13.333313 L7.500003,12.500013 L7.457503,12.500013 C6.805733,12.500013 6.180653,12.241113 5.719783,11.780213 C5.258913,11.319313 5.000003,10.694313 5.000003,10.042513 C5.000003,9.821483 5.087793,9.609523 5.244083,9.453243 C5.400363,9.296963 5.612323,9.209163 5.833333,9.209163 C6.054343,9.209163 6.266313,9.296963 6.422593,9.453243 C6.578873,9.609523 6.666663,9.821483 6.666663,10.042513 C6.666883,10.252213 6.750283,10.453213 6.898543,10.601413 C7.046803,10.749713 7.247823,10.833113 7.457503,10.833313 L7.500003,10.833313 Z M9.166663,10.833313 C9.387713,10.833313 9.599613,10.745513 9.755913,10.589213 C9.912213,10.433013 10.000013,10.221013 10.000013,10.000013 C10.000013,9.778983 9.912213,9.567023 9.755913,9.410743 C9.599613,9.254463 9.387713,9.166663 9.166663,9.166663 L9.166663,10.833313 Z M7.500003,5.833333 C7.278983,5.833333 7.067023,5.921133 6.910743,6.077413 C6.754463,6.233693 6.666663,6.445653 6.666663,6.666663 C6.666663,6.887683 6.754463,7.099643 6.910743,7.255923 C7.067023,7.412203 7.278983,7.500003 7.500003,7.500003 L7.500003,5.833333 Z M8.333333,16.666713 C3.730833,16.666713 4.4408921e-16,12.935813 4.4408921e-16,8.333333 C4.4408921e-16,3.730833 3.730833,4.16333634e-16 8.333333,4.16333634e-16 C12.935813,4.16333634e-16 16.666713,3.730833 16.666713,8.333333 C16.666713,12.935813 12.935813,16.666713 8.333333,16.666713 Z M8.333333,15.000013 C10.101413,15.000013 11.797113,14.297613 13.047413,13.047413 C14.297613,11.797113 15.000013,10.101413 15.000013,8.333333 C15.000013,6.565223 14.297613,4.869533 13.047413,3.619293 C11.797113,2.369043 10.101413,1.666663 8.333333,1.666663 C6.565223,1.666663 4.869533,2.369043 3.619293,3.619293 C2.369043,4.869533 1.666663,6.565223 1.666663,8.333333 C1.666663,10.101413 2.369043,11.797113 3.619293,13.047413 C4.869533,14.297613 6.565223,15.000013 8.333333,15.000013 Z" id="Shape"></Path>
                 </G>
@@ -479,8 +494,8 @@ const HeadphoneIcon = ({ color, size }:IconProps) => {
     let icon_size = size ?? 17
     return (
         <Svg width={`${icon_size}px`} height={`${icon_size}px`} viewBox="0 0 22 23">
-        <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-            <G id="headphones-round-sound-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color ?? Colors.brand.midnight} stroke-width="2">
+        <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
+            <G id="headphones-round-sound-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color ?? Colors.brand.midnight} strokeWidth="2">
                 <Path d="M20,15 L20,10 C20,8.1786 19.513,6.47087 18.6622,5 M0,16 L0,10 C0,4.47715 4.47715,0 10,0 C11.8214,0 13.5291,0.48697 15,1.33782" id="Shape" stroke-linecap="round"></Path>
                 <Path d="M6,13.1871 C6,12.6088 6,12.3196 5.93097,12.0899 C5.77135,11.5588 5.35457,11.156 4.83579,11.0313 C4.61143,10.9775 4.33578,11.0002 3.78447,11.0457 C2.82772,11.1247 2.34935,11.1642 1.95934,11.3151 C1.06004,11.6629 0.3739,12.4394 0.1131,13.4044 C0,13.8229 0,14.3248 0,15.3285 L0,15.514 C0,16.5431 0,17.0577 0.12305,17.493 C0.36454,18.3475 0.942,19.0543 1.71133,19.437 C2.10333,19.632 2.58932,19.7123 3.56129,19.8728 C4.20632,19.9793 4.52883,20.0326 4.78984,19.9788 C5.30414,19.8729 5.72826,19.4938 5.90852,18.9791 C6,18.7178 6,18.3763 6,17.6934 L6,13.1871 Z" id="Path"></Path>
                 <Path d="M14,13.1871 C14,12.6088 14,12.3196 14.069,12.0899 C14.2286,11.5588 14.6454,11.156 15.1642,11.0313 C15.3886,10.9775 15.6642,11.0002 16.2155,11.0457 C17.1723,11.1247 17.6506,11.1642 18.0407,11.3151 C18.94,11.6629 19.6261,12.4394 19.8869,13.4044 C20,13.8229 20,14.3248 20,15.3285 L20,15.514 C20,16.5431 20,17.0577 19.877,17.493 C19.6355,18.3475 19.058,19.0543 18.2887,19.437 C17.8967,19.632 17.4107,19.7123 16.4387,19.8728 C15.7937,19.9793 15.4712,20.0326 15.2102,19.9788 C14.6959,19.8729 14.2717,19.4938 14.0915,18.9791 C14,18.7178 14,18.3763 14,17.6934 L14,13.1871 Z" id="Path"></Path>
@@ -497,8 +512,8 @@ const EdgeCoinIcon = ({ color, size }:IconProps) => {
     let icon_size = size ?? 17
     return (
         <Svg width={`${icon_size}px`} height={`${icon_size}px`} viewBox="0 0 22 22">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="currency-dollar-circle-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color??Colors.brand.midnight} stroke-width="2">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="currency-dollar-circle-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color??Colors.brand.midnight} strokeWidth="2">
                     <Path d="M6.56111111,4.49999979 L6.53611111,15.4833333 M6.51666667,4.50277788 L12.95,4.50277788 M6.51666667,10.2361112 L12.95,10.2361112 M6.51666667,15.5694445 L12.95,15.5694445 M20,10 C20,13.5726557 18.0940108,16.873926 15,18.660254 C11.9059893,20.4465819 8.09401075,20.4465819 5,18.660254 C1.90598917,16.873926 4.93432455e-16,13.5726557 4.93432455e-16,10 C4.93432455e-16,4.47715237 4.47715258,0 10,0 C15.5228474,0 20,4.47715237 20,10 L20,10 Z" id="Shape"></Path>
                 </G>
             </G>
@@ -512,8 +527,8 @@ const ActivityIcon = ({ color, size }:IconProps) => {
     let height = width * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 28 22">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="activity-svgrepo-com" transform="translate(2.000000, 2.000000)" stroke={color ?? Colors.brand.midnight} stroke-width="3">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="activity-svgrepo-com" transform="translate(2.000000, 2.000000)" stroke={color ?? Colors.brand.midnight} strokeWidth="3">
                     <Path d="M0,9.80125802 L4.71504,9.80125802 C4.97052,9.80125802 5.19735429,9.63771516 5.27814857,9.39531516 L5.27814857,9.39531516 L8.35714286,0.158400878 L8.35714286,0.158400878 C8.42787429,-0.0537934081 8.7288,-0.0518048366 8.80525714,0.158400878 L8.80525714,0.158400878 L15.2142857,17.7833152 L15.2314286,17.830458 C15.3005143,18.0205723 15.5677714,18.0246866 15.6428571,17.8369723 L15.6428571,17.8369723 L18.6584571,10.298058 L18.6584571,10.298058 C18.7784571,9.99805802 19.0690286,9.80125802 19.3923429,9.80125802 L24,9.80125802" id="Path"></Path>
                 </G>
             </G>
@@ -527,7 +542,7 @@ const HeadToHeadIcon = ({ color, size }:IconProps) => {
     let height = width * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 24 20">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="battle-cross-fight-knife-sword-weapon-svgrepo-com-(1)" fill={color ?? Colors.brand.midnight} fill-rule="nonzero">
                     <Path d="M23.4881688,12.0224429 C22.964089,11.6777732 22.2570319,11.8230591 21.9120762,12.347294 L21.864234,12.4199884 L18.9345081,10.4915476 L19.2272192,10.046852 C19.4264409,9.744311 19.4957476,9.3811704 19.4221518,9.02439453 C19.3487025,8.66761255 19.141485,8.36152955 18.8389562,8.16244296 C18.5364151,7.96292747 18.1726974,7.89344902 17.8164978,7.96750334 C17.4597175,8.04096312 17.1536337,8.24816842 16.954405,8.55070945 L16.6332501,9.03861468 C16.2711835,8.79599324 15.9052725,8.5413232 15.5375028,8.27628879 C19.4797002,3.61782674 18.0103128,0.351133128 17.9245455,0.172002882 C17.880492,0.0799297029 17.7928521,0.0162275451 17.6914611,0.00278455811 C17.5911075,-0.0108183919 17.4891342,0.0276083747 17.4223242,0.105193331 C17.3905643,0.142037423 15.1927076,2.67611998 11.9991372,5.45822803 C8.81106856,2.68222144 6.59994541,0.131119492 6.57750455,0.105193331 C6.51069456,0.0276083804 6.40872036,-0.0111099979 6.30836241,0.00278455811 C6.20697665,0.0162275451 6.11933681,0.0799297029 6.07528239,0.172002882 C6.00865634,0.311238745 4.52000915,3.58060038 8.4716721,8.27111402 C8.10882877,8.53297086 7.74046022,8.78961805 7.3673275,9.03974623 L7.04541857,8.55071032 C6.84619511,8.24816928 6.54011212,8.04096399 6.18332404,7.96750421 C5.82699363,7.89405053 5.46371093,7.9633677 5.16087263,8.16230086 C4.53422364,8.57479706 4.35997177,9.42019214 4.77246841,10.0468529 L5.06524049,10.4916182 L2.135709,12.4199317 L2.08789555,12.3472949 C1.74279691,11.823501 1.03603791,11.6776206 0.511803145,12.0224438 C0.258629697,12.1891488 0.0854128226,12.4451274 0.0239327795,12.7433898 C-0.0375581643,13.0417882 0.0203790447,13.3455061 0.186946566,13.5985364 L2.81948969,17.5980468 C3.03793852,17.9296907 3.40150846,18.1100039 3.77189339,18.1100039 C3.8869841,18.1100039 4.00247015,18.0910885 4.11475684,18.0554038 C4.72162122,18.763106 5.58772672,19.1434029 6.4715307,19.1434029 C7.06064996,19.1434029 7.65611651,18.9760981 8.18419072,18.6284801 C9.28810642,17.9020559 9.80085247,16.5762074 9.50273911,15.3152754 C9.59863452,15.2797337 9.69213608,15.2364281 9.77950218,15.1789129 C10.0820371,14.9796894 10.2892537,14.6736073 10.3627022,14.3168183 C10.4363067,13.9600433 10.3669991,13.5969027 10.1679064,13.2943669 L9.99640843,13.0338186 C10.7250434,12.5463196 11.3929358,12.0657563 12.0020341,11.5936945 C12.6239638,12.0763081 13.2950904,12.5587509 14.0038423,13.0331718 L13.8319224,13.2943669 C13.6328297,13.5969027 13.5636659,13.9600433 13.6371257,14.3168183 C13.7107232,14.6736073 13.9177908,14.9796894 14.2203266,15.1789129 C14.3077258,15.2364055 14.4012047,15.2796936 14.4970897,15.3152405 C14.1989528,16.5761725 14.7117171,17.9020559 15.815638,18.6284801 C16.3438552,18.9763788 16.939184,19.1434029 17.5282972,19.1434029 C18.4119713,19.1434029 19.2782869,18.7628933 19.885095,18.0553742 C19.9973586,18.0910885 20.1128111,18.1100039 20.2279376,18.1100039 C20.5983225,18.1100039 20.9618903,17.9296907 21.1803325,17.5980468 L23.8130304,13.5985364 C24.1578257,13.0744435 24.0121057,12.3673881 23.4881688,12.0224429 Z M6.4780384,0.903739569 C7.2273489,1.7316467 9.09409872,3.72529129 11.5354852,5.85778949 C10.7283169,6.54573502 9.8635774,7.24154819 8.96030177,7.91316563 C6.09030805,4.52107884 6.24972865,1.92307792 6.4780384,0.903739569 Z M4.06275065,17.4174241 C3.81799863,17.5785359 3.48664504,17.5105491 3.32525382,17.2652025 L0.692705022,13.2656921 C0.531170832,13.0205059 0.599454536,12.6895926 0.844646793,12.5281966 C1.0904275,12.366804 1.42105404,12.4353855 1.5821493,12.680127 L1.79606104,13.0051089 C1.79619224,13.0053024 1.79616958,13.0055378 1.79630078,13.0057139 C1.79648385,13.0060173 1.79677502,13.0062056 1.79696942,13.006502 L4.21468589,16.6796304 C4.37622008,16.924977 4.30794771,17.2557474 4.06275065,17.4174241 Z M2.46859254,12.9256549 L5.39812925,10.9973466 L7.2693294,13.8400708 L4.33979269,15.7684889 L2.46859254,12.9256549 Z M7.85135253,18.1230062 C6.80911652,18.8087645 5.44209214,18.6216986 4.6210924,17.7204917 C4.95038777,17.344993 5.00790218,16.7834746 4.72044435,16.3468044 L4.67261345,16.2741223 L7.60222427,14.3457948 L7.89495015,14.7905078 C8.0941858,15.0930436 8.40027403,15.3002489 8.75704468,15.3737086 C8.80418949,15.3834497 8.85134651,15.3834898 8.89854973,15.3882426 C9.17289629,16.4232875 8.75994765,17.5250604 7.85135253,18.1230062 Z M9.76989801,14.1945966 C9.72895228,14.3929413 9.614117,14.5628963 9.44665876,14.673303 C9.27891459,14.7835563 9.07702878,14.821389 8.87927773,14.7809044 C8.68093475,14.7399579 8.51096759,14.6251121 8.40071428,14.4576643 L5.73745248,10.4116542 L5.73742284,10.4116089 L5.73738884,10.4115688 L5.2782273,9.71401384 C5.04928901,9.3660994 5.14594373,8.89684811 5.49371083,8.66806412 C5.61741889,8.58647953 5.75974427,8.5443456 5.90562382,8.5443456 C5.95720851,8.5443456 6.00938077,8.54967554 6.06110842,8.56031887 C6.25944616,8.60125413 6.4294081,8.71608854 6.53967187,8.88354765 L7.02937119,9.62745324 C7.02943309,9.62752821 7.02941042,9.62762584 7.02946795,9.62769384 C7.02951329,9.62777928 7.02958739,9.62781414 7.02964492,9.62788214 L9.32531055,13.115282 C9.32540208,13.1153953 9.32538029,13.1155557 9.32547618,13.1156813 C9.32560869,13.115887 9.32578478,13.1159951 9.32591642,13.1161956 L9.66230182,13.6272043 C9.77255513,13.794652 9.8106903,13.9962519 9.76989801,14.1945966 Z M9.66273073,12.526882 L7.70045077,9.54582419 C8.17847198,9.2254295 8.64907713,8.89431652 9.10992989,8.5558511 C9.11112943,8.55482329 9.11264368,8.55455479 9.11383189,8.55351477 C9.11421459,8.55318351 9.114341,8.5526805 9.11473591,8.5523379 C13.1589859,5.58119205 16.457341,2.07784768 17.5201741,0.905070744 C17.8369284,2.34975418 17.9965373,6.94683992 9.66273073,12.526882 Z M12.491362,11.2065168 C13.5500229,10.3505351 14.4214069,9.52382793 15.1369079,8.73408517 C15.5272248,9.01614419 15.9159324,9.2866916 16.3003614,9.54432737 L14.3367206,12.527487 C13.6856758,12.0916991 13.067798,11.649305 12.491362,11.2065168 Z M14.5531648,14.6731479 C14.2053986,14.4443647 14.108743,13.9751134 14.3376691,13.6272042 L16.9701961,9.62788214 C16.9702519,9.62781414 16.9703146,9.62777928 16.9703617,9.62769384 L16.9704175,9.62755088 L17.4601569,8.88354765 C17.5704207,8.71608854 17.7403756,8.60125413 17.9387204,8.56031887 C17.9906023,8.54967554 18.0426203,8.5443456 18.0943593,8.5443456 C18.2400845,8.5443456 18.3824116,8.5866225 18.506118,8.66806412 C18.6735657,8.77831656 18.788401,8.94827239 18.8293459,9.14661624 C18.8701321,9.34496008 18.8320082,9.54656082 18.7216032,9.71401384 L18.2624399,10.4115688 L18.2623894,10.4116089 L18.2623789,10.4116542 L15.5991136,14.4576643 C15.4888621,14.6251121 15.3188966,14.7399579 15.1205502,14.7809044 C14.9217661,14.8215424 14.7204748,14.7832582 14.5531648,14.6731479 Z M16.1484762,18.1230062 C15.2398838,17.5247867 14.827065,16.4232648 15.1013035,15.3882426 C15.1485058,15.3834898 15.1956506,15.3834497 15.2427832,15.3737086 C15.5995547,15.3002489 15.9056386,15.0930436 16.1048778,14.7905078 L16.3976045,14.3457721 L19.3272659,16.2740647 L19.2793801,16.3468045 C18.9919257,16.7834624 19.0494288,17.3449756 19.3787991,17.7204795 C18.5579145,18.6216986 17.1910095,18.8087645 16.1484762,18.1230062 Z M16.7304758,13.8400481 L18.6016315,10.9972838 L21.531333,12.9257072 L19.6600936,15.7684314 L16.7304758,13.8400481 Z M23.3072663,13.2656921 L20.6745754,17.2652025 C20.5133258,17.5102527 20.1824247,17.5785359 19.9372211,17.4174241 C19.6918745,17.2557474 19.6236087,16.924977 19.7851425,16.6796304 L19.9991178,16.3545753 C19.9992102,16.3544324 19.9993532,16.3543347 19.9994491,16.3541813 C19.9995014,16.3540941 19.9995258,16.3539808 19.9995694,16.3538953 L22.2034308,13.0058168 C22.2034308,13.0058168 22.2034988,13.005754 22.2035215,13.0057139 C22.2035511,13.0057087 22.2035511,13.0056564 22.2035511,13.0056564 L22.4178351,12.680127 C22.5199636,12.5247967 22.690072,12.4405445 22.8632908,12.4405445 C22.9637961,12.4405445 23.0653266,12.4689221 23.1553306,12.5281966 C23.400522,12.6895926 23.4686641,13.0205059 23.3072663,13.2656921 Z" id="Shape"></Path>
                 </G>
@@ -541,7 +556,7 @@ const HeadToHeadIcon = ({ color, size }:IconProps) => {
     return (
         <Svg width={`${icon_size}px`} height={`${icon_size}px`}  viewBox="0 0 50 50">
-    <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
         <G id="change-svgrepo-com" fill={color??Colors.brand.midnight} fill-rule="nonzero">
             <Path d="M16.2740785,40.028426 C15.755866,39.5000562 14.9179053,39.5000562 14.3996928,40.028426 C13.8814803,40.5567957 13.8814803,41.4111809 14.3996928,41.9395506 L15.8992014,43.4684504 L9.81296064,43.4684504 C5.85469899,43.4684504 2.64619163,40.1858127 2.64619163,36.161209 L2.64619163,31.6307193 C2.64619163,30.8887533 2.05079851,30.2816901 1.32309582,30.2816901 C0.595393117,30.2816901 0,30.8887533 0,31.6307193 L0,36.161209 C0,41.6809867 4.39929359,46.1665087 9.81296064,46.1665087 L15.8992014,46.1665087 L14.3996928,47.6954085 C13.8814803,48.2237782 13.8814803,49.0781634 14.3996928,49.6065332 C14.6532862,49.8650971 14.9950859,50 15.3368857,50 C15.6786854,50 16.0094594,49.8650971 16.2740785,49.6065332 L20.0338758,45.7730419 C20.5520883,45.2446721 20.5520883,44.390287 20.0338758,43.8619172 L16.2740785,40.028426 Z" id="Path"></Path>
             <Path d="M23.3101458,0 L1.33774151,0 C0.60198368,0 0,0.60198368 0,1.33774151 L0,23.3101458 C0,24.0459036 0.60198368,24.6478873 1.33774151,24.6478873 L23.3101458,24.6478873 C24.0459036,24.6478873 24.6478873,24.0459036 24.6478873,23.3101458 L24.6478873,1.33774151 C24.6478873,0.60198368 24.0570515,0 23.3101458,0 Z M21.9724043,21.9724043 L2.67548302,21.9724043 L2.67548302,2.67548302 L21.9724043,2.67548302 L21.9724043,21.9724043 Z" id="Shape"></Path>
@@ -574,8 +589,8 @@ const HeadToHeadIcon = ({ color, size }:IconProps) => {
     const width = height * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`}  viewBox="0 0 20 22">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="lock" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="lock" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                     <Rect id="Rectangle" x="0" y="9" width="18" height="11" rx="2"></Rect>
                     <Path d="M4,9 L4,5 C4,2.23857625 6.23857625,8.8817842e-16 9,8.8817842e-16 C11.7614237,8.8817842e-16 14,2.23857625 14,5 L14,9" id="Path"></Path>
                 </G>
@@ -587,8 +602,8 @@ const HeadToHeadIcon = ({ color, size }:IconProps) => {
  const PausedIcon = ({ color, size }:IconProps) => {
     return (
         <Svg width={`${size??14}px`} height={`${size??14}px`} viewBox="0 0 22 22">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="pause-circle" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="pause-circle" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                     <Circle id="Oval" cx="10" cy="10" r="10"></Circle>
                     <Line x1="8" y1="13" x2="8" y2="7" id="Path"></Line>
                     <Line x1="12" y1="13" x2="12" y2="7" id="Path"></Line>
@@ -601,8 +616,8 @@ const HeadToHeadIcon = ({ color, size }:IconProps) => {
  const PlusCircleIcon = ({ color, size }:IconProps) => {
     return (
         <Svg  width={`${size??14}px`} height={`${size??14}px`} viewBox="0 0 22 22">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="plus-circle" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="plus-circle" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                     <Circle id="Oval" cx="10" cy="10" r="10"></Circle>
                     <Line x1="10" y1="6" x2="10" y2="14" id="Path"></Line>
                     <Line x1="6" y1="10" x2="14" y2="10" id="Path"></Line>
@@ -615,8 +630,8 @@ const HeadToHeadIcon = ({ color, size }:IconProps) => {
  const TVIcon = ({ color, size }:IconProps) => {
     return (
         <Svg width={`${size??14}px`} height={`${size??14}px`}  viewBox="0 0 22 22">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="tv-(1)" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="tv-(1)" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                     <Rect id="Rectangle" x="0" y="5" width="20" height="15" rx="2"></Rect>
                     <Polyline id="Path" points="15 0 10 5 5 0"></Polyline>
                 </G>
@@ -628,7 +643,7 @@ const HeadToHeadIcon = ({ color, size }:IconProps) => {
 const PreferencesIcon = ({ color, size }:IconProps) => {
     return (
         <Svg width={`${size??14}px`} height={`${size??14}px`} viewBox="0 0 20 20">
-    <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+    <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
         <G id="preferences-svgrepo-com" fill={color ?? Colors.brand.midnight} fill-rule="nonzero">
             <Path d="M18.75,17.5 C18.75,18.19 18.19,18.75 17.5,18.75 L2.5,18.75 C1.81,18.75 1.25,18.19 1.25,17.5 L1.25,2.5 C1.25,1.81 1.81,1.25 2.5,1.25 L17.5,1.25 C18.19,1.25 18.75,1.81 18.75,2.5 L18.75,17.5 L18.75,17.5 Z M17.5,0 L2.5,0 C1.119375,0 0,1.119375 0,2.5 L0,17.5 C0,18.880625 1.119375,20 2.5,20 L17.5,20 C18.880625,20 20,18.880625 20,17.5 L20,2.5 C20,1.119375 18.880625,0 17.5,0 L17.5,0 Z M12.5,12.125 C11.67125,12.125 11,11.453125 11,10.625 C11,9.796875 11.67125,9.125 12.5,9.125 C13.32875,9.125 14,9.796875 14,10.625 C14,11.453125 13.32875,12.125 12.5,12.125 L12.5,12.125 Z M16.25,10 L14.91125,10 C14.633125,8.923125 13.66375,8.125 12.5,8.125 C11.33625,8.125 10.3675,8.923125 10.08875,10 L3.75,10 C3.405,10 3.125,10.28 3.125,10.625 C3.125,10.970625 3.405,11.25 3.75,11.25 L10.08875,11.25 C10.366875,12.326875 11.33625,13.125 12.5,13.125 C13.66375,13.125 14.633125,12.326875 14.91125,11.25 L16.25,11.25 C16.595,11.25 16.875,10.970625 16.875,10.625 C16.875,10.28 16.595,10 16.25,10 L16.25,10 Z M6.875,7.125 C6.04625,7.125 5.375,6.453125 5.375,5.625 C5.375,4.796875 6.04625,4.125625 6.875,4.125625 C7.70375,4.125625 8.375,4.796875 8.375,5.625 C8.375,6.453125 7.70375,7.125 6.875,7.125 L6.875,7.125 Z M16.25,5 L9.28625,5 C9.008125,3.923125 8.03875,3.125 6.875,3.125 C5.71125,3.125 4.741875,3.923125 4.46375,5 L3.75,5 C3.405,5 3.125,5.28 3.125,5.625 C3.125,5.970625 3.405,6.25 3.75,6.25 L4.46375,6.25 C4.741875,7.326875 5.71125,8.125 6.875,8.125 C8.03875,8.125 9.008125,7.326875 9.28625,6.25 L16.25,6.25 C16.595,6.25 16.875,5.970625 16.875,5.625 C16.875,5.28 16.595,5 16.25,5 L16.25,5 Z M6.875,17.125 C6.04625,17.125 5.375,16.453125 5.375,15.625 C5.375,14.796875 6.04625,14.125625 6.875,14.125625 C7.70375,14.125625 8.375,14.796875 8.375,15.625 C8.375,16.453125 7.70375,17.125 6.875,17.125 L6.875,17.125 Z M16.25,15 L9.28625,15 C9.008125,13.92375 8.03875,13.125 6.875,13.125 C5.71125,13.125 4.741875,13.92375 4.46375,15 L3.75,15 C3.405,15 3.125,15.279375 3.125,15.625 C3.125,15.970625 3.405,16.25 3.75,16.25 L4.46375,16.25 C4.741875,17.326875 5.71125,18.125 6.875,18.125 C8.03875,18.125 9.008125,17.326875 9.28625,16.25 L16.25,16.25 C16.595,16.25 16.875,15.970625 16.875,15.625 C16.875,15.279375 16.595,15 16.25,15 L16.25,15 Z" id="preferences"></Path>
         </G>
@@ -644,8 +659,8 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
     const width = height * ratio;
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 16 24">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="award" transform="translate(1.000000, 1.000000)" stroke={color ?? Colors.brand.midnight} stroke-width="2">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="award" transform="translate(1.000000, 1.000000)" stroke={color ?? Colors.brand.midnight} strokeWidth="2">
                     <Circle id="Oval" cx="7" cy="7" r="7"></Circle>
                     <Polyline id="Path" points="3.21 12.89 2 22 7 19 12 22 10.79 12.88"></Polyline>
                 </G>
@@ -658,8 +673,8 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
     return (
     <Svg width={`${size??40}px`} height={`${size??40}px`} viewBox="0 0 42 42">
-        <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-            <G id="car-salesman-service-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color??Colors.brand.midnight} stroke-width="2">
+        <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+            <G id="car-salesman-service-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color??Colors.brand.midnight} strokeWidth="2">
                 <Path d="M15.1724138,35.862069 L15.1724138,38.6206897 C15.1724138,39.3834483 14.5558621,40 13.7931034,40 L11.0344828,40" id="XMLID_336_"></Path>
                 <Path d="M38.6206897,35.862069 L38.6206897,38.6206897 C38.6206897,39.3834483 38.0041379,40 37.2413793,40 L35.862069,40 C35.0993103,40 34.4827586,39.3834483 34.4827586,38.6206897 L34.4827586,35.862069" id="XMLID_6229_"></Path>
                 <Line x1="40" y1="35.862069" x2="13.7931034" y2="35.862069" id="XMLID_5901_"></Line>
@@ -687,8 +702,8 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
     let width = height * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 22 25">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="share-social-outline" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="share-social-outline" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                     <Circle id="Oval" cx="2.5" cy="12.5" r="2.5"></Circle>
                     <Circle id="Oval" cx="17.5" cy="2.5" r="2.5"></Circle>
                     <Circle id="Oval" cx="17.5" cy="20.5" r="2.5"></Circle>
@@ -723,7 +738,7 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
         case 'up':
             return (
                 <Svg width={`${up_down_width}`} height={`${up_down_height}`}  viewBox="0 0 9 6">
-                    <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+                    <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                         <G id="Group" transform="translate(-0.000000, 0.000000)" fill={color} fill-rule="nonzero">
                             <Path d="M4.4298072,1.609187 L1.1298072,4.909187 C1.0040772,5.030627 0.835667203,5.097827 0.660877203,5.09633223 C0.486077203,5.094787 0.318868203,5.024677 0.195262203,4.901067 C0.0716572032,4.777467 0.00154420324,4.610257 -3.33066907e-16,4.435457 C-0.00149379676,4.260657 0.0657032032,4.092257 0.187141203,3.966527 L3.9584772,0.195191 C4.0834972,0.07021 4.2530372,-1.11022302e-16 4.4298072,-1.11022302e-16 C4.6065872,-1.11022302e-16 4.7761272,0.07021 4.9011372,0.195191 L8.6724772,3.966527 C8.7939172,4.092257 8.8611072,4.260657 8.85961244,4.435457 C8.8580772,4.610257 8.7879572,4.777467 8.6643572,4.901067 C8.5407472,5.024677 8.3735372,5.094787 8.1987472,5.09633223 C8.0239472,5.097827 7.8555472,5.030627 7.7298072,4.909187 L4.4298072,1.609187 L4.4298072,1.609187 Z" id="Path"></Path>
                         </G>
@@ -733,7 +748,7 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
         case 'down':
             return (
                 <Svg width={`${up_down_width}`}  height={`${up_down_height}`}  viewBox="0 0 9 6">
-                    <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+                    <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                         <G id="Group" transform="translate(0.000000, 0.000000)" fill={color} fill-rule="nonzero">
                             <Path d="M4.44619516,3.50352216 L7.74619516,0.203525159 C7.80769516,0.139852159 7.88125516,0.0890631588 7.96259516,0.0541241588 C8.04392516,0.0191851588 8.13140516,0.000794158788 8.21992516,-5.55111512e-17 C8.30844516,-0.000743841212 8.39623516,0.0161231588 8.47816516,0.0496441588 C8.56009516,0.0831651588 8.63452516,0.132667159 8.69712516,0.195262159 C8.75971516,0.257857159 8.80922516,0.332291159 8.84274516,0.414222159 C8.87626516,0.496153159 8.89312516,0.583940159 8.89238975,0.672462159 C8.89159516,0.760982159 8.87320516,0.848462159 8.83826516,0.929792159 C8.80332516,1.01113216 8.75253516,1.08469216 8.68886516,1.14619216 L4.91752516,4.91752216 C4.79250516,5.04250216 4.62296516,5.11271216 4.44619516,5.11271216 C4.26941516,5.11271216 4.09987516,5.04250216 3.97485516,4.91752216 L0.203526157,1.14619216 C0.139852157,1.08469216 0.0890641574,1.01113216 0.0541251574,0.929792159 C0.0191851574,0.848462159 0.000795157381,0.760982159 0,0.672462159 C-0.000743842619,0.583940159 0.0161241574,0.496153159 0.0496451574,0.414222159 C0.0831651574,0.332291159 0.132667157,0.257857159 0.195262157,0.195262159 C0.257858157,0.132667159 0.332292157,0.0831651588 0.414225157,0.0496441588 C0.496155157,0.0161231588 0.583945157,-0.000743841212 0.672455157,-5.55111512e-17 C0.760975157,0.000794158788 0.848455157,0.0191851588 0.929795157,0.0541241588 C1.01113516,0.0890631588 1.08469516,0.139852159 1.14619516,0.203525159 L4.44619516,3.50352216 Z" id="Path"></Path>
                         </G>
@@ -743,7 +758,7 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
         case 'right':
             return (
                 <Svg width={`${right_left_width}`}  height={`${right_left_height}`} viewBox="0 0 5 9">
-                    <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+                    <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                         <G id="Group" fill={color} fill-rule="nonzero">
                             <Path d="M3.42628961,4.5083094 L0.199038607,1.1622094 C0.136769607,1.0998494 0.087100807,1.0252594 0.052931607,0.942785403 C0.018762407,0.860313403 0.000777086037,0.771610403 1.12960314e-16,0.681854403 C-0.000727827963,0.592098403 0.015768307,0.503086403 0.048549907,0.420010403 C0.081331507,0.336934403 0.129742607,0.261460403 0.190957607,0.197990403 C0.252172607,0.134520403 0.324966607,0.0843266034 0.405090607,0.0503376034 C0.485215607,0.0163486034 0.571066607,-0.00075456557 0.657634607,3.46944695e-16 C0.744202607,0.00080563043 0.829753607,0.0194538034 0.909296607,0.0548809034 C0.988838607,0.0903079034 1.06077961,0.141806403 1.12091961,0.206369403 L4.80910961,4.0303894 C4.93133961,4.1571494 5,4.3290594 5,4.5083094 C5,4.6875494 4.93133961,4.8594594 4.80910961,4.9862194 L1.12091961,8.8102394 C0.997960607,8.9333794 0.833271607,9.0015094 0.662327607,9 C0.491383607,8.9984294 0.327861607,8.9273394 0.206981607,8.8020094 C0.086101107,8.6766794 0.017533807,8.5071294 0.016048407,8.3298894 C0.014563107,8.1526494 0.080277907,7.9818994 0.199039607,7.8544094 L3.42628961,4.5083094 Z" id="Path"></Path>
                         </G>
@@ -753,7 +768,7 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
         case 'left':
             return (
                 <Svg width={`${right_left_width}`} height={`${right_left_height}`} viewBox="0 0 5 9">
-                    <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+                    <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                         <G id="Group" transform="translate(0.000000, 0.000000)" fill={color} fill-rule="nonzero">
                             <Path d="M1.57371568,4.49170068 L4.80094025,7.83779879 C4.86321636,7.90017832 4.91289642,7.97472551 4.94708569,8.05722224 C4.98119672,8.13971897 4.99919107,8.22838064 5,8.31817797 C5.0007558,8.40789417 4.98424794,8.49696144 4.95146692,8.58002599 C4.9186859,8.66309054 4.87025763,8.73853003 4.80907683,8.80204521 C4.74781779,8.86547927 4.67505802,8.91569114 4.59494403,8.94967947 C4.5147518,8.9836678 4.42892657,9.00078364 4.3423972,9 C4.2557896,8.9992424 4.1702773,8.98058532 4.09071097,8.94513688 C4.01114464,8.90968843 3.93924546,8.85817867 3.87908174,8.79360896 L0.190888788,4.96963821 C0.0686601911,4.84285121 -6.94878077e-16,4.67096275 -6.94878077e-16,4.49170068 C-6.94878077e-16,4.31245484 0.0686601911,4.14054204 0.190888788,4.01377937 L3.87908174,0.189751841 C4.00206922,0.0666151323 4.16675667,-0.00151564628 4.33770302,0 C4.50864937,0.00156682733 4.67216327,0.0726584029 4.79303838,0.19798529 C4.91391349,0.32332029 4.9824485,0.49286445 4.98393499,0.670106683 C4.98542148,0.847348915 4.91970298,1.01810173 4.80094025,1.14559446 L1.57371568,4.49170068 Z" id="Path"></Path>
                         </G>
@@ -763,7 +778,7 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
         default:
             return (
                 <Svg width={`${up_down_width}`} height={`${up_down_height}`} viewBox="0 0 9 6">
-                    <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+                    <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                         <G id="Group" transform="translate(-0.000000, 0.000000)" fill={color} fill-rule="nonzero">
                             <Path d="M4.4298072,1.609187 L1.1298072,4.909187 C1.0040772,5.030627 0.835667203,5.097827 0.660877203,5.09633223 C0.486077203,5.094787 0.318868203,5.024677 0.195262203,4.901067 C0.0716572032,4.777467 0.00154420324,4.610257 -3.33066907e-16,4.435457 C-0.00149379676,4.260657 0.0657032032,4.092257 0.187141203,3.966527 L3.9584772,0.195191 C4.0834972,0.07021 4.2530372,-1.11022302e-16 4.4298072,-1.11022302e-16 C4.6065872,-1.11022302e-16 4.7761272,0.07021 4.9011372,0.195191 L8.6724772,3.966527 C8.7939172,4.092257 8.8611072,4.260657 8.85961244,4.435457 C8.8580772,4.610257 8.7879572,4.777467 8.6643572,4.901067 C8.5407472,5.024677 8.3735372,5.094787 8.1987472,5.09633223 C8.0239472,5.097827 7.8555472,5.030627 7.7298072,4.909187 L4.4298072,1.609187 L4.4298072,1.609187 Z" id="Path"></Path>
                         </G>
@@ -793,8 +808,8 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
     let height = width * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 24 18">
-            <G id="Images" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="credit-card" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+            <G id="Images" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="credit-card" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                     <Rect id="Rectangle" x="0" y="0" width="22" height="16" rx="2"></Rect>
                     <Line x1="0" y1="6" x2="22" y2="6" id="Path"></Line>
                 </G>
@@ -806,8 +821,8 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
  const BankIcon = ({ size, color }:IconProps) => {
     return (
         <Svg width={`${size??33}px`} height={`${size??33}px`} viewBox="0 0 33 33">
-            <G id="Images" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="bank-svgrepo-com" transform="translate(2.000000, 2.000000)" stroke={color} stroke-width="2.666667">
+            <G id="Images" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="bank-svgrepo-com" transform="translate(2.000000, 2.000000)" stroke={color} strokeWidth="2.666667">
                     <Path d="M0,29.2622951 L29,29.2622951 M1.5,24.3442623 L27.5,24.3442623 M4.75,23.5901639 L4.75,15.7213115 M11.25,23.5901639 L11.25,15.7213115 M17.75,23.5901639 L17.75,15.7213115 M24.25,23.5901639 L24.25,15.7213115 M29,11.8032787 L17.9252222,1.9561866 C16.7131833,0.878592829 16.1072444,0.339812056 15.4234889,0.135190751 C14.8209333,-0.0450635838 14.1790667,-0.0450635838 13.5765111,0.135190751 C12.8927556,0.339812056 12.2868167,0.878592829 11.0748422,1.9561866 L0,11.8032787 L29,11.8032787 Z" id="Shape"></Path>
                 </G>
             </G>
@@ -820,10 +835,10 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
     let height = width * .92857
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 42 39">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="bank_icon" transform="translate(4.000000, 1.370506)" stroke={color}>
-                    <Path d="M0,35.8917894 L29,35.8917894 M1.5,30.9737566 L27.5,30.9737566 M4.75,30.2196582 L4.75,22.3508058 M11.25,30.2196582 L11.25,22.3508058 M17.75,30.2196582 L17.75,22.3508058 M24.25,30.2196582 L24.25,22.3508058 M29,18.432773 L17.9252222,8.58568093 C16.7131833,7.50808716 16.1072444,6.96930639 15.4234889,6.76468508 C14.8209333,6.58443075 14.1790667,6.58443075 13.5765111,6.76468508 C12.8927556,6.96930639 12.2868167,7.50808716 11.0748422,8.58568093 L0,18.432773 L29,18.432773 Z" id="Shape" stroke-width="2.666667"></Path>
-                    <G id="zap" transform="translate(30.500000, 10.629494) rotate(10.000000) translate(-30.500000, -10.629494) translate(26.000000, 0.629494)" stroke-linecap="round" stroke-linejoin="round" stroke-width="2">
+                    <Path d="M0,35.8917894 L29,35.8917894 M1.5,30.9737566 L27.5,30.9737566 M4.75,30.2196582 L4.75,22.3508058 M11.25,30.2196582 L11.25,22.3508058 M17.75,30.2196582 L17.75,22.3508058 M24.25,30.2196582 L24.25,22.3508058 M29,18.432773 L17.9252222,8.58568093 C16.7131833,7.50808716 16.1072444,6.96930639 15.4234889,6.76468508 C14.8209333,6.58443075 14.1790667,6.58443075 13.5765111,6.76468508 C12.8927556,6.96930639 12.2868167,7.50808716 11.0748422,8.58568093 L0,18.432773 L29,18.432773 Z" id="Shape" strokeWidth="2.666667"></Path>
+                    <G id="zap" transform="translate(30.500000, 10.629494) rotate(10.000000) translate(-30.500000, -10.629494) translate(26.000000, 0.629494)" stroke-linecap="round" stroke-linejoin="round" strokeWidth="2">
                         <Polygon id="Path" points="0 12 4.5 12 4 20 9 8 4.5 8 5 1.13686838e-13"></Polygon>
                     </G>
                 </G>
@@ -836,8 +851,8 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
     let width = size ?? 20
     return (
         <Svg width={`${width}px`} height={`${width}px`} viewBox="0 0 23 24">
-            <G id="Images" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                <G id="dollar-sign-(1)" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+            <G id="Images" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
+                <G id="dollar-sign-(1)" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                     <Line x1="11.5" y1="6" x2="11.5" y2="19" id="Path" stroke-linecap="round" stroke-linejoin="round"></Line>
                     <Path d="M14.4166667,9 L10.0416667,9 C8.91408531,9 8,9.8954305 8,11 C8,12.1045695 8.91408531,13 10.0416667,13 L12.9583334,13 C14.0859147,13 15,13.8954305 15,15 C15,16.1045695 14.0859147,17 12.9583334,17 L8,17" id="Path" stroke-linecap="round" stroke-linejoin="round"></Path>
                     <Circle id="Oval" cx="11.5" cy="12.5" r="9.5"></Circle>
@@ -853,8 +868,8 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
     let width = size ?? 20
     return (
         <Svg width={`${width}px`} height={`${width - 1}px`}  viewBox="0 0 24 22">
-            <G id="Images" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                <G id="dollar-sign-(1)" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+            <G id="Images" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
+                <G id="dollar-sign-(1)" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                     <Line x1="12.5" y1="4" x2="12.5" y2="17" id="Path" stroke-linecap="round" stroke-linejoin="round"></Line>
                     <Path d="M15.4166667,7 L11.0416667,7 C9.91408531,7 9,7.8954305 9,9 C9,10.1045695 9.91408531,11 11.0416667,11 L13.9583334,11 C15.0859147,11 16,11.8954305 16,13 C16,14.1045695 15.0859147,15 13.9583334,15 L9,15" id="Path" stroke-linecap="round" stroke-linejoin="round"></Path>
                     <Circle id="Oval" cx="12.5" cy="10.5" r="9.5"></Circle>
@@ -871,8 +886,8 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
     let width = height * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 31 34">
-            <G id="Images" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="sleep-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+            <G id="Images" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="sleep-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                     <Path d="M0,0 L13.518797,0 L0,16 L13.518797,16 M18.9699248,10.8108108 L29,10.8108108 L18.9699248,22.7027027 L29,22.7027027 M5.23308271,22.7027027 L13.0827068,22.7027027 L5.23308271,32 L13.0827068,32" id="Shape"></Path>
                 </G>
             </G>
@@ -888,7 +903,7 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
     if(['up','down'].includes(direction ?? 'up')){
         return (
             <Svg width={`${width}px`} height={`${height}px`}  viewBox="0 0 6 24">
-                <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+                <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                     <G id="Group" transform="translate(0.000000, 0.000000)" fill={color} fill-rule="nonzero">
                         <Path d="M-6,15 C-6.79565,15 -7.55871,14.6839259 -8.12132,14.1213159 C-8.68393,13.5587159 -9,12.7956459 -9,12 C-9,11.2043459 -8.68393,10.4412859 -8.12132,9.87867986 C-7.55871,9.31607086 -6.79565,9 -6,9 C-5.20435,9 -4.44129,9.31607086 -3.87868,9.87867986 C-3.31607,10.4412859 -3,11.2043459 -3,12 C-3,12.7956459 -3.31607,13.5587159 -3.87868,14.1213159 C-4.44129,14.6839259 -5.20435,15 -6,15 Z M12,15 C11.2044,15 10.4413,14.6839259 9.8787,14.1213159 C9.3161,13.5587159 9,12.7956459 9,12 C9,11.2043459 9.3161,10.4412859 9.8787,9.87867986 C10.4413,9.31607086 11.2044,9 12,9 C12.7956,9 13.5587,9.31607086 14.1213,9.87867986 C14.6839,10.4412859 15,11.2043459 15,12 C15,12.7956459 14.6839,13.5587159 14.1213,14.1213159 C13.5587,14.6839259 12.7956,15 12,15 Z M3,15 C2.2044,15 1.4413,14.6839259 0.87868,14.1213159 C0.31607,13.5587159 0,12.7956459 0,12 C0,11.2043459 0.31607,10.4412859 0.87868,9.87867986 C1.4413,9.31607086 2.2044,9 3,9 C3.7956,9 4.5587,9.31607086 5.1213,9.87867986 C5.6839,10.4412859 6,11.2043459 6,12 C6,12.7956459 5.6839,13.5587159 5.1213,14.1213159 C4.5587,14.6839259 3.7956,15 3,15 Z" id="Shape" transform="translate(3.000000, 12.000000) rotate(90.000000) translate(-3.000000, -12.000000) "></Path>
                     </G>
@@ -898,7 +913,7 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
     }
     return (
         <Svg width={`${height}px`} height={`${width}px`} viewBox="0 0 24 6">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="Group" fill={color} fill-rule="nonzero">
                     <Path d="M3,6 C2.20435,6 1.44129,5.68392586 0.87868,5.12131586 C0.31607,4.55871586 0,3.79564586 0,3 C0,2.20434586 0.31607,1.44128586 0.87868,0.878679859 C1.44129,0.316070859 2.20435,0 3,0 C3.79565,0 4.55871,0.316070859 5.12132,0.878679859 C5.68393,1.44128586 6,2.20434586 6,3 C6,3.79564586 5.68393,4.55871586 5.12132,5.12131586 C4.55871,5.68392586 3.79565,6 3,6 Z M21,6 C20.2044,6 19.4413,5.68392586 18.8787,5.12131586 C18.3161,4.55871586 18,3.79564586 18,3 C18,2.20434586 18.3161,1.44128586 18.8787,0.878679859 C19.4413,0.316070859 20.2044,0 21,0 C21.7956,0 22.5587,0.316070859 23.1213,0.878679859 C23.6839,1.44128586 24,2.20434586 24,3 C24,3.79564586 23.6839,4.55871586 23.1213,5.12131586 C22.5587,5.68392586 21.7956,6 21,6 Z M12,6 C11.2044,6 10.4413,5.68392586 9.87868,5.12131586 C9.31607,4.55871586 9,3.79564586 9,3 C9,2.20434586 9.31607,1.44128586 9.87868,0.878679859 C10.4413,0.316070859 11.2044,0 12,0 C12.7956,0 13.5587,0.316070859 14.1213,0.878679859 C14.6839,1.44128586 15,2.20434586 15,3 C15,3.79564586 14.6839,4.55871586 14.1213,5.12131586 C13.5587,5.68392586 12.7956,6 12,6 Z" id="Shape"></Path>
                 </G>
@@ -908,11 +923,14 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
 }
- const MenuIcon = ({ color }: IconProps) => {
+ const MenuIcon = ({ color, size }: IconProps) => {
+    const ratio = 0.75
+    const width = size??20
+    const height=width*ratio
     return (
-        <Svg width="20px" height="15px" viewBox="0 0 20 15">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="menu" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+        <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 20 15">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="menu" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                     <Line x1="0" y1="6.5" x2="18" y2="6.5" id="Path"></Line>
                     <Line x1="0" y1="0.5" x2="18" y2="0.5" id="Path"></Line>
                     <Line x1="0" y1="12.5" x2="18" y2="12.5" id="Path"></Line>
@@ -926,8 +944,8 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
  const ImageIcon = ({ color, size }:IconProps) => {
     return (
         <Svg width={`${size??20}px`} height={`${size??20}px`} viewBox="0 0 20 20">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="image" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="image" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                     <Rect id="Rectangle" x="0" y="0" width="18" height="18" rx="2"></Rect>
                     <Circle id="Oval" cx="5.5" cy="5.5" r="1.5"></Circle>
                     <Polyline id="Path" points="18 12 13 7 2 18"></Polyline>
@@ -941,7 +959,7 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
  const CheckIcon = ({ color, size }: IconProps) => {
     return (
         <Svg width={`${size??14}px`} height={`${size??14}px`} viewBox="0 0 14 10">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="Group" fill={color} fill-rule="nonzero">
                     <Path d="M5.25478903,9.07120602 C5.12351903,9.07146406 4.99349903,9.04581406 4.87216903,8.99570406 C4.75083903,8.94559406 4.64060903,8.87202406 4.54778903,8.77920406 L0.305787033,4.53620406 C0.210214033,4.44402406 0.133956033,4.33373406 0.0814620331,4.21176406 C0.0289690331,4.08979406 0.0012910331,3.95860406 1.94289029e-16,3.82582406 C-0.0012019669,3.69304406 0.0240070331,3.56134406 0.0742000331,3.43841406 C0.124394033,3.31548406 0.198568033,3.20378406 0.292393033,3.10982406 C0.386219033,3.01586406 0.497817033,2.94153406 0.620677033,2.89116406 C0.743536033,2.84080406 0.875199033,2.81540406 1.00797903,2.81646406 C1.14075903,2.81752406 1.27198903,2.84501406 1.39402903,2.89733406 C1.51606903,2.94965406 1.62646903,3.02576406 1.71878903,3.12120406 L5.25378903,6.65620406 L11.618799,0.293202063 C11.806299,0.105562063 12.060699,9.30628876e-05 12.325899,3.33066907e-16 C12.591199,-9.39371124e-05 12.845599,0.105194063 13.033299,0.292702063 C13.220899,0.480214063 13.3264991,0.734574063 13.3264991,0.999844063 C13.3264991,1.26511406 13.221299,1.51956406 13.033799,1.70720406 L5.96178903,8.77920406 C5.86896903,8.87202406 5.75872903,8.94559406 5.63740903,8.99570406 C5.51607903,9.04581406 5.38604903,9.07146406 5.25478903,9.07120602 Z" id="Path"></Path>
                 </G>
@@ -962,7 +980,7 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
     }
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 45 58">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="Group" fill={color} fill-rule="nonzero">
                     <Path d="M21.6596,34.4057 L31.3356,44.3798 L44.1069,43.1291 L44.1069,53.5633 L21.6596,57.2682 L21.6596,57.3389 L15.78,56.3557 C15.78,56.3557 21.6596,56.1748 21.6596,50.8967 L21.6596,34.4057 Z M0,33.0803 L9.64838,33.3635 C9.64838,33.3635 12.4051,34.0596 12.4051,39.5422 C12.4051,45.0248 9.64838,45.3512 9.64838,45.3512 L0,44.3522 L0,33.0803 Z M31.1111,13.0182 L31.1111,23.5586 L43.3193,23.9361 L43.3193,33.332 L31.4104,33.7017 L31.3356,43.9629 L21.6596,33.8669 L16.7646,28.7304 L21.6596,23.3108 L31.1111,13.0182 Z M9.64838,12.0507 C9.64838,12.0507 12.4051,12.3732 12.4051,17.1989 C12.4051,22.0247 9.64838,22.7051 9.64838,22.7051 L0,23.063 L0,13.0418 L9.64838,12.0507 Z M21.6596,0 L44.1069,3.71667 L44.1069,13.6868 L31.1269,12.3928 L21.6596,22.6972 L21.6596,6.51302 C21.6596,1.89471 17.1581,1.1759 16.0327,1.06836 L15.8461,1.05347 C15.8245,1.05215 15.808,1.05131 15.7969,1.0508 L15.78,1.05011 L21.6596,0.0707937 L21.6596,0 Z" id="Shape"></Path>
                 </G>
@@ -974,8 +992,8 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
  const CheckCirlceIcon = ({ color, size }: IconProps) => {
     return (
         <Svg width={`${size??14}px`} height={`${size??14}px`} viewBox="0 0 22 22">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="check-circle" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="check-circle" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                     <Path d="M20.0000565,9.08623485 L20.0000565,10.0062349 C19.9975243,14.4349207 17.0823504,18.3344478 12.8354089,19.5901358 C8.58846732,20.8458238 4.02145001,19.158547 1.61101155,15.4433012 C-0.799426916,11.7280554 -0.479080094,6.86987383 2.39833065,3.503307 C5.2757414,0.136740166 10.0247691,-0.936239861 14.0700565,0.866234854" id="Path"></Path>
                     <Polyline id="Path" points="20.0000565 2.00623485 10.0000565 12.0162349 7.00005646 9.01623485"></Polyline>
                 </G>
@@ -988,8 +1006,8 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
  const CloseIcon = ({ color, size }: IconProps) => {
     return (
         <Svg width={`${size??14}px`} height={`${size??14}px`} viewBox="0 0 14 14">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="x" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="x" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                     <Line x1="12" y1="0" x2="0" y2="12" id="Path"></Line>
                     <Line x1="0" y1="0" x2="12" y2="12" id="Path"></Line>
                 </G>
@@ -1001,7 +1019,7 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
  const InProgressIcon = ({color, size}:IconProps) => {
     return (
         <Svg width={`${size??14}px`} height={`${size??14}px`} viewBox="0 0 24 24">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="in-progress-svgrepo-com">
                     <Path d="M11.7,2 C11.6,2 11.6,2 11.5,2 C11.5,2 11.5,2 11.4,2 L11.4,2 C11.2,2 11.1,2 10.9,2 L11.1,4 C11.5,4 12,4 12.4,4 C16.4,4.3 19.7,7.5 19.9,11.6 C20.1,16 16.7,19.8 12.3,20 C12.3,20 12.2,20 12.1,20 C11.8,20 11.4,20 11.1,20 L11,22 C11.4,22 11.8,22 12.3,22 C12.4,22 12.6,22 12.7,22 L12.7,22 C18.1,21.6 22.2,17 22,11.6 C21.8,6.5 17.7,2.5 12.7,2.1 L12.7,2.1 C12.7,2.1 12.7,2.1 12.7,2.1 C12.5,2.1 12.4,2.1 12.2,2.1 C12,2 11.9,2 11.7,2 Z M8.2,2.7 C7.7,3 7.2,3.2 6.7,3.5 L7.8,5.2 C8.1,5 8.5,4.8 8.9,4.6 L8.2,2.7 Z M4.5,5.4 C4.1,5.8 3.8,6.3 3.5,6.7 L5.2,7.7 C5.4,7.4 5.7,7.1 6,6.7 L4.5,5.4 Z M15.4,8.4 L10.8,13.6 L8.1,11.5 L7,13.2 L11.2,16.4 L17,9.8 L15.4,8.4 Z M2.4,9 C2.2,9.5 2.1,10.1 2.1,10.6 L4.1,10.9 C4.2,10.5 4.2,10 4.4,9.6 L2.4,9 Z M4.1,13 L2.1,13.2 C2.1,13.3 2.1,13.4 2.1,13.5 C2.2,13.9 2.3,14.4 2.4,14.8 L4.3,14.2 C4.2,13.9 4.1,13.5 4.1,13.1 L4.1,13 Z M5.2,16.2 L3.5,17.3 C3.8,17.8 4.1,18.2 4.5,18.6 L6,17.3 C5.7,16.9 5.4,16.6 5.2,16.2 Z M7.8,18.8 L6.7,20.5 C7.2,20.8 7.7,21 8.2,21.3 L9,19.5 C8.5,19.2 8.1,19 7.8,18.8 Z" id="Shape" fill={color} fill-rule="nonzero"></Path>
                     <Rect id="Rectangle" x="0" y="0" width="24" height="24"></Rect>
@@ -1015,8 +1033,8 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
  const UserIcon = ({ color, size }: IconProps) => {
     return (
         <Svg width={`${size??14}px`} height={`${size??14}px`} viewBox="0 0 18 20">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="user" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="user" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                     <Path d="M16,18 L16,16 C16,13.790861 14.209139,12 12,12 L4,12 C1.790861,12 0,13.790861 0,16 L0,18" id="Path"></Path>
                     <Circle id="Oval" cx="8" cy="4" r="4"></Circle>
                 </G>
@@ -1032,8 +1050,8 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
     let width = height * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 21 15">
-        <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-            <G id="list" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+        <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+            <G id="list" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                 <Line x1="5.495" y1="0.5" x2="18.495" y2="0.5" id="Path"></Line>
                 <Line x1="5.495" y1="6.5" x2="18.495" y2="6.5" id="Path"></Line>
                 <Line x1="5.495" y1="12.5" x2="18.495" y2="12.5" id="Path"></Line>
@@ -1049,10 +1067,10 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
  const TrophyIcon = ({ color, size }: IconProps ) => {
     return (
-        <Svg width={`${size??14}px`} height={`${size??14}px`} viewBox="0 0 16 16">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                <G id="Group" transform="translate(0.000000, 0.000000)" fill={color}>
-                    <Path d="M15.9744,2.74451 C15.8361,1.81267 15.1711,1.06941 14.3196,0.895008 C14.0161,0.832855 13.7183,0.846759 13.4379,0.928709 L13.4379,0.690593 C13.4379,0.309201 13.1374,0 12.7666,0 L3.23337997,0 C3.05515997,0 2.88428997,0.0728345 2.75833997,0.202666 C2.63239997,0.332405 2.56177997,0.508276 2.56204997,0.691606 L2.56230997,0.928801 C2.28196997,0.846759 1.98397997,0.832763 1.68035997,0.895008 C0.828752974,1.06941 0.163774974,1.81267 0.0255696737,2.74451 C-0.0737876263,3.41457 -0.00754954628,5.1021 2.58916997,6.68521 C2.77373997,8.73812 5.37310997,10.3952 7.33303997,10.7075 L7.33303997,11.9521 L4.30004997,11.9521 C3.92928997,11.9521 3.62870997,12.2613 3.62870997,12.6427 L3.62870997,15.3094 C3.62870997,15.6908 3.92928997,16 4.30004997,16 L11.7,16 C12.0708,16 12.3714,15.6908 12.3714,15.3094 L12.3714,12.6427 C12.3714,12.2613 12.0708,11.9521 11.7,11.9521 L8.67570997,11.9521 L8.67570997,10.7075 C10.6366,10.395 13.2364,8.73545 13.4189,6.68024 C16.0075,5.0986 16.0738,3.41383 15.9744,2.74451 Z M11.0287,14.6188 L4.97137997,14.6188 L4.97137997,13.3333 L11.0287,13.3333 L11.0287,14.6188 Z M13.438,5.008 C14.6791,4.03094 14.6861,3.21522 14.6471,2.95288 C14.5856,2.53788 14.3066,2.3006 14.0575,2.24958 C13.7851,2.19397 13.5802,2.35087 13.438,2.53567 L13.438,5.008 Z M1.94262997,2.24958 C2.21652997,2.19369 2.42240997,2.3528 2.56463997,2.53908 L2.56803997,5.01269 C1.32096997,4.03352 1.31389997,3.21558 1.35292997,2.95288 C1.41450997,2.53788 1.69342997,2.3006 1.94262997,2.24958 Z M3.90569997,1.38119 L3.91231997,6.26754 C3.91231997,7.9839 6.33614997,9.37945 8.00436997,9.37945 C9.67106997,9.37945 12.0937,7.98556 12.0954,6.26745 L12.0954,1.38119 L3.90569997,1.38119 Z" id="Shape"></Path>
+        <Svg width={`${size??24}px`} height={`${size??24}px`} viewBox="0 0 34 34">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="trophy-svgrepo-com" transform="translate(2.000000, 2.000000)" stroke={color??Colors.brand.midnight} strokeWidth="3">
+                    <Path d="M15,18.3333333 L15,23.3333333 M15,18.3333333 C10.9684,18.3333333 7.60548333,15.4703333 6.83336667,11.6666667 M15,18.3333333 C19.0316667,18.3333333 22.3945,15.4703333 23.1666667,11.6666667 M23.3333333,3.33333333 L27.9166667,3.33333333 C28.3038333,3.33333333 28.4975,3.33333333 28.6585,3.36535 C29.3196667,3.49686667 29.8365,4.0137 29.968,4.67485 C30,4.83585 30,5.02945 30,5.41666667 C30,6.5783 30,7.15911667 29.904,7.64211667 C29.5093333,9.62556667 27.9588333,11.1760667 25.9755,11.5706 C25.4925,11.6666667 24.9116667,11.6666667 23.75,11.6666667 L23.3333333,11.6666667 L23.1666667,11.6666667 M6.66666667,3.33333333 L2.08333333,3.33333333 C1.69611667,3.33333333 1.50251667,3.33333333 1.34151667,3.36535 C0.680366667,3.49686667 0.163533333,4.0137 0.0320166667,4.67485 C0,4.83585 0,5.02945 0,5.41666667 C0,6.5783 0,7.15911667 0.0960666667,7.64211667 C0.4906,9.62556667 2.0411,11.1760667 4.02455,11.5706 C4.50755,11.6666667 5.08836667,11.6666667 6.25,11.6666667 L6.66666667,11.6666667 L6.83336667,11.6666667 M15,23.3333333 C16.55,23.3333333 17.325,23.3333333 17.9608333,23.5036667 C19.6861667,23.966 21.034,25.3138333 21.4963333,27.0391667 C21.6666667,27.675 21.6666667,28.45 21.6666667,30 L8.33333333,30 C8.33333333,28.45 8.33333333,27.675 8.5037,27.0391667 C8.96603333,25.3138333 10.3137833,23.966 12.0391667,23.5036667 C12.675,23.3333333 13.45,23.3333333 15,23.3333333 Z M6.83336667,11.6666667 C6.72405,11.12815 6.66666667,10.5707833 6.66666667,10 L6.66666667,2.61905 C6.66666667,1.73051667 6.66666667,1.28626667 6.83171667,0.943533333 C6.99553333,0.60335 7.27001667,0.328866667 7.6102,0.16505 C7.95293333,0 8.39718333,0 9.28571667,0 L20.7143333,0 C21.6028333,0 22.047,0 22.3898333,0.16505 C22.73,0.328866667 23.0045,0.60335 23.1683333,0.943533333 C23.3333333,1.28626667 23.3333333,1.73051667 23.3333333,2.61905 L23.3333333,10 C23.3333333,10.5707833 23.276,11.12815 23.1666667,11.6666667" id="Shape"></Path>
                 </G>
             </G>
         </Svg>
@@ -1062,8 +1080,8 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
  const EditIcon = ({ color, size }:IconProps) => {
     return (
         <Svg width={`${size??14}px`} height={`${size??14}px`} viewBox="0 0 16 16">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="edit-3-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color??Colors.brand.midnight} stroke-width="1.5">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="edit-3-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color??Colors.brand.midnight} strokeWidth="1.5">
                     <Path d="M13.4142169,3.12168866 L6.77664984,9.75922094 C6.11567618,10.4201946 4.15360718,10.7263298 3.71527728,10.2879999 C3.27694738,9.84966997 3.57612493,7.88762184 4.23709859,7.22664818 L10.8816442,0.582137411 C11.045496,0.403368388 11.2438577,0.259665757 11.4648316,0.159684794 C11.685736,0.0597038305 11.9246606,0.00550399043 12.1671336,0.000397099207 C12.4095369,-0.0047028344 12.6505488,0.0393667147 12.8754886,0.129961852 C13.1004284,0.220556989 13.304704,0.355813073 13.475931,0.527527072 C13.6471579,0.699241071 13.7818574,0.903864601 13.8718194,1.12905485 C13.9617814,1.35425205 14.0052665,1.5953335 13.9994917,1.83777168 C13.9937169,2.08020986 13.9388213,2.31898833 13.8382837,2.53964917 C13.7376765,2.76031001 13.5934451,2.95831685 13.4142169,3.12168866 L13.4142169,3.12168866 Z" id="Path"></Path>
                     <Path d="M6.26185573,1.45182568 L2.78304699,1.45182568 C2.04493422,1.45182568 1.33710101,1.7450336 0.815175336,2.26695927 C0.293256619,2.78888495 0,3.4967599 0,4.23487267 L0,11.1924901 C0,11.9306238 0.293256619,12.6384918 0.815175336,13.1603827 C1.33710101,13.6823431 2.04493422,13.9755371 2.78304699,13.9755371 L10.4364262,13.9755371 C11.9740597,13.9755371 12.5237115,12.723166 12.5237115,11.1924901 L12.5237115,7.71368141" id="Path"></Path>
                 </G>
@@ -1079,8 +1097,8 @@ const PreferencesIcon = ({ color, size }:IconProps) => {
     let height = width * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 18 22">
-        <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-            <G id="share" transform="translate(1.000000, 1.000000)" stroke={color} stroke-width="2">
+        <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+            <G id="share" transform="translate(1.000000, 1.000000)" stroke={color} strokeWidth="2">
                 <Path d="M0,10 L0,18 C0,19.1045695 0.8954305,20 2,20 L14,20 C15.1045695,20 16,19.1045695 16,18 L16,10" id="Path"></Path>
                 <Polyline id="Path" points="12 4 8 0 4 4"></Polyline>
                 <Line x1="8" y1="0" x2="8" y2="13" id="Path"></Line>
@@ -1096,7 +1114,7 @@ const SettingsIcon = ({ color, size } : IconProps) => {
     let width = height * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 19 20">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="settings-svgrepo-com-(1)" transform="translate(0.000000, -0.000000)" fill={color ?? Colors.brand.midnight}>
                     <Path d="M9.46811514,6.51162817 C7.54154773,6.51162817 5.97974311,8.07342349 5.97974311,10.0000002 C5.97974311,11.9266048 7.54154773,13.4883722 9.46811514,13.4883722 C11.3947198,13.4883722 12.9564872,11.9266048 12.9564872,10.0000002 C12.9564872,8.07342349 11.3947198,6.51162817 9.46811514,6.51162817 Z M7.37509192,10.0000002 C7.37509192,8.84409324 8.31220818,7.90697698 9.46811514,7.90697698 C10.6240221,7.90697698 11.5611384,8.84409324 11.5611384,10.0000002 C11.5611384,11.1559072 10.6240221,12.0930234 9.46811514,12.0930234 C8.31220818,12.0930234 7.37509192,11.1559072 7.37509192,10.0000002 Z" id="Shape"></Path>
                     <Path d="M9.44458025,0 C9.03118491,0 8.68597562,0 8.40262679,0.0193213249 C8.10765005,0.0394515571 7.8290454,0.0828376027 7.55891517,0.194725973 C6.93210588,0.454363177 6.43409659,0.952363167 6.17445939,1.57918176 C6.0392966,1.90550733 6.00269195,2.2494143 5.98871055,2.62321895 C5.97747335,2.92371197 5.82582684,3.17442824 5.60202219,3.30363754 C5.37822685,3.43284684 5.08527801,3.43881893 4.81942686,3.29830731 C4.48871058,3.12350731 4.17257106,2.98324685 3.82237571,2.93714452 C3.14972456,2.84858639 2.46943621,3.03087475 1.93117575,3.443898 C1.69921297,3.6218887 1.52231995,3.84148869 1.35740832,4.08688404 C1.19898042,4.32261426 1.02641298,4.62153519 0.819687401,4.9796003 L0.796199029,5.02028867 C0.58946415,5.37834447 0.416887409,5.67724679 0.291947877,5.93230725 C0.161892065,6.19783283 0.0601525324,6.46082817 0.0219850912,6.75070724 C-0.0665730465,7.42336769 0.115715322,8.10364675 0.528729267,8.64195371 C0.743724612,8.92204673 1.02321298,9.12576766 1.33990134,9.3247444 C1.59458041,9.48474439 1.73591064,9.74148857 1.73589203,10 C1.73588273,10.2584188 1.5945525,10.515163 1.33990134,10.675163 C1.02317577,10.8741397 0.743659496,11.0778606 0.528645546,11.3580467 C0.115622299,11.8962792 -0.0666567675,12.5765583 0.021892068,13.2492094 C0.0600595091,13.5390699 0.161799042,13.8021397 0.291854853,14.067628 C0.416794386,14.3226978 0.589371127,14.6215815 0.796096704,14.979628 L0.819594378,15.0203722 C1.02631996,15.3784187 1.19888739,15.6773024 1.3573153,15.9130233 C1.52222692,16.1584187 1.69911994,16.3780466 1.93108273,16.5560001 C2.46934318,16.9690233 3.14963154,17.1513489 3.82228269,17.0627908 C4.17245943,17.0166512 4.48858035,16.8764652 4.81927802,16.7016745 C5.08516639,16.5611163 5.37815243,16.5670698 5.60197568,16.6963722 C5.82580823,16.8255815 5.97747335,17.0762791 5.98871055,17.3768373 C6.00269195,17.7506047 6.0393059,18.0945117 6.17445939,18.4208372 C6.43409659,19.0476279 6.93210588,19.5456744 7.55891517,19.8053023 C7.8290454,19.9172093 8.10765005,19.9605581 8.40262679,19.9806512 C8.68597562,20 9.03118491,20 9.44458025,20 L9.491557,20 C9.90504536,20 10.2501616,20 10.5336035,19.9806512 C10.8285802,19.9605581 11.1071849,19.9172093 11.3773244,19.8053023 C12.0041151,19.5456744 12.5021616,19.0476279 12.7617895,18.4208372 C12.8969523,18.0945117 12.9335104,17.7506047 12.9474639,17.3767442 C12.9587197,17.0762791 13.1103476,16.8255815 13.3341616,16.6962791 C13.5579755,16.5670698 13.8509988,16.5611163 14.1168592,16.7015815 C14.4475569,16.8763722 14.7636499,17.0166512 15.1138825,17.0626977 C15.7865336,17.1512559 16.4668127,16.9690233 17.0050452,16.5560001 C17.2370452,16.3779536 17.4138824,16.1584187 17.5788127,15.9130233 C17.7372313,15.6773024 17.9097894,15.3784187 18.1164871,15.0203722 L18.1400219,14.979628 C18.3467196,14.6215815 18.5193708,14.3226048 18.644301,14.067535 C18.7743475,13.8020466 18.8760219,13.5390699 18.9142545,13.2492094 C19.0028126,12.5764653 18.820487,11.8961862 18.4074638,11.3579537 C18.1924871,11.0777676 17.9129522,10.8741397 17.596301,10.675163 C17.3416034,10.515163 17.200301,10.2584188 17.200301,9.99990717 C17.200301,9.74148857 17.3416034,9.48483742 17.596208,9.32483742 C17.9130452,9.12586068 18.1925801,8.92223278 18.4075568,8.64195371 C18.8205801,8.10371186 19.0029056,7.42343281 18.9143475,6.75077235 C18.876115,6.46089329 18.7744405,6.19789795 18.644394,5.93237237 C18.5194638,5.67733052 18.3469057,5.3784468 18.140115,5.0204189 L18.1166731,4.97970262 C17.9098824,4.62162821 17.7373243,4.32267938 17.5789057,4.08694915 C17.4139754,3.84155381 17.2371382,3.62195381 17.0051382,3.44395382 C16.4669057,3.03093987 15.7866266,2.8486515 15.1138825,2.93720964 C14.7637429,2.98331196 14.4476499,3.12355382 14.1169523,3.29834452 C13.8510918,3.43887475 13.5580685,3.43289335 13.3342546,3.30366545 C13.1104406,3.17444684 12.9587197,2.92369336 12.9474639,2.62317244 C12.9335104,2.24937709 12.8969523,1.90548873 12.7617895,1.57918176 C12.5021616,0.952363167 12.0041151,0.454363177 11.3773244,0.194725973 C11.1071849,0.0828376027 10.8285802,0.0394515571 10.5336035,0.0193213249 C10.2501616,0 9.90504536,0 9.491557,0 L9.44458025,0 Z M8.09285935,1.48386083 C8.1646733,1.4541306 8.27369656,1.42671665 8.49760353,1.41143293 C8.72783608,1.3957306 9.0251384,1.3953492 9.46811514,1.3953492 C9.91109187,1.3953492 10.2083942,1.3957306 10.4385337,1.41143293 C10.6625337,1.42671665 10.771557,1.4541306 10.8432779,1.48386083 C11.1282081,1.60187943 11.3546267,1.82824222 11.4725802,2.11316314 C11.5098825,2.20303291 11.5406732,2.34313523 11.5531384,2.67532127 C11.5806732,3.41241893 11.9611383,4.12213055 12.6365802,4.51207472 C13.311929,4.90202821 14.1168592,4.87665146 14.7689522,4.5319817 C15.0628127,4.37665147 15.1996499,4.33332124 15.296022,4.32062357 C15.6017894,4.2803724 15.9109987,4.36322822 16.1556499,4.55095844 C16.2173243,4.59825147 16.2955569,4.67896774 16.4207662,4.86526542 C16.5495103,5.05677239 16.6984406,5.3140468 16.9199289,5.6976747 C17.1414173,6.0813119 17.2897894,6.33895841 17.3912778,6.54616771 C17.4899754,6.7477398 17.5207661,6.85587933 17.5309057,6.93290258 C17.5711847,7.23865141 17.488301,7.54787932 17.3005801,7.79253978 C17.2413243,7.86972117 17.1354638,7.96650256 16.8538824,8.14334907 C16.2294173,8.53581418 15.8050452,9.22009324 15.8049522,9.99990717 C15.8049522,10.7798141 16.2293243,11.4641862 16.8538824,11.8566513 C17.1353708,12.0334885 17.2412313,12.1302327 17.3004871,12.207442 C17.488208,12.4520932 17.5710917,12.7613025 17.5308127,13.0670699 C17.5206731,13.1440932 17.4898824,13.2521862 17.3911847,13.4537676 C17.2896964,13.6609304 17.1413243,13.9186048 16.9198359,14.3022327 C16.6983476,14.6858606 16.5494173,14.9431629 16.4206731,15.1346978 C16.2954638,15.3209303 16.2172313,15.4016745 16.1555569,15.4489303 C15.9109057,15.6367443 15.6016964,15.719535 15.295929,15.6793489 C15.1995569,15.6666047 15.0627197,15.6232559 14.7688592,15.4680001 C14.1167662,15.1232559 13.311836,15.0979536 12.6363941,15.4879071 C11.9611383,15.8778605 11.5806732,16.587535 11.5531384,17.3246512 C11.5406732,17.6568373 11.5098825,17.7969303 11.4725802,17.8868838 C11.3546267,18.171721 11.1282081,18.3981396 10.8432779,18.5161861 C10.771557,18.5458605 10.6625337,18.5733024 10.4385337,18.5885582 C10.2083942,18.6042791 9.91109187,18.6046512 9.46811514,18.6046512 C9.0251384,18.6046512 8.72783608,18.6042791 8.49760353,18.5885582 C8.27369656,18.5733024 8.1646733,18.5458605 8.09285935,18.5161861 C7.80802215,18.3981396 7.58161285,18.171721 7.46359425,17.8868838 C7.42636634,17.7969303 7.39551053,17.6568373 7.38308262,17.3246512 C7.35551983,16.587628 6.97506402,15.8778605 6.29965008,15.4879071 C5.62424545,15.0979536 4.81938965,15.1233489 4.16725943,15.4680001 C3.87337106,15.6233489 3.73660827,15.6666978 3.64016176,15.6793489 C3.33440363,15.719628 3.02518503,15.6367443 2.78052457,15.4490233 C2.71888736,15.4017675 2.6406269,15.3210233 2.5154269,15.1346978 C2.38672923,14.9432559 2.23775249,14.6859536 2.01626412,14.3023257 C1.79476645,13.9186978 1.64645018,13.6610234 1.5449525,13.4538606 C1.44621762,13.2522792 1.41544553,13.1440932 1.40530599,13.0670699 C1.36505483,12.7613025 1.44791064,12.4520932 1.63565018,12.207442 C1.69486878,12.1303257 1.80077575,12.0334885 2.08225482,11.8566513 C2.70679434,11.4642792 3.13120363,10.7799072 3.13124084,10.0000932 C3.13128736,9.22009324 2.70685946,8.53572116 2.08226412,8.14325605 C1.80085017,7.96640954 1.6949525,7.86964675 1.6357339,7.79247466 C1.44800367,7.5478142 1.36514786,7.2385956 1.40539902,6.93283747 C1.41553855,6.85582352 1.44631064,6.74767468 1.54504553,6.54611189 C1.6465432,6.33889329 1.79485947,6.08124679 2.01634784,5.69760958 C2.23784551,5.31398169 2.38681295,5.05670727 2.51551993,4.8652003 C2.64071992,4.67891193 2.71898039,4.59818635 2.78060829,4.55090263 C3.02527806,4.3631631 3.33449665,4.28030729 3.64024548,4.32055845 C3.7367013,4.33325612 3.87347339,4.37658636 4.16739896,4.53194449 C4.81949197,4.87660495 5.62431056,4.90197239 6.29968729,4.51204682 C6.97507333,4.12212124 7.35551983,3.41243754 7.38308262,2.67536778 C7.39551053,2.34315384 7.42636634,2.20304221 7.46359425,2.11316314 C7.58161285,1.82824222 7.80802215,1.60187943 8.09285935,1.48386083 Z" id="Shape"></Path>
@@ -1109,7 +1127,7 @@ const SettingsIcon = ({ color, size } : IconProps) => {
 const TransactionIcon = ({ color, size }:IconProps) => {
     return (
         <Svg width={`${size??20}px`} height={`${size??20}px`} viewBox="0 0 20 20">
-        <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
             <G id="transaction-svgrepo-com" fill={color ?? Colors.brand.midnight}>
                 <Path d="M9.28571429,0 C8.10228571,0 7.14285714,0.959385714 7.14285714,2.14285714 L7.14285714,4.28571429 L2.14285714,4.28571429 C0.959385714,4.28571429 0,5.2451 0,6.42857143 L0,17.8571429 C0,19.0405714 0.959385714,20 2.14285714,20 L10.7142857,20 C11.8977143,20 12.8571429,19.0405714 12.8571429,17.8571429 L12.8571429,15.7142857 L17.8571429,15.7142857 C19.0405714,15.7142857 20,14.7548571 20,13.5714286 L20,2.14285714 C20,0.959385714 19.0405714,0 17.8571429,0 L9.28571429,0 Z M11.4285714,15.7142857 L9.28571429,15.7142857 C8.10228571,15.7142857 7.14285714,14.7548571 7.14285714,13.5714286 L7.14285714,5.71428571 L2.14285714,5.71428571 C1.74837143,5.71428571 1.42857143,6.03408571 1.42857143,6.42857143 L1.42857143,17.8571429 C1.42857143,18.2515714 1.74837143,18.5714286 2.14285714,18.5714286 L10.7142857,18.5714286 C11.1087143,18.5714286 11.4285714,18.2515714 11.4285714,17.8571429 L11.4285714,15.7142857 Z M8.57142857,2.14285714 C8.57142857,1.74837143 8.89128571,1.42857143 9.28571429,1.42857143 L17.8571429,1.42857143 C18.2515714,1.42857143 18.5714286,1.74837143 18.5714286,2.14285714 L18.5714286,13.5714286 C18.5714286,13.9658571 18.2515714,14.2857143 17.8571429,14.2857143 L9.28571429,14.2857143 C8.89128571,14.2857143 8.57142857,13.9658571 8.57142857,13.5714286 L8.57142857,2.14285714 Z" id="Shape"></Path>
                 <Path d="M10,5 C10,4.60551429 10.3198571,4.28571429 10.7142857,4.28571429 L16.4285714,4.28571429 C16.823,4.28571429 17.1428571,4.60551429 17.1428571,5 C17.1428571,5.39448571 16.823,5.71428571 16.4285714,5.71428571 L10.7142857,5.71428571 C10.3198571,5.71428571 10,5.39448571 10,5 Z" id="Path"></Path>
@@ -1128,8 +1146,8 @@ const PhoneIcon = ({ color, size } : IconProps) => {
     let width = height * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 17 22">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="phone-svgrepo-com" transform="translate(1.438912, 1.000000)" stroke={color ?? Colors.brand.midnight} stroke-width="2">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="phone-svgrepo-com" transform="translate(1.438912, 1.000000)" stroke={color ?? Colors.brand.midnight} strokeWidth="2">
                     <Path d="M14.0067027,15.5000775 L14.0067027,4.5000225 C14.069603,3.37367687 13.684301,2.26821134 12.9347973,1.42505713 C12.1852936,0.58190291 11.1326883,0.0695803479 10.0066827,0 L4.00666266,0 C2.88071703,0.0695803479 1.82805177,0.58190291 1.07858802,1.42505713 C0.329114272,2.26821134 -0.0562676553,3.37367687 0.00665265933,4.5000225 L0.00665265933,15.5000775 C-0.0562676553,16.6263831 0.329114272,17.7317887 1.07858802,18.5748929 C1.82805177,19.4180971 2.88071703,19.9303997 4.00666266,20 L10.0066827,20 C11.1326883,19.9303997 12.1852936,19.4180971 12.9347973,18.5748929 C13.684301,17.7317887 14.069603,16.6263831 14.0067027,15.5000775 L14.0067027,15.5000775 Z" id="Path"></Path>
                     <Line x1="9.00687766" y1="3.000015" x2="5.00685766" y2="3.000015" id="Path"></Line>
                 </G>
@@ -1145,8 +1163,8 @@ const EmailIcon = ({ color, size } : IconProps) => {
     let height = width * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 22 18">
-        <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
-            <G id="email-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color ?? Colors.brand.midnight} stroke-width="2">
+        <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round">
+            <G id="email-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color ?? Colors.brand.midnight} strokeWidth="2">
                 <Path d="M1.11111111,2.22222222 L8,7.38888889 C9.18522222,8.27777778 10.8147778,8.27777778 12,7.38888889 L18.8888889,2.22222222" id="Path" stroke-linejoin="round"></Path>
                 <Rect id="Rectangle" x="0" y="0" width="20" height="15.5555556" rx="1"></Rect>
             </G>
@@ -1161,7 +1179,7 @@ const BirthdayIcon = ({ color, size } : IconProps) => {
     let width = height * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 23 24">
-        <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
             <G id="birthday-card-invitation-svgrepo-com" fill={color ?? Colors.brand.midnight} fill-rule="nonzero">
                 <Path d="M22.0403438,9.3645 L20.3392969,7.75045312 L20.3392969,3.18304687 C20.3392969,2.92148437 20.1273281,2.70951562 19.8657656,2.70951562 L15.0264375,2.70951562 L12.9365625,0.726609375 C11.915625,-0.242203125 10.3160625,-0.242203125 9.29503125,0.726609375 L7.20520312,2.70951562 L2.365875,2.70951562 C2.1043125,2.70951562 1.89234375,2.92148437 1.89234375,3.18304687 L1.89234375,7.75045312 L0.147609375,9.40589062 C-0.042140625,9.58589062 -0.0481875,9.88382812 0.130078125,10.0753594 C0.211828125,10.16325 7.89342187,15.8377969 7.89342187,15.8377969 L1.52517187,21.8800781 C1.36954687,22.0276875 1.25953125,22.207875 1.19798438,22.4021719 C1.03964062,22.1668594 0.9470625,21.8836875 0.9470625,21.579375 L0.9470625,12.7727344 C0.9470625,12.5111719 0.73509375,12.2992031 0.47353125,12.2992031 C0.21196875,12.2992031 0,12.5111719 0,12.7727344 L0,21.579375 C0,22.8550312 0.990375,23.9029687 2.24245312,23.996625 C2.28534375,24.001125 19.94625,24.001125 19.9891875,23.996625 C21.2412187,23.9029219 22.2314533,22.8549375 22.2314533,21.579375 L22.2314533,9.82626562 C22.2314533,9.66520312 22.1904844,9.51473437 22.0403438,9.3645 Z M9.946875,1.41360938 C10.602375,0.791625 11.6292656,0.791765625 12.2846719,1.41360938 L13.6504687,2.70951562 L8.58098437,2.70951562 L9.946875,1.41360938 Z M1.21125,9.7021875 L1.89234375,9.05596875 L1.89234375,9.24159375 C1.89234375,9.50315625 2.1043125,9.715125 2.365875,9.715125 C2.6274375,9.715125 2.83940625,9.50315625 2.83940625,9.24159375 L2.83940625,3.65657813 L14.8336406,3.65657813 C14.8349531,3.65657813 14.8363125,3.65676563 14.837625,3.65676563 C14.8388906,3.65676563 14.8401562,3.65657813 14.8413281,3.65657813 L19.3921406,3.65657813 L19.3921406,9.25129687 C19.3921406,9.51285937 19.6041094,9.72482812 19.8656719,9.72482812 C20.1272344,9.72482812 20.3392031,9.51285937 20.3392031,9.25129687 L20.3392031,9.05596875 L21.0260156,9.70767187 L13.6464844,15.1815 L12.9365156,14.5078594 C11.9155781,13.5390469 10.3160156,13.5389531 9.29498437,14.5078594 L8.59078125,15.1759687 L1.21125,9.7021875 Z M20.1229219,22.878375 C20.1023906,22.9298437 20.0374219,23.0454844 19.8794531,23.0552812 C19.8552656,23.0565 2.37628125,23.0565 2.35223437,23.0552812 C2.194125,23.0455781 2.12929687,22.9298437 2.10876562,22.878375 C2.08729687,22.8245625 2.0510625,22.6867031 2.17701562,22.567125 L8.91089062,16.1777812 C8.94257812,16.154625 8.97173438,16.1271562 8.99770312,16.0954688 L9.946875,15.1948594 C10.274625,14.8838906 10.6952344,14.7284062 11.1157969,14.7284062 C11.5363594,14.7284062 11.9569687,14.8839375 12.2847187,15.1948594 L20.054625,22.567125 C20.180625,22.6866562 20.1443437,22.8245625 20.1229219,22.878375 Z M21.2844375,21.5793281 C21.2844375,21.8837344 21.1918594,22.1667656 21.0335156,22.402125 C20.9719688,22.2079219 20.8619531,22.0277344 20.7063281,21.8800781 L14.3439375,15.8432344 L21.2844375,10.6950937 L21.2844375,21.5793281 L21.2844375,21.5793281 Z" id="Shape"></Path>
                 <Path d="M7.498125,5.2335 C7.24354687,5.2335 7.04409375,5.43295312 7.04409375,5.68753125 L7.04409375,7.49971875 L5.1174375,7.49971875 L5.1174375,5.68753125 C5.1174375,5.43295313 4.9145625,5.2335 4.65571875,5.2335 C4.40109375,5.2335 4.20164063,5.43295312 4.20164063,5.68753125 L4.20164063,10.2201094 C4.20164063,10.4746875 4.40109375,10.6741406 4.65571875,10.6741406 C4.91465625,10.6741406 5.1174375,10.4746875 5.1174375,10.2201094 L5.1174375,8.40792187 L7.04404688,8.40792187 L7.04404688,10.2201094 C7.04404688,10.4746875 7.2435,10.6741406 7.49807813,10.6741406 C7.7570625,10.6741406 7.95989063,10.4746875 7.95989063,10.2201094 L7.95989063,5.68753125 C7.95989063,5.43295313 7.7570625,5.2335 7.498125,5.2335 Z" id="Path"></Path>
@@ -1181,11 +1199,11 @@ const IBTFLowIcon = ({ size }: IconProps) => {
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 939 262">
-        <G id="Artboard" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <G id="Artboard" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
             <G id="Plaid_(company)-Vertical-Logo.wine" transform="translate(400.000000, 52.000000)" fill="#111212" fill-rule="nonzero">
                 <Path d="M144.343651,102.773557 L127.410108,85.8404032 L140.71937,72.5319192 L149.772096,81.5850344 L144.343651,102.773557 Z M140.71937,56.5613492 L127.410108,43.2528651 L144.343651,26.3201001 L149.772096,47.5094011 L140.71937,56.5613492 Z M115.170816,12.9061753 L136.35895,18.3338424 L119.425796,35.2677746 L106.117312,21.9592906 L115.170816,12.9061753 Z M90.1471306,21.9596796 L76.8382575,35.2677746 L59.9054924,18.3346205 L81.0940154,12.9061753 L90.1471306,21.9596796 Z M51.9188457,26.3185438 L68.853167,43.2532542 L55.545072,56.5613492 L46.4904004,47.5066776 L51.9188457,26.3185438 Z M55.545072,72.531141 L68.853167,85.839236 L51.9188457,102.773557 L46.4904004,81.5854235 L55.545072,72.531141 Z M81.0932372,116.187093 L59.9039361,110.758648 L76.8382575,93.8247155 L90.1467416,107.133589 L81.0932372,116.187093 Z M111.440316,85.8400142 L98.131832,99.1484982 L84.8229588,85.8400142 L98.131832,72.531141 L111.440316,85.8400142 Z M119.425407,51.2375665 L132.733891,64.5464396 L119.425407,77.8549237 L106.116533,64.5464396 L119.425407,51.2375665 Z M90.1467416,64.5464396 L76.8382575,77.8549237 L63.5301625,64.5464396 L76.8382575,51.2383446 L90.1467416,64.5464396 Z M84.823737,43.2532542 L98.1322211,29.9447701 L111.440316,43.2528651 L98.131832,56.5613492 L84.823737,43.2532542 Z M106.116533,107.133589 L119.425407,93.8254937 L136.358172,110.758648 L115.169649,116.186315 L106.116533,107.133589 Z M152.363759,118.778366 L162.678272,78.5202506 L148.704461,64.5468287 L162.678272,50.5722395 L152.36337,10.3137347 L112.104865,0 L98.1322211,13.9742001 L84.1568537,0 L43.898738,10.314902 L33.5850033,50.5730177 L47.5599816,64.5464396 L33.5850033,78.5210288 L43.898738,118.779145 L84.1576319,129.093268 L98.131832,115.11829 L112.105254,129.093268 L152.363759,118.778366 Z M190.361708,160.693185 C188.719401,158.371155 186.759994,156.51252 184.489712,155.109886 C180.764659,152.787467 175.687942,151.626063 169.257227,151.626063 L153.013133,151.626063 L153.013133,199.998055 L172.014248,199.998055 C178.877232,199.998055 184.391664,197.776407 188.549373,193.328055 C192.706694,188.879702 194.784382,182.982416 194.784382,175.632304 C194.784382,169.783263 193.30899,164.804983 190.361708,160.693185 M170.636905,189.04973 L165.341525,189.04973 L165.341525,162.577889 L170.709274,162.577889 C174.480627,162.577889 177.378884,163.74474 179.409882,166.075719 C181.441658,168.409032 182.455601,171.716602 182.455601,175.992203 C182.455601,184.699037 178.514609,189.04973 170.636905,189.04973 M130.171798,200 L142.50019,200 L142.50019,151.628397 L130.171798,151.628397 L130.171798,200 Z M94.9989592,151.627619 L75.6371673,200 L88.9075215,200 L91.4458799,192.966989 L108.268535,192.966989 L110.58862,200 L124.00877,200 L104.788214,151.627619 L94.9989592,151.627619 Z M94.8546105,183.176956 L99.9313274,166.64183 L104.932952,183.176956 L94.8546105,183.176956 Z M56.5644618,151.627619 L44.2364595,151.627619 L44.2364595,200 L70.8526495,200 L70.8526495,189.048174 L56.5644618,189.048174 L56.5644618,151.627619 Z M30.6762406,155.254235 C27.7744814,152.83688 22.8187684,151.629565 15.8091018,151.629565 L0,151.629565 L0,199.999222 L11.82142,199.999222 L11.82142,184.844164 L17.1144654,184.844164 C23.545181,184.844164 28.258497,183.440752 31.2551918,180.634317 C34.6374649,177.494441 36.3311305,173.313386 36.3311305,168.089986 C36.3311305,162.675937 34.4472048,158.397613 30.6762406,155.254235 M16.8234335,173.892338 L11.82142,173.892338 L11.82142,162.578278 L16.3160731,162.578278 C21.7787574,162.578278 24.5100995,164.476989 24.5100995,168.270909 C24.5100995,172.019695 21.9487854,173.892338 16.8234335,173.892338" id="Shape"></Path>
             </G>
-            <G id="bank_icon_instant" transform="translate(724.000000, 52.159450)" stroke="#003566" stroke-width="12">
+            <G id="bank_icon_instant" transform="translate(724.000000, 52.159450)" stroke="#003566" strokeWidth="12">
                 <Path d="M0,196.640044 L194.877444,196.640044 M10.0798678,163.591297 L184.797577,163.591297 M31.9195814,158.523822 L31.9195814,105.645828 M75.5990086,158.523822 L75.5990086,105.645828 M119.278436,158.523822 L119.278436,105.645828 M162.957863,158.523822 L162.957863,105.645828 M194.877444,79.3169925 L120.455913,13.1454015 C112.311119,5.90406637 108.239263,2.28350708 103.644486,0.908469909 C99.5953657,-0.302823303 95.2820787,-0.302823303 91.2329581,0.908469909 C86.6381814,2.28350708 82.5663254,5.90406637 74.4219636,13.1454015 L0,79.3169925 L194.877444,79.3169925 Z" id="Shape"></Path>
             </G>
             <G id="BettorEdge-Double-Line---Dark" transform="translate(8.000000, 52.000000)" fill="#003566" fill-rule="nonzero">
@@ -1221,7 +1239,7 @@ const IBTFLowIcon = ({ size }: IconProps) => {
 const PieIcon = ({ color, size }:IconProps) => {
     return (
     <Svg width={`${size ?? 14}`} height={`${size ?? 14}`} viewBox="0 0 20 20">
-    <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+    <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
         <G id="stats-svgrepo-com-(1)" transform="translate(1.000000, 1.000000)" stroke={color ?? Colors.brand.midnight}>
             <Path d="M0.0487155625,9.94908701 C-0.243938891,7.09124252 0.802475441,4.46977279 2.63602934,2.6362189 C4.26464749,1.00760074 6.51467118,0 8.99990522,0 L8.99990522,6.6712795 C8.99990522,7.95756181 10.0424382,9.00009478 11.3287205,9.00009478 L18,9.00009478 C18,14.3082411 13.4048593,18.5428035 7.9752265,17.9431336 C3.81402173,17.4835807 0.474888758,14.113785 0.0487155625,9.94908701 Z" id="Path"></Path>
             <Path d="M11.450207,5.77352121 L11.450207,0.340007031 C13.7790223,0.340007031 17.6596048,4.85984935 17.6596048,6.54979297 L12.2264788,6.54979297 C11.7975886,6.54979297 11.450207,6.20241136 11.450207,5.77352121 Z" id="Path"></Path>
@@ -1237,7 +1255,7 @@ const ScoreboardIcon = ({ color, size }:IconProps) => {
     let height = width * ratio
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 20 15">
-            <G id="ss" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="ss" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="scoreboard-svgrepo-com" fill={color ?? Colors.brand.midnight} fill-rule="nonzero">
                     <Path d="M10,4.4032186 C10.7778274,4.4032186 11.4081359,3.74608851 11.4081359,2.93696916 C11.4081359,2.1278498 10.7778274,1.47071971 10,1.47071971 C9.22217255,1.47071971 8.5918641,2.1278498 8.5918641,2.93696916 C8.5918641,3.74608851 9.22217255,4.4032186 10,4.4032186 Z M10,2.14126062 C10.4067948,2.14126062 10.737595,2.49888243 10.737595,2.93696916 C10.737595,3.37505588 10.4067948,3.73267769 10,3.73267769 C9.59320519,3.73267769 9.26240501,3.37505588 9.26240501,2.93696916 C9.26240501,2.49888243 9.59320519,2.14126062 10,2.14126062 Z" id="Shape"></Path>
                     <Path d="M12.1502012,4.39874832 C12.3334823,4.39874832 12.4854716,4.24675905 12.4854716,4.06347787 L12.4854716,3.88466696 L13.3884667,4.36298614 C13.4376397,4.38980778 13.491283,4.4032186 13.5449262,4.4032186 C13.6656236,4.4032186 13.7818507,4.33616451 13.8399642,4.21546714 C13.9293697,4.05453733 13.8667859,3.84890478 13.7013858,3.7639696 L12.8699151,3.32588288 L13.7013858,2.88779616 C13.8131426,2.82968261 13.8801967,2.71792579 13.8801967,2.59275816 L13.8801967,1.80151989 C13.8801967,1.61823871 13.7282074,1.46624944 13.5449262,1.46624944 L12.1502012,1.46624944 C11.96692,1.46624944 11.8149307,1.61823871 11.8149307,1.80151989 L11.8149307,4.06347787 C11.8149307,4.24675905 11.96692,4.39874832 12.1502012,4.39874832 Z M12.4810013,2.14126062 L13.2051855,2.14126062 L13.2051855,2.39606616 L12.4810013,2.77603934 L12.4810013,2.14126062 L12.4810013,2.14126062 Z" id="Shape"></Path>
@@ -1255,25 +1273,15 @@ const ScoreboardIcon = ({ color, size }:IconProps) => {
 const SquaresIcon = ({ color, size }:IconProps) => {
     return (
-        <Svg width={`${size ?? 14}`} height={`${size ?? 14}`} viewBox="0 0 50 50">
-            <G id="Artboard" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                <Rect id="Rectangle" stroke={color ?? Colors.brand.midnight} x="6" y="6" width="8" height="8" rx="1"></Rect>
-                <Rect id="Rectangle" stroke={color ?? Colors.brand.midnight} x="16" y="6" width="8" height="8" rx="1"></Rect>
-                <Rect id="Rectangle" stroke={color ?? Colors.brand.midnight} x="26" y="6" width="8" height="8" rx="1"></Rect>
-                <Rect id="Rectangle" stroke={color ?? Colors.brand.midnight} x="36" y="6" width="8" height="8" rx="1"></Rect>
-                <Rect id="Rectangle" stroke={color ?? Colors.brand.midnight} x="6" y="16" width="8" height="8" rx="1"></Rect>
-                <Rect id="Rectangle" stroke={color ?? Colors.brand.midnight} x="16" y="16" width="8" height="8" rx="1"></Rect>
-                <Rect id="Rectangle" stroke={color ?? Colors.brand.midnight} x="26" y="16" width="8" height="8" rx="1"></Rect>
-                <Rect id="Rectangle" stroke={color ?? Colors.brand.midnight} x="36" y="16" width="8" height="8" rx="1"></Rect>
-                <Rect id="Rectangle" stroke={color ?? Colors.brand.midnight} x="6" y="26" width="8" height="8" rx="1"></Rect>
-                <Rect id="Rectangle" stroke={color ?? Colors.brand.midnight} x="16" y="26" width="8" height="8" rx="1"></Rect>
-                <Rect id="Rectangle" stroke={color ?? Colors.brand.midnight} x="26" y="26" width="8" height="8" rx="1"></Rect>
-                <Rect id="Rectangle" stroke={color ?? Colors.brand.midnight} x="36" y="26" width="8" height="8" rx="1"></Rect>
-                <Rect id="Rectangle" stroke={color ?? Colors.brand.midnight} x="6" y="36" width="8" height="8" rx="1"></Rect>
-                <Rect id="Rectangle" stroke={color ?? Colors.brand.midnight} x="16" y="36" width="8" height="8" rx="1"></Rect>
-                <Rect id="Rectangle" stroke={color ?? Colors.brand.midnight} x="26" y="36" width="8" height="8" rx="1"></Rect>
-                <Rect id="Rectangle" stroke={color ?? Colors.brand.midnight} x="36" y="36" width="8" height="8" rx="1"></Rect>
-                <Rect id="Rectangle" fill-opacity="0.2" fill="#D8D8D8" x="4" y="3" width="42" height="43" rx="1"></Rect>
+        <Svg width={`${size ?? 14}`} height={`${size ?? 14}`} viewBox="0 0 24 24">
+            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+                <G id="squares-with-rounded-edges-svgrepo-com" fill={color??Colors.brand.midnight} fill-rule="nonzero">
+                    <Path d="M2.59488603,21.9303693 L4.69870304,21.9303693 C5.07938536,21.9303693 5.3889793,21.6206156 5.3889793,21.2400931 L5.3889793,19.1365157 C5.3889793,18.7555138 5.07938536,18.4457602 4.69870304,18.4457602 L2.59488603,18.4457602 C2.21412383,18.4457602 1.90460976,18.7555937 1.90460976,19.1365157 L1.90460976,21.2400931 C1.90460976,21.6206156 2.2142037,21.9303693 2.59488603,21.9303693 Z" id="Path"></Path>
+                    <Path d="M13.7319608,5.41286181 L15.8359376,5.41286181 C16.2164602,5.41286181 16.5258145,5.10302825 16.5258145,4.72234592 L16.5258145,2.61876853 C16.5258145,2.23800633 16.2164602,1.92825264 15.8359376,1.92825264 L13.7319608,1.92825264 C13.350959,1.92825264 13.0416047,2.23800633 13.0416047,2.61876853 L13.0416047,4.72234592 C13.0420041,5.10302825 13.3518376,5.41286181 13.7319608,5.41286181 Z" id="Path"></Path>
+                    <Path d="M8.16342343,10.9186178 L10.2671606,10.9186178 C10.6479228,10.9186178 10.9574368,10.6088641 10.9574368,10.2281019 L10.9574368,8.1245245 C10.9574368,7.74376229 10.6479228,7.43400861 10.2671606,7.43400861 L8.16342343,7.43400861 C7.78266122,7.43400861 7.47306728,7.74376229 7.47306728,8.1245245 L7.47306728,10.2281019 C7.47314716,10.6088641 7.78314047,10.9186178 8.16342343,10.9186178 Z" id="Path"></Path>
+                    <Path d="M19.4416366,16.4245335 L21.5456933,16.4245335 C21.9266152,16.4245335 22.2359695,16.1146999 22.2359695,15.7341773 L22.2359695,13.6306 C22.2359695,13.2495981 21.9266152,12.9399243 21.5456933,12.9399243 L19.4416366,12.9399243 C19.0611141,12.9399243 18.7517597,13.249678 18.7517597,13.6306 L18.7517597,15.7341773 C18.7518396,16.1146999 19.0615933,16.4245335 19.4416366,16.4245335 Z" id="Path"></Path>
+                    <Path d="M0,2.11763531 L0,21.8823647 C0,23.0516489 0.94819134,24 2.11763531,24 L21.8823647,24 C23.0516489,24 24,23.0516489 24,21.8823647 L24,2.11763531 C24,0.948430963 23.0516489,0 21.8823647,0 L2.11763531,0 C0.947712092,0 0,0.94803159 0,2.11763531 Z M18.3282646,2.61876853 C18.3282646,2.00373414 18.8270815,1.50475753 19.4425153,1.50475753 L21.5460926,1.50475753 C22.1610472,1.50475753 22.659864,2.00333476 22.659864,2.61876853 L22.659864,4.72234592 C22.659864,5.33738031 22.1615264,5.83635692 21.5460926,5.83635692 L19.4425153,5.83635692 C18.8274809,5.83635692 18.3282646,5.33769981 18.3282646,4.72234592 L18.3282646,2.61876853 L18.3282646,2.61876853 Z M18.3282646,8.12460437 C18.3282646,7.50956998 18.8270815,7.01059337 19.4425153,7.01059337 L21.5460926,7.01059337 C22.1610472,7.01059337 22.659864,7.5091706 22.659864,8.12460437 L22.659864,10.2281818 C22.659864,10.8432162 22.1615264,11.3421928 21.5460926,11.3421928 L19.4425153,11.3421928 C18.8274809,11.3421928 18.3282646,10.8436155 18.3282646,10.2281818 L18.3282646,8.12460437 L18.3282646,8.12460437 Z M18.3282646,13.6306 C18.3282646,13.0151662 18.8270815,12.5164292 19.4425153,12.5164292 L21.5460926,12.5164292 C22.1610472,12.5164292 22.659864,13.0151662 22.659864,13.6306 L22.659864,15.7341773 C22.659864,16.3487325 22.1615264,16.8479487 21.5460926,16.8479487 L19.4425153,16.8479487 C18.8274809,16.8479487 18.3282646,16.3496111 18.3282646,15.7341773 L18.3282646,13.6306 L18.3282646,13.6306 Z M18.3282646,19.1365157 C18.3282646,18.5210819 18.8270815,18.022265 19.4425153,18.022265 L21.5460926,18.022265 C22.1610472,18.022265 22.659864,18.5210819 22.659864,19.1365157 L22.659864,21.2400931 C22.659864,21.8546482 22.1615264,22.3538644 21.5460926,22.3538644 L19.4425153,22.3538644 C18.8274809,22.3538644 18.3282646,21.8555268 18.3282646,21.2400931 L18.3282646,19.1365157 L18.3282646,19.1365157 Z M12.6185089,2.61876853 C12.6185089,2.00373414 13.1168466,1.50475753 13.7322803,1.50475753 L15.8358577,1.50475753 C16.4508921,1.50475753 16.9501083,2.00333476 16.9501083,2.61876853 L16.9501083,4.72234592 C16.9501083,5.33738031 16.4512915,5.83635692 15.8358577,5.83635692 L13.7318809,5.83635692 C13.1168466,5.83635692 12.6180297,5.33769981 12.6180297,4.72234592 L12.6180297,2.61876853 L12.6185089,2.61876853 Z M12.6185089,8.12460437 C12.6185089,7.50956998 13.1168466,7.01059337 13.7322803,7.01059337 L15.8358577,7.01059337 C16.4508921,7.01059337 16.9501083,7.5091706 16.9501083,8.12460437 L16.9501083,10.2281818 C16.9501083,10.8432162 16.4512915,11.3421928 15.8358577,11.3421928 L13.7318809,11.3421928 C13.1168466,11.3421928 12.6180297,10.8436155 12.6180297,10.2281818 L12.6180297,8.12460437 L12.6185089,8.12460437 Z M12.6185089,13.6306 C12.6185089,13.0151662 13.1168466,12.5164292 13.7322803,12.5164292 L15.8358577,12.5164292 C16.4508921,12.5164292 16.9501083,13.0151662 16.9501083,13.6306 L16.9501083,15.7341773 C16.9501083,16.3487325 16.4512915,16.8479487 15.8358577,16.8479487 L13.7318809,16.8479487 C13.1168466,16.8479487 12.6180297,16.3496111 12.6180297,15.7341773 L12.6180297,13.6306 L12.6185089,13.6306 Z M12.6185089,19.1365157 C12.6185089,18.5210819 13.1168466,18.022265 13.7322803,18.022265 L15.8358577,18.022265 C16.4508921,18.022265 16.9501083,18.5210819 16.9501083,19.1365157 L16.9501083,21.2400931 C16.9501083,21.8546482 16.4512915,22.3538644 15.8358577,22.3538644 L13.7318809,22.3538644 C13.1168466,22.3538644 12.6180297,21.8555268 12.6180297,21.2400931 L12.6180297,19.1365157 L12.6185089,19.1365157 Z M7.04957217,2.61876853 C7.04957217,2.00373414 7.54798966,1.50475753 8.16342343,1.50475753 L10.2671606,1.50475753 C10.8819553,1.50475753 11.3810118,2.00333476 11.3810118,2.61876853 L11.3810118,4.72234592 C11.3810118,5.33738031 10.8824346,5.83635692 10.2671606,5.83635692 L8.16342343,5.83635692 C7.54862865,5.83635692 7.04957217,5.33769981 7.04957217,4.72234592 L7.04957217,2.61876853 L7.04957217,2.61876853 Z M7.04957217,8.12460437 C7.04957217,7.50956998 7.54798966,7.01059337 8.16342343,7.01059337 L10.2671606,7.01059337 C10.8819553,7.01059337 11.3810118,7.5091706 11.3810118,8.12460437 L11.3810118,10.2281818 C11.3810118,10.8432162 10.8824346,11.3421928 10.2671606,11.3421928 L8.16342343,11.3421928 C7.54862865,11.3421928 7.04957217,10.8436155 7.04957217,10.2281818 L7.04957217,8.12460437 L7.04957217,8.12460437 Z M7.04957217,13.6306 C7.04957217,13.0151662 7.54798966,12.5164292 8.16342343,12.5164292 L10.2671606,12.5164292 C10.8819553,12.5164292 11.3810118,13.0151662 11.3810118,13.6306 L11.3810118,15.7341773 C11.3810118,16.3487325 10.8824346,16.8479487 10.2671606,16.8479487 L8.16342343,16.8479487 C7.54862865,16.8479487 7.04957217,16.3496111 7.04957217,15.7341773 L7.04957217,13.6306 L7.04957217,13.6306 Z M7.04957217,19.1365157 C7.04957217,18.5210819 7.54798966,18.022265 8.16342343,18.022265 L10.2671606,18.022265 C10.8819553,18.022265 11.3810118,18.5210819 11.3810118,19.1365157 L11.3810118,21.2400931 C11.3810118,21.8546482 10.8824346,22.3538644 10.2671606,22.3538644 L8.16342343,22.3538644 C7.54862865,22.3538644 7.04957217,21.8555268 7.04957217,21.2400931 L7.04957217,19.1365157 L7.04957217,19.1365157 Z M1.48111465,2.61876853 C1.48111465,2.00373414 1.97945226,1.50475753 2.59488603,1.50475753 L4.69870304,1.50475753 C5.31349781,1.50475753 5.81247442,2.00333476 5.81247442,2.61876853 L5.81247442,4.72234592 C5.81247442,5.33738031 5.31389718,5.83635692 4.69870304,5.83635692 L2.59488603,5.83635692 C1.97985163,5.83635692 1.48111465,5.33769981 1.48111465,4.72234592 L1.48111465,2.61876853 Z M1.48111465,8.12460437 C1.48111465,7.50956998 1.97945226,7.01059337 2.59488603,7.01059337 L4.69870304,7.01059337 C5.31349781,7.01059337 5.81247442,7.5091706 5.81247442,8.12460437 L5.81247442,10.2281818 C5.81247442,10.8432162 5.31389718,11.3421928 4.69870304,11.3421928 L2.59488603,11.3421928 C1.97985163,11.3421928 1.48111465,10.8436155 1.48111465,10.2281818 L1.48111465,8.12460437 Z M1.48111465,13.6306 C1.48111465,13.0151662 1.97945226,12.5164292 2.59488603,12.5164292 L4.69870304,12.5164292 C5.31349781,12.5164292 5.81247442,13.0151662 5.81247442,13.6306 L5.81247442,15.7341773 C5.81247442,16.3487325 5.31389718,16.8479487 4.69870304,16.8479487 L2.59488603,16.8479487 C1.97985163,16.8479487 1.48111465,16.3496111 1.48111465,15.7341773 L1.48111465,13.6306 Z M1.48111465,19.1365157 C1.48111465,18.5210819 1.97945226,18.022265 2.59488603,18.022265 L4.69870304,18.022265 C5.31349781,18.022265 5.81247442,18.5210819 5.81247442,19.1365157 L5.81247442,21.2400931 C5.81247442,21.8546482 5.31389718,22.3538644 4.69870304,22.3538644 L2.59488603,22.3538644 C1.97985163,22.3538644 1.48111465,21.8555268 1.48111465,21.2400931 L1.48111465,19.1365157 Z" id="Shape"></Path>
+                </G>
             </G>
         </Svg>
     )
@@ -1281,9 +1289,9 @@ const SquaresIcon = ({ color, size }:IconProps) => {
 const OwnedSquareIcon = ({ color, size }:IconProps) => {
     return (
-        <Svg width={`${size ?? 14}`} height={`${size ?? 14}`}  viewBox="0 0 20 19">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
-                <G id="square-user-check-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color ?? Colors.brand.midnight} stroke-width="2">
+        <Svg width={`${size ?? 14}`} height={`${size ?? 14}`} viewBox="0 0 20 19">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round">
+                <G id="square-user-check-svgrepo-com" transform="translate(1.000000, 1.000000)" stroke={color ?? Colors.brand.midnight} strokeWidth="2">
                     <Path d="M11.6470588,14.8235294 L13.7647059,16.9411765 L18,12.7058824 M7.41176471,16.9411765 L3.38823529,16.9411765 C2.20224706,16.9411765 1.60924235,16.9411765 1.15625647,16.7103529 C0.757789412,16.5073765 0.433831765,16.1833765 0.230812941,15.7849412 C0,15.3319765 0,14.7389294 0,13.5529412 L0,3.38823529 C0,2.20224706 0,1.60924235 0.230812941,1.15625647 C0.433831765,0.757789412 0.757789412,0.433831765 1.15625647,0.230812941 C1.60924235,0 2.20224706,0 3.38823529,0 L13.5529412,0 C14.7389294,0 15.3319765,0 15.7849412,0.230812941 C16.1833765,0.433831765 16.5073765,0.757789412 16.7103529,1.15625647 C16.9411765,1.60924235 16.9411765,2.20224706 16.9411765,3.38823529 L16.9411765,8.47058824 M3.17647059,16.9411765 C3.17647059,16.5785294 3.21292588,16.2244588 3.28237412,15.8823529 C3.77289529,13.4659059 5.90933647,11.6470588 8.47058824,11.6470588 M10.5882353,6.35294118 C10.5882353,7.52251765 9.64016471,8.47058824 8.47058824,8.47058824 C7.30101176,8.47058824 6.35294118,7.52251765 6.35294118,6.35294118 C6.35294118,5.18339647 7.30101176,4.23529412 8.47058824,4.23529412 C9.64016471,4.23529412 10.5882353,5.18339647 10.5882353,6.35294118 Z" id="Shape"></Path>
                 </G>
             </G>
@@ -1298,7 +1306,7 @@ const SelectorIcon = ({ color, size }:IconProps) => {
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 13 20">
-        <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
             <G id="select-svgrepo-com" fill={color ?? Colors.brand.midnight} fill-rule="nonzero">
                 <Path d="M0,3.33333333 C0,1.49533333 1.49533333,0 3.33333333,0 C5.17133333,0 6.66666667,1.49533333 6.66666667,3.33333333 C6.66666667,4.418 6.138,5.374 5.33333333,5.98266667 L5.33333333,3.33333333 C5.33333333,2.23066667 4.436,1.33333333 3.33333333,1.33333333 C2.23066667,1.33333333 1.33333333,2.23066667 1.33333333,3.33333333 L1.33333333,5.98266667 C0.528666667,5.374 0,4.418 0,3.33333333 Z M11.3333333,8 C10.5973333,8 10,8.59733333 10,9.33333333 L10,8.66666667 C10,7.93066667 9.40266667,7.33333333 8.66666667,7.33333333 C7.93066667,7.33333333 7.33333333,7.93066667 7.33333333,8.66666667 L7.33333333,8 C7.33333333,7.264 6.736,6.66666667 6,6.66666667 C5.264,6.66666667 4.66666667,7.264 4.66666667,8 L4.66666667,3.33333333 C4.66666667,2.59733333 4.06933333,2 3.33333333,2 C2.59733333,2 2,2.59733333 2,3.33333333 L2,10.1846667 C1.80333333,10.0706667 1.57733333,10 1.33333333,10 C0.597333333,10 0,10.5973333 0,11.3333333 L0,13.3333333 C0,13.636 0.103333333,13.93 0.292,14.166 L2.66666667,18 L10.6666667,18 L12.1953333,15.8046667 C12.4546667,15.5453333 12.6666667,15.0333333 12.6666667,14.6666667 L12.6666667,9.33333333 C12.6666667,8.59733333 12.0693333,8 11.3333333,8 Z M2.66666667,18.6666667 L2.66666667,19.3333333 C2.66666667,19.7013333 2.96466667,20 3.33333333,20 L10,20 C10.3686667,20 10.6666667,19.7013333 10.6666667,19.3333333 L10.6666667,18.6666667 L2.66666667,18.6666667 Z" id="Shape"></Path>
             </G>
@@ -1310,7 +1318,7 @@ const SelectorIcon = ({ color, size }:IconProps) => {
 const InstagramIcon = ({ size }: IconProps) => {
     return (
         <Svg width={`${size ?? 18}`} height={`${size ?? 18}`} viewBox="0 0 24 24">
-            <G id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="Page-1" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="instagram-167-svgrepo-com" fill={'#fccc63'} fill-rule="nonzero">
                     <Path d="M7.04358393,0.14727253 C5.09012398,0.235412546 3.39696687,0.713036633 2.02978382,2.07444888 C0.657824771,3.44301313 0.186176686,5.14269344 0.0978170697,7.07583379 C0.0428906598,8.28241001 -0.278307399,17.3978157 0.653048771,19.7883361 C1.28111688,21.4010644 2.51814911,22.6409886 4.14563381,23.2710727 C4.90504674,23.5664648 5.7719245,23.7665648 7.04358393,23.8249328 C17.6765639,24.3061329 21.618111,24.0440889 23.2802229,19.7883361 C23.5751517,19.0308 23.7781402,18.1648798 23.8342606,16.8963716 C24.3202367,6.23612164 23.755453,3.92540122 21.9022938,2.07444888 C20.4324232,0.608216614 18.7034436,-0.389907567 7.04358393,0.14727253 M7.14149555,21.6809764 C5.97730094,21.6285604 5.34564962,21.4344124 4.92415195,21.2712364 C3.86383895,20.8591203 3.06740961,20.0658601 2.65785193,19.011744 C1.94858821,17.1953276 2.18381585,8.56827406 2.24710026,7.17231381 C2.30919067,5.80493756 2.58620952,4.55548533 3.5509989,3.59070916 C4.74504471,2.39961294 6.28775179,1.81598083 16.7917761,2.29004092 C18.1625412,2.35197293 19.4150954,2.62830898 20.3822728,3.59070916 C21.5763186,4.78179337 22.1685655,6.33616565 21.6861714,16.7998916 C21.633633,17.9612038 21.4390037,18.5912879 21.2754197,19.011744 C20.1948075,21.7810205 17.7088031,22.1657405 7.14149555,21.6809764 M16.9075989,5.62746953 C16.9075989,6.41597767 17.548801,7.05677779 18.3404544,7.05677779 C19.1321065,7.05677779 19.7745038,6.41597767 19.7745038,5.62746953 C19.7745038,4.83897338 19.1321065,4.19816127 18.3404544,4.19816127 C17.548801,4.19816127 16.9075989,4.83897338 16.9075989,5.62746953 M5.83520891,11.9855027 C5.83520891,15.3634313 8.58032101,18.1017478 11.9666352,18.1017478 C15.3529506,18.1017478 18.0980627,15.3634313 18.0980627,11.9855027 C18.0980627,8.60757407 15.3529506,5.87045757 11.9666352,5.87045757 C8.58032101,5.87045757 5.83520891,8.60757407 5.83520891,11.9855027 M7.9868801,11.9855027 C7.9868801,9.79390628 9.76839683,8.01560196 11.9666352,8.01560196 C14.1648748,8.01560196 15.9463915,9.79390628 15.9463915,11.9855027 C15.9463915,14.1782991 14.1648748,15.9565914 11.9666352,15.9565914 C9.76839683,15.9565914 7.9868801,14.1782991 7.9868801,11.9855027" id="instagram-[#167]"></Path>
                 </G>
@@ -1326,7 +1334,7 @@ const LiquidityIcon = ({ color, size }:IconProps) => {
     return (
         <Svg width={`${width}px`} height={`${height}px`}  viewBox="0 0 18 17">
-            <G id="ss" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="ss" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="exchange-dollar-svgrepo-com" transform="translate(0.000000, 0.000000)" fill={color??Colors.brand.midnight} fill-rule="nonzero">
                     <Path d="M15.773049,12.4927553 C14.0612582,15.1274121 10.9789335,16.532799 7.86733523,16.0973679 C4.75573693,15.6619368 2.17759358,13.4644349 1.25477308,10.4610957 C1.19184557,10.2633235 1.15588699,10.0565617 1.11093877,9.84979984 C0.809350943,9.92615094 0.489724403,9.84114389 0.26591218,9.62505873 C0.0957268356,9.45626323 0,9.22649163 0,8.98679396 C0,8.74709629 0.0957268356,8.5173247 0.26591218,8.3485292 L1.16487664,7.44956474 C1.33367214,7.2793794 1.56344373,7.18365256 1.8031414,7.18365256 C2.04283907,7.18365256 2.27261066,7.2793794 2.44140616,7.44956474 L3.34037062,8.3485292 C3.51055596,8.5173247 3.6062828,8.74709629 3.6062828,8.98679396 C3.6062828,9.22649163 3.51055596,9.45626323 3.34037062,9.62505873 C3.22860907,9.72404371 3.09673444,9.79764815 2.9538159,9.8408102 C2.94985586,9.87064484 2.94985586,9.90087199 2.9538159,9.93070664 C3.76632497,12.5835598 6.2203864,14.391239 8.99485705,14.3805807 C11.1210172,14.3788188 13.1025131,13.303536 14.2627888,11.5218737 C14.4275544,11.2330323 14.738309,11.0587382 15.0706897,11.0687433 C15.4030705,11.0787483 15.702779,11.2714181 15.8498731,11.5696469 C15.9969672,11.8678756 15.9674172,12.2229442 15.773049,12.4927553 L15.773049,12.4927553 Z M17.7238019,6.55060029 C17.4962805,6.33458773 17.1726027,6.25281649 16.8697857,6.33484882 C16.8248375,6.12808699 16.7978685,5.91233552 16.734941,5.71456334 C15.8121205,2.71122411 13.2339772,0.513722236 10.1223789,0.0782911427 C7.01078057,-0.357139951 3.92845589,1.04824689 2.21666505,3.68290367 C1.9798217,4.09810056 2.10931386,4.62603855 2.51139649,4.88452024 C2.91347912,5.14300193 3.44752956,5.04162704 3.72692534,4.65378528 C4.88720097,2.87212299 6.8686969,1.79684022 8.99485705,1.79507831 C11.7717,1.80230249 14.2155523,3.628799 15.0089293,6.28990059 C15.0128893,6.31973524 15.0128893,6.34996239 15.0089293,6.37979704 C14.8651823,6.42098669 14.7328922,6.49482304 14.6223745,6.59554851 C14.4521892,6.76434401 14.3564624,6.99411561 14.3564624,7.23381327 C14.3564624,7.47351094 14.4521892,7.70328254 14.6223745,7.87207804 L15.521339,8.77104249 C15.6901345,8.94122784 15.9199061,9.03695467 16.1596038,9.03695467 C16.3993014,9.03695467 16.629073,8.94122784 16.7978685,8.77104249 L17.696833,7.87207804 C17.8848351,7.70568518 17.9946899,7.46825545 17.9998126,7.21724723 C18.0049352,6.966239 17.9048587,6.72452496 17.7238019,6.55060029 Z" id="secondary"></Path>
                     <Path d="M9.44433928,7.18886505 L8.54537482,7.18886505 C8.29713264,7.18886505 8.09589259,6.987625 8.09589259,6.73938282 C8.09589259,6.49114064 8.29713264,6.28990059 8.54537482,6.28990059 L10.792786,6.28990059 C11.2892703,6.28990059 11.6917504,5.8874205 11.6917504,5.39093614 C11.6917504,4.89445178 11.2892703,4.49197168 10.792786,4.49197168 L9.8938215,4.49197168 C9.8938215,3.99548732 9.49134141,3.59300723 8.99485705,3.59300723 C8.49837269,3.59300723 8.09589259,3.99548732 8.09589259,4.49197168 L8.09589259,4.5369199 C6.96436928,4.76668252 6.19104593,5.81647644 6.30708325,6.96524587 C6.42312057,8.1140153 7.39076037,8.98795435 8.54537482,8.98679396 L9.44433928,8.98679396 C9.69258146,8.98679396 9.8938215,9.18803401 9.8938215,9.43627619 C9.8938215,9.68451837 9.69258146,9.88575842 9.44433928,9.88575842 L7.19692814,9.88575842 C6.70044378,9.88575842 6.29796368,10.2882385 6.29796368,10.7847229 C6.29796368,11.2812072 6.70044378,11.6836873 7.19692814,11.6836873 L8.09589259,11.6836873 C8.09589259,12.1801717 8.49837269,12.5826518 8.99485705,12.5826518 C9.49134141,12.5826518 9.8938215,12.1801717 9.8938215,11.6836873 C11.1350324,11.5595662 12.0406126,10.452746 11.9164915,9.21153508 C11.7923704,7.9703242 10.6855502,7.06474399 9.44433928,7.18886505 Z" id="primary"></Path>
@@ -1339,7 +1347,7 @@ const LiquidityIcon = ({ color, size }:IconProps) => {
 const PickEmIcon = ({ color, size }:IconProps) => {
     return (
         <Svg width={`${size ?? 18}`} height={`${size ?? 18}`} viewBox="0 0 25 25">
-            <G id="ss" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="ss" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="select-category-svgrepo-com" transform="translate(0.666667, 0.666667)" fill={color??Colors.brand.midnight} fill-rule="nonzero">
                     <Path d="M10.8,20.4 L10.8,16.8 C10.8,14.8117749 9.1882251,13.2 7.2,13.2 L3.6,13.2 C1.6117749,13.2 0,14.8117749 0,16.8 L0,20.4 C0,22.3882251 1.6117749,24 3.6,24 L7.2,24 C9.1882251,24 10.8,22.3882251 10.8,20.4 Z M1.2,20.4 L1.2,16.8 C1.2,15.4745166 2.2745166,14.4 3.6,14.4 L7.2,14.4 C8.5254834,14.4 9.6,15.4745166 9.6,16.8 L9.6,20.4 C9.6,21.7254834 8.5254834,22.8 7.2,22.8 L3.6,22.8 C2.2745166,22.8 1.2,21.7254834 1.2,20.4 Z M24,16.8 C24,14.8117749 22.3882251,13.2 20.4,13.2 L16.8,13.2 C14.8117749,13.2 13.2,14.8117749 13.2,16.8 L13.2,20.4 C13.2,22.3882251 14.8117749,24 16.8,24 L20.4,24 C22.3882251,24 24,22.3882251 24,20.4 L24,16.8 Z M22.8,20.4 C22.8,21.7254834 21.7254834,22.8 20.4,22.8 L16.8,22.8 C15.4745166,22.8 14.4,21.7254834 14.4,20.4 L14.4,16.8 C14.4,15.4745166 15.4745166,14.4 16.8,14.4 L20.4,14.4 C21.7254834,14.4 22.8,15.4745166 22.8,16.8 L22.8,20.4 Z M24,3.6 C24,1.6117749 22.3882251,0 20.4,0 L16.8,0 C14.8117749,0 13.2,1.6117749 13.2,3.6 L13.2,7.2 C13.2,9.1882251 14.8117749,10.8 16.8,10.8 L20.4,10.8 C22.3882251,10.8 24,9.1882251 24,7.2 L24,3.6 Z M22.8,7.2 C22.8,8.5254834 21.7254834,9.6 20.4,9.6 L16.8,9.6 C15.4745166,9.6 14.4,8.5254834 14.4,7.2 L14.4,3.6 C14.4,2.2745166 15.4745166,1.2 16.8,1.2 L20.4,1.2 C21.7254834,1.2 22.8,2.2745166 22.8,3.6 L22.8,7.2 Z M0,3.6 L0,7.2 C0,9.1882251 1.6117749,10.8 3.6,10.8 L7.2,10.8 C9.1882251,10.8 10.8,9.1882251 10.8,7.2 L10.8,3.6 C10.8,1.6117749 9.1882251,0 7.2,0 L3.6,0 C1.6117749,0 0,1.6117749 0,3.6 Z M1.2,3.6 C1.2,2.2745166 2.2745166,1.2 3.6,1.2 L7.2,1.2 C8.5254834,1.2 9.6,2.2745166 9.6,3.6 L9.6,7.2 C9.6,8.5254834 8.5254834,9.6 7.2,9.6 L3.6,9.6 C2.2745166,9.6 1.2,8.5254834 1.2,7.2 L1.2,3.6 Z M9,17.0856 L4.8684,21.2016 L2.682,19.0152 L3.5676,18.1296 L4.8684,19.4352 L8.1144,16.2 L9,17.0856 Z M21.744,3.8016 L17.6124,7.9176 L15.426,5.7312 L16.3116,4.8456 L17.6124,6.1512 L20.8584,2.916 L21.744,3.8016 Z" id="Shape"></Path>
                 </G>
@@ -1355,7 +1363,7 @@ const MarketClosedIcon = ({color, size}:IconProps) => {
     return (
         <Svg width={`${width}px`} height={`${height}px`} viewBox="0 0 24 21">
-            <G id="ss" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="ss" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="closed-svgrepo-com" fill={color??Colors.brand.midnight} fill-rule="nonzero">
                     <Path d="M22.3671706,9.53779698 L20.8694773,9.53779698 L13.0909374,1.75925702 C13.1721641,1.59612959 13.2181425,1.41242333 13.2181425,1.21814255 C13.2181425,0.546453564 12.671689,0 12,0 C11.328311,0 10.7818575,0.546453564 10.7818575,1.21814255 C10.7818575,1.41242333 10.8278359,1.59612959 10.9090626,1.75925702 L3.13052268,9.53779698 L1.63282937,9.53779698 C0.732492441,9.53779698 0,10.2702894 0,11.1706263 L0,18.6349892 C0,19.5353261 0.732492441,20.2678186 1.63282937,20.2678186 L22.3671706,20.2678186 C23.2675076,20.2678186 24,19.5353261 24,18.6349892 L24,11.1706263 C24,10.2702894 23.2675076,9.53779698 22.3671706,9.53779698 Z M12,0.777537797 C12.2429546,0.777537797 12.4406048,0.975187905 12.4406048,1.21814255 C12.4406048,1.46109719 12.2429546,1.6587473 12,1.6587473 C11.7570454,1.6587473 11.5593952,1.46109719 11.5593952,1.21814255 C11.5593952,0.975187905 11.7570454,0.777537797 12,0.777537797 Z M11.4588855,2.30907991 C11.622013,2.3903067 11.8057192,2.4362851 12,2.4362851 C12.1942808,2.4362851 12.377987,2.3903067 12.5411145,2.30907991 L19.7698315,9.53779698 L4.23016847,9.53779698 L11.4588855,2.30907991 Z M23.2224622,18.6349892 C23.2224622,19.1066436 22.8387732,19.4902808 22.3671706,19.4902808 L1.63282937,19.4902808 C1.16122678,19.4902808 0.777537797,19.1066436 0.777537797,18.6349892 L0.777537797,11.1706263 C0.777537797,10.6989719 1.16122678,10.3153348 1.63282937,10.3153348 L22.3671706,10.3153348 C22.8387732,10.3153348 23.2224622,10.6989719 23.2224622,11.1706263 L23.2224622,18.6349892 Z" id="Shape"></Path>
                     <Path d="M3.29157667,13.2181425 C3.65396112,13.2181425 3.97829806,13.4476199 4.09860907,13.7892181 C4.16993521,13.9916371 4.39205184,14.0979525 4.59441901,14.02673 C4.79694168,13.9553521 4.90325702,13.7333909 4.83193089,13.5308683 C4.60224622,12.8787214 3.98322246,12.4406048 3.29157667,12.4406048 C2.39123974,12.4406048 1.6587473,13.1730972 1.6587473,14.0734341 L1.6587473,15.7321814 C1.6587473,16.6325184 2.39123974,17.3650108 3.29157667,17.3650108 C3.98239309,17.3650108 4.6012095,16.9276199 4.83136069,16.2765616 C4.90289417,16.0741425 4.79683801,15.8520259 4.59441901,15.7804406 C4.392,15.708959 4.16988337,15.8149633 4.09829806,16.0173823 C3.97772786,16.3583585 3.65354644,16.587473 3.29157667,16.587473 C2.81997408,16.587473 2.4362851,16.203784 2.4362851,15.7321814 L2.4362851,14.0734341 C2.4362851,13.6018315 2.81997408,13.2181425 3.29157667,13.2181425 Z" id="Path"></Path>
@@ -1373,7 +1381,7 @@ const MarketClosedIcon = ({color, size}:IconProps) => {
 const ChatIcon = ({ color, size }:IconProps) => {
     return (
         <Svg width={`${size ?? 18}`} height={`${size ?? 18}`} viewBox="0 0 24 24" fill="none">
-            <Path d="M17 3.33782C15.5291 2.48697 13.8214 2 12 2C6.47715 2 2 6.47715 2 12C2 13.5997 2.37562 15.1116 3.04346 16.4525C3.22094 16.8088 3.28001 17.2161 3.17712 17.6006L2.58151 19.8267C2.32295 20.793 3.20701 21.677 4.17335 21.4185L6.39939 20.8229C6.78393 20.72 7.19121 20.7791 7.54753 20.9565C8.88837 21.6244 10.4003 22 12 22C17.5228 22 22 17.5228 22 12C22 10.1786 21.513 8.47087 20.6622 7" stroke={color ?? Colors.brand.midnight} stroke-width="1.5" stroke-linecap="round"/>
+            <Path d="M17 3.33782C15.5291 2.48697 13.8214 2 12 2C6.47715 2 2 6.47715 2 12C2 13.5997 2.37562 15.1116 3.04346 16.4525C3.22094 16.8088 3.28001 17.2161 3.17712 17.6006L2.58151 19.8267C2.32295 20.793 3.20701 21.677 4.17335 21.4185L6.39939 20.8229C6.78393 20.72 7.19121 20.7791 7.54753 20.9565C8.88837 21.6244 10.4003 22 12 22C17.5228 22 22 17.5228 22 12C22 10.1786 21.513 8.47087 20.6622 7" stroke={color ?? Colors.brand.midnight} strokeWidth="1.5" stroke-linecap="round"/>
         </Svg>
     )
 }
@@ -1381,11 +1389,11 @@ const ChatIcon = ({ color, size }:IconProps) => {
 const QuestionIcon = ({ color, size }:IconProps) => {
     return (
         <Svg width={`${size ?? 18}`} height={`${size ?? 18}`} viewBox="0 0 26 26">
-            <G id="ss" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+            <G id="ss" stroke="none" strokeWidth="1" fill="none" fill-rule="evenodd">
                 <G id="question-circle-svgrepo-com" transform="translate(1.000000, 1.000000)">
-                    <Path d="M9.75,8.25 C9.75,7.007364 10.7574,6 12,6 C13.2426,6 14.25,7.007364 14.25,8.25 C14.25,9.07494 13.806,9.7962 13.14408,10.18788 C12.5736,10.52532 12,11.03724 12,11.7 L12,13.2" id="Path" stroke={color ?? Colors.brand.midnight} stroke-width="2" stroke-linecap="round"></Path>
+                    <Path d="M9.75,8.25 C9.75,7.007364 10.7574,6 12,6 C13.2426,6 14.25,7.007364 14.25,8.25 C14.25,9.07494 13.806,9.7962 13.14408,10.18788 C12.5736,10.52532 12,11.03724 12,11.7 L12,13.2" id="Path" stroke={color ?? Colors.brand.midnight} strokeWidth="2" stroke-linecap="round"></Path>
                     <Circle id="Oval" fill={color ?? Colors.brand.midnight} fill-rule="nonzero" cx="12" cy="16.8" r="1.2"></Circle>
-                    <Path d="M6,1.605384 C7.765044,0.584364 9.81432,0 12,0 C18.62736,0 24,5.37258 24,12 C24,18.62736 18.62736,24 12,24 C5.37258,24 0,18.62736 0,12 C0,9.81432 0.584364,7.765044 1.605384,6" id="Path" stroke={color ?? Colors.brand.midnight} stroke-width="2" stroke-linecap="round"></Path>
+                    <Path d="M6,1.605384 C7.765044,0.584364 9.81432,0 12,0 C18.62736,0 24,5.37258 24,12 C24,18.62736 18.62736,24 12,24 C5.37258,24 0,18.62736 0,12 C0,9.81432 0.584364,7.765044 1.605384,6" id="Path" stroke={color ?? Colors.brand.midnight} strokeWidth="2" stroke-linecap="round"></Path>
                 </G>
             </G>
         </Svg>
@@ -1426,6 +1434,7 @@ export default {
     SelectorIcon,
     CloseIcon,
     BettorEdgeIcon,
+    LeaderboardIcon,
     BirthdayIcon,
     CheckIcon,
     LogoutIcon,