Bluesky app fork with some witchin' additions 馃挮
at 5ee667f307bc459ba53cdaabdad00a0ea1ee6846 199 lines 6.1 kB view raw
1<!DOCTYPE html> 2<html> 3 <head> 4 <meta charset="utf-8"> 5 <meta name="theme-color"> 6 <!-- 7 This viewport works for phones with notches. 8 It's optimized for gestures by disabling global zoom. 9 --> 10 <meta 11 name="viewport" 12 content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1.00001, viewport-fit=cover" 13 /> 14 <!-- 15 Preconnect to essential domains 16 --> 17 <link rel="preconnect" href="https://bsky.social"> 18 <link rel="preconnect" href="https://go.bsky.app"> 19 <title>%WEB_TITLE%</title> 20 21 <link rel="preload" as="font" type="font/woff2" href="/static/media/InterVariable.c504db5c06caaf7cdfba.woff2" crossorigin> 22 <link rel="stylesheet" href="/static/style.css"> 23 24 <style> 25 /** 26 * Minimum styles required to render splash. 27 * 28 * ALL OTHER STYLES BELONG IN `src/style.css` 29 * 30 * THIS NEEDS TO BE DUPLICATED IN `bskyweb/templates/base.html` 31 */ 32 @font-face { 33 font-family: 'InterVariable'; 34 src: url(/static/media/InterVariable.c504db5c06caaf7cdfba.woff2) format('woff2'); 35 font-weight: 300 1000; 36 font-style: normal; 37 font-display: swap; 38 } 39 @font-face { 40 font-family: 'InterVariableItalic'; 41 src: url(/static/media/InterVariable-Italic.01dcbad1bac635f9c9cd.woff2) format('woff2'); 42 font-weight: 300 1000; 43 font-style: italic; 44 font-display: swap; 45 } 46 html, 47 body { 48 margin: 0px; 49 padding: 0px; 50 font-family: InterVariable, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Liberation Sans', Helvetica, Arial, sans-serif; 51 text-rendering: optimizeLegibility; 52 /* Platform-specific reset */ 53 -webkit-overflow-scrolling: touch; 54 -webkit-text-size-adjust: 100%; 55 -webkit-font-smoothing: antialiased; 56 -moz-osx-font-smoothing: grayscale; 57 -ms-overflow-style: scrollbar; 58 font-synthesis-weight: none; 59 } 60 :root { 61 --text: black; 62 --background: white; 63 --backgroundLight: #e2e7ee; 64 } 65 @media (prefers-color-scheme: dark) { 66 :root { 67 color-scheme: dark; 68 --text: white; 69 --background: black; 70 --backgroundLight: #232e3e; 71 } 72 } 73 html, 74 body, 75 #root { 76 display: flex; 77 flex: 1 0 auto; 78 min-height: 100%; 79 width: 100%; 80 } 81 html.theme--light, 82 html.theme--light body, 83 html.theme--light #root { 84 background-color: white; 85 --text: black; 86 --background: white; 87 --backgroundLight: #DCE2EA; 88 } 89 html.theme--dark, 90 html.theme--dark body, 91 html.theme--dark #root { 92 color-scheme: dark; 93 background-color: black; 94 --text: white; 95 --background: black; 96 --backgroundLight: #232E3E; 97 } 98 html.theme--dim, 99 html.theme--dim body, 100 html.theme--dim #root { 101 color-scheme: dark; 102 background-color: #151D28; 103 --text: white; 104 --background: #151D28; 105 --backgroundLight: #2C3A4E; 106 } 107 #splash { 108 display: flex; 109 position: fixed; 110 top: 0; 111 bottom: 0; 112 left: 0; 113 right: 0; 114 align-items: center; 115 justify-content: center; 116 } 117 #splash svg { 118 position: relative; 119 top: -50px; 120 width: 100px; 121 } 122 /** 123 * We need these styles to prevent shifting due to scrollbar show/hide on 124 * OSs that have them enabled by default. This also handles cases where the 125 * screen wouldn't otherwise scroll, and therefore hide the scrollbar and 126 * shift the content, by forcing the page to show a scrollbar. 127 */ 128 body { 129 width: 100%; 130 overflow-y: scroll; 131 } 132 </style> 133 <script> 134 const theme = localStorage.getItem('ALF_THEME') 135 if (theme) { 136 document.documentElement.classList.add(`theme--${theme}`) 137 } 138 </script> 139 </head> 140 141 <body> 142 <!-- 143 A generic no script element with a reload button and a message. 144 Feel free to customize this however you'd like. 145 --> 146 <noscript> 147 <form 148 action="" 149 style=" 150 background-color: #fff; 151 position: fixed; 152 top: 0; 153 left: 0; 154 right: 0; 155 bottom: 0; 156 z-index: 9999; 157 " 158 > 159 <div 160 style=" 161 font-size: 18px; 162 font-family: Helvetica, sans-serif; 163 line-height: 24px; 164 margin: 10%; 165 width: 80%; 166 " 167 > 168 <p lang="en">Oh no! It looks like JavaScript is not enabled in your browser.</p> 169 <p lang="en" style="margin: 20px 0;"> 170 <button 171 type="submit" 172 style=" 173 background-color: #4630eb; 174 border-radius: 100px; 175 border: none; 176 box-shadow: none; 177 color: #fff; 178 cursor: pointer; 179 font-weight: bold; 180 line-height: 20px; 181 padding: 6px 16px; 182 " 183 > 184 Reload 185 </button> 186 </p> 187 </div> 188 </form> 189 </noscript> 190 191 <!-- The root element for your Expo app. --> 192 <div id="splash"> 193 <!-- Bluesky SVG --> 194 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 57"><path fill="#006AFF" d="M13.873 3.805C21.21 9.332 29.103 20.537 32 26.55v15.882c0-.338-.13.044-.41.867-1.512 4.456-7.418 21.847-20.923 7.944-7.111-7.32-3.819-14.64 9.125-16.85-7.405 1.264-15.73-.825-18.014-9.015C1.12 23.022 0 8.51 0 6.55 0-3.268 8.579-.182 13.873 3.805ZM50.127 3.805C42.79 9.332 34.897 20.537 32 26.55v15.882c0-.338.13.044.41.867 1.512 4.456 7.418 21.847 20.923 7.944 7.111-7.32 3.819-14.64-9.125-16.85 7.405 1.264 15.73-.825 18.014-9.015C62.88 23.022 64 8.51 64 6.55c0-9.818-8.578-6.732-13.873-2.745Z"/></svg> 195 </div> 196 <div id="root"> 197 </div> 198 </body> 199</html>