Make web app fill viewport
This commit is contained in:
parent
420bfed5e9
commit
4d1a333414
|
|
@ -6,10 +6,12 @@
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<div id="whole-window">
|
||||||
<script type="module" src="pteropus-frame.js"></script>
|
<script type="module" src="pteropus-frame.js"></script>
|
||||||
<canvas id="pteropus-canvas"></canvas>
|
<canvas id="pteropus-canvas"></canvas>
|
||||||
<div id="bottom-panel">
|
<div id="bottom-panel">
|
||||||
<input type="file" id="file-upload-file-input" name="filename" accept="image/tiff, .tif, .tiff">
|
<input type="file" id="file-upload-file-input" name="filename" accept="image/tiff, .tif, .tiff">
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,22 @@
|
||||||
#pteropus-canvas {
|
body {
|
||||||
height: 100%;
|
margin: 0;
|
||||||
width: 100%;
|
}
|
||||||
display: block;
|
|
||||||
|
#whole-window {
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
#pteropus-canvas {
|
||||||
|
display: flex;
|
||||||
|
flex-grow: 1;
|
||||||
|
margin: 0.4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#bottom-panel {
|
||||||
|
display: flex;
|
||||||
|
flex-grow: 0;
|
||||||
|
margin: 0.4rem;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue