encounter/decomp.dev
0
0
Fork 0
mirror of https://github.com/encounter/decomp.dev.git synced 2026-07-10 03:18:48 -07:00
Code Issues Packages Projects Releases Wiki Activity

Replace SVGs with custom icon font

Browse Source
This commit is contained in:
Luke Street
2025-04-25 23:50:25 -06:00
parent 0b13972571
commit 09b68b68be
10 changed files with 89 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/icons.woff2
BIN
View File
Binary file not shown.
assets/platforms/n64.svg
+2 -5
View File
@@ -1,6 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-linejoin="round" stroke-width=".2">
<path d="m8.907 8.642 3.094 1.268v11.737l-2.904-1.19L4.85 12.73v5.984L2.059 17.57V5.836L4.977 7.03l3.93 7.624V8.642M19.13 18.725l-4.21-5.447v3.044l.962 1.275 3.249 1.128"/>
<path d="m8.907 8.642 3.063-1.226 3.059 1.254L12 9.91 8.907 8.642m7.33-2.631 2.897-1.201 2.81 1.026-2.968 1.215-2.74-1.04M4.977 7.03 2.06 5.836l2.683-.885 2.792 1.046L4.977 7.03m6.989-2.712-2.81-1.025 2.705-.948 2.743.94-2.638 1.033"/>
<path d="m14.049 8.266.98.404 3.947 5.608V7.051l-2.74-1.04-2.187 2.255m-5.142.509L7.601 6.138l1.555-2.845 2.81 1.025-2.353 4.043-.706.28v.134"/>
<path fill="currentColor" d="M8.907 14.654 4.977 7.03l2.557-1.033 1.373 2.778v5.88m3.094-4.745 3.028-1.24 3.947 5.608V7.051l2.968-1.215v11.733l-2.813 1.156-4.211-5.447v7.171L12 21.647V9.91m-4.466 7.705L4.85 12.73v5.984Zm6.515-9.349.555-.573V3.286l-2.638 1.032-2.353 4.043 2.357-.945 2.079.85"/>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
<path d="M11.852 2.249a.1.1 0 0 0-.026.005l-2.687.944a.1.1 0 0 0-.073.05L7.602 5.93a.1.1 0 0 0-.069-.03.1.1 0 0 1 .012 0l-2.77-1.038a.1.1 0 0 0-.039-.008.1.1 0 0 0-.013.002.1.1 0 0 0-.014.004l-2.682.885a.1.1 0 0 0-.068.082.1.1 0 0 0-.002.013v11.735a.1.1 0 0 0 .063.092l2.78 1.14a.1.1 0 0 0 .087.004l2.601-1.066 1.52 2.765a.1.1 0 0 0 .049.043l2.896 1.188a.1.1 0 0 0 .082.004l2.92-1.2a.1.1 0 0 0 .063-.091v-3.829l.783 1.038a.1.1 0 0 0 .047.033l3.232 1.12.002.003a.1.1 0 0 0 .086.004l2.813-1.156a.1.1 0 0 0 .062-.094V5.84a.1.1 0 0 0-.08-.097L19.166 4.72a.1.1 0 0 0-.049-.006.1.1 0 0 0-.023.006l-2.885 1.197a.1.1 0 0 0-.002 0 .1.1 0 0 0-.045.028l-1.46 1.506V3.315a.1.1 0 0 0-.067-.121l-2.744-.94a.1.1 0 0 0-.04-.005zm.007.207 2.453.84-2.351.92-2.512-.917Zm-2.658.964 2.615.955-2.271 3.907-.647.26-1.185-2.399Zm9.934 1.502 2.531.924-2.691 1.102-2.47-.936zm-14.397.139 2.52.943-2.281.922-2.63-1.074Zm-2.582.928 2.746 1.125 3.914 7.59a.1.1 0 0 0 .19-.045V8.795l2.892 1.186v11.521l-2.732-1.12-4.23-7.696a.1.1 0 0 0-.106-.05.1.1 0 0 0-.082.099v5.834l-2.592-1.063zm14.104.142 2.615.993v6.843l-3.766-5.35a.1.1 0 0 0-.054-.038l-.832-.344Zm-4.293 1.397 2.797 1.146-2.766 1.133-2.826-1.16.476-.19ZM9 8.745a.1.1 0 0 1 .006.023A.1.1 0 0 0 9 8.745zm6.018 4.83 3.824 4.949-2.9-1.008-.924-1.223zm-10.27 5.144a.1.1 0 0 0 .004.028.1.1 0 0 1-.004-.028z"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1009 B

After

Width:  |  Height:  |  Size: 1.4 KiB

crates/images/src/lib.rs
-28
View File
@@ -5,7 +5,6 @@ pub mod treemap;
use std::str::FromStr;
use axum::{
extract::Path,
http::{StatusCode, header},
response::{IntoResponse, Response},
};
@@ -17,33 +16,6 @@ pub fn image_mime_from_ext(ext: &str) -> Option<Mime> {
.map(|format| Mime::from_str(format.to_mime_type()).unwrap())
}
pub async fn get_asset(Path(filename): Path<String>) -> Result<Response, AppError> {
let path = join_normalized("assets", &filename);
let Some(ext) = path.extension() else {
return Err(AppError::Status(StatusCode::NOT_FOUND));
};
let content_type = if let Some(format) = image::ImageFormat::from_extension(ext) {
format.to_mime_type()
} else {
match ext.to_str() {
Some("svg") => mime::IMAGE_SVG.as_ref(),
_ => return Err(AppError::Status(StatusCode::NOT_FOUND)),
}
};
let output = tokio::fs::read(path).await?;
Ok((
[
(header::CONTENT_TYPE, content_type),
#[cfg(not(debug_assertions))]
(header::CACHE_CONTROL, "public, max-age=3600"),
#[cfg(debug_assertions)]
(header::CACHE_CONTROL, "no-cache"),
],
output,
)
.into_response())
}
pub async fn get_og() -> Result<Response, AppError> {
let path = join_normalized("assets", "og.svg");
let svg_src = tokio::fs::read_to_string(&path)
crates/web/src/handlers/auth.rs
+2 -2
View File
@@ -44,8 +44,8 @@ pub async fn login(
}
Ok(html! {
(DOCTYPE)
html {
head lang="en" {
html lang="en" {
head {
meta charset="utf-8";
title { "Logging in... • decomp.dev" }
meta http-equiv="refresh" content=(format!("0;URL={redirect_url}"));
crates/web/src/handlers/common.rs
+1 -5
View File
@@ -133,11 +133,7 @@ pub fn nav_links() -> Markup {
a href="https://wiki.decomp.dev" { "Wiki" }
}
li {
a #theme-toggle href="#" title="Toggle theme" {
(PreEscaped(r#"<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="1.33em" height="1.33em">
<path d="M7.5,2C5.71,3.15 4.5,5.18 4.5,7.5C4.5,9.82 5.71,11.85 7.53,13C4.46,13 2,10.54 2,7.5A5.5,5.5 0 0,1 7.5,2M19.07,3.5L20.5,4.93L4.93,20.5L3.5,19.07L19.07,3.5M12.89,5.93L11.41,5L9.97,6L10.39,4.3L9,3.24L10.75,3.12L11.33,1.47L12,3.1L13.73,3.13L12.38,4.26L12.89,5.93M9.59,9.54L8.43,8.81L7.31,9.59L7.65,8.27L6.56,7.44L7.92,7.35L8.37,6.06L8.88,7.33L10.24,7.36L9.19,8.23L9.59,9.54M19,13.5A5.5,5.5 0 0,1 13.5,19C12.28,19 11.15,18.6 10.24,17.93L17.93,10.24C18.6,11.15 19,12.28 19,13.5M14.6,20.08L17.37,18.93L17.13,22.28L14.6,20.08M18.93,17.38L20.08,14.61L22.28,17.15L18.93,17.38M20.08,12.42L18.94,9.64L22.28,9.88L20.08,12.42M9.63,18.93L12.4,20.08L9.87,22.27L9.63,18.93Z" />
</svg>"#))
}
a #theme-toggle .icon-theme-light-dark href="#" title="Toggle theme" {}
}
}
}
crates/web/src/handlers/manage.rs
+6 -6
View File
@@ -39,8 +39,8 @@ pub async fn manage(
Ok(html! {
(DOCTYPE)
html {
head lang="en" {
html lang="en" {
head {
meta charset="utf-8";
title { "Manage • decomp.dev" }
(header())
@@ -138,8 +138,8 @@ async fn render_new(
Ok(html! {
(DOCTYPE)
html {
head lang="en" {
html lang="en" {
head {
meta charset="utf-8";
title { "New Project • decomp.dev" }
(header())
@@ -351,8 +351,8 @@ async fn render_manage_project(
html! {
(DOCTYPE)
html {
head lang="en" {
html lang="en" {
head {
meta charset="utf-8";
title { (project_short_name) " • Manage" }
(header())
crates/web/src/handlers/mod.rs
-1
View File
@@ -32,7 +32,6 @@ pub fn build_router() -> Router<AppState> {
.route("/manage/{owner}/{repo}", get(manage::manage_project))
.route("/manage/{owner}/{repo}", post(manage::manage_project_save))
.route("/manage/{owner}/{repo}/refresh", post(manage::manage_project_refresh))
.route("/assets/{*filename}", get(decomp_dev_images::get_asset))
.route("/og.png", get(decomp_dev_images::get_og))
.route("/", get(project::get_projects))
.route("/{owner}/{repo}", get(report::get_report))
crates/web/src/handlers/project.rs
+3 -4
View File
@@ -157,8 +157,8 @@ pub async fn get_projects(
let rendered = html! {
(DOCTYPE)
html {
head lang="en" {
html lang="en" {
head {
meta charset="utf-8";
title { "Projects • decomp.dev" }
(header())
@@ -251,8 +251,7 @@ fn project_fragment(
}
@if let Some(platform) = &info.project.platform {
@let platform_name = Platform::from_str(platform).map(|p| p.name()).unwrap_or(platform);
img class="platform-icon" src=(format!("/assets/platforms/{}.svg", platform))
alt=(platform_name) title=(platform_name) width="24" height="24";
span class=(format!("platform-icon icon-{platform}")) title=(platform_name) {}
}
}
h6 {
crates/web/src/handlers/report.rs
+24 -10
View File
@@ -664,8 +664,8 @@ async fn render_report(
Ok(html! {
(DOCTYPE)
html {
head lang="en" {
html lang="en" {
head {
meta charset="utf-8";
title { (project_short_name) " • Progress Report" }
(header())
@@ -710,9 +710,19 @@ async fn render_report(
details class="dropdown" {
summary {}
ul dir="rtl" {
li { a href=(project_history_path) { "History" } }
li {
a href=(project_history_path) {
"History "
span .icon-chart-line { " " }
}
}
@if can_manage {
li { a href=(project_manage_path) { "Manage" } }
li {
a href=(project_manage_path) {
"Manage "
span .icon-cog { " " }
}
}
}
}
}
@@ -764,20 +774,24 @@ async fn render_report(
div role="group" {
@if let Some(prev_commit_path) = prev_commit_path {
a role="button" class="outline secondary" href=(prev_commit_path) {
"Previous"
span .icon-left-open {}
" Previous"
}
} @else {
button disabled class="outline secondary" {
"Previous"
span .icon-left-open {}
" Previous"
}
}
@if let Some(next_commit_path) = next_commit_path {
a role="button" class="outline secondary" href=(next_commit_path) {
"Next"
"Next "
span .icon-right-open {}
}
} @else {
button disabled class="outline secondary" {
"Next"
"Next "
span .icon-right-open {}
}
}
@if let Some(latest_commit_path) = latest_commit_path {
@@ -899,8 +913,8 @@ async fn render_history(
Ok(html! {
(DOCTYPE)
html {
head lang="en" {
html lang="en" {
head {
meta charset="utf-8";
title { (project_short_name) " • Progress History" }
(header())
css/main.scss
+51 -6
View File
@@ -109,10 +109,6 @@ $breakpoints: (
--pico-code-kbd-background-color: #333;
--progress-background-color: #{$slate-800};
--progress-stripe-color: rgba(255, 255, 255, 0.15);
.platform-icon {
filter: invert(1);
}
}
[data-theme=dark] {
@@ -125,6 +121,50 @@ $breakpoints: (
}
}
@font-face {
font-family: 'icons';
src: url('../assets/icons.woff2') format('woff2');
font-weight: normal;
font-style: normal;
font-display: block;
}
[class^="icon-"], [class*=" icon-"] {
font-size: 0.9em;
line-height: 1em;
&:before {
display: inline-block;
width: 1em;
font-family: "icons";
font-style: normal;
font-weight: normal;
font-variant: normal;
text-decoration: inherit;
text-align: center;
text-transform: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
}
.icon-history:before { content: '\e800'; }
.icon-cog:before { content: '\e801'; }
.icon-theme-light-dark:before { content: '\e802'; }
.icon-chart-line:before { content: '\e803'; }
.icon-github-circled:before { content: '\e804'; }
.icon-left-open:before { content: '\e805'; }
.icon-right-open:before { content: '\e806'; }
.icon-gc:before { content: '\ea00'; }
.icon-wii:before { content: '\ea01'; }
.icon-n64:before { content: '\ea02'; }
.icon-gba:before { content: '\ea03'; }
.icon-nds:before { content: '\ea04'; }
.icon-switch:before { content: '\ea05'; }
.icon-ps:before { content: '\ea06'; }
.icon-ps2:before { content: '\ea07'; }
// Override the tooltip component
[data-tooltip]:not(a, button, input) {
border-bottom: none;
@@ -157,6 +197,12 @@ nav {
}
}
#theme-toggle {
font-size: 1.33rem;
vertical-align: middle;
text-decoration: none;
}
@keyframes progress-stripes {
0% {
background-position: 0 0
@@ -273,8 +319,7 @@ $unit-size: 0.75rem;
}
.platform-icon {
width: 1.5rem;
height: 1.5rem;
font-size: 1.5rem;
}
}