fix viewer backend for convenitnt test and do some frontend work

SuperScriptViewer/static/css/env.css

@@ -0,0 +1,17 @@
+table.envOutput {
+    border: 1px solid black;
+}
+
+table.envOutput tr:nth-child(odd) {
+    background:#cfcfcf;
+}
+
+table.envOutput tr:nth-child(2n) {
+    background:white;
+}
+
+table.envOutput tr:nth-child(1) td {
+    background: blue;
+    color: white;
+    border: 1px solid black;
+}

SuperScriptViewer/static/css/global.css

@@ -0,0 +1,16 @@
+body {
+    background: silver;
+    font-size: 1rem;
+}
+
+div.simple-menu {
+    display: flex; 
+    flex-flow: row;
+}
+div.simple-menu > p {
+    margin: 5px;
+}
+
+h1 {
+    margin: 0;
+}

SuperScriptViewer/static/css/tabcontrol.css

@@ -0,0 +1,14 @@
+/*side panel style*/
+div.tabitem-activated {
+    background: #0000ff;
+}
+div.tabitem-activated b {
+    color: white;
+}
+
+div.tabitem-deactivated {
+    background: #ffffff00;
+}
+div.tabitem-deactivated b {
+    color: black;
+}

SuperScriptViewer/static/css/viewer.css

@@ -0,0 +1,114 @@
+/*navigation style*/
+p.hamburger {
+    margin: 0 5px 0 5px; 
+    padding: 0;
+}
+
+/*graph style*/
+div.block-target {
+    position: absolute;
+    background: green;
+}
+
+div.block-b {
+    position: absolute;
+    background: yellow;
+}
+
+div.block-p {
+    position: absolute;
+    background: blue;
+}
+
+p.block-text {
+    position: absolute; 
+    margin: 0; 
+    padding: 0;
+    font-size: 12px;
+    color: black;
+}
+
+p.block-expandable-text {
+    position: absolute; 
+    margin: 0; 
+    padding: 0;
+    font-size: 12px;
+    color: #5f5f5f;
+}
+
+p.block-asstext {
+    position: absolute; 
+    margin: 0; 
+    padding: 0;
+    font-size: 9px;
+    color: white;
+}
+
+div.block-body {
+    position: absolute;
+    background: #8f8f8f;
+    border: 1px solid #cfcfcf;
+}
+
+div.cell-ptarget {
+    position: absolute;
+    background: green;
+    border: 1px solid #cfcfcf;
+}
+
+div.cell-plocal {
+    position: absolute;
+    background: #8f8f8f;
+    border: 1px solid #cfcfcf;
+}
+
+div.cell-shortcut {
+    position: absolute;
+    background: purple;
+    border: 1px solid #cfcfcf;
+}
+
+div.cell-pio {
+    position: absolute;
+    background: blue;
+    border: 1px solid #cfcfcf;
+}
+
+div.cell-bio {
+    position: absolute;
+    background: yellow;
+    border: 1px solid #cfcfcf;
+}
+
+text.link-delay {
+    font-size: 12px;
+    color: black;
+}
+
+/* property list*/
+
+pre.propertyItem {
+    border: 1px solid black;
+    border-radius: 2px;
+    padding: 5px;
+    background: #3f3f3f;
+    color: white;
+    white-space: pre-wrap;
+    word-wrap: break-word;
+}
+
+code.propertyItem {
+    border: 1px solid black;
+    border-radius: 2px;
+    padding: 5px;
+    margin: 5px;
+    background: gray;
+    color: white;
+}
+
+div.propertyItem {
+    margin: 5px;
+    border: 1px solid gray;
+    border-radius: 2px;
+    padding: 5px;
+}