Dashboard updates

Former-commit-id: e6c96075892397f2033dc54edbe51b218e515e79 [formerly 842b38286f4cffdabd36c8a09f135dea50d8a750] [formerly 6db6ef19b576adc616b8209ec5ad0ef52705effa [formerly af369cdea115cf56e4f10d39fd75ca4455ff0145]]
Former-commit-id: 1cd150a4e4d4846772e460778fca006ea1105fe4 [formerly 6137ec696244fe7230db1d8c29a6eede7dee6926]
Former-commit-id: 2b82b1b5a2b3f7ff39448501089cd9860cb4707c

assets/src/css/base.css

@@ -3,7 +3,7 @@ body {
   padding-top: 4em;
   background-color: #f8f8f8;
   user-select: none;
-  color: #333;
+  color: #212121;
 }
 
 * {

assets/src/css/dashboard.css

@@ -0,0 +1,121 @@
+.dashboard {
+  max-width: 600px;
+  box-shadow: rgba(0, 0, 0, 0.06) 0px 1px 3px, rgba(0, 0, 0, 0.12) 0px 1px 2px;
+  border-radius: .5em;
+  background: #fff;
+  padding: 1em;
+  margin: 1em 0;
+}
+
+.dashboard a {
+  color: inherit
+}
+
+.dashboard h1 button {
+  font-size: 0.5em;
+  float: right;
+}
+
+.dashboard table {
+  width: 100%;
+}
+
+.dashboard table tr {
+
+}
+
+.dashboard table th {
+  font-weight: 500;
+  color: #757575;
+  text-align: left;
+}
+
+.dashboard table th,
+.dashboard table td {
+  padding: .5em 0;
+}
+
+.dashboard table td {
+
+}
+
+.dashboard table td:last-child {
+  width: 1em
+}
+
+.dashboard > *:first-child {
+  margin-top: 0;
+}
+
+.dashboard > *:last-child {
+  margin-bottom: 0;
+}
+
+form.dashboard input[type="submit"],
+.dashboard form input[type="submit"] {
+  margin-left: auto;
+  display: block;
+}
+
+.dashboard textarea,
+.dashboard input[type="text"],
+.dashboard input[type="password"] {
+  padding: 0;
+  line-height: 1.7;
+  display: block;
+  border: 0;
+  border-bottom: 1px solid #dddddd;
+  transition: .2s ease border;
+  width: 100%;
+}
+
+.dashboard #username,
+.dashboard #password,
+.dashboard #scope {
+  max-width: 18em;
+}
+
+.dashboard textarea:focus,
+.dashboard textarea:hover,
+.dashboard input[type="text"]:focus,
+.dashboard input[type="password"]:focus,
+.dashboard input[type="text"]:hover,
+.dashboard input[type="password"]:hover {
+  border-color: #2979ff;
+}
+
+.dashboard input.red {
+  border-color: red;
+}
+
+.dashboard input.green {
+  border-color: green;
+}
+
+.dashboard textarea {
+  line-height: 1.15;
+  padding: .5em;
+  border: 1px solid #ddd;
+  font-family: monospace;
+  min-height: 10em;
+  resize: vertical;
+}
+
+.dashboard p label {
+  margin-bottom: .2em;
+  display: block;
+  font-size: .8em;
+  font-weight: bold;
+}
+
+li code,
+p code {
+  background: rgba(0, 0, 0, 0.05);
+  padding: .1em;
+  border-radius: .2em;
+}
+
+.small {
+  font-size: .8em;
+  line-height: 1.5;
+}

assets/src/css/editor.css

@@ -6,7 +6,7 @@
 }
 
 #editor .CodeMirror {
-  border: 1px solid #dddddd;
+  box-shadow: rgba(0, 0, 0, 0.06) 0px 1px 3px, rgba(0, 0, 0, 0.12) 0px 1px 2px;
   margin: 2em 0;
   border-radius: .5em;
 }

assets/src/css/styles.css

@@ -5,6 +5,7 @@
 @import "./prompts.css";
 @import "./listing.css";
 @import "./editor.css";
+@import "./dashboard.css";
 
 /* * * * * * * * * * * * * * * *
  *            ACTION           *