Make the website more mobile-friendly
This commit is contained in:
parent
aefa31b84e
commit
b68e481b3f
@ -26,7 +26,7 @@ fn details(name: String, conn: DbConn, user: Option<User>) -> Template {
|
||||
json!({
|
||||
"post": p,
|
||||
"author": p.get_authors(&*conn)[0],
|
||||
"url": p.compute_id(&*conn),
|
||||
"url": format!("/~/{}/{}/", p.get_blog(&*conn).actor_id, p.slug),
|
||||
"date": p.creation_date.timestamp()
|
||||
})
|
||||
}).collect::<Vec<serde_json::Value>>()
|
||||
|
@ -23,7 +23,7 @@ fn index(conn: DbConn, user: Option<User>) -> Template {
|
||||
json!({
|
||||
"post": p,
|
||||
"author": p.get_authors(&*conn)[0],
|
||||
"url": p.compute_id(&*conn),
|
||||
"url": format!("/~/{}/{}/", p.get_blog(&*conn).actor_id, p.slug),
|
||||
"date": p.creation_date.timestamp()
|
||||
})
|
||||
}).collect::<Vec<serde_json::Value>>()
|
||||
|
@ -32,7 +32,7 @@ fn details(name: String, conn: DbConn, account: Option<User>) -> Template {
|
||||
json!({
|
||||
"post": p,
|
||||
"author": p.get_authors(&*conn)[0],
|
||||
"url": p.compute_id(&*conn),
|
||||
"url": format!("/~/{}/{}/", p.get_blog(&*conn).actor_id, p.slug),
|
||||
"date": p.creation_date.timestamp()
|
||||
})
|
||||
}).collect::<Vec<serde_json::Value>>(),
|
||||
|
@ -21,6 +21,10 @@ header {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
header #menu {
|
||||
display: none;
|
||||
}
|
||||
|
||||
header nav a {
|
||||
margin: 0px 20px;
|
||||
}
|
||||
@ -101,3 +105,32 @@ textarea {
|
||||
padding: 5px 10px;
|
||||
margin: 0px 10px;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 500px) {
|
||||
header {
|
||||
padding: 20px 0px;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
header #menu {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
header > nav {
|
||||
display: none;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
header nav a {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
header:focus-within > nav {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
input {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
@ -3,10 +3,12 @@
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>{% block title %}{% endblock title %} ⋅ Plume</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" href="/static/main.css">
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<nav id="menu"><a href="#">Menu</a></nav>
|
||||
<nav>
|
||||
<a href="/">Plume</a>
|
||||
{% block header %}
|
||||
|
Loading…
Reference in New Issue
Block a user