Profile extra info in correct order and in single line

ONEARMY · Sep 6, 2020 · 03b17a9 · 03b17a9
1 parent 8b6e0c7
commit 03b17a9
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 7 deletions.
diff --git a/src/components/ElWithBeforeIcon/index.tsx b/src/components/ElWithBeforeIcon/index.tsx
@@ -8,6 +8,7 @@ interface IProps {
   width?: string
   ticked?: boolean
   contain?: boolean
+  mr?: number
 }
 
 export const ElWithBeforeIcon: FunctionComponent<IProps> = ({
@@ -17,6 +18,7 @@ export const ElWithBeforeIcon: FunctionComponent<IProps> = ({
   children,
   ticked,
   contain,
+  mr,
 }) => {
   let after: any
   if (ticked) {
@@ -35,7 +37,7 @@ export const ElWithBeforeIcon: FunctionComponent<IProps> = ({
 
   return (
     <Box
-      mr={4}
+      mr={mr || 4}
       pl="30px"
       sx={{
         position: 'relative',

diff --git a/src/pages/User/content/UserPage/UserPage.tsx b/src/pages/User/content/UserPage/UserPage.tsx
@@ -256,17 +256,17 @@ export class UserPage extends React.Component<
             </ElWithBeforeIcon>
           </UserStatsBoxItem>
          )} */}
-        {user._stats.eventCount > 0 && (
+        {user._stats.howToCount > 0 && (
           <UserStatsBoxItem>
-            <ElWithBeforeIcon IconUrl={EventsIcon}>
-              How-to: {user._stats.eventCount}
+            <ElWithBeforeIcon IconUrl={HowToCountIcon} mr={2}>
+              How-to: {user._stats.howToCount}
             </ElWithBeforeIcon>
           </UserStatsBoxItem>
         )}
-        {user._stats.howToCount > 0 && (
+        {user._stats.eventCount > 0 && (
           <UserStatsBoxItem>
-            <ElWithBeforeIcon IconUrl={HowToCountIcon}>
-              Events: {user._stats.howToCount}
+            <ElWithBeforeIcon IconUrl={EventsIcon} mr={2}>
+              Events: {user._stats.eventCount}
             </ElWithBeforeIcon>
           </UserStatsBoxItem>
         )}