Improving layout

This commit is contained in:
Radon Rosborough 2020-06-07 16:01:02 -06:00
parent d5430812bc
commit 2239a3685d
3 changed files with 8 additions and 11 deletions

View File

@ -13,12 +13,10 @@
<script src="/js/app.js" async defer></script> <script src="/js/app.js" async defer></script>
</head> </head>
<body> <body>
<div id="header">
<button type="button" class="btn btn-success" id="runButton">Run</button>
</div>
<div id="app"> <div id="app">
<div id="editor" class="column"></div> <div id="editor" class="column"></div>
<div id="terminal" class="column"></div> <div id="terminal" class="column"></div>
<button type="button" class="btn btn-success" id="runButton">Run</button>
</div> </div>
</body> </body>
</html> </html>

View File

@ -69,7 +69,10 @@ term.onData((data) =>
socket.send(JSON.stringify({ event: "terminalInput", input: data })) socket.send(JSON.stringify({ event: "terminalInput", input: data }))
); );
const editor = monaco.editor.create(document.getElementById("editor")); const editor = monaco.editor.create(document.getElementById("editor"), {
minimap: { enabled: false },
scrollbar: { verticalScrollbarSize: 0 },
});
window.addEventListener("resize", () => editor.layout()); window.addEventListener("resize", () => editor.layout());
document.getElementById("runButton").addEventListener("click", () => { document.getElementById("runButton").addEventListener("click", () => {

View File

@ -3,18 +3,14 @@ body {
height: 100vh; height: 100vh;
} }
#header {
height: 50px;
padding: 5px;
}
#runButton { #runButton {
position: absolute; position: absolute;
left: 50%; top: 25px;
right: calc(50% + 25px);
} }
#app { #app {
height: calc(100% - 50px); height: 100%;
} }
.column { .column {