index.html

   1 <!--
   2     forgejo:buttons
   3     Copyright 2024 Tuxilio
   4
   5     This program is free software: you can redistribute it and/or modify
   6     it under the terms of the GNU General Public License as published by
   7     the Free Software Foundation, either version 3 of the License, or
   8     (at your option) any later version.
   9
  10     This program is distributed in the hope that it will be useful,
  11     but WITHOUT ANY WARRANTY; without even the implied warranty of
  12     MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  13     GNU General Public License for more details.
  14
  15     You should have received a copy of the GNU General Public License
  16     along with this program.  If not, see <https://www.gnu.org/licenses/>.
  17 -->
  18
  19 <!DOCTYPE html>
  20 <html lang="en">
  21 <head>
  22   <meta charset="UTF-8">
  23   <meta name="viewport" content="width=device-width, initial-scale=1.0">
  24   <title>Forgejo / Gitea Buttons</title>
  25   <link rel="stylesheet" href="simple.css">
  26   <script src="script.js"></script>
  27 </head>
  28 <body>
  29   <div id="navbar">
  30     <div id="navbar-logo">
  31       <a href="index.html"><img src="buttons/img/forgejo-buttons.svg" alt="Forgejo" width="200"></a>
  32       <a href="https://codeberg.org/Tuxilio/forgejo-buttons/src/branch/pages/docs/README.md">Docs</a>
  33       <a href="features/index.html">Features</a>
  34     </div>
  35
  36   </div>
  37
  38   <div id="buttons-container">
  39     <a href="#follow" class="forgejo-button" data-type="follow"><button><img src="buttons/img/forgejo-light.svg" width=15px> Follow</button></a>
  40     <a href="#watch" class="forgejo-button" data-type="watch"><button><img src="buttons/img/eye-light.svg" width=15px> Watch</button></a>
  41     <a href="#star" class="forgejo-button" data-type="star"><button><img src="buttons/img/star-light.svg" width=15px> Star</button></a>
  42     <a href="#fork" class="forgejo-button" data-type="fork"><button><img src="buttons/img/repo-forked-light.svg" width=15px> Fork</button></a>
  43     <a href="#issue" class="forgejo-button" data-type="issue"><button><img src="buttons/img/issue-opened-light.svg" width=15px> Issue</button></a>
  44     <a href="#download" class="forgejo-button" data-type="download"><button><img src="buttons/img/download-light.svg" width=15px> Download</button></a>
  45     <a href="#template" class="forgejo-button" data-type="template"><button><img src="buttons/img/repo-template-light.svg" width=15px> Use this Template</button></a>
  46     <a href="#release" class="forgejo-button" data-type="release"><button><img src="buttons/img/download-light.svg" width=15px> Releases</button></a>
  47     <a href="#custom" class="forgejo-button" data-type="custom"><button><img src="buttons/img/forgejo-light.svg" width=15px> Custom</button></a>
  48   </div>
  49
  50   <noscript>
  51     <p>Sorry, Forgejo:buttons doesn't work properly without JavaScript enabled. Please enable it to continue.</p>
  52   </noscript>
  53
  54   <div id="after-select" hidden>
  55
  56     <br>
  57
  58     <div id="user-server-input-div">
  59       <div class="input-container" style="float:left">
  60         <input type="text" id="server-url" placeholder="server url"> <span> / <br></span>
  61       </div>
  62       <div class="input-container" style="float:left">
  63          <input type="text" id="username" placeholder="username"> <span> / </span> <input type="text" id="repo-name" placeholder="repo">
  64       </div>
  65     </div>
  66
  67     <br><br><br><br>
  68
  69     <div id="default-icon-div">
  70       <input type="checkbox" id="default-icon">
  71       <label for="default-icon">Use default icon</label>
  72     </div>
  73
  74     <input type="checkbox" id="light-mode">
  75     <label for="light-mode">Dark mode</label>
  76
  77     <br>
  78
  79     <input type="checkbox" id="show-count">
  80     <label for="show-count">Hide count</label>
  81
  82     <br>
  83
  84     <input type="checkbox" id="small-button">
  85     <label for="small-button">Small button</label>
  86
  87     <br><br>
  88
  89     <div id="custom" hidden>
  90       <div class="input-container" style="float:left">
  91         <label for="icon-url">Icon URL:</label>
  92         <input type="text" id="icon-url" placeholder="icon url">
  93       </div>
  94
  95       <br><br>
  96
  97       <label for="ctype">Type:</label>
  98       <select id="ctype">
  99         <option value="follow">Follow</option>
 100         <option value="watch">Watch</option>
 101         <option value="star">Star</option>
 102         <option value="fork">Fork</option>
 103         <option value="issue">Issue</option>
 104         <option value="download">Download</option>
 105         <option value="template">Use this template</option>
 106         <option value="release">Releases</option>
 107         <option value="custom">Custom</option>
 108       </select>
 109
 110       <div id="custom-text-div">
 111         <br>
 112         <input type="checkbox" id="custom-text">
 113         <label for="custom-text">Set custom button text</label>
 114         <br>
 115       </div>
 116
 117       <div id="custom-text-input-div" hidden>
 118         <div class="input-container" style="float:left">
 119           <label for="custom-text-input">Custom button text:</label>
 120           <input type="text" id="custom-text-input" placeholder="custom text">
 121         </div>
 122       </div>
 123
 124       <div id="advanced-custom-settings" hidden>
 125         <br><br><br>
 126
 127         <div class="input-container" style="float:left">
 128           <label for="count-url">Counter API Endpoint:</label>
 129           <input type="text" id="count-url" placeholder="count api url">
 130         </div>
 131
 132         <br><br><br>
 133
 134         <div class="input-container" style="float:left">
 135           <label for="count-name">Counter API Endpoint name:</label>
 136           <input type="text" id="count-name" placeholder="count api name">
 137         </div>
 138
 139         <br><br><br>
 140
 141         <div class="input-container" style="float:left">
 142           <label for="button-href">Button HREF:</label>
 143           <input type="text" id="button-href" placeholder="button href">
 144         </div>
 145
 146         <br><br><br>
 147
 148         <div class="input-container" style="float:left">
 149           <label for="count-href">Counter HREF:</label>
 150           <input type="text" id="count-href" placeholder="count href">
 151         </div>
 152       </div>
 153
 154       <br><br>
 155     </div>
 156
 157     <div id="output">
 158       <textarea id="output-code" rows="4" cols="50" onclick="this.select();"></textarea>
 159     </div>
 160
 161     <br>
 162
 163     <div id="preview" style="background-color: transparent;"></div>
 164     </div>
 165
 166     <br>
 167
 168     <footer>
 169       Made with <svg viewBox="0 0 1792 1792" preserveAspectRatio="xMidYMid meet" xmlns="http://www.w3.org/2000/svg" style="height: 0.8rem;"><path d="M896 1664q-26 0-44-18l-624-602q-10-8-27.5-26T145 952.5 77 855 23.5 734 0 596q0-220 127-344t351-124q62 0 126.5 21.5t120 58T820 276t76 68q36-36 76-68t95.5-68.5 120-58T1314 128q224 0 351 124t127 344q0 221-229 450l-623 600q-18 18-44 18z" fill="#e25555"></path></svg> by <a href="https://tuxilio.codeberg.page/">Tuxilio</a> | <a href="https://codeberg.org/Tuxilio/forgejo-buttons#credits">Credits</a> | <a href="https://codeberg.org/Tuxilio/forgejo-buttons">Source</a>
 170     </footer>
 171   </div>
 172 </body>
 173 </html>