App: rename directory

app-proto/full-interface/main.css

@@ -0,0 +1,96 @@
+body {
+  margin: 0px;
+  color: #fcfcfc;
+  background-color: #222;
+}
+
+/* outline */
+
+#outline {
+  float: left;
+  width: 450px;
+  height: 100vh;
+  margin: 0px;
+  padding: 0px;
+  border-width: 0px 1px 0px 0px;
+  border-style: solid;
+  border-color: #555;
+  overflow-y: scroll;
+}
+
+li {
+  user-select: none;
+}
+
+summary {
+  display: flex;
+}
+
+summary.selected {
+  color: #fff;
+  background-color: #444;
+}
+
+summary > div, .cst {
+  padding-top: 4px;
+  padding-bottom: 4px;
+}
+
+.elt, .cst {
+  display: flex;
+  flex-grow: 1;
+  padding-left: 8px;
+  padding-right: 8px;
+}
+
+.elt-switch {
+  width: 18px;
+  padding-left: 2px;
+  text-align: center;
+}
+
+details:has(li) .elt-switch::after {
+  content: '▸';
+}
+
+details[open]:has(li) .elt-switch::after {
+  content: '▾';
+}
+
+.elt-label {
+  flex-grow: 1;
+}
+
+.cst-label {
+  flex-grow: 1;
+}
+
+.elt-rep {
+  display: flex;
+}
+
+.elt-rep > div, .cst-rep {
+  padding: 2px 0px 0px 0px;
+  font-size: 10pt;
+  text-align: center;
+  width: 56px;
+}
+
+.cst {
+  font-style: italic;
+}
+
+/* display */
+
+canvas {
+  float: left;
+  margin-left: 20px;
+  margin-top: 20px;
+  background-color: #020202;
+  border: 1px solid #555;
+  border-radius: 16px;
+}
+
+canvas:focus {
+  border-color: #aaa;
+}