vaxandme/website/public/privacy.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="icon" href="/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <meta
      name="description"
      content="Learn about the expected side effects of COVID-19 Vaccines"
    />
    <link rel="apple-touch-icon" href="/logo192.png" />
    <link rel="manifest" href="/manifest.json" />

    <style>
      @import "/styles/variables.css";
      @import "/styles/variables-dark.css" screen and
        (prefers-color-scheme: dark);
      @import "/styles/extrasmall.css";
      @import "/styles/small.css" only screen and (min-width: 370px) and
        (max-width: 767px);
      @import "/styles/smallmedium.css" only screen and (min-width: 768px) and
        (max-width: 1023px);
      @import "/styles/medium.css" only screen and (min-width: 1024px);
      @import "/styles/large.css" only screen and (min-width: 1366px);
      @import "/styles/extralarge.css" only screen and (min-width: 1921px);
      @font-face {
        font-family: "GlacialBold";
        src: url("/fonts/glacialindifference-bold-webfont.woff2")
            format("woff2"),
          url("/fonts/glacialindifference-bold-webfont.woff") format("woff");
        font-weight: normal;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: "GlacialItalic";
        src: url("/fonts/glacialindifference-italic-webfont.woff2")
            format("woff2"),
          url("/fonts/glacialindifference-italic-webfont.woff") format("woff");
        font-weight: normal;
        font-style: normal;
        font-display: swap;
      }
      @font-face {
        font-family: "Glacial";
        src: url("/fonts/glacialindifference-regular-webfont.woff2")
            format("woff2"),
          url("/fonts/glacialindifference-regular-webfont.woff") format("woff");
        font-weight: normal;
        font-style: normal;
        font-display: swap;
      }
      [data-font="sans"] {
        font-family: "Glacial", sans-serif;
        font-display: swap;
      }
      [data-font="sans-bold"] {
        font-family: "GlacialBold", sans-serif;
        font-display: swap;
      }
      [data-font="sans-italic"] {
        font-family: "GlacialItalic", sans-serif;
        font-style: italic;
        font-display: swap;
      }
    </style>
    <title>Vax & Me | Privacy</title>
  </head>
  <body>
    <div id="root">
      <div class="app-container">
        <header>
          <div class="logo-container">
            <div class="logo"></div>
            <div class="logo-text-container">
              <p data-font="sans-bold">PRIVACY</p>
            </div>
          </div>
        </header>
        <main>
          <div class="intro">
            <h6 class="overline" data-font="sans">What's collected</h6>
            <h6 class="overline" data-font="sans">&amp; How it's used</h6>
          </div>
          <div class="question-container">
            <h6 class="subheader" data-font="sans-bold">
              USER PERSONAL INFORMATION
            </h6>
            <div class="answers-container">
              <p class="overline" data-font="sans">
                No personally indentifiable information or user data is
                collected. Vax & Me only uses Google Analytics on it's website
                to study website performance, and error prevention.
              </p>
            </div>
          </div>
          <div class="question-container">
            <h6 class="subheader" data-font="sans-bold">USER ACTIVITY</h6>
            <div class="answers-container">
              <p class="overline" data-font="sans">
                Vax & Me monitors some click, and keystrokes on it's website to
                detect functionality errors.
              </p>
            </div>
          </div>
          <div class="question-container">
            <h6 class="subheader" data-font="sans-bold">USER DATA</h6>
            <div class="answers-container">
              <p class="overline" data-font="sans">
                Volunteered data is linked to Google Analytics Client ID - which
                is unique to a device and web-browser combination. This is
                required to prevent data duplicacy and is core to the
                functionality of Vax & Me.
              </p>
            </div>
          </div>
        </main>
      </div>
    </div>
    <footer data-font="sans">
      <div class="link-container">
        <div>
          <h6 class="overline" data-font="sans">FDA Data Sources</h6>
          <a href="https://www.fda.gov/media/144416/download"
            >PFizer-BioNTech</a
          >
          <a href="https://www.fda.gov/media/144637/download">Moderna</a>
          <a href="https://www.fda.gov/media/146304/download">J&J Janssen</a>
        </div>
        <div>
          <h6 class="overline" data-font="sans">Links</h6>
          <a href="/vaxandme_chart.pdf">Download Chart</a>
          <a href="/">Home</a>
        </div>
        <div>
          <h6 class="overline" data-font="sans">Legal</h6>
          <a href="/copyright">Copyright</a>
          <a href="/privacy">Privacy</a>
        </div>
      </div>
      <div class="overline by" data-font="sans">
        Designed &amp; Developed with ❤ by Alba Rajanibala and Ayushya Amitabh
      </div>
    </footer>
  </body>
</html>