1*dfe12d45SEvan Bacon<!DOCTYPE html>
2*dfe12d45SEvan Bacon<html lang="%LANG_ISO_CODE%">
3*dfe12d45SEvan Bacon  <head>
4*dfe12d45SEvan Bacon    <meta charset="utf-8" />
5*dfe12d45SEvan Bacon    <meta httpEquiv="X-UA-Compatible" content="IE=edge" />
6*dfe12d45SEvan Bacon    <!--
7*dfe12d45SEvan Bacon      This viewport works for phones with notches.
8*dfe12d45SEvan Bacon      It's optimized for gestures by disabling global zoom.
9*dfe12d45SEvan Bacon     -->
10*dfe12d45SEvan Bacon    <meta
11*dfe12d45SEvan Bacon      name="viewport"
12*dfe12d45SEvan Bacon      content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1.00001, viewport-fit=cover"
13*dfe12d45SEvan Bacon    />
14*dfe12d45SEvan Bacon    <title>%WEB_TITLE%</title>
15*dfe12d45SEvan Bacon    <style>
16*dfe12d45SEvan Bacon      /**
17*dfe12d45SEvan Bacon       * Extend the react-native-web reset:
18*dfe12d45SEvan Bacon       * https://github.com/necolas/react-native-web/blob/master/packages/react-native-web/src/exports/StyleSheet/initialRules.js
19*dfe12d45SEvan Bacon       */
20*dfe12d45SEvan Bacon      html,
21*dfe12d45SEvan Bacon      body,
22*dfe12d45SEvan Bacon      #root {
23*dfe12d45SEvan Bacon        width: 100%;
24*dfe12d45SEvan Bacon        /* To smooth any scrolling behavior */
25*dfe12d45SEvan Bacon        -webkit-overflow-scrolling: touch;
26*dfe12d45SEvan Bacon        margin: 0px;
27*dfe12d45SEvan Bacon        padding: 0px;
28*dfe12d45SEvan Bacon        /* Allows content to fill the viewport and go beyond the bottom */
29*dfe12d45SEvan Bacon        min-height: 100%;
30*dfe12d45SEvan Bacon      }
31*dfe12d45SEvan Bacon      #root {
32*dfe12d45SEvan Bacon        flex-shrink: 0;
33*dfe12d45SEvan Bacon        flex-basis: auto;
34*dfe12d45SEvan Bacon        flex-grow: 1;
35*dfe12d45SEvan Bacon        display: flex;
36*dfe12d45SEvan Bacon        flex: 1;
37*dfe12d45SEvan Bacon      }
38*dfe12d45SEvan Bacon
39*dfe12d45SEvan Bacon      html {
40*dfe12d45SEvan Bacon        scroll-behavior: smooth;
41*dfe12d45SEvan Bacon        /* Prevent text size change on orientation change https://gist.github.com/tfausak/2222823#file-ios-8-web-app-html-L138 */
42*dfe12d45SEvan Bacon        -webkit-text-size-adjust: 100%;
43*dfe12d45SEvan Bacon        height: calc(100% + env(safe-area-inset-top));
44*dfe12d45SEvan Bacon      }
45*dfe12d45SEvan Bacon
46*dfe12d45SEvan Bacon      body {
47*dfe12d45SEvan Bacon        display: flex;
48*dfe12d45SEvan Bacon        /* Allows you to scroll below the viewport; default value is visible */
49*dfe12d45SEvan Bacon        overflow-y: auto;
50*dfe12d45SEvan Bacon        overscroll-behavior-y: none;
51*dfe12d45SEvan Bacon        text-rendering: optimizeLegibility;
52*dfe12d45SEvan Bacon        -webkit-font-smoothing: antialiased;
53*dfe12d45SEvan Bacon        -moz-osx-font-smoothing: grayscale;
54*dfe12d45SEvan Bacon        -ms-overflow-style: scrollbar;
55*dfe12d45SEvan Bacon      }
56*dfe12d45SEvan Bacon      /* Enable for apps that support dark-theme */
57*dfe12d45SEvan Bacon      /*@media (prefers-color-scheme: dark) {
58*dfe12d45SEvan Bacon        body {
59*dfe12d45SEvan Bacon          background-color: black;
60*dfe12d45SEvan Bacon        }
61*dfe12d45SEvan Bacon      }*/
62*dfe12d45SEvan Bacon    </style>
63*dfe12d45SEvan Bacon  </head>
64*dfe12d45SEvan Bacon
65*dfe12d45SEvan Bacon  <body>
66*dfe12d45SEvan Bacon    <!--
67*dfe12d45SEvan Bacon      A generic no script element with a reload button and a message.
68*dfe12d45SEvan Bacon      Feel free to customize this however you'd like.
69*dfe12d45SEvan Bacon    -->
70*dfe12d45SEvan Bacon    <noscript>
71*dfe12d45SEvan Bacon      <form
72*dfe12d45SEvan Bacon        action=""
73*dfe12d45SEvan Bacon        style="
74*dfe12d45SEvan Bacon          background-color: #fff;
75*dfe12d45SEvan Bacon          position: fixed;
76*dfe12d45SEvan Bacon          top: 0;
77*dfe12d45SEvan Bacon          left: 0;
78*dfe12d45SEvan Bacon          right: 0;
79*dfe12d45SEvan Bacon          bottom: 0;
80*dfe12d45SEvan Bacon          z-index: 9999;
81*dfe12d45SEvan Bacon        "
82*dfe12d45SEvan Bacon      >
83*dfe12d45SEvan Bacon        <div
84*dfe12d45SEvan Bacon          style="
85*dfe12d45SEvan Bacon            font-size: 18px;
86*dfe12d45SEvan Bacon            font-family: Helvetica, sans-serif;
87*dfe12d45SEvan Bacon            line-height: 24px;
88*dfe12d45SEvan Bacon            margin: 10%;
89*dfe12d45SEvan Bacon            width: 80%;
90*dfe12d45SEvan Bacon          "
91*dfe12d45SEvan Bacon        >
92*dfe12d45SEvan Bacon          <p>Oh no! It looks like JavaScript is not enabled in your browser.</p>
93*dfe12d45SEvan Bacon          <p style="margin: 20px 0;">
94*dfe12d45SEvan Bacon            <button
95*dfe12d45SEvan Bacon              type="submit"
96*dfe12d45SEvan Bacon              style="
97*dfe12d45SEvan Bacon                background-color: #4630eb;
98*dfe12d45SEvan Bacon                border-radius: 100px;
99*dfe12d45SEvan Bacon                border: none;
100*dfe12d45SEvan Bacon                box-shadow: none;
101*dfe12d45SEvan Bacon                color: #fff;
102*dfe12d45SEvan Bacon                cursor: pointer;
103*dfe12d45SEvan Bacon                font-weight: bold;
104*dfe12d45SEvan Bacon                line-height: 20px;
105*dfe12d45SEvan Bacon                padding: 6px 16px;
106*dfe12d45SEvan Bacon              "
107*dfe12d45SEvan Bacon            >
108*dfe12d45SEvan Bacon              Reload
109*dfe12d45SEvan Bacon            </button>
110*dfe12d45SEvan Bacon          </p>
111*dfe12d45SEvan Bacon        </div>
112*dfe12d45SEvan Bacon      </form>
113*dfe12d45SEvan Bacon    </noscript>
114*dfe12d45SEvan Bacon    <!-- The root element for your Expo app. -->
115*dfe12d45SEvan Bacon    <div id="root"></div>
116*dfe12d45SEvan Bacon  </body>
117*dfe12d45SEvan Bacon</html>
118