ha-frontend/src/html/index.html.template

107 lines
3.3 KiB
Plaintext

<!DOCTYPE html>
<html>
<head>
<% if (!useWDS) { %>
<link rel="preload" href="<%= latestCoreJS %>" as="script" crossorigin="use-credentials" />
<link rel="preload" href="<%= latestAppJS %>" as="script" crossorigin="use-credentials" />
<% } %>
<%= renderTemplate('_header') %>
<title>Home Assistant</title>
<link rel="mask-icon" href="/static/icons/mask-icon.svg" color="#03a9f4" />
<link
rel="apple-touch-icon"
sizes="180x180"
href="/static/icons/favicon-apple-180x180.png"
/>
<meta name="apple-itunes-app" content="app-id=1099568401" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="default">
<meta name="apple-mobile-web-app-title" content="Home Assistant">
<meta
name="msapplication-square70x70logo"
content="/static/icons/tile-win-70x70.png"
/>
<meta
name="msapplication-square150x150logo"
content="/static/icons/tile-win-150x150.png"
/>
<meta
name="msapplication-wide310x150logo"
content="/static/icons/tile-win-310x150.png"
/>
<meta
name="msapplication-square310x310logo"
content="/static/icons/tile-win-310x310.png"
/>
<meta name="msapplication-TileColor" content="#03a9f4ff" />
<meta name="mobile-web-app-capable" content="yes" />
<meta name="referrer" content="same-origin" />
<meta name="theme-color" content="#THEMEC" />
<meta name="color-scheme" content="dark light" />
<style>
#ha-init-skeleton::before {
display: block;
content: "";
height: 112px;
background-color: #THEMEC;
}
html {
background-color: var(--primary-background-color);
}
@media (prefers-color-scheme: dark) {
html {
background-color: #111111;
}
#ha-init-skeleton::before {
background-color: #1c1c1c;
}
}
</style>
</head>
<body>
<div id="ha-init-skeleton"></div>
<home-assistant> </home-assistant>
<%= renderTemplate('_js_base') %>
<%= renderTemplate('_preload_roboto') %>
<script <% if (!useWDS) { %>crossorigin="use-credentials"<% } %>>
import("<%= latestCoreJS %>");
import("<%= latestAppJS %>");
window.customPanelJS = "<%= latestCustomPanelJS %>";
window.latestJS = true;
</script>
<script>
{% for extra_module in extra_modules -%}
import("{{ extra_module }}");
{% endfor -%}
</script>
<script>
if (!window.latestJS) {
window.customPanelJS = "<%= es5CustomPanelJS %>";
<% if (useRollup) { %>
_ls("/static/js/s.min.js").onload = function() {
// Although core and app can load in any order, we need to
// force loading core first because it contains polyfills
return System.import("<%= es5CoreJS %>").then(function() {
System.import("<%= es5AppJS %>");
});
}
<% } else { %>
_ls("<%= es5CoreJS %>");
_ls("<%= es5AppJS %>");
<% } %>
}
</script>
<script>
if (!window.latestJS) {
{% for extra_script in extra_js_es5 -%}
_ls("{{ extra_script }}");
{% endfor -%}
}
</script>
</body>
</html>