Blog Page (codesandbox#1611)

* add structure

* add things

* need to reclone

* add markdown as pages

* add markdown to feed

* no repeat css

* make mobile

* delete dummy post

* delete rel

* fix gatsby

* add header

* review fixes

* Style tweaks

* Font fallback

Author: SaraVieira

packages/app/src/app/pages/Profile/Header/UserInfo/Stats/Badges/index.js

@@ -11,9 +11,7 @@ function Badges({ badges, username }) {
   return (
     <Margin style={{ display: 'flex', alignItems: 'center' }} right={2}>
       <Link to={patronUrl()}>
-        {badges.map(badge => (
-          <Badge key={badge.id} badge={badge} size={64} />
-        ))}
+        {badges.map(badge => <Badge key={badge.id} badge={badge} size={64} />)}
       </Link>
 
       <ContributorsBadge

packages/app/src/app/pages/Sandbox/Editor/Header/ViewMode/index.tsx

@@ -20,7 +20,7 @@ const ViewButton = styled.div`
   color: white;
   font-weight: 400;
   border-radius: 4px;
-  font-family: 'Poppins';
+ font-family: 'Poppins', sans-serif;
 
   svg {
     height: 100%;

packages/app/src/app/pages/common/Modals/DeploymentModal/index.js

@@ -49,9 +49,7 @@ function DeploymentModal({ store, signals }) {
             <DeployText>Deploying sandbox...</DeployText>
             <DeployAnimationContainer deploying={store.deployment.deploying}>
               <StyledLogo width={70} height={70} />
-              {[0, 1, 2, 3].map(i => (
-                <StyledCube key={i} i={i} size={20} />
-              ))}
+              {[0, 1, 2, 3].map(i => <StyledCube key={i} i={i} size={20} />)}
               <StyledNowLogo backgroundColor="#24282A" />
             </DeployAnimationContainer>
           </Margin>

packages/app/src/app/pages/common/Modals/ShareModal/elements.js

@@ -76,7 +76,7 @@ export const Wrapper = styled.section`
 `;
 
 export const SideTitle = styled.span`
-  font-family: 'Poppins';
+  font-family: 'Poppins', sans-serif;
   font-weight: bold;
   font-size: 20px;
   margin-top: 20px;

packages/app/src/embed/components/App/index.js

@@ -91,7 +91,8 @@ export default class App extends React.PureComponent<
       runOnClick,
       verticalMode = window.innerWidth < window.innerHeight,
       tabs,
-    } = props.embedOptions || getSandboxOptions(document.location.href);
+    } =
+      props.embedOptions || getSandboxOptions(document.location.href);
 
     this.state = {
       notFound: false,

packages/common/src/components/FeaturedSandbox/elements.ts

@@ -71,7 +71,7 @@ export const SandboxInfo = styled.div`
 
 export const Title = styled.h1`
   margin-bottom: 0.5em;
-  font-family: 'Poppins';
+ font-family: 'Poppins', sans-serif;
   font-weight: 600;
   font-size: 2.125em;
   display: -webkit-box;
@@ -83,7 +83,7 @@ export const Title = styled.h1`
 
 export const Description = styled.p`
   color: ${theme.new.description};
-  font-family: 'Poppins';
+ font-family: 'Poppins', sans-serif;
   font-weight: 600;
   font-size: 1em;
 `;

packages/common/src/components/Navigation/index.tsx

@@ -145,13 +145,7 @@ export default class Navigation extends React.PureComponent {
             <Item href="/explore">Explore</Item>
             <Item href="/docs">Docs</Item>
 
-            <Item
-              href="https://medium.com/@compuives"
-              target="_blank"
-              rel="noopener noreferrer"
-            >
-              Blog
-            </Item>
+            <Item href="/blog">Blog</Item>
             <Item
               href="https://github.com/CompuIves/codesandbox-client"
               target="_blank"

packages/common/src/components/WideSandbox/elements.ts

@@ -52,7 +52,7 @@ export const Container = styled.div<{ small?: boolean; noMargin?: boolean }>`
 
 export const SandboxTitle = styled.h2`
   color: ${props => props.color};
-  font-family: 'Poppins';
+ font-family: 'Poppins', sans-serif;
   font-size: 1rem;
   font-weight: 600;
   margin-bottom: 6px;

packages/dynamic-pages/pages/profile/_elements.js

@@ -30,7 +30,7 @@ export const More = styled.div`
   height: 100%;
 
   a {
-    font-family: 'Poppins';
+    font-family: 'Poppins', sans-serif;
     font-size: 1rem;
     font-weight: 600;
     color: white;