src/server/views/components/progress-bar.ts

   1 export interface ProgressBarOptions {
   2   startingColor: string;
   3   endingColor: string;
   4 }
   5
   6 export function ProgressBar(current: number, max: number, id: string, opts: ProgressBarOptions) {
   7   let percent = 0;
   8   if(max > 0) {
   9     percent = Math.floor((current / max) * 100);
  10   }
  11
  12   return `<div class="progress-bar" id="${id}" style="background: linear-gradient(to right, ${opts.startingColor}, ${opts.endingColor} ${percent}%, transparent ${percent}%, transparent)"
  13 title="${percent}% - ${current}/${max}">${current}/${max} - ${percent}%</div>`;
  14 }