⭐ Moe-Counter Compatible Website Hit Counter Written in Gleam mayu.due.moe
hit-counter svg moe
1
fork

Configure Feed

Select the types of activity you want to include in your feed.

feat(index.html): random image on desktop

Fuwn c859a509 06cadd77

+75 -2
+75 -2
index.html
··· 33 33 0 6px 20px -3px rgba(0, 0, 0, 0.2); 34 34 } 35 35 36 - img { 36 + .example-image { 37 37 display: block; 38 38 margin: 10px 0; 39 39 width: 100%; ··· 156 156 select { 157 157 margin-bottom: unset; 158 158 } 159 + 160 + .mascot { 161 + display: none; 162 + } 163 + } 164 + 165 + @media (min-width: 768px) { 166 + .mascot { 167 + position: fixed; 168 + bottom: 0; 169 + right: 20px; 170 + width: 300px; 171 + margin: 0; 172 + border-radius: 0; 173 + z-index: -1; 174 + } 159 175 } 160 176 </style> 161 177 ··· 167 183 Enter the username you'd like to use as the ID of your counter. 168 184 </p> 169 185 170 - <input type="text" id="idInput" placeholder="@demo" /> 186 + <input type="text" id="idInput" placeholder="demo" /> 171 187 172 188 <p></p> 173 189 ··· 197 213 id="example" 198 214 src="https://counter.due.moe/get/@demo" 199 215 alt="Example counter" 216 + class="example-image" 200 217 /> 201 218 202 219 <pre id="copy-codes" class="copy-codes">hi</pre> ··· 213 230 </div> 214 231 </main> 215 232 233 + <img 234 + src="https://i.imgur.com/efamPLp.png" 235 + alt="Mascot" 236 + class="mascot" 237 + title="Mascot" 238 + /> 239 + 216 240 <script> 217 241 let inputTimeout; 218 242 const idInput = document.getElementById("idInput"); ··· 227 251 image.src = `https://counter.due.moe/get/@${inputValue}?theme=${themeValue}`; 228 252 copyCodesInput.innerText = `![${inputValue}](${image.src})\n\n<img src="${image.src}" alt="${inputValue}" />`; 229 253 }; 254 + const mascots = [ 255 + { name: "Akaza Akari", image: "https://i.imgur.com/efamPLp.png" }, 256 + { name: "Akemi Homura", image: "https://i.imgur.com/8v6aSbV.png" }, 257 + { name: "Akiyama Mio", image: "https://i.imgur.com/fgbEdWe.png" }, 258 + { name: "Ali Baba", image: "https://i.imgur.com/FWC00jB.png" }, 259 + { name: "Cirno", image: "https://i.imgur.com/u65u8oN.png" }, 260 + { name: "Fubuki Atsuya", image: "https://i.imgur.com/97DaEBD.png" }, 261 + { name: "Gasai Yuno", image: "https://i.imgur.com/BurJnOd.png" }, 262 + { name: "Hatsune Miku", image: "https://i.imgur.com/HsqOvDJ.png" }, 263 + { name: "Hirasawa Yui", image: "https://i.imgur.com/ZttwSus.png" }, 264 + { 265 + name: "Hitagi Senjougahara", 266 + image: "https://i.imgur.com/ttQDirH.png", 267 + }, 268 + { name: "Horo", image: "https://i.imgur.com/4F6BAMZ.png" }, 269 + { name: "Kaname Madoka", image: "https://i.imgur.com/TVlagl3.png" }, 270 + { name: "Kikuchi Makoto", image: "https://i.imgur.com/aXVz09Y.png" }, 271 + { name: "Kirisame Marisa", image: "https://i.imgur.com/MCvbGgt.png" }, 272 + { name: "Kisaragi Chihaya", image: "https://i.imgur.com/4Hdd0R8.png" }, 273 + { name: "Kousaka Kirino", image: "https://i.imgur.com/E0sdnuC.png" }, 274 + { name: "Kurisu Makise", image: "https://i.imgur.com/pMNliiX.png" }, 275 + { name: "Kuriyama Mirai", image: "https://i.imgur.com/TwcfQPD.png" }, 276 + { name: "Kuroko no Basuke", image: "https://i.imgur.com/FNgiG0D.png" }, 277 + { name: "Mashiro Shiina", image: "https://i.imgur.com/BxJylsO.png" }, 278 + { name: "Mayoi Hachikuji", image: "https://i.imgur.com/Xgzke7s.png" }, 279 + { name: "Miyamoto Konatsu", image: "https://i.imgur.com/GhwBI5n.png" }, 280 + { name: "Nagase Iori", image: "https://i.imgur.com/SRWU4e1.png" }, 281 + { name: "Nakano Azusa", image: "https://i.imgur.com/pfqZLHo.png" }, 282 + { name: "Poko Fox", image: "https://i.imgur.com/OF68sMQ.png" }, 283 + { name: "Remilia Scarlet", image: "https://i.imgur.com/3YSqyiI.png" }, 284 + { name: "Ruri Gokou", image: "https://i.imgur.com/UtjqvU6.png" }, 285 + { name: "Saber", image: "https://i.imgur.com/H7GtZ9j.png" }, 286 + { name: "Shana", image: "https://i.imgur.com/MPD95PX.png" }, 287 + { name: "Touwa Erio", image: "https://i.imgur.com/AFINQjc.png" }, 288 + { name: "Yin", image: "https://i.imgur.com/rddrYFR.png" }, 289 + { name: "Yoko Littner", image: "https://i.imgur.com/bEPA1rz.png" }, 290 + { 291 + name: "Yukinoshita Yukino", 292 + image: "https://i.imgur.com/uu6Dh0I.png", 293 + }, 294 + { name: "Yuuki Asuna", image: "https://i.imgur.com/283FX36.png" }, 295 + { name: "Yuzuki Yukari", image: "https://i.imgur.com/84HOYIc.png" }, 296 + ]; 230 297 231 298 copyCodesInput.innerText = `![${inputValue}](${image.src})\n\n<img src="${image.src}" alt="${inputValue}" />`; 232 299 ··· 236 303 inputTimeout = setTimeout(set, 500); 237 304 }); 238 305 themeSelect.addEventListener("change", set); 306 + 307 + const randomMascot = mascots[Math.floor(Math.random() * mascots.length)]; 308 + 309 + document.querySelector(".mascot").src = randomMascot.image; 310 + document.querySelector(".mascot").alt = randomMascot.name; 311 + document.querySelector(".mascot").title = randomMascot.name; 239 312 </script> 240 313 </body> 241 314 </html>