A very simple single-file PDS home page to list active users
at main 4.8 kB view raw
1<!doctype html> 2<html lang="en"> 3 <head> 4 <meta charset="utf-8" /> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 6 <title>PDS Homepage</title> 7 <link rel="preconnect" href="https://fonts.bunny.net" /> 8 <link 9 href="https://fonts.bunny.net/css?family=actor:400|coiny:400" 10 rel="stylesheet" 11 /> 12 <script type="importmap"> 13 { 14 "imports": { 15 "@atcute/client": "https://unpkg.com/react@18/umd/react.development.js" 16 } 17 } 18 </script> 19 <link rel="stylesheet" href="src/reset.css" /> 20 <link rel="stylesheet" href="src/style.css" /> 21 </head> 22 <body> 23 <main> 24 <svg class="atproto-logo" aria-hidden="true" viewBox="0 0 28 28"> 25 <path 26 d="M14.362 27.78c-1.956 0-3.756-.324-5.4-.972-1.644-.648-3.072-1.566-4.284-2.754a12.247 12.247 0 0 1-2.808-4.158c-.66-1.596-.99-3.33-.99-5.202 0-2.232.342-4.212 1.026-5.94.696-1.728 1.656-3.18 2.88-4.356a12.48 12.48 0 0 1 4.284-2.7c1.632-.612 3.378-.918 5.238-.918 2.28 0 4.278.354 5.994 1.062 1.716.708 3.144 1.668 4.284 2.88a11.706 11.706 0 0 1 2.538 4.158c.552 1.548.804 3.168.756 4.86-.06 2.328-.546 4.116-1.458 5.364-.912 1.236-2.328 1.854-4.248 1.854a5.839 5.839 0 0 1-2.826-.702 3.703 3.703 0 0 1-1.764-2.07l1.044.054c-.492.924-1.164 1.572-2.016 1.944a6.464 6.464 0 0 1-2.61.558c-1.212 0-2.28-.258-3.204-.774a5.682 5.682 0 0 1-2.178-2.214c-.528-.948-.792-2.046-.792-3.294 0-1.284.276-2.394.828-3.33a5.77 5.77 0 0 1 2.232-2.196c.936-.516 1.992-.774 3.168-.774.78 0 1.59.162 2.43.486.852.324 1.512.78 1.98 1.368l-.738.936V8.664h2.412l-.054 6.462c0 .924.18 1.62.54 2.088.36.468.894.702 1.602.702.624 0 1.104-.174 1.44-.522.348-.36.588-.846.72-1.458a10.66 10.66 0 0 0 .252-2.106c.036-1.86-.24-3.426-.828-4.698-.588-1.272-1.386-2.298-2.394-3.078a9.499 9.499 0 0 0-3.294-1.71c-1.2-.36-2.394-.54-3.582-.54-1.68 0-3.174.27-4.482.81-1.308.528-2.412 1.278-3.312 2.25-.888.96-1.56 2.1-2.016 3.42-.444 1.308-.654 2.748-.63 4.32.048 1.56.33 2.964.846 4.212a9.324 9.324 0 0 0 2.16 3.204 9.38 9.38 0 0 0 3.276 2.034c1.26.468 2.64.702 4.14.702.84 0 1.674-.096 2.502-.288.84-.18 1.608-.438 2.304-.774l1.026 2.808c-.924.432-1.896.75-2.916.954a14.649 14.649 0 0 1-3.078.324Zm-.144-10.098c.852 0 1.566-.246 2.142-.738.576-.492.864-1.326.864-2.502 0-1.068-.258-1.872-.774-2.412-.504-.552-1.218-.828-2.142-.828-1.092 0-1.908.288-2.448.864-.54.576-.81 1.368-.81 2.376 0 1.032.276 1.83.828 2.394.564.564 1.344.846 2.34.846Z" 27 ></path> 28 </svg> 29 <h1>finxol's PDS</h1> 30 <p> 31 This is an atproto PDS operated by 32 <a href="https://finxol.io" target="_blank">finxol</a>. 33 <br /> 34 You can find more information about what that means on the 35 <a 36 href="https://atproto.com/guides/glossary#pds-personal-data-server" 37 > 38 atproto website </a 39 >. 40 </p> 41 42 <p> 43 If you'd like to migrate your atproto account to this PDS, 44 <br class="desktop-only" /> 45 feel free to 46 <a 47 href="https://bsky.app/profile/did:plc:hpmpe3pzpdtxbmvhlwrevhju" 48 >DM me on Bluesky</a 49 > 50 or 51 <a href="mailto:contact@finxol.io">send me an email</a>. 52 </p> 53 </main> 54 55 <section class="users"> 56 <h3>Users</h3> 57 58 <noscript> 59 To view the list of accounts hosted on this PDS, please activate 60 Javascript. 61 </noscript> 62 63 <p>No users found on this PDS</p> 64 65 <svg 66 width="24" 67 height="24" 68 viewBox="0 0 24 24" 69 xmlns="http://www.w3.org/2000/svg" 70 id="users__spinner" 71 > 72 <style> 73 .spinner_P7sC { 74 transform-origin: center; 75 animation: spinner_svv2 0.75s infinite linear; 76 } 77 @keyframes spinner_svv2 { 78 100% { 79 transform: rotate(360deg); 80 } 81 } 82 </style> 83 <path 84 d="M10.14,1.16a11,11,0,0,0-9,8.92A1.59,1.59,0,0,0,2.46,12,1.52,1.52,0,0,0,4.11,10.7a8,8,0,0,1,6.66-6.61A1.42,1.42,0,0,0,12,2.69h0A1.57,1.57,0,0,0,10.14,1.16Z" 85 class="spinner_P7sC" 86 /> 87 </svg> 88 </section> 89 </body> 90 91 <script type="module" src="src/main.ts"></script> 92</html>