static, scriptless homepage for my pds (pds.jeanmachine.dev)
0
fork

Configure Feed

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

mobile compatibility changes

+36 -1
+34 -1
index.css
··· 32 32 font-family: "Maple Mono", monospace; 33 33 font-size: 14px; 34 34 margin: 5px; 35 + margin-top: 13px; 35 36 } 36 37 37 38 header { 38 39 display: flex; 39 40 align-items: center; 40 41 width: 100%; 41 - border-bottom: 1px solid var(--overlay); 42 42 } 43 43 44 44 header img { ··· 53 53 font-size: 13px; 54 54 font-style: initial; 55 55 margin: 0; 56 + } 57 + 58 + .mobile-title { 59 + display: none; 60 + color: var(--bg); 61 + text-decoration: underline; 62 + font-style: italic; 63 + text-shadow: 64 + -1px -1px 0 var(--accent), 65 + 1px -1px 0 var(--accent), 66 + -1px 1px 0 var(--accent), 67 + 1px 1px 0 var(--accent); 68 + margin: 0; 69 + } 70 + 71 + @media (max-width: 600px) { 72 + .ascii { 73 + display: none; 74 + } 75 + 76 + .mobile-title { 77 + display: block; 78 + } 79 + 80 + header img { 81 + max-height: 100px; 82 + } 83 + } 84 + 85 + hr { 86 + border: none; 87 + border-top: 4px double var(--overlay); 88 + overflow: visible; 56 89 } 57 90 58 91 .links {
+2
index.html
··· 10 10 <body> 11 11 <header> 12 12 <img src="assets/logo.svg" alt="logo" /> 13 + <h1 class="mobile-title">pds.<wbr />jeanmachine.dev</h1> 13 14 <pre class="ascii"> 14 15 __ _ __ _ __ 15 16 ___ ___/ /__ (_)__ ___ ____ __ _ ___ _____/ / (_)__ ___ ___/ /__ _ __ ··· 19 20 </pre 20 21 > 21 22 </header> 23 + <hr /> 22 24 23 25 <p style="font-style: italic"> 24 26 This is an AT Protocol Personal Data Server (aka, an atproto PDS)