small changes

2019-10-28 00:47:15 +01:00 · 2019-10-28 00:47:15 +01:00 · 46c2782e4e
commit 46c2782e4e
parent d04fc53849
3 changed files with 12 additions and 16 deletions
--- a/css/index.css
+++ b/css/index.css
@ -7,8 +7,6 @@
 }
 
 * {
-    padding: 0;
-    margin: 0;
    color: white;
    font-family: 'Share Tech';
    font-size: 1.05em;
@ -31,6 +29,11 @@ button {
    width: 100%;
 }

+a {
+    color: lightcyan;
+    text-decoration: none;
+}
+
 .actions {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
@ -41,11 +44,7 @@ button {
 }

 .play {
-    grid-column: 2 / 4;
    text-align: center;
-    text-decoration: none;
    text-shadow: 2px 1px rgb(153, 145, 175);
    font-size: 1.5em;
-    width: 70%;
-    margin: 40px;
 }
--- a/index.html
+++ b/index.html
@ -8,9 +8,10 @@
 </head>
 <body>
    <h1>WEBTRIS</h1>
-        <div class="actions">
-            <script>loadButtons()</script>
-            <a href="webtris.html" class="play"><b>JOUER</b></a>
+    <div class="actions" id="actions">
+    </div>
+    <div class="play">
+        <a href="webtris.html"><b>JOUER</b></a>
    </div>
 </body>
 </html>
--- a/js/index.js
+++ b/js/index.js
@ -29,14 +29,10 @@ function getKey(action) {
        return key
 }

-function loadButtons() {
-    document.open()
-    document.write(
-        actionLabel.map(action => `<div>${action.label}</div>
+window.onload = function() {
+    document.getElementById("actions").innerHTML = actionLabel.map(action => `<div>${action.label}</div>
 <button type="button" onclick="changeKey(this, '${action.name}')">${getKey(action.name)}</button>
 `).join("\n")
-    )
-    document.close()
 }

 function changeKey(button, action) {