diff --git a/schemas/query.graphql b/schemas/query.graphql index 0f7f114..c5e7366 100644 --- a/schemas/query.graphql +++ b/schemas/query.graphql @@ -5,6 +5,7 @@ query GetPost($id: ID!) { creator { name id + imageId } content { bodyModel { diff --git a/schemas/schema.graphql b/schemas/schema.graphql index f5ff695..88649ad 100644 --- a/schemas/schema.graphql +++ b/schemas/schema.graphql @@ -49,7 +49,7 @@ type BodyModel { paragraphs: [Paragraphs! ]! } type Content { bodyModel: BodyModel! } -type User { id: String! name: String! } +type User { id: String! name: String! imageId: String! } type Post { id: ID! diff --git a/templates/main.css b/templates/main.css index bcbc85c..83e3de8 100644 --- a/templates/main.css +++ b/templates/main.css @@ -28,8 +28,7 @@ a:hover { html { color: #333; font-family: Georgia, "Times New Roman", Times, serif; - /* font-size: 1.25rem; */ - font-size: 18px; + font-size: 26px; line-height: 1.55rem; } @@ -52,10 +51,14 @@ p { img { margin: auto; - max-width: 80%; + max-width: 100%; display: block; } +figcaption { + text-align: center; +} + code { font-family: monospace; font-size: 15px; @@ -63,8 +66,8 @@ code { @media screen and (max-width: 1200px) { html { - font-size: 1rem; - line-height: 1.34rem; + font-size: 16px; + line-height: 1.5rem; } main { width: 90%; @@ -73,4 +76,34 @@ code { img { display: block; } + + h1, + h2, + h3, + h4, + h5, + h6 { + font-family: "Times New Roman", Times, serif; + line-height: 30px; + } +} + +.author__photo { + width: 28px; + height: 28px; + border-radius: 20px; + display: inline-block; + margin: auto; + margin-right: 5px; + display: inline-flex; +} + +.author { + display: inline-flex; + flex-direction: row; + margin-right: 5px; +} + +.meta { + display: inline-flex; } diff --git a/templates/post.html b/templates/post.html index ea803eb..2198b9d 100644 --- a/templates/post.html +++ b/templates/post.html @@ -7,22 +7,31 @@
-

<.= data.title .>

<. use chrono::{TimeZone, Utc}; .> <. let dt = Utc.timestamp_millis(data.created_at); .> + <. let date = dt.format("%b %e, %Y").to_string(); .> + +

<.= data.title .>

- + + <.= data.creator.name .> <.= data.creator.name .> - on <.= dt.format("%b %e, %Y").to_string() .> + on <.= &date .>

<. let paragraphs = data.content.body_model.paragraphs; .> <. for (pindex, p) in paragraphs.iter().enumerate() {.> - <. if pindex == 1 && p.type_ == "H3" {.> + <. if pindex == 0 && p.type_ == "H3" {.> <. continue; .> <.}.> - <. if p.type_ == "IMG" {.> + + + <. if p.type_ == "IMG" {.> <. include!("./img.html"); .> <.} else if p.type_ == "P" {.> <. include!("./p.html"); .> @@ -37,6 +46,8 @@ <.} else if p.type_ == "H6" {.>
<.= p.text .>
<.}.> + + <.}.>