github/qBittorrent
1
0
Fork 0
mirror of https://github.com/qbittorrent/qBittorrent synced 2025-08-22 06:13:36 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

apply suggections

Browse source 
Co-authored-by: Chocobo1 <Chocobo1@users.noreply.github.com>
This commit is contained in:
tehcneko 2025-05-25 17:38:29 +08:00
commit 0d1a8fcddf
1 changed files with 12 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

24
src/webui/www/private/scripts/progressbar.js
View file

@ -38,9 +38,7 @@ window.qBittorrent.ProgressBar ??= (() => {
class ProgressBar extends HTMLElement { class ProgressBar extends HTMLElement {
static #progressBarUniqueId = 0; static #progressBarUniqueId = 0;
static #styles = {
#value = 0;
#styles = {
height: 12, height: 12,
darkbg: "var(--color-background-blue)", darkbg: "var(--color-background-blue)",
darkfg: "var(--color-text-white)", darkfg: "var(--color-text-white)",
@ -48,6 +46,8 @@ window.qBittorrent.ProgressBar ??= (() => {
lightfg: "var(--color-text-default)", lightfg: "var(--color-text-default)",
}; };
#value = 0;
#id = ++ProgressBar.#progressBarUniqueId; #id = ++ProgressBar.#progressBarUniqueId;
#light = document.createElement("div"); #light = document.createElement("div");
@ -57,33 +57,33 @@ window.qBittorrent.ProgressBar ??= (() => {
super(); super();
this.#dark.style.width = "100%"; this.#dark.style.width = "100%";
this.#dark.style.height = `${this.#styles.height}px`; this.#dark.style.height = `${ProgressBar.#styles.height}px`;
this.#dark.style.background = this.#styles.darkbg; this.#dark.style.background = ProgressBar.#styles.darkbg;
this.#dark.style.boxSizing = "content-box"; this.#dark.style.boxSizing = "content-box";
this.#dark.style.color = this.#styles.darkfg; this.#dark.style.color = ProgressBar.#styles.darkfg;
this.#dark.style.position = "absolute"; this.#dark.style.position = "absolute";
this.#dark.style.textAlign = "center"; this.#dark.style.textAlign = "center";
this.#dark.style.left = "0"; this.#dark.style.left = "0";
this.#dark.style.top = "0"; this.#dark.style.top = "0";
this.#dark.style.lineHeight = `${this.#styles.height}px`; this.#dark.style.lineHeight = `${ProgressBar.#styles.height}px`;
this.#light.style.width = "100%"; this.#light.style.width = "100%";
this.#light.style.height = `${this.#styles.height}px`; this.#light.style.height = `${ProgressBar.#styles.height}px`;
this.#light.style.background = this.#styles.lightbg; this.#light.style.background = ProgressBar.#styles.lightbg;
this.#light.style.boxSizing = "content-box"; this.#light.style.boxSizing = "content-box";
this.#light.style.color = this.#styles.lightfg; this.#light.style.color = ProgressBar.#styles.lightfg;
this.#light.style.position = "absolute"; this.#light.style.position = "absolute";
this.#light.style.textAlign = "center"; this.#light.style.textAlign = "center";
this.#light.style.left = "0"; this.#light.style.left = "0";
this.#light.style.top = "0"; this.#light.style.top = "0";
this.#light.style.lineHeight = `${this.#styles.height}px`; this.#light.style.lineHeight = `${ProgressBar.#styles.height}px`;
this.attachShadow({ mode: "open" }); this.attachShadow({ mode: "open" });
this.shadowRoot.host.id = this.#id; this.shadowRoot.host.id = this.#id;
this.shadowRoot.host.style.display = "block"; this.shadowRoot.host.style.display = "block";
this.shadowRoot.host.style.border = "1px solid var(--color-border-default)"; this.shadowRoot.host.style.border = "1px solid var(--color-border-default)";
this.shadowRoot.host.style.boxSizing = "content-box"; this.shadowRoot.host.style.boxSizing = "content-box";
this.shadowRoot.host.style.height = `${this.#styles.height}px`; this.shadowRoot.host.style.height = `${ProgressBar.#styles.height}px`;
this.shadowRoot.host.style.position = "relative"; this.shadowRoot.host.style.position = "relative";
this.shadowRoot.host.style.margin = "0 auto"; this.shadowRoot.host.style.margin = "0 auto";
this.shadowRoot.appendChild(this.#dark); this.shadowRoot.appendChild(this.#dark);