Use aphrodite for HomePage.js styling (#1127)

This is a minor refactor so that we use Aphrodite for styling on
HomePage.js. It's not super consequential, but I want to switch to using
Aphrodite more consistently in the codebase, so why not start here.

Test plan:
`yarn test` reveals no errors.
`yarn start` launches a correctly styled frontend.
I also used `build_static_site.sh` and the resultant site is also
correctly styled.
This commit is contained in:
Dandelion Mané 2019-04-19 17:10:38 +03:00 committed by GitHub
parent e465919281
commit 6dd58a9c67
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 13 additions and 10 deletions

View File

@ -4,6 +4,7 @@ import React from "react";
import type {Assets} from "../webutil/assets"; import type {Assets} from "../webutil/assets";
import Link from "../webutil/Link"; import Link from "../webutil/Link";
import {StyleSheet, css} from "aphrodite/no-important";
export default class HomePage extends React.Component<{|+assets: Assets|}> { export default class HomePage extends React.Component<{|+assets: Assets|}> {
render() { render() {
@ -23,16 +24,7 @@ export default class HomePage extends React.Component<{|+assets: Assets|}> {
readme: "https://github.com/sourcecred/sourcecred/blob/master/README.md", readme: "https://github.com/sourcecred/sourcecred/blob/master/README.md",
}; };
return ( return (
<div <div className={css(styles.container)}>
style={{
maxWidth: 900,
margin: "0 auto",
marginBottom: 200,
padding: "0 10px",
lineHeight: 1.5,
fontSize: 20,
}}
>
<h1>SourceCred vision</h1> <h1>SourceCred vision</h1>
<p> <p>
<strong>The open-source movement is amazing. </strong> <strong>The open-source movement is amazing. </strong>
@ -203,3 +195,14 @@ function Dt(props) {
function Dd(props) { function Dd(props) {
return <dd style={{marginBottom: 15}}>{props.children}</dd>; return <dd style={{marginBottom: 15}}>{props.children}</dd>;
} }
const styles = StyleSheet.create({
container: {
maxWidth: 900,
margin: "0 auto",
marginBottom: 200,
padding: "0 10px",
lineHeight: 1.5,
fontSize: 20,
},
});