khairul169/honey
1
0
Fork 0
mirror of https://github.com/khairul169/honey.git synced 2025-04-28 14:59:32 +07:00
Code Issues Actions Packages Projects Releases Wiki Activity

Overview: animate services count value

Browse Source
This commit is contained in:
Daniel 2023-10-30 13:06:55 +01:00
parent 5a7d7ece3d
commit b1dc8c2772
2 changed files with 18 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
css/Pages/More/Overview.css
View File

@ -12,9 +12,26 @@
font-size: 80px; font-size: 80px;
} }
@property --value {
syntax: '<integer>';
initial-value: 0;
inherits: false;
}
.overview .big { .overview .big {
font-size: 64px; font-size: 64px;
margin-bottom: -4px; margin-bottom: -4px;
counter-reset: value var(--value);
transition: --value 1.2s;
}
.page:not(.current) .overview .big {
--value: 0 !important;
transition: --value 0s .5s;
}
.overview .big::after {
content: counter(value);
} }
.overview .small { .overview .small {

2
js/UI/More/Overview/Overview.js
View File

@ -27,7 +27,7 @@ export default class Overview {
stats.secure += analysis.isSecure stats.secure += analysis.isSecure
stats.thirdParties += analysis.isThirdParty stats.thirdParties += analysis.isThirdParty
} }
this.div.querySelector(".big").innerText = stats.total this.div.querySelector(".big").setAttribute("style", `--value: ${stats.total}`)
this.div.querySelector(".small").innerText = `Available service${s(stats.total)}` this.div.querySelector(".small").innerText = `Available service${s(stats.total)}`
let encryption_t, encryption_d let encryption_t, encryption_d