Some layout and styling
This commit is contained in:
parent
94758adaf4
commit
405b203bc7
5 changed files with 168 additions and 7 deletions
|
@ -8,6 +8,7 @@ extern crate chrono;
|
|||
extern crate clap;
|
||||
extern crate futures;
|
||||
extern crate hyper;
|
||||
extern crate pulldown_cmark;
|
||||
|
||||
use std::net::SocketAddr;
|
||||
|
||||
|
|
|
@ -1,7 +1,6 @@
|
|||
use chrono;
|
||||
|
||||
#[derive(BartDisplay, Clone, Debug, Queryable)]
|
||||
#[template="templates/article_revision.html"]
|
||||
#[derive(Debug, Queryable)]
|
||||
pub struct ArticleRevision {
|
||||
pub article_id: i32,
|
||||
pub revision: i32,
|
||||
|
|
30
src/site.rs
30
src/site.rs
|
@ -10,6 +10,15 @@ use models;
|
|||
use state::State;
|
||||
use web::{Lookup, Resource};
|
||||
|
||||
fn render_markdown(src: &str) -> String {
|
||||
use pulldown_cmark::{Parser, html};
|
||||
|
||||
let p = Parser::new(src);
|
||||
let mut buf = String::new();
|
||||
html::push_html(&mut buf, p);
|
||||
buf
|
||||
}
|
||||
|
||||
lazy_static! {
|
||||
static ref TEXT_HTML: mime::Mime = "text/html;charset=utf-8".parse().unwrap();
|
||||
}
|
||||
|
@ -87,11 +96,30 @@ impl Resource for ArticleResource {
|
|||
}
|
||||
|
||||
fn get(self) -> futures::BoxFuture<Response, Box<::std::error::Error + Send>> {
|
||||
use chrono::{self, TimeZone, Local};
|
||||
|
||||
#[derive(BartDisplay)]
|
||||
#[template="templates/article_revision.html"]
|
||||
struct Template<'a> {
|
||||
article_id: i32,
|
||||
revision: i32,
|
||||
created: &'a chrono::DateTime<Local>,
|
||||
|
||||
title: &'a str,
|
||||
body: String,
|
||||
}
|
||||
|
||||
self.head().map(move |head|
|
||||
head
|
||||
.with_body(Layout {
|
||||
title: &self.data.title,
|
||||
body: &self.data
|
||||
body: &Template {
|
||||
article_id: self.data.article_id,
|
||||
revision: self.data.revision,
|
||||
created: &Local.from_utc_datetime(&self.data.created),
|
||||
title: &self.data.title,
|
||||
body: render_markdown(&self.data.body),
|
||||
}
|
||||
}.to_string())
|
||||
).boxed()
|
||||
}
|
||||
|
|
|
@ -1,5 +1,20 @@
|
|||
<p>{{article_id}}-{{revision}}</p>
|
||||
<p>{{created}}</p>
|
||||
|
||||
<header>
|
||||
<h1>{{title}}</h1>
|
||||
<p>{{body}}</p>
|
||||
</header>
|
||||
|
||||
<article>
|
||||
{{{body}}}
|
||||
</article>
|
||||
|
||||
<footer>
|
||||
<dl>
|
||||
<dt>Article ID</dt>
|
||||
<dd>{{article_id}}</dd>
|
||||
|
||||
<dt>Revision</dt>
|
||||
<dd>{{revision}}</dd>
|
||||
|
||||
<dt>Last updated</dt>
|
||||
<dd>{{created}}</dd>
|
||||
</dl>
|
||||
</footer>
|
||||
|
|
|
@ -2,6 +2,124 @@
|
|||
<html>
|
||||
<head>
|
||||
<title>{{title}}</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link href="https://fonts.googleapis.com/css?family=Amatic+SC" rel="stylesheet">
|
||||
<style>
|
||||
html {
|
||||
font-family: "Apple Garamond", "Baskerville",
|
||||
"Times New Roman", "Droid Serif", "Times",
|
||||
"Source Serif Pro", serif;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: 'Amatic SC', cursive;
|
||||
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
||||
font-size: 40px;
|
||||
line-height: 54px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-family: inherit;
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
font-size: 18px;
|
||||
line-height: 32px;
|
||||
margin-top: 32px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
header {
|
||||
max-width: 600px;
|
||||
width: 100%;
|
||||
margin: 40px auto 0 auto;
|
||||
}
|
||||
|
||||
article {
|
||||
font-size: 18px;
|
||||
line-height: 32px;
|
||||
max-width: 600px;
|
||||
width: 100%;
|
||||
margin: 0 auto 120px auto;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0 0 28px 0;
|
||||
}
|
||||
|
||||
code, pre {
|
||||
background: #f8f8f8;
|
||||
font-family: "SF Mono", "Monaco",
|
||||
"Inconsolata", "Fira Mono",
|
||||
"Droid Sans Mono", "Source Code Pro",
|
||||
monospace;
|
||||
}
|
||||
|
||||
pre {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #5e90af;
|
||||
}
|
||||
|
||||
a:visited {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
color: #79b9e1;
|
||||
}
|
||||
|
||||
|
||||
/* Sticky footer */
|
||||
html, body {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
article {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
|
||||
footer {
|
||||
background: #f8f8f8;
|
||||
color: #444;
|
||||
text-align: center;
|
||||
font-family: -apple-system, BlinkMacSystemFont,
|
||||
"Segoe UI", "Roboto", "Oxygen",
|
||||
"Ubuntu", "Cantarell", "Fira Sans",
|
||||
"Droid Sans", "Helvetica Neue", sans-serif;
|
||||
}
|
||||
|
||||
footer dt, footer dd {
|
||||
display: inline;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
footer dt::after {
|
||||
content: ": ";
|
||||
display: inline;
|
||||
}
|
||||
|
||||
footer dd::after {
|
||||
content: "|";
|
||||
margin: 0 12px;
|
||||
}
|
||||
|
||||
footer dd:last-child::after {
|
||||
content: "";
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
{{{body}}}
|
||||
|
|
Loading…
Reference in a new issue