diff --git a/assets/css/screen.css b/assets/css/screen.css index a62fcd7..7249e98 100644 --- a/assets/css/screen.css +++ b/assets/css/screen.css @@ -18,26 +18,145 @@ 1. General ========================================================================== */ -html {font-size: 62.5%;} +html { + font-size: 62.5%; +} body { font-family: 'Open Sans', sans-serif; - font-size: 2rem; + font-size: 2.0rem; line-height: 1.6em; color: #50585D; } +h1, h2, h3 +h4, h5, h6 { + margin:0; +} + h1 { font-size: 5rem; line-height: 1.2em; letter-spacing: -1px; } +p { +} + +a { + color: #4a4a4a; +} + +a:hover { + color: #57A3E8; +} + /* ========================================================================== 1. General ========================================================================== */ +.content { + padding-top:120px; +} + .post { max-width: 700px; margin: 0 auto; +} + +.post-meta { + font-size: 1.4rem; + color: #9EABB3; +} + +.post-meta a { + color: #9EABB3; + text-decoration: none; +} + +.post-meta a:hover { + text-decoration: underline; +} + +.post-footer { + position: relative; + padding: 4rem 100px 0 0; + margin: 4rem 0 0 0; + border-top: #DDE6EB 1px solid; + font-size: 1.6rem; + line-height: 1.5em; +} + +.user-meta { + position: relative; + padding: 0.3rem 40px 0 100px; + min-height: 77px; +} + +.user-image { + position: absolute; + top:0; + left:0; +} + +.user-name { + display: block; + font-weight: bold; +} + +.user-bio { + display: block; + max-width: 440px; + font-size: 1.4rem; + line-height: 1.5em; +} + +.publish-meta { + position: absolute; + top:0; + right:0; + padding: 4.3rem 0 4rem 0; + text-align: right; +} + +.publish-heading { + display: block; + font-weight: bold; +} + +.publish-date { + display: block; + font-size: 1.4rem; + line-height: 1.5em; +} + +.related-footer { + margin: 4rem 0 0 0; + padding: 4rem 0; + border-top: #DDE6EB 1px solid; + background: #F2F5F7; +} + +.related-post { + max-width: 700px; + margin: 0 auto; +} + +.related-title { + font-size: 2.2rem; + opacity:0.9; +} + +.related-meta { + font-size: 1.4rem; + color: #9EABB3; +} + +.related-content { + font-size: 1.8rem; + opacity:0.9; +} + +.related-content p { + margin:0; } \ No newline at end of file diff --git a/assets/img/user.png b/assets/img/user.png new file mode 100644 index 0000000..320f2fd Binary files /dev/null and b/assets/img/user.png differ diff --git a/post.hbs b/post.hbs index cad5c1a..6fd1d29 100644 --- a/post.hbs +++ b/post.hbs @@ -1,17 +1,44 @@ {{!< default}}
+ {{#post}} -
-
- -

{{title}}

-
-
- {{content}} +
+ +
+ +

{{title}}

+
+ +
+ {{content}} +
+ +
+
+ User + John O'Nolan + A designer, developer and entrepreneur. Spends his time travelling the world with a bag of kites. Likes to write. +
+
+ Published + +
+
+ +
+ + {{/post}} + + +
\ No newline at end of file