fix metro web shell

2026-08-10 13:22:20 +02:00
parent 35578543e9
commit 504256ae4e
2 changed files with 199 additions and 90 deletions
@@ -12,96 +12,6 @@
 * HTML & BODY STYLES IN `web/index.html` and `bskyweb/templates/base.html`
 */

-/**
- * Base shell styles, duplicated from the inline <style> blocks in
- * `web/index.html` and `bskyweb/templates/base.html`. The Metro dev server
- * serves its own HTML shell that contains none of those styles, so without
- * this copy the page has no root sizing and no `theme--*` backgrounds (the
- * background stops at the first viewport height). In production these rules
- * are identical to the inline ones, so loading both is harmless. Keep all
- * locations in sync.
- */
-html,
-body {
-  margin: 0px;
-  padding: 0px;
-  font-family:
-    InterVariable,
-    -apple-system,
-    BlinkMacSystemFont,
-    'Segoe UI',
-    Roboto,
-    'Liberation Sans',
-    Helvetica,
-    Arial,
-    sans-serif;
-  text-rendering: optimizeLegibility;
-  /* Platform-specific reset */
-  -webkit-overflow-scrolling: touch;
-  -webkit-text-size-adjust: 100%;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  -ms-overflow-style: scrollbar;
-  font-synthesis-weight: none;
-}
-:root {
-  --text: black;
-  --background: white;
-  --backgroundLight: #e2e7ee;
-}
-@media (prefers-color-scheme: dark) {
-  :root {
-    color-scheme: dark;
-    --text: white;
-    --background: black;
-    --backgroundLight: #232e3e;
-  }
-}
-html,
-body,
-#root {
-  display: flex;
-  flex: 1 0 auto;
-  min-height: 100%;
-  width: 100%;
-}
-html.theme--light,
-html.theme--light body,
-html.theme--light #root {
-  background-color: white;
-  --text: black;
-  --background: white;
-  --backgroundLight: #dce2ea;
-}
-html.theme--dark,
-html.theme--dark body,
-html.theme--dark #root {
-  color-scheme: dark;
-  background-color: black;
-  --text: white;
-  --background: black;
-  --backgroundLight: #232e3e;
-}
-html.theme--dim,
-html.theme--dim body,
-html.theme--dim #root {
-  color-scheme: dark;
-  background-color: #151d28;
-  --text: white;
-  --background: #151d28;
-  --backgroundLight: #2c3a4e;
-}
-/**
- * We need these styles to prevent shifting due to scrollbar show/hide on
- * OSs that have them enabled by default. This also handles cases where the
- * screen wouldn't otherwise scroll, and therefore hide the scrollbar and
- * shift the content, by forcing the page to show a scrollbar.
- */
-body {
-  width: 100%;
-  overflow-y: scroll;
-}
-
 /* Buttons and inputs have a font set by UA, so we'll have to reset that */
 button,
 input,