Files
flipper/desktop/static/index.dev.html
Michel Weststrate 4e6ecac43e Load ant theme in classic Flipper as well
Summary: If a new code path uses some Ant design based components in classic flipper, they are unstyled before this diff. By making sure that the ant stylesheet is loaded we can safely 'leak' new UI elements into the old UI. For example when we use toasters, dialogs etc.

Reviewed By: cekkaewnumchai

Differential Revision: D24021751

fbshipit-source-id: 3b42d28f1c75e4df441170660027562264e879dd
2020-10-01 05:35:10 -07:00

98 lines
2.3 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="style.css">
<link id="flipper-theme-import" rel="stylesheet" href="themes/light.css">
<link rel="stylesheet" href="graphiql/graphiql.css">
<link rel="stylesheet" href="vis/vis.min.css">
<title>Flipper</title>
<style>
#loading {
-webkit-app-region: drag;
z-index: 999999;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
padding: 50px;
overflow: auto;
display: flex;
align-items: center;
justify-content: center;
font-size: 20px;
color: #525252;
text-align: center;
}
.__infinity-dev-box-error {
background-color: #000;
font-family: monospace;
white-space: pre;
font-size: 16px;
}
</style>
</head>
<body>
<div id="root">
<div id="loading">
Loading...
</div>
</div>
<div class="__infinity-dev-box __infinity-dev-box-error" hidden>
</div>
<script src="/socket.io/socket.io.js"></script>
<script>
(function() {
global.electronRequire = window.require;
let suppressErrors = false;
const socket = io(location.origin);
socket.on('refresh', () => {
location.reload();
});
socket.on('hasErrors', (html) => {
openError(html);
suppressErrors = true;
});
function openError(text) {
if (suppressErrors) {
return;
}
const box = document.querySelector('.__infinity-dev-box-error');
box.removeAttribute('hidden');
box.textContent = text;
}
function init() {
const script = document.createElement('script');
script.src = window.process.env.BUNDLE_URL;
script.onerror = () => {
openError('Script failure. Check Chrome console for more info.');
};
window.addEventListener('flipper-store-ready', () => global.Flipper.init());
document.body.appendChild(script);
}
init();
})();
</script>
</body>
</html>