trimlog-ykonsole-chrome-extension/contentScript.js

function applyDefaultStyle(element) {
  element.style.position = "fixed";
  element.style.zIndex = 99999999;
  element.style.color = "#FFF";
  element.style.backgroundColor = "rgba(0, 0, 0, 0.5)";
  element.style.padding = "0.25em 0.5ch";
  element.style.fontSize = "3vmax";
}

let mCalorieCount = document.createElement("div");
mCalorieCount.id = "ykonsole-calorie-count";
applyDefaultStyle(mCalorieCount);
mCalorieCount.style.left = 0;
mCalorieCount.style.top = 0;
mCalorieCount.innerHTML = `
<b>25</b>:<b>23</b>
<br/>
<b>883</b> kal
`;
document.body.append(mCalorieCount);

let mResults = document.createElement("div");
mResults.id = "ykonsole-result";
applyDefaultStyle(mResults);
mResults.style.right = 0;
mResults.style.bottom = 0;
mResults.style.textAlign = "right";
mResults.innerHTML = `
5&nbsp;161<br/>
10&nbsp;332<br/>
15&nbsp;490<br/>
20&nbsp;712<br/>
25&nbsp;875<br/>
`;
document.body.append(mResults);

chrome.storage.sync.get('color', ({color}) => {
});