toph 0.4.0

Simple server-side html generation
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

<!DOCTYPE html><html><head><style>t-stack {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

t-stack>* {
  margin-block: 0;
}

t-stack>*+* {
  margin-block-start: var(--t-stack-space);
}

t-stack:only-child {
  block-size: 100%;
}

t-stack> :nth-child(3) {
  margin-block-end: auto;
}
</style><style>.card { padding: 1rem; border: 5px solid black; }</style><style>
button {
  padding: 0.5rem 1.25rem;
  font-weight: bold;
  border: 2px solid black;
  box-shadow: 2px 2px black;
}</style><style>t-cluster {
  display: flex;
  flex-wrap: wrap;
  gap: var(--t-cluster-gap);
  justify-content: flex-start;
  align-items: center;
}
</style></head><body><t-cluster style="--t-cluster-gap: 1.096875rem;"><div class="card"><t-stack style="--t-stack-space: 1.096875rem;"><button>Hello</button><button>World</button></t-stack></div><div class="card"><t-stack style="--t-stack-space: 1.096875rem;"><button>Goodbye</button><button>World</button></t-stack></div></t-cluster></body></html>