Prototype/options.html at master · denbue/Prototype · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
<!doctype html>
<html>

<head>
  <meta charset="UTF-8">
  <title>Options</title>
  <link href="options.css" rel="stylesheet" type="text/css">
</head>

<body>
  <div class="container header">
    <img src="images/icon.svg">
    <h1><strong>Prototype</strong> &mdash; Test your ideas in real-time</h1>
  </div>
  <div class="container content">
    <p>Use Prototype to inject any stylesheet or javascript into your website. The files need to be hosted on a server (e.g. via <a href="https://pages.github.com/">Github Pages</a>) or via <code>localhost</code>.</p>
    <div>
      <p><span id="savedOptionsStatus">1</span><strong>Enter a folder URL that contains:</strong></p>
      <ul>
        <li>a CSS file named <code>prototype.css</code></li>
        <li>a JS file named <code>prototype.js</code></li>
      </ul>
    </div>
    <div>
        <p><span>2</span><strong>Activate the extension:</strong></p>
        <ul>
          <li>Select the tab you want to inject the code</li>
          <li>Click on the <img width="12" height="12" src="images/icon.svg"> icon to activate the extension. No worries, your options are saved even when you close the browser.</li>
        </ul>
      </div>

  </div>
  <div class="container full url">
    <div class="container form">
      <label for="url">Link to a folder</label>
      <input type="text" id="url" placeholder="Example: http://localhost/prototype/" />
      <button id="saveButton">Save</button>
    </div>
    <ul id="error" class="container"></ul>
  </div>

  <div class="container full footer">
    <div class="container">
      <div class="copyright">
          <img src="images/icon.svg" style="margin-right: 10px">
          <span><strong>Prototype</strong> &mdash; A Chrome extension by <a href="https://dennisbucker.com">Dennis Bücker</a></span>
      </div>
      <div class="links">
        <a href="https://github.com/denbue/Prototype/issues">Found a bug?</a>
        <a href="https://github.com/denbue/Prototype">Contribute</a>
        <a href="mailto:mail@dennisbucker.com">Contact</a>
      </div>
    </div>
  </div>


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