web2markdownpro/popup.html at main · ivomartins/web2markdownpro · 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
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">

  <style>
    body { width: 280px; padding: 15px; font-family: sans-serif; color: #24292f; }
    .option-group { background: #f3f4f6; padding: 10px; border-radius: 5px; margin-bottom: 10px; }
    .option { display: flex; gap: 6px; align-items: flex-start; margin: 6px 0; line-height: 1.3; }
    .actions { display: grid; gap: 8px; }
    button { width: 100%; padding: 10px; border-radius: 5px; cursor: pointer; font-weight: 600; }
    #saveBtn { background: #2ea44f; color: white; border: none; }
    #copyBtn { background: #f6f8fa; color: #24292f; border: 1px solid #d0d7de; }
    #status { min-height: 16px; font-size: 0.8em; color: #666; margin-top: 10px; text-align: center; }
    .footer { margin-top: 12px; text-align: center; }
    .footer a { color: #777; font-size: 0.75em; text-decoration: none; }
    .footer a:hover { text-decoration: underline; }
  </style>
</head>
<body>
  <div class="option-group">
    <label class="option" for="urlOnly">
      <input type="radio" id="urlOnly" name="imgOpt" value="url" checked>
      <span>Keep image URLs in Markdown</span>
    </label>
    <label class="option" for="downloadImgs">
      <input type="radio" id="downloadImgs" name="imgOpt" value="zip">
      <span>Bundle Markdown and images as ZIP</span>
    </label>
  </div>
  <div class="actions">
    <button id="saveBtn">Download</button>
    <button id="copyBtn">Copy Markdown</button>
  </div>
  <div id="status"></div>
  <div class="footer">
    <a href="https://buymeacoffee.com/ivomartins" id="supportLink">Support development</a>
  </div>

  <script src="lib/jszip.js"></script>
  <script src="popup.js"></script>
</body>
</html>