Merge pull request #1161 from ethereum/rc-1149

Fixed #1149

Author: samajammin

src/components/Footer.js

@@ -62,8 +62,14 @@ const ListItem = styled.li`
 
 const FooterLink = styled(Link)`
   color: ${(props) => props.theme.colors.text200};
+  &:after {
+    color: ${(props) => props.theme.colors.text200};
+  }
   &:hover {
     color: ${(props) => props.theme.colors.primary};
+    &:after {
+      color: ${(props) => props.theme.colors.primary};
+    }
   }
 `
 

src/components/Link.js

@@ -8,6 +8,7 @@ import { languageMetadata } from "../utils/translations"
 // TODO set globally to apply to markdown files
 const ExternalLink = styled.a`
   &:after {
+    color: ${(props) => props.theme.colors.primary};
     margin-left: 0.125em;
     margin-right: 0.3em;
     display: inline-block;

src/components/MeetupList.js

@@ -246,13 +246,14 @@ const Table = styled.div`
 `
 
 const Item = styled(Link)`
+  display: flex;
+  justify-content: space-between;
   color: ${(props) => props.theme.colors.text} !important;
   box-shadow: 0 1px 1px ${(props) => props.theme.colors.tableItemBoxShadow};
   margin-bottom: 1px;
   padding: 1rem;
   width: 100%;
   color: #000;
-  display: flex;
 
   &:hover {
     border-radius: 4px;
@@ -268,10 +269,25 @@ const ItemNumber = styled.div`
 const ItemTitle = styled.div``
 const ItemDesc = styled.p`
   margin-bottom: 0;
-  margin-left: auto;
+  opacity: 0.6;
+`
+
+const Flag = styled(Twemoji)`
+  margin-right: 0.5rem;
+`
+
+const RightContainer = styled.div`
+  display: flex;
+  align-items: right;
+  align-content: flex-start;
+  width: 25%;
+  margin-right: 1rem;
+  flex-wrap: wrap;
 `
 const LeftContainer = styled.div`
   display: flex;
+  width: 75%;
+  margin-right: 2rem;
 `
 // TODO create generalized CardList / TableCard
 // TODO prop if ordered list or unordered
@@ -285,9 +301,10 @@ const MeetupList = () => {
               <ItemNumber>{idx + 1}</ItemNumber>
               <ItemTitle>{meetup.title}</ItemTitle>
             </LeftContainer>
-            <ItemDesc>
-              <Twemoji svg text={meetup.emoji} /> {meetup.location}
-            </ItemDesc>
+            <RightContainer>
+              <Flag svg text={meetup.emoji} />
+              <ItemDesc>{meetup.location}</ItemDesc>
+            </RightContainer>
           </Item>
         )
       })}