Skip to content
Permalink
Browse files

Improved button placement

Run and save, the most important buttons, are now placed on the right site. This way they are more accessible and visually differ from the rest of the buttons.
  • Loading branch information
spacehuhn committed Nov 16, 2019
1 parent 4820561 commit 9d2e93fb74206a7b5ce5d1aed2f230e6a7d1dc8a
Showing with 21 additions and 7 deletions.
  1. +11 −5 web/index.html
  2. +10 −2 web/style.css
@@ -48,19 +48,25 @@ <h2>Scripts <a class="reload" id="scriptsReload">&#x21bb;</a></h2>
<h2>Editor <a class="reload" id="editorReload">&#x21bb;</a></h2>

<label>Filename:</label>
<input type="text" class="smooth" value="" id="editorFile">
<input type="text" class="smooth" value="/" id="editorFile">

<textarea class="smooth" id="editor"></textarea>

<div id="editor-primary-buttons">
<p>
<button class="warn" id="editorRun">⯈run</button>
<button class="success" id="editorSave">save</button>
</p>
</div>

<p id="editorinfo">saved</p>

<button class="danger" id="editorDelete">delete</button>
<button class="primary" id="editorDownload">download</button>
<button class="warn" id="editorStop">stop</button>
<button class="warn" id="editorRun">run</button>
<button class="success" id="editorSave">save</button>
<br>
<button class="primary" id="editorDownload">🡇download</button>
<button class="primary" id="editorAutorun">Enable autorun</button>

<p id="editorinfo">saved</p>

<br>
<hr>
@@ -131,6 +131,14 @@ footer {
margin-bottom: 3em;
}

#editor-primary-buttons {
float: right;
}

#editor-primary-buttons p {
text-align: right;
}

/* ===== CHECKBOX ===== */
/* Customize the label (the container) */
.checkBoxContainer {
@@ -372,9 +380,9 @@ nav a:hover {
.button, button, input[type="submit"], input[type="reset"], input[type="button"] {
display: inline-block;
height: 38px;
padding: 0 20px;
padding: 0 18px;
text-align: center;
font-size: 11px;
font-size: 12px;
font-weight: 600;
line-height: 38px;
letter-spacing: .1rem;

0 comments on commit 9d2e93f

Please sign in to comment.
You can’t perform that action at this time.