Enhance memory view and bump to new version

CHANGELOG.md

@@ -1,3 +1,11 @@
+## 1.9.1
+* Add binary format to memory view
+* Add option for selecting number of columns in memory
+
+## 1.9.0
+* Better align controls in memory view
+* Simplify CSS of memory view using flex layout
+
 ## 1.8.1
 * Fix and improve settings descriptions
 * Reduce number of linter warnings

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "riscv-venus",
 	"displayName": "RISC-V Venus Simulator",
-	"version": "1.8.1",
+	"version": "1.9.1",
 	"publisher": "hm",
 	"description": "RISC-V Venus Simulator embedded in VS Code",
 	"author": {

src/memoryui/memoryUI.css

@@ -16,40 +16,48 @@ table {
   width: 100%;
 }
 
-.field:not(:last-child) {
-  margin-bottom: 0.75rem;
+.table-block  {
+  width: 100%;
 }
 
-@media screen and (min-width: 361px), print {
-  .field.is-horizontal {
-    display: -webkit-box;
-    display: -ms-flexbox;
-    display: flex;
-  }
+.label {
+  white-space: nowrap; 
 }
 
-.field-label .label {
-  font-size: inherit;
+#address-jump, #mem-move, #display-settings, #display-rows {
+  box-sizing: border-box;  /* needed for having same width for input and select */
+  width: 95px;
 }
 
-@media screen and (max-width: 360px) {
-  .field-label {
-    margin-bottom: 0.5rem;
+@media screen and (max-width: 330px) {
+  .table-row {
+    padding-top: 0.3rem;
+  }  
+}
+
+@media screen and (min-width: 200px), print {
+  .field {
+    display: inline-block; 
   }
 }
 
-@media screen and (min-width: 361px), print {
+@media screen and (min-width: 331px), print {
+  .table-block  {
+    display: table;
+  }
+  .table-row {
+    display: table-row;
+  }
   .field-label {
-    -ms-flex-preferred-size: 0;
-        flex-basis: 0;
-    -webkit-box-flex: 1;
-        -ms-flex-positive: 1;
-            flex-grow: 1;
-    -ms-flex-negative: 0;
-        flex-shrink: 0;
-    margin-right: 1.5rem;
+    display: table-cell;
+    padding-top: 0.3rem;
+    padding-right: 0.5rem;
     text-align: right;
   }
+  .field-body {
+    display: table-cell;
+  }
+
   .field-label.is-small {
     font-size: 0.75rem;
     padding-top: 0.375em;
@@ -66,31 +74,3 @@ table {
     padding-top: 0.375em;
   }
 }
-
-@media screen and (min-width: 361px), print {
-  .field-body {
-    display: -webkit-box;
-    display: -ms-flexbox;
-    display: flex;
-    -ms-flex-preferred-size: 0;
-        flex-basis: 0;
-    -webkit-box-flex: 5;
-        -ms-flex-positive: 5;
-            flex-grow: 5;
-    -ms-flex-negative: 1;
-        flex-shrink: 1;
-  }
-  .field-body .field {
-    -ms-flex-negative: 1;
-        flex-shrink: 1;
-  }
-  .field-body .field:not(.is-narrow) {
-    -webkit-box-flex: 1;
-        -ms-flex-positive: 1;
-            flex-grow: 1;
-  }
-  .field-body .field:not(:last-child) {
-    margin-bottom: 0;
-    margin-right: 0.75rem;
-  }
-}