Improve the editor HTML template
- Darken the header tab background to match the default editor
background color.
- Hide the distracting focus outlines for the editor and game canvas.
- Use a pure black background for the game canvas to better distinguish it
from the editor and provide a more neutral background.
- Use a bold font weight for the Start Godot editor button on the
loader page.
- Link to the web editor documentation on the loader page.
- Clarify what happens when clicking "OK" in the persistent data removal
warning dialog.
- Tidy up the HTML template by removing obsolete attributes.
(cherry picked from commit 3527756943
)
This commit is contained in:
parent
8190305075
commit
3b4dd88e56
1 changed files with 26 additions and 8 deletions
34
misc/dist/html/editor.html
vendored
34
misc/dist/html/editor.html
vendored
|
@ -5,8 +5,7 @@
|
||||||
<meta name='viewport' content='width=device-width, user-scalable=no' />
|
<meta name='viewport' content='width=device-width, user-scalable=no' />
|
||||||
<link id='-gd-engine-icon' rel='icon' type='image/png' href='favicon.png' />
|
<link id='-gd-engine-icon' rel='icon' type='image/png' href='favicon.png' />
|
||||||
<title>Godot Engine Web Editor ($GODOT_VERSION)</title>
|
<title>Godot Engine Web Editor ($GODOT_VERSION)</title>
|
||||||
<style type='text/css'>
|
<style>
|
||||||
|
|
||||||
*:focus {
|
*:focus {
|
||||||
/* More visible outline for better keyboard navigation. */
|
/* More visible outline for better keyboard navigation. */
|
||||||
outline: 0.125rem solid hsl(220, 100%, 62.5%);
|
outline: 0.125rem solid hsl(220, 100%, 62.5%);
|
||||||
|
@ -40,13 +39,30 @@
|
||||||
filter: brightness(82.5%);
|
filter: brightness(82.5%);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#tabs-buttons {
|
||||||
|
/* Match the default background color of the editor window for a seamless appearance. */
|
||||||
|
background-color: #202531;
|
||||||
|
}
|
||||||
|
|
||||||
|
#tab-game {
|
||||||
|
/* Use a pure black background to better distinguish the running project */
|
||||||
|
/* from the editor window, and to use a more neutral background color (no tint). */
|
||||||
|
background-color: black;
|
||||||
|
/* Make the background span the entire page height. */
|
||||||
|
min-height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
#canvas, #gameCanvas {
|
#canvas, #gameCanvas {
|
||||||
display: block;
|
display: block;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
color: white;
|
color: white;
|
||||||
}
|
}
|
||||||
|
|
||||||
#canvas:focus, #gameCanvas:focus {
|
/* Don't show distracting focus outlines for the main tabs' contents. */
|
||||||
|
#tab-editor canvas:focus,
|
||||||
|
#tab-game canvas:focus,
|
||||||
|
#canvas:focus,
|
||||||
|
#gameCanvas:focus {
|
||||||
outline: none;
|
outline: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -200,9 +216,11 @@
|
||||||
<a href="demo.zip">(Try this for example)</a>
|
<a href="demo.zip">(Try this for example)</a>
|
||||||
<br />
|
<br />
|
||||||
<br />
|
<br />
|
||||||
<button id="startButton" class="btn" style="margin-bottom: 4rem">Start Godot editor</button>
|
<button id="startButton" class="btn" style="margin-bottom: 4rem; font-weight: 700">Start Godot editor</button>
|
||||||
<br />
|
<br />
|
||||||
<button class="btn" onclick="clearPersistence()">Clear persistent data</button>
|
<button class="btn" onclick="clearPersistence()" style="margin-bottom: 1.5rem">Clear persistent data</button>
|
||||||
|
<br />
|
||||||
|
<a href="https://docs.godotengine.org/en/latest/tutorials/editor/using_the_web_editor.html">Web editor documentation</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div id='tab-editor' style="display: none;">
|
<div id='tab-editor' style="display: none;">
|
||||||
|
@ -233,8 +251,8 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script type='text/javascript' src='godot.tools.js'></script>
|
<script src='godot.tools.js'></script>
|
||||||
<script type='text/javascript'>//<![CDATA[
|
<script>//<![CDATA[
|
||||||
|
|
||||||
var editor = null;
|
var editor = null;
|
||||||
var game = null;
|
var game = null;
|
||||||
|
@ -258,7 +276,7 @@
|
||||||
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
if (!window.confirm("Are you sure you want to delete all the locally stored files?")) {
|
if (!window.confirm("Are you sure you want to delete all the locally stored files?\nClicking \"OK\" will permanently remove your projects and editor settings!")) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
Promise.all([
|
Promise.all([
|
||||||
|
|
Loading…
Reference in a new issue