diff --git a/src/components/Nav.svelte b/src/components/Nav.svelte
index 61c4cbe..a01e93c 100644
--- a/src/components/Nav.svelte
+++ b/src/components/Nav.svelte
@@ -12,10 +12,6 @@
text-shadow: 2px 2px $gray-color-dark;
}
- .menu-item .active {
- background-color: $red;
- }
-
.btn {
background-color: $red !important;
margin-left: 4px;
diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index e3cbea7..d4f9679 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -10,8 +10,8 @@
let code = [
['PUSH', -10], // start at -10
- ['PUSH', 1], // increment by 1
['STOR', 'AX'],
+ ['PUSH', 1], // increment by 1
['ADD'],
['JZ', 5], // if we're at 0 jumps to the end
['JUMP', 1] // the previous test fails so it jumps to loop again
@@ -99,12 +99,30 @@
background-color: $gray;
width: 100%;
}
+
+ #machine-state {
+ font-size: 20px;
+ overflow-x: none;
+ white-space: pre-wrap;
+ white-space: -moz-pre-wrap;
+ white-space: -pre-wrap;
+ white-space: -o-pre-wrap;
+ word-wrap: break-word;
+ }
+
+ #machine-state code {
+ color: lighten($green, 10%) !important;
+ }
+
+ #machine-state .error {
+ color: lighten($red, 10%) !important;
+ }
-
+
?¿
@@ -165,54 +183,27 @@
{/each}
-
-
-
-
- IP |
- TICK |
- HALT |
- ERROR |
-
-
-
-
- { machine.ip } |
- { machine.tick } |
- { machine.halted } |
- { machine.error } |
-
-
-
-
-
- STACK |
-
-
-
- {#each [...machine.stack].reverse() as datum, i}
-
- {datum} |
-
- {/each}
-
-
-
-
-
- REGISTER |
- VALUE |
-
-
-
- {#each machine.register_entries as [name, value] }
-
- { name } |
- { value } |
-
- {/each}
-
-
+
+
+
+█IP {machine.ip} █TICK { machine.tick}
+{#if machine.halted }HALT! { machine.error }{/if}
+
+╞ STACK ╡
+──────────────────
+{#each [...machine.stack].reverse() as datum, i}
+{#if i == 0}→{i}▐ {datum + '\n'}
+{:else}─────────
+▌{i}▐ {datum + '\n'}{/if}
+{/each}
+
+╞ REGISTERS ╡
+──────────────────
+{#each registers as reg }
+[{ reg }]={ (machine.registers[reg] || '█') + '\n'}
+{/each}
+
+