comfey/comfey.css

Tiny micro mini data binding library inspired by react hook useState

.comfey-debug {
  background: rgba(22, 22, 22, 0.9);
  font-size: 14px;
  color: white;
  font-family: 'Courier New', Courier, monospace;
  position: fixed;
  width: 100%;
  height: fit-content;
  overflow-y: auto;
  left: 0;
  bottom: 0;
  text-align: left;
  padding: 10px;
  box-sizing: border-box;
  margin: 0;
  resize: both;
}
.comfey-debug h2 {
  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande',
    'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}
.comfey-debug table {
  border: 1px solid;
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}
.comfey-debug table tr {
  border-bottom: 1px solid #666;
}
.comfey-debug table th,
.comfey-debug table td {
  padding: 5px;
}
.comfey-debug table tbody th {
  border-right: 1px solid #555;
  min-width: 100px;
  color: #9bbbdc;
}
.comfey-debug table td {
  color: #f29766;
}

/* These css rules are neede for data-bind hidden/visible to work */
[data-bind-visible] {
  display: none;
}
[data-bind-visible].visible {
  display: block;
}

[data-bind-hidden] {
  display: block;
}
[data-bind-hidden].hidden {
  display: none;
}