index.html 7.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>Excalidraw | Hand-drawn look & feel • Collaborative • Secure</title>
  6. <meta
  7. name="viewport"
  8. content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover, shrink-to-fit=no"
  9. />
  10. <meta name="referrer" content="origin" />
  11. <meta name="mobile-web-app-capable" content="yes" />
  12. <meta name="theme-color" content="#121212" />
  13. <!-- Primary Meta Tags -->
  14. <meta
  15. name="title"
  16. content="Excalidraw — Collaborative whiteboarding made easy"
  17. />
  18. <meta
  19. name="description"
  20. content="Excalidraw is a virtual collaborative whiteboard tool that lets you easily sketch diagrams that have a hand-drawn feel to them."
  21. />
  22. <meta name="image" content="https://excalidraw.com/og-general-v1.png" />
  23. <!-- Open Graph / Facebook -->
  24. <meta property="og:site_name" content="Excalidraw" />
  25. <meta property="og:type" content="website" />
  26. <meta property="og:url" content="https://excalidraw.com" />
  27. <meta
  28. property="og:title"
  29. content="Excalidraw — Collaborative whiteboarding made easy"
  30. />
  31. <meta property="og:image:alt" content="Excalidraw logo" />
  32. <meta
  33. property="og:description"
  34. content="Excalidraw is a virtual collaborative whiteboard tool that lets you easily sketch diagrams that have a hand-drawn feel to them."
  35. />
  36. <meta property="og:image" content="https://excalidraw.com/og-fb-v1.png" />
  37. <!-- Twitter -->
  38. <meta property="twitter:card" content="summary_large_image" />
  39. <meta property="twitter:site" content="@excalidraw" />
  40. <meta property="twitter:url" content="https://excalidraw.com" />
  41. <meta
  42. property="twitter:title"
  43. content="Excalidraw — Collaborative whiteboarding made easy"
  44. />
  45. <meta
  46. property="twitter:description"
  47. content="Excalidraw is a virtual collaborative whiteboard tool that lets you easily sketch diagrams that have a hand-drawn feel to them."
  48. />
  49. <meta
  50. property="twitter:image"
  51. content="https://excalidraw.com/og-twitter-v1.png"
  52. />
  53. <!-- General tags -->
  54. <meta
  55. name="description"
  56. content="Excalidraw is a virtual collaborative whiteboard tool that lets you easily sketch diagrams that have a hand-drawn feel to them."
  57. />
  58. <!------------------------------------------------------------------------->
  59. <!-- to minimize white flash on load when user has dark mode enabled -->
  60. <script>
  61. try {
  62. //
  63. const theme = window.localStorage.getItem("excalidraw-theme");
  64. if (theme === "dark") {
  65. document.documentElement.classList.add("dark");
  66. }
  67. } catch {}
  68. </script>
  69. <style>
  70. html.dark {
  71. background-color: #121212;
  72. color: #fff;
  73. }
  74. </style>
  75. <!------------------------------------------------------------------------->
  76. <% if (process.env.NODE_ENV === "production") { %>
  77. <script>
  78. // Redirect Excalidraw+ users which have auto-redirect enabled.
  79. //
  80. // Redirect only the bare root path, so link/room/library urls are not
  81. // redirected.
  82. //
  83. // Putting into index.html for best performance (can't redirect on server
  84. // due to location.hash checks).
  85. if (
  86. window.location.pathname === "/" &&
  87. !window.location.hash &&
  88. !window.location.search &&
  89. // if its present redirect
  90. document.cookie.includes("excplus-autoredirect=true")
  91. ) {
  92. window.location.href = "https://app.excalidraw.com";
  93. }
  94. </script>
  95. <% } %>
  96. <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
  97. <!-- Excalidraw version -->
  98. <meta name="version" content="{version}" />
  99. <link
  100. rel="preload"
  101. href="Virgil.woff2"
  102. as="font"
  103. type="font/woff2"
  104. crossorigin="anonymous"
  105. />
  106. <link
  107. rel="preload"
  108. href="Cascadia.woff2"
  109. as="font"
  110. type="font/woff2"
  111. crossorigin="anonymous"
  112. />
  113. <link
  114. rel="manifest"
  115. href="manifest.json"
  116. style="--pwacompat-splash-font: 24px Virgil"
  117. />
  118. <link rel="stylesheet" href="fonts.css" type="text/css" />
  119. <% if (process.env.REACT_APP_DEV_DISABLE_LIVE_RELOAD==="true" ) { %>
  120. <script>
  121. {
  122. const _WebSocket = window.WebSocket;
  123. window.WebSocket = function (url) {
  124. if (/ws:\/\/localhost:.+?\/sockjs-node/.test(url)) {
  125. console.info(
  126. "[!!!] Live reload is disabled via process.env.REACT_APP_DEV_DISABLE_LIVE_RELOAD [!!!]",
  127. );
  128. } else {
  129. return new _WebSocket(url);
  130. }
  131. };
  132. }
  133. </script>
  134. <% } %>
  135. <script>
  136. window.EXCALIDRAW_ASSET_PATH = "/";
  137. // setting this so that libraries installation reuses this window tab.
  138. window.name = "_excalidraw";
  139. </script>
  140. <% if (process.env.REACT_APP_DISABLE_TRACKING !== 'true') { %>
  141. <!-- Fathom - privacy-friendly analytics -->
  142. <script
  143. src="https://cdn.usefathom.com/script.js"
  144. data-site="VMSBUEYA"
  145. defer
  146. ></script>
  147. <!-- / Fathom -->
  148. <!-- LEGACY GOOGLE ANALYTICS -->
  149. <% if (process.env.REACT_APP_GOOGLE_ANALYTICS_ID) { %>
  150. <script
  151. async
  152. src="https://www.googletagmanager.com/gtag/js?id=%REACT_APP_GOOGLE_ANALYTICS_ID%"
  153. ></script>
  154. <script>
  155. window.dataLayer = window.dataLayer || [];
  156. function gtag() {
  157. dataLayer.push(arguments);
  158. }
  159. gtag("js", new Date());
  160. gtag("config", "%REACT_APP_GOOGLE_ANALYTICS_ID%");
  161. </script>
  162. <% } %>
  163. <!-- end LEGACY GOOGLE ANALYTICS -->
  164. <% } %>
  165. <!-- FIXME: remove this when we update CRA (fix SW caching) -->
  166. <style>
  167. body,
  168. html {
  169. margin: 0;
  170. -webkit-text-size-adjust: 100%;
  171. width: 100%;
  172. height: 100%;
  173. overflow: hidden;
  174. }
  175. .visually-hidden {
  176. position: absolute !important;
  177. height: 1px;
  178. width: 1px;
  179. overflow: hidden;
  180. clip: rect(1px, 1px, 1px, 1px);
  181. white-space: nowrap;
  182. user-select: none;
  183. }
  184. #root {
  185. height: 100%;
  186. -webkit-touch-callout: none;
  187. -webkit-user-select: none;
  188. -khtml-user-select: none;
  189. -moz-user-select: none;
  190. -ms-user-select: none;
  191. user-select: none;
  192. }
  193. @media screen and (min-width: 1200px) {
  194. #root {
  195. -webkit-touch-callout: default;
  196. -webkit-user-select: auto;
  197. -khtml-user-select: auto;
  198. -moz-user-select: auto;
  199. -ms-user-select: auto;
  200. user-select: auto;
  201. }
  202. }
  203. </style>
  204. </head>
  205. <body>
  206. <noscript> You need to enable JavaScript to run this app. </noscript>
  207. <header>
  208. <h1 class="visually-hidden">Excalidraw</h1>
  209. </header>
  210. <div id="root"></div>
  211. <!-- 100% privacy friendly analytics -->
  212. <script
  213. async
  214. defer
  215. src="https://scripts.simpleanalyticscdn.com/latest.js"
  216. ></script>
  217. <noscript
  218. ><img
  219. src="https://queue.simpleanalyticscdn.com/noscript.gif"
  220. alt=""
  221. referrerpolicy="no-referrer-when-downgrade"
  222. /></noscript>
  223. </body>
  224. </html>