red box for not started sections
This commit is contained in:
parent
b53fe3ac94
commit
45368c13e6
5 changed files with 24 additions and 3 deletions
|
|
@ -96,7 +96,7 @@ If you like the tool and wish it developed further with more functions and easie
|
|||
|
||||
— **Optimized:** Now smaller, faster and more web- and mobile-friendly than before. At least I hope 😉
|
||||
|
||||
— **Visual completion percentages** in all sections for better readability (blue = partially completed, green = fully completed)
|
||||
— **Visual completion percentages** in all sections for better readability (red = not started yet (0%), blue = partially completed, green = fully completed)
|
||||
|
||||
— **Game Status** additions:
|
||||
✅ **Charm Notches** + visuals
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -697,6 +697,12 @@ input[type="radio"] {
|
|||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.box-red {
|
||||
color: #ffe2dd;
|
||||
background: #c22e14;
|
||||
border: 2px solid #e24e34;
|
||||
}
|
||||
|
||||
.box-green {
|
||||
color: #ddffd9;
|
||||
background: #1e6c1e;
|
||||
|
|
|
|||
|
|
@ -590,6 +590,12 @@ input[type="radio"] {
|
|||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.box-red {
|
||||
color: #ffe2dd;
|
||||
background: #c22e14;
|
||||
border: 2px solid #e24e34;
|
||||
}
|
||||
|
||||
.box-green {
|
||||
color: #ddffd9;
|
||||
background: #1e6c1e;
|
||||
|
|
|
|||
|
|
@ -294,6 +294,7 @@ function CompletionHTML(jsObj, hkGameCompletion) {
|
|||
let h2id = "";
|
||||
let cl = "";
|
||||
let clGreen = "box-green";
|
||||
let clRed = "box-red";
|
||||
let cp = 0; // current Percent
|
||||
let mp = 0; // max Percent
|
||||
let fillText = "";
|
||||
|
|
@ -322,8 +323,16 @@ function CompletionHTML(jsObj, hkGameCompletion) {
|
|||
(perc % 3) ? cp = Math.floor(perc / 3): cp = perc / 3;
|
||||
}
|
||||
|
||||
// switches the box to red when a section (h2) is 0
|
||||
if (cp === 0) {
|
||||
cl = ` ${clRed}`;
|
||||
}
|
||||
// switches the box to green when a section (h2) is completed
|
||||
(cp === mp) ? cl = ` ${clGreen}`: cl = "";
|
||||
else if (cp === mp) {
|
||||
cl = ` ${clGreen}`;
|
||||
}
|
||||
// default is blue (partially completed and starting value)
|
||||
else cl = "";
|
||||
|
||||
// needed for Game Status to show percentage properly (adds a slash for all boxes except the Game Status one)
|
||||
if (jsObj[i].hasOwnProperty("percent")) cp += "/";
|
||||
|
|
|
|||
Loading…
Reference in a new issue