nyuuzyou/libmedium
1
0
Fork 0
forked from realaravinth/libmedium
Code Pull requests Activity

Show author photo in metadata section

Browse source
This commit is contained in:
Aravinth Manivannan 2021-11-02 13:40:13 +05:30
parent 26722e5a52
commit 133c4a96b3
Signed by untrusted user: realaravinth
GPG key ID: AD9F0F08E855ED88
4 changed files with 56 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
schemas/query.graphql
View file

@ -5,6 +5,7 @@ query GetPost($id: ID!) {
creator { creator {
name name
id id
imageId
} }
content { content {
bodyModel { bodyModel {

2
schemas/schema.graphql
View file

@ -49,7 +49,7 @@ type BodyModel { paragraphs: [Paragraphs! ]! }
type Content { bodyModel: BodyModel! } type Content { bodyModel: BodyModel! }
type User { id: String! name: String! } type User { id: String! name: String! imageId: String! }
type Post { type Post {
id: ID! id: ID!

43
templates/main.css
View file

@ -28,8 +28,7 @@ a:hover {
html { html {
color: #333; color: #333;
font-family: Georgia, "Times New Roman", Times, serif; font-family: Georgia, "Times New Roman", Times, serif;
/* font-size: 1.25rem; */ font-size: 26px;
font-size: 18px;
line-height: 1.55rem; line-height: 1.55rem;
} }
@ -52,10 +51,14 @@ p {
img { img {
margin: auto; margin: auto;
max-width: 80%; max-width: 100%;
display: block; display: block;
} }
figcaption {
text-align: center;
}
code { code {
font-family: monospace; font-family: monospace;
font-size: 15px; font-size: 15px;
@ -63,8 +66,8 @@ code {
@media screen and (max-width: 1200px) { @media screen and (max-width: 1200px) {
html { html {
font-size: 1rem; font-size: 16px;
line-height: 1.34rem; line-height: 1.5rem;
} }
main { main {
width: 90%; width: 90%;
@ -73,4 +76,34 @@ code {
img { img {
display: block; 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;
} }

21
templates/post.html
View file

@ -7,22 +7,31 @@
</head> </head>
<body> <body>
<main class="container"> <main class="container">
<h1><.= data.title .></h1>
<. use chrono::{TimeZone, Utc}; .> <. use chrono::{TimeZone, Utc}; .>
<. let dt = Utc.timestamp_millis(data.created_at); .> <. let dt = Utc.timestamp_millis(data.created_at); .>
<. let date = dt.format("%b %e, %Y").to_string(); .>
<h1><.= data.title .></h1>
<p class="meta"> <p class="meta">
<a href="https://medium.com/u/<.= data.creator.id .>" rel="noreferrer"> <a class="author" href="https://medium.com/u/<.= data.creator.id .>" rel="noreferrer">
<img
src="https://miro.medium.com/<.= data.creator.image_id .>"
class="author__photo"
alt="<.= data.creator.name .>"
/>
<.= data.creator.name .></a <.= data.creator.name .></a
> >
on <.= dt.format("%b %e, %Y").to_string() .> on <.= &date .>
</p> </p>
<article> <article>
<. let paragraphs = data.content.body_model.paragraphs; .> <. let paragraphs = data.content.body_model.paragraphs; .>
<. for (pindex, p) in paragraphs.iter().enumerate() {.> <. for (pindex, p) in paragraphs.iter().enumerate() {.>
<. if pindex == 1 && p.type_ == "H3" {.> <. if pindex == 0 && p.type_ == "H3" {.>
<. continue; .> <. continue; .>
<.}.> <.}.>
<. if p.type_ == "IMG" {.>
<. if p.type_ == "IMG" {.>
<. include!("./img.html"); .> <. include!("./img.html"); .>
<.} else if p.type_ == "P" {.> <.} else if p.type_ == "P" {.>
<. include!("./p.html"); .> <. include!("./p.html"); .>
@ -37,6 +46,8 @@
<.} else if p.type_ == "H6" {.> <.} else if p.type_ == "H6" {.>
<h6><.= p.text .></h6> <h6><.= p.text .></h6>
<.}.> <.}.>
<.}.> <.}.>
</article> </article>
</main> </main>