From 5f6db8a9a3dfc80af1f663948ca67af2b7d72822 Mon Sep 17 00:00:00 2001
From: lowlighter <22963968+lowlighter@users.noreply.github.com>
Date: Sun, 21 Mar 2021 00:27:50 +0100
Subject: [PATCH] Use precomputed colors for achievements to avoid use of
"filter" css property
---
source/plugins/achievements/index.mjs | 40 ++++++++++++++-------------
source/templates/classic/style.css | 22 +++++++++------
2 files changed, 35 insertions(+), 27 deletions(-)
diff --git a/source/plugins/achievements/index.mjs b/source/plugins/achievements/index.mjs
index 69caf394..8c87f8ce 100644
--- a/source/plugins/achievements/index.mjs
+++ b/source/plugins/achievements/index.mjs
@@ -21,7 +21,7 @@
list.push({
title:"Developer",
text:`Published ${value} public repositor${imports.s(value, "y")}`,
- icon:"",
+ icon:"",
...rank(value, [1, 20, 50, 100]), value, unlock:new Date(unlock?.createdAt),
})
}
@@ -33,7 +33,7 @@
list.push({
title:"Forker",
text:`Forked ${value} public repositor${imports.s(value, "y")}`,
- icon:"",
+ icon:"",
...rank(value, [1, 5, 10, 20]), value, unlock:new Date(unlock?.createdAt),
})
}
@@ -46,7 +46,7 @@
list.push({
title:"Contributor",
text:`Opened ${value} pull request${imports.s(value)}`,
- icon:"",
+ icon:"",
...rank(value, [1, 200, 500, 1000]), value, unlock:new Date(unlock?.createdAt),
})
}
@@ -59,7 +59,7 @@
list.push({
title:"Manager",
text:`Created ${value} user project${imports.s(value)}`,
- icon:"",
+ icon:"",
...rank(value, [1, 2, 3, 4]), value, unlock:new Date(unlock?.createdAt),
})
}
@@ -72,7 +72,7 @@
list.push({
title:"Reviewer",
text:`Reviewed ${value} pull request${imports.s(value)}`,
- icon:"",
+ icon:"",
...rank(value, [1, 200, 500, 1000]), value, unlock:new Date(unlock?.createdAt),
})
}
@@ -85,7 +85,7 @@
list.push({
title:"Packager",
text:`Created ${value} package${imports.s(value)}`,
- icon:"",
+ icon:"",
...rank(value, [1, 5, 10, 20]), value, unlock:new Date(unlock?.createdAt),
})
}
@@ -98,7 +98,7 @@
list.push({
title:"Scripter",
text:`Published ${value} gist${imports.s(value)}`,
- icon:"",
+ icon:"",
...rank(value, [1, 20, 50, 100]), value, unlock:new Date(unlock?.createdAt),
})
}
@@ -111,7 +111,7 @@
list.push({
title:"Worker",
text:`Joined ${value} organization${imports.s(value)}`,
- icon:"",
+ icon:"",
...rank(value, [1, 2, 3, 4]), value, unlock:new Date(unlock?.createdAt),
})
}
@@ -124,7 +124,7 @@
list.push({
title:"Stargazer",
text:`Starred ${value} repositor${imports.s(value, "y")}`,
- icon:"",
+ icon:"",
...rank(value, [1, 200, 500, 1000]), value, unlock:new Date(unlock?.createdAt),
})
}
@@ -137,7 +137,7 @@
list.push({
title:"Follower",
text:`Following ${value} user${imports.s(value)}`,
- icon:"",
+ icon:"",
...rank(value, [1, 200, 500, 1000]), value, unlock:new Date(unlock?.createdAt),
})
}
@@ -150,7 +150,7 @@
list.push({
title:"Influencer",
text:`Followed by ${value} user${imports.s(value)}`,
- icon:"",
+ icon:"",
...rank(value, [1, 200, 500, 1000]), value, unlock:new Date(unlock?.createdAt),
gh:Number(`1${"0".repeat(Math.ceil(Math.log10(1+ranks.user_rank.userCount)))}`),
})
@@ -164,7 +164,7 @@
list.push({
title:"Maintainer",
text:`Maintaining a repository with ${value} star${imports.s(value)}`,
- icon:"",
+ icon:"",
...rank(value, [1, 1000, 5000, 10000]), value, unlock:new Date(unlock?.createdAt),
gh:Number(`1${"0".repeat(Math.ceil(Math.log10(1+ranks.repo_rank.repositoryCount)))}`),
})
@@ -178,7 +178,7 @@
list.push({
title:"Polyglot",
text:`Using ${value} different programming language${imports.s(value)}`,
- icon:"",
+ icon:"",
...rank(value, [1, 4, 8, 16]), value, unlock:new Date(unlock?.createdAt),
})
}
@@ -191,7 +191,7 @@
list.push({
title:"Member",
text:`Registered ${Math.floor(value)} year${imports.s(Math.floor(value))} ago`,
- icon:"",
+ icon:"",
...rank(value, [1, 3, 5, 10]), value, unlock:new Date(unlock?.createdAt),
})
}
@@ -204,7 +204,7 @@
list.push({
title:"Verified",
text:"Registered a GPG key to sign commits",
- icon:"",
+ icon:"",
rank:value ? "$" : "X", progress:1, value, unlock:new Date(unlock?.createdAt),
})
}
@@ -217,7 +217,7 @@
list.push({
title:"Explorer",
text:"Starred a topic on GitHub Explore",
- icon:"",
+ icon:"",
rank:value ? "$" : "X", progress:1, value, unlock:new Date(unlock?.createdAt),
})
}
@@ -230,7 +230,7 @@
list.push({
title:"Automater",
text:"Use GitHub Actions to automate profile updates",
- icon:"",
+ icon:"",
rank:value ? "$" : "X", progress:1, value, unlock:new Date(unlock?.createdAt),
})
}
@@ -243,7 +243,7 @@
list.push({
title:"Infographile",
text:"Fervent supporter of metrics",
- icon:"",
+ icon:"",
rank:(value)&&(login === _login) ? "$" : "X", progress:1, value, unlock:new Date(unlock?.createdAt),
})
}
@@ -256,19 +256,21 @@
list.push({
title:"Octonaut",
text:"Following octocat",
- icon:"",
+ icon:"",
rank:(value)&&(login === _login) ? "$" : "X", progress:1, value, unlock:new Date(unlock?.createdAt),
})
}
//Results
const order = {S:5, A:4, B:3, C:2, $:1, X:0}
+ const colors = {S:["#FF0000", "#FF8500"], A:["#B59151", "#FFD576"], B:["#7D6CFF", "#B2A8FF"], C:["#2088FF", "#79B8FF"], $:["#FF48BD", "#FF92D8"], X:["#7A7A7A", "#B0B0B0"]}
const achievements = list
.filter(a => (order[a.rank] >= order[threshold])||((a.rank === "$")&&(secrets)))
.filter(a => (!only.length)||((only.length)&&(only.includes(a.title.toLocaleLowerCase()))))
.filter(a => !ignored.includes(a.title.toLocaleLowerCase()))
.sort((a, b) => (order[b.rank]+b.progress*0.99) - (order[a.rank]+a.progress*0.99))
.map(({title, unlock, ...achievement}) => ({title:({S:`Master ${title.toLocaleLowerCase()}`, A:`Super ${title.toLocaleLowerCase()}`, B:`Great ${title.toLocaleLowerCase()}`}[achievement.rank] ?? title), unlock:!/invalid date/i.test(unlock) ? `${imports.date(unlock, {timeStyle:"short", timeZone:data.config.timezone?.name})} on ${imports.date(unlock, {dateStyle:"short", timeZone:data.config.timezone?.name})}` : null, ...achievement}))
+ .map(({icon, ...achievement}) => ({icon:icon.replace(/#primary/g, colors[achievement.rank][0]).replace(/#secondary/g, colors[achievement.rank][1]), ...achievement}))
.slice(0, limit || Infinity)
return {list:achievements}
}
diff --git a/source/templates/classic/style.css b/source/templates/classic/style.css
index 4b323929..c4b870ab 100644
--- a/source/templates/classic/style.css
+++ b/source/templates/classic/style.css
@@ -858,35 +858,41 @@
font-size: 14px;
color: #58A6FF;
}
+ .achievement .gauge.info {
+ color: #58A6FF;
+ }
.achievement.x .title {
color: #666666;
}
- .achievement.x .icon {
- filter: grayscale(1) opacity(.5);
+ .achievement.x .gauge.info {
+ color: #B0B0B0;
}
.achievement.b .title {
color: #9D8FFF;
}
- .achievement.b .icon {
- filter: hue-rotate(35deg);
+ .achievement.b .gauge.info {
+ color: #9E91FF;
}
.achievement.a .title {
color: #D79533;
}
- .achievement.a .icon {
- filter: sepia() saturate(2);
+ .achievement.a .gauge.info {
+ color: #E7BD69;
}
.achievement.s .title {
color: #FF0000;
}
+ .achievement.s .gauge.info {
+ color: #FF0000;
+ }
.achievement.s .icon {
filter: sepia() saturate(100);
}
.achievement.secret .title{
color: #FF76CD;
}
- .achievement.secret .icon {
- filter: hue-rotate(100deg);
+ .achievement.secret .gauge.info {
+ color: #FF79D1;
}
.achievement .gh {
border: 1px solid currentColor;