Skip to content

Update Font Awesome & Tera and refactor templates #957

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Aug 13, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions Cargo.lock

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion Cargo.toml
Original file line number Diff line number Diff line change
Expand Up @@ -60,7 +60,7 @@ staticfile = { version = "0.4", features = ["cache"] }
tempfile = "3.1.0"

# Templating
tera = { version = "1.3.1", features = ["builtins"] }
tera = { version = "1.5.0", features = ["builtins"] }
walkdir = "2"

# Template hot-reloading
Expand Down
2 changes: 1 addition & 1 deletion src/lib.rs
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ pub(crate) static GLOBAL_ALERT: Option<GlobalAlert> = Some(GlobalAlert {
url: "https://blog.rust-lang.org/2019/09/18/upcoming-docsrs-changes.html",
text: "Upcoming docs.rs breaking changes!",
css_class: "error",
fa_icon: "warning",
fa_icon: "exclamation-triangle",
});
*/

Expand Down
67 changes: 67 additions & 0 deletions src/web/page/templates.rs
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ use postgres::Client;
use serde_json::Value;
use std::{
collections::HashMap,
fmt,
path::PathBuf,
sync::{mpsc::channel, Arc},
thread,
Expand Down Expand Up @@ -147,6 +148,9 @@ pub(super) fn load_templates(conn: &mut Client) -> Result<Tera> {
tera.register_filter("timeformat", timeformat);
tera.register_filter("dbg", dbg);
tera.register_filter("dedent", dedent);
tera.register_filter("fas", IconType::Strong);
tera.register_filter("far", IconType::Regular);
tera.register_filter("fab", IconType::Brand);

Ok(tera)
}
Expand Down Expand Up @@ -250,6 +254,69 @@ fn dedent(value: &Value, _args: &HashMap<String, Value>) -> TeraResult<Value> {
))
}

enum IconType {
Strong,
Regular,
Brand,
}

impl fmt::Display for IconType {
fn fmt(&self, f: &mut fmt::Formatter<'_>) -> fmt::Result {
let icon = match self {
Self::Strong => "fas",
Self::Regular => "far",
Self::Brand => "fab",
};

f.write_str(icon)
}
}

impl tera::Filter for IconType {
fn filter(&self, value: &Value, args: &HashMap<String, Value>) -> TeraResult<Value> {
let mut aria_hidden = true;
let class = tera::escape_html(value.as_str().expect("Icons only take strings"));
let fixed_width = if args.get("fw").and_then(|fw| fw.as_bool()).unwrap_or(false) {
" fa-fw"
} else {
""
};
let aria_label = args
.get("aria-label")
.and_then(|l| l.as_str())
.map(|label| {
aria_hidden = false;
format!(r#" aria_label="{}""#, tera::escape_html(label))
})
.unwrap_or_default();
let id = args
.get("id")
.and_then(|l| l.as_str())
.map(|id| format!(r#" id="{}""#, tera::escape_html(id)))
.unwrap_or_default();
aria_hidden = args
.get("aria-hidden")
.and_then(|l| l.as_bool())
.unwrap_or(aria_hidden);

let icon = format!(
r#"<span aria-hidden="{aria_hidden}" class="{icon_class} fa-{fa_class}{fw}"{aria_label}{id}></span>"#,
aria_hidden = aria_hidden,
icon_class = self,
fa_class = class,
fw = fixed_width,
aria_label = aria_label,
id = id,
);

Ok(Value::String(icon))
}

fn is_safe(&self) -> bool {
true
}
}

#[cfg(test)]
mod tests {
use super::*;
Expand Down
43 changes: 26 additions & 17 deletions templates/about-base.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,22 +2,31 @@

{% block header %}
<div class="cratesfyi-package-container">
<div class="container about">
<h3 id="crate-title">Docs.rs documentation</h3>
<div class="pure-menu pure-menu-horizontal">
<ul class="pure-menu-list">
{% set text = '<i class="fa fa-fw fa-info-circle"></i> <span class="title">About</span>' %}
{{ macros::active_link(expected="index", href="/about", text=text) }}
{% set text = '<i class="fa fa-fw fa-fonticons"></i> <span class="title">Badges</span>' %}
{{ macros::active_link(expected="badges", href="/about/badges", text=text) }}
{% set text = '<i class="fa fa-fw fa-cogs"></i> <span class="title">Builds</span>' %}
{{ macros::active_link(expected="builds", href="/about/builds", text=text) }}
{% set text = '<i class="fa fa-fw fa-table"></i> <span class="title">Metadata</span>' %}
{{ macros::active_link(expected="metadata", href="/about/metadata", text=text) }}
{% set text = '<i class="fa fa-fw fa-road"></i> <span class="title">Shorthand URLs</span>' %}
{{ macros::active_link(expected="redirections", href="/about/redirections", text=text) }}
</ul>
</div>
</div>
<div class="container about">
<h3 id="crate-title">Docs.rs documentation</h3>
<div class="pure-menu pure-menu-horizontal">
<ul class="pure-menu-list">
{% set text = "info-circle" | fas(fw=true) %}
{% set text = text ~ ' <span class="title">About</span>' %}
{{ macros::active_link(expected="index", href="/about", text=text) }}

{% set text = "fonticons" | fab(fw=true) %}
{% set text = text ~ ' <span class="title">Badges</span>' %}
{{ macros::active_link(expected="badges", href="/about/badges", text=text) }}

{% set text = "cogs" | fas(fw=true) %}
{% set text = text ~ ' <span class="title">Builds</span>' %}
{{ macros::active_link(expected="builds", href="/about/builds", text=text) }}

{% set text = "table" | fas(fw=true) %}
{% set text = text ~ ' <span class="title">Metadata</span>' %}
{{ macros::active_link(expected="metadata", href="/about/metadata", text=text) }}

{% set text = "road" | fas(fw=true) %}
{% set text = text ~ ' <span class="title">Shorthand URLs</span>' %}
{{ macros::active_link(expected="redirections", href="/about/redirections", text=text) }}
</ul>
</div>
</div>
</div>
{% endblock %}
7 changes: 5 additions & 2 deletions templates/base.html
Original file line number Diff line number Diff line change
Expand Up @@ -9,16 +9,19 @@
<meta name="generator" content="docs.rs {{ docsrs_version() }}">
{%- block meta -%}{%- endblock meta -%}

{# External styles #}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/pure/0.6.0/pure-min.css" type="text/css"
media="all" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/pure/0.6.0/grids-responsive-min.css"
type="text/css" media="all" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css"
type="text/css" media="all" />
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.14.0/css/all.css" />

{# Docs.rs styles #}
<link rel="stylesheet" href="/normalize-{{ rustc_resource_suffix() }}.css" type="text/css" media="all" />
<link rel="stylesheet" href="/rustdoc-{{ rustc_resource_suffix() }}.css" type="text/css" media="all" />
<link rel="stylesheet" href="/light-{{ rustc_resource_suffix() }}.css" type="text/css" media="all" />
<link rel="stylesheet" href="/style.css?{{ docsrs_version() | slugify }}" type="text/css" media="all" />

{%- block css -%}{%- endblock css -%}

<link rel="search" href="/opensearch.xml" type="application/opensearchdescription+xml" title="Docs.rs">
Expand Down
6 changes: 3 additions & 3 deletions templates/core/home.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@

{%- block body -%}
<div class="container landing">
<h1 class="brand"><i class="fa fa-cubes fa-fw"></i> Docs.rs</h1>
<h1 class="brand">{{ "cubes" | fas(fw=true) }} Docs.rs</h1>

<form action="/releases/search" method="GET" class="landing-search-form">
<div>
Expand All @@ -28,7 +28,7 @@ <h1 class="brand"><i class="fa fa-cubes fa-fw"></i> Docs.rs</h1>
<strong>Recent Releases</strong>
</a>
<a href="/releases/feed" title="Atom feed">
<i class="fa fa-rss-square"></i>
{{ "rss-square" | fas }}
</a>
</div>

Expand All @@ -54,7 +54,7 @@ <h1 class="brand"><i class="fa fa-cubes fa-fw"></i> Docs.rs</h1>
{%- if varsb.show_stars -%}
<div class="pure-u-1 pure-u-sm-4-24 pure-u-md-3-24 date">
{{ release.stars }}
<i class="fa fa-star-o"></i>
{{ "star" | fas }}
</div>
{%- else -%}
<div class="pure-u-1 pure-u-sm-4-24 pure-u-md-3-24 date"
Expand Down
5 changes: 2 additions & 3 deletions templates/crate/builds.html
Original file line number Diff line number Diff line change
Expand Up @@ -43,11 +43,10 @@
<div class="pure-g">
<div class="pure-u-1 pure-u-sm-1-24 build">
{%- if build.build_status -%}
{%- set build_icon = "check" -%}
{{ "check" | fas }}
{%- else -%}
{%- set build_icon = "close" -%}
{{ "times" | fas }}
{%- endif -%}
<i class="fa fa-{{ build_icon }}"></i>
</div>
<div class="pure-u-1 pure-u-sm-10-24">{{ build.rustc_version }}</div>
<div class="pure-u-1 pure-u-sm-10-24">{{ build.docsrs_version }}</div>
Expand Down
16 changes: 8 additions & 8 deletions templates/crate/details.html
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@
{%- if details.homepage_url -%}
<li class="pure-menu-item">
<a href="{{ details.homepage_url }}" class="pure-menu-link">
<i class="fa fa-home fa-fw"></i> Homepage
{{ "home" | fas(fw=true) }} Homepage
</a>
</li>
{%- endif -%}
Expand All @@ -48,7 +48,7 @@
{%- if details.documentation_url -%}
<li class="pure-menu-item">
<a href="{{ details.documentation_url }}" title="Canonical documentation" class="pure-menu-link">
<i class="fa fa-fw fa-file-text"></i> Documentation
{{ "file-alt" | far(fw=true) }} Documentation
</a>
</li>
{%- endif -%}
Expand All @@ -60,14 +60,14 @@
{# If the repo link is for github, show some github stats #}
{# TODO: add support for hosts besides github (#35) #}
{%- if details.github -%}
<i class="fa fa-github fa-fw"></i>
<i class="fa fa-star-o fa-fw"></i> {{ details.github_stars }}
<i class="fa fa-code-fork fa-fw"></i> {{ details.github_forks }}
<i class="fa fa-exclamation-circle fa-fw"></i> {{ details.github_issues }}
{{ "github" | fab(fw=true) }}
{{ "star" | fas(fw=true) }} {{ details.github_stars }}
{{ "code-branch" | fas(fw=true) }} {{ details.github_forks }}
{{ "exclamation-circle" | fas(fw=true) }} {{ details.github_issues }}

{# If the repo link is unknown, just show a normal link #}
{%- else -%}
<i class="fa fa-code-fork fa-fw"></i> Repository
{{ "code-branch" | fas(fw=true) }} Repository
{%- endif -%}
</a>
</li>
Expand All @@ -77,7 +77,7 @@
<li class="pure-menu-item">
<a href="https://crates.io/crates/{{ details.name }}" class="pure-menu-link"
title="See {{ details.name }} on crates.io">
<i class="fa fa-cube fa-fw"></i> Crates.io
{{ "cube" | fas(fw=true) }} Crates.io
</a>
</li>

Expand Down
25 changes: 13 additions & 12 deletions templates/crate/source.html
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@
{# If this isn't the root folder, show a 'back' button #}
{%- if show_parent_link -%}
<li class="pure-menu-item">
<a href="../" class="pure-menu-link"><i class="fa fa-fw fa-folder-open-o"></i> ..</a>
<a href="../" class="pure-menu-link">{{ "folder-open" | far(fw=true) }} ..</a>
</li>
{%- endif -%}

Expand All @@ -32,24 +32,25 @@
<a href="./{{ file.name }}{% if file.mime == 'dir' %}/{% endif %}" class="pure-menu-link">
{# Directories #}
{%- if file.mime == "dir" -%}
<i class="fa fa-fw fa-folder-open-o"></i>
{{ "folder-open" | far(fw=true) }}

{# Rust files #}
{%- elif file.mime == "text/rust" -%}
<i class="fa fa-fw fa-file-code-o"></i>
{{ "rust" | fab(fw=true) }}

{# Cargo.lock #}
{%- elif file.mime == "text/plain" and file.name == "Cargo.lock" -%}
<i class="fa fa-fw fa-lock"></i>
{{ "lock" | fas(fw=true) }}

{#
TODO: Font awesome v4.6 doesn't support these, upgrade and enable them
{% elif file.mime == "text/markdown" %}
<i class="fab fa-markdown"></i>
{# Markdown files #}
{% elif file.mime == "text/markdown" %}
{{ "markdown" | fab(fw=true) }}

{% elif file.mime == "text/plain" and file.name == ".gitignore" %}
<i class="fab fa-git-alt"></i>
{# .gitignore #}
{% elif file.mime == "text/plain" and file.name == ".gitignore" %}
{{ "git-alt" | fab(fw=true) }}

{#
More ideas
FontAwesome v5:
".application/x-bzip"
Expand All @@ -69,11 +70,11 @@

{# Text files or files which mime starts with `text` #}
{%- elif file.mime == "text/plain" or file.mime | split(pat="/") | first == "text" -%}
<i class="fa fa-fw fa-file-text-o"></i>
{{ "file-alt" | far(fw=true) }}

{# Binary files and any unrecognized types #}
{% else -%}
<i class="fa fa-fw fa-file-archive-o"></i>
{{ "file-archive" | far(fw=true) }}
{%- endif -%}

{{ file.name }}
Expand Down
2 changes: 1 addition & 1 deletion templates/header/global_alert.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
{%- if global_alert -%}
<li class="pure-menu-item">
<a href="{{ global_alert.url | safe }}" class="pure-menu-link {{ global_alert.css_class }}">
<i class="fa fa-fw fa-{{ global_alert.fa_icon }}"></i>
<i class="{{ global_alert.fa_icon | fas(fw=true) }}"></i>
{{ global_alert.text }}
</a>
</li>
Expand Down
Loading