(function flexible(window, document) {
  const docEl = document.documentElement;
  // const dpr = window.devicePixelRatio || 1;
  const dpr =  1;

  // adjust body font size
  function setBodyFontSize() {
    if (document.body) {
      document.body.style.fontSize = 12 * dpr + "px";
    } else {
      document.addEventListener("DOMContentLoaded", setBodyFontSize);
    }
  }
  setBodyFontSize();

  const browser = {
    versions: (function () {
      const u = navigator.userAgent;
      //   const app = navigator.appVersion;
      return {
        trident: u.includes("Trident") > -1,
        presto: u.includes("Presto") > -1,
        webkit: u.includes("AppleWebkit") > -1,
        gecko: u.includes("Gecko") > -1,
        mobile: !!u.match(/AppleWebKit.*Mobile.*/),
        ios: !!u.match(/\(i[^;]+;(U;)? CPU.+Mac OS X/),
        android: u.includes("Android") > -1,
        iPhone: u.includes("iPhone") > -1,
        iPad: u.includes("iPad") > -1,
      };
    })(),
  };

  function refreshRem() {
    let width = docEl.getBoundingClientRect().width;
    if (!browser.versions.mobile) {
      if (width > 1920) {
        width = 1920;
      } else if (width < 1200) {
        width = 1200;
      }
    }

    if (width / dpr > 540) {
      width = width * dpr;
    }
    let rem;
    // console.log(browser.versions.mobile);
    if (browser.versions.mobile) {
      rem = width / 7.5;
    } else {
      // >1600
      rem = width / 19.2;
    }
    docEl.style.fontSize = rem + "px";
    flexible.rem = window.rem = rem;
  }
  refreshRem();
  //   由于我们设计稿pc宽度为1920，移动端宽度为750，所以在使得100px=1rem的基准下，分别使得当前width/19.2和width/7.5。

  //   // set 1rem = viewWidth / 10
  //   function setRemUnit() {
  //     const rem = docEl.clientWidth / 10;
  //     docEl.style.fontSize = rem + "px";
  //   }
  //   setRemUnit();

  // reset rem unit on page resize
  window.addEventListener("resize", refreshRem);
  window.addEventListener("pageshow", function (e) {
    if (e.persisted) {
      refreshRem();
    }
  });

  // detect 0.5px supports
  if (dpr >= 2) {
    const fakeBody = document.createElement("body");
    const testElement = document.createElement("div");
    testElement.style.border = ".5px solid transparent";
    fakeBody.appendChild(testElement);
    docEl.appendChild(fakeBody);
    if (testElement.offsetHeight === 1) {
      docEl.classList.add("hairlines");
    }
    docEl.removeChild(fakeBody);
  }
})(window, document);
