ef.js

Declarative DOM helper experiment

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. 7
  8. 8
  9. 9
  10. 10
  11. 11
  12. 12
  13. 13
  14. 14
  15. 15
  16. 16
  17. 17
  18. 18
  19. 19
  20. 20
  21. 21
  22. 22
  23. 23
  24. 24
  25. 25
  26. 26
  27. 27
  28. 28
  29. 29
  30. 30
  31. 31
  32. 32
  33. 33
  34. 34
  35. 35
  36. 36
  37. 37
  38. 38
.list {
  list-style: none;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  line-height: var(--v-rhythm);
  font-size: var(--font-4);

  color: var(--color-fg-dim);
}

.item > .list {
  padding-left: var(--spacing-10);
}

.link {
  border: 1px solid transparent;

  border-radius: var(--radii);
  text-decoration: none;
}
.link:hover {
  text-decoration: underline;
}
.link:focus {
  border-color: var(--color-focus);
  box-shadow: 0 0 0 var(--focus-shadow-radius) var(--color-focus-shadow);
  outline: none;
}
.link[data-current] {
  color: var(--color-fg);
  text-shadow: var(--color-fg) 0 0 1px;
}

.groupLabel::after {
  content: "/";
}