Update CSS classes
This commit is contained in:
parent
9bc95d9670
commit
0ecdd6e405
|
@ -3,7 +3,7 @@ import React from 'react';
|
||||||
|
|
||||||
export const About = () => (
|
export const About = () => (
|
||||||
<div>
|
<div>
|
||||||
<div className="content">
|
<div className="content-wrapper">
|
||||||
<h1>About</h1>
|
<h1>About</h1>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -31,10 +31,10 @@ export default class Blog extends Component {
|
||||||
)
|
)
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="content">
|
<div className="content-wrapper">
|
||||||
<h1>Blog</h1>
|
<h1>Blog</h1>
|
||||||
|
|
||||||
<div className="blog-posts">
|
<div className="content">
|
||||||
{posts}
|
{posts}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -1 +0,0 @@
|
||||||
|
|
|
@ -6,7 +6,7 @@ export const NotFoundPage = (props) => {
|
||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<div className="content">
|
<div className="content-wrapper">
|
||||||
<h1>Uhm... WHAT?</h1>
|
<h1>Uhm... WHAT?</h1>
|
||||||
<h2>Looks like you're lost</h2>
|
<h2>Looks like you're lost</h2>
|
||||||
<p>404 Page not found</p>
|
<p>404 Page not found</p>
|
||||||
|
|
|
@ -2,7 +2,7 @@ import React from 'react';
|
||||||
|
|
||||||
export const Portfolio = () => (
|
export const Portfolio = () => (
|
||||||
<div>
|
<div>
|
||||||
<div className="content">
|
<div className="content-wrapper">
|
||||||
<h1>Portfolio</h1>
|
<h1>Portfolio</h1>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -10,10 +10,10 @@ export default class Post extends Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="content">
|
<div className="content-wrapper">
|
||||||
<h1>{this.props.post.title}</h1>
|
<h1>{this.props.post.title}</h1>
|
||||||
<h4>{this.props.post.published}</h4>
|
<h4>{this.props.post.published}</h4>
|
||||||
<div dangerouslySetInnerHTML={{__html: this.props.post.body}}>
|
<div className="content" dangerouslySetInnerHTML={{__html: this.props.post.body}}>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
|
|
|
@ -2,7 +2,7 @@ import React from 'react';
|
||||||
|
|
||||||
export const Resume = () => (
|
export const Resume = () => (
|
||||||
<div>
|
<div>
|
||||||
<div className="content">
|
<div className="content-wrapper">
|
||||||
<h1>Resume</h1>
|
<h1>Resume</h1>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -6,4 +6,3 @@ export { default as Portfolio } from './Portfolio';
|
||||||
export { default as Resume } from './Resume';
|
export { default as Resume } from './Resume';
|
||||||
export { default as NotFoundPage } from './NotFoundPage';
|
export { default as NotFoundPage } from './NotFoundPage';
|
||||||
export { default as App } from './App';
|
export { default as App } from './App';
|
||||||
export { default as Main } from './Main';
|
|
||||||
|
|
|
@ -15,7 +15,7 @@ $break-large: 1200px;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
position: absolute;
|
position: fixed;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
color: $white;
|
color: $white;
|
||||||
|
@ -68,7 +68,7 @@ body {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.content {
|
.content-wrapper {
|
||||||
margin-left: 320px;
|
margin-left: 320px;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
|
@ -151,7 +151,7 @@ body {
|
||||||
padding-bottom: 5px;
|
padding-bottom: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.blog-posts {
|
.content {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
@media screen and (min-width: $break-large) {
|
@media screen and (min-width: $break-large) {
|
||||||
|
|
Loading…
Reference in New Issue