image/text form

1 files changed, 58 insertions, 4 deletions

diff --git a/frontend/views/graph/graph.css b/frontend/views/graph/graph.css
index 73ac103..6facb9b 100644
--- a/frontend/views/graph/graph.css
+++ b/frontend/views/graph/graph.css
@@ -15,11 +15,14 @@
 
 /* Sidebar boxes */
 
-.box {
-  width: 15rem;
+.sidebar {
   position: absolute;
   top: 1rem;
   right: 1rem;
+  z-index: 2000;
+}
+.box {
+  width: 15rem;
   padding: 0.5rem;
   background: rgba(64,12,64,0.9);
   border: 2px solid #000;
@@ -36,6 +39,30 @@
   align-items: flex-start;
   margin-bottom: 0.25rem;
 }
+.box form label.checkbox {
+  flex-direction: row;
+  justify-content: flex-start;
+  align-items: center;
+}
+.box form input[type="checkbox"] {
+  margin-left: 0rem;
+}
+.box form input[type=checkbox] + span {
+  color: #ddd;
+}
+.box form input[type=checkbox]:hover + span {
+  color: #fff;
+}
+.box form input[type="checkbox"]:after {
+  border-color: #84f;
+}
+.box form input[type="checkbox"]:checked:after {
+  border-color: #84f;
+  background-color: #84f;
+}
+.box form input[type=checkbox]:hover + span {
+  color: #84f;
+}
 .box input[type=text],
 .box input[type=number],
 .box input[type=password] {
@@ -48,10 +75,37 @@
   height: 5rem;
   border-color: #888;
 }
-.box .text.description span:first-child {
-  display: none;
+.box .select {
+  padding: 0.25rem;
+  margin-right: 0;
+}
+.box .selects label {
+  flex-direction: row;
+  width: 6.5rem;
+  margin-right: 0.5rem;
+  min-width: auto;
+}
+.box form textarea {
+  padding: 0.25rem;
 }
 
+.box form .pair label span {
+  min-width: 3rem;
+  padding: 0.25rem 0;
+}
+.box .pair label {
+  flex-direction: row;
+  width: 6rem;
+  margin-right: 1rem;
+  min-width: auto;
+}
+.box .pair input[type=text] {
+  width: 3rem;
+}
+.box .position {
+  font-size: smaller;
+  margin-bottom: 0.25rem;
+}
 /* Graph handles */
 
 .handle {