src/html/options.html - master - githubmirror/bypass-paywalls-chrome

src/html/options.html
149 строк3 KB
Adam
Fix nzz.ch
09 июл 2020, 06:29
09 июл 2020, 06:29c12ea50
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Bypass Paywalls Options</title>
  <style>
    html {
      min-width: 350px;
      max-width: 400px;
    }
    body {
      min-width: 350px;
      max-width: 400px;
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: column;
      font-family: sans-serif;
    }

    #bypass_sites label {
      display: block;
    }

    #tabs {
      display: none;
      background-color: #ccc;
    }

    #tabs button {
      flex-grow: 1;
      background: #ddd;
      text-shadow: none;
      margin: 0;
      padding: 0;
      border: none;
      padding-bottom: 3px;
      border-bottom: 1px solid #666;
      border-right: solid 1px #ccc;
      border-radius: 0;
    }

    #tabs button:last-of-type {
      border-right: none;
    }

    #tabs button.active {
      background-color: #fff;
      color: black;
      padding-bottom: 0;
      border-bottom: solid blue 4px;
    }

    .tab-cell {
      height: 2em;
    }

    .pane {
      height: 520px;
      display: none;
      flex-direction: column;
    }

    p {
      margin: 0;
      padding: .5em 0;
      line-height: 1.3em;
    }

    #select-all {
      border-top: solid 1px #aaa;
      background: #eee;
      padding: 4px 0;
    }

    #bypass_sites {
      border-bottom: solid 1px #aaa;
      flex-grow: 1;
      overflow-y: auto;
      padding-bottom: 4px;
    }

    input[type=checkbox] {
      margin: 0 .5em;
    }

    .pane, #controls {
      padding: 0 1em;
    }

    #controls {
      align-self: flex-end;
      padding: 1em;
    }

    .pane.active {
      display: flex;
    }

    #custom textarea {
      flex-grow: 1;
    }

    body.customSitesEnabled #tabs {
      display: flex;
    }

    #status {
      display: inline-block;
      margin-right: 1em;
    }
  </style>
</head>
<body>
  <div id="tabs">
    <button data-pane="sites" class="tab-cell">Supported Sites</button>
    <button data-pane="custom" class="tab-cell">Custom Sites</button>
  </div>

  <div id="sites" class="pane">
    <p>
      Selected sites will have their cookies cleared and referer set to Google. You should
      uncheck sites you are logged in to otherwise you will be logged out on every visit.
    </p>
    <label id="select-all"><input checked type="checkbox"><em>Select all/none</em></label>
    <div id='bypass_sites'></div>
  </div>

  <div id="custom" class="pane">
    <p>
      To try bypassing other sites enter domain names here (one domain per line). Sites below will be have their cookies removed and attempted to be browsed as the Googlebot.
    </p>
    <p>
    <span style="color: #900; font-weight: bold">This feature is provided "as is" and will not work with many sites.</span>
    Do not report issues with sites entered here.
    </p>
    <textarea id="custom_sites" placeholder="e.g.,&#10;campaignlive.co.uk&#10;cincinnati.com&#10;hk.appledaily.com&#10;" /></textarea>
  </div>

  <div id="controls">
    <div id="status"></div>
    <button id="save">Save</button>
  </div>

  <script src="../js/common.js"></script>
  <script src="../js/sites.js"></script>
  <script src="../js/options.js"></script>
</body>
</html>