Use margin: 0 auto for centering canvas in default emscripten shells

- Instead of using width: 100% for shell.html simply center the canvas.
  With width: 100% it breaks input when the window do not fits on screen
  and on some browsers on first load the canvas do not resizes properly
  (tested on qutebrowser)
- Center canvas on minshell with margin auto instead of leaving it in top
  left always. I think this is better minimal default and it only repositions
  the canvas when it fits inside of window, so when it doesnt the original
  behaviour is preserved

Signed-off-by: Tomas Slusny <slusnucky@gmail.com>
This commit is contained in:
Tomas Slusny 2024-10-31 21:45:57 +01:00
parent b8c0842b2e
commit 4ce6f17086
2 changed files with 11 additions and 5 deletions

View File

@ -34,12 +34,17 @@
<link rel="shortcut icon" href="https://www.raylib.com/favicon.ico">
<style>
body {
margin: 0px;
overflow: hidden;
body {
margin: 0px;
overflow: hidden;
background-color: black;
}
canvas.emscripten { border: 0px none; background-color: black;}
canvas.emscripten {
border: 0px none;
background-color: black;
display: block;
margin: 0 auto;
}
</style>
<script type='text/javascript' src="https://cdn.jsdelivr.net/gh/eligrey/FileSaver.js/dist/FileSaver.min.js"> </script>
<script type='text/javascript'>

View File

@ -79,7 +79,8 @@ jwE50AGjLCVuS8Yt4H7OgZLKK5EKOsLviEWJSL/+0uMi7gLUSBseYwqEbXvSHCec1CJvZPyHCmYQffaB
canvas.emscripten {
border: 0px none;
background: black;
width: 100%;
display: block;
margin: 0 auto;
}
.spinner {