What is Hackers' Pub?
Hackers' Pub is a place for software engineers to share their knowledge and experience with each other. It's also an ActivityPub-enabled social network, so you can follow your favorite hackers in the fediverse and get their latest posts in your feed.



師走も2025年も最後の日やで





















![An editor window with the contents of a "Csskit Rule Sheet". The code reads:
/* check.cks */
:prefixed {
level: error;
diagnostic: "Avoid prefixed properties";
}
compound-selector:has(id) {
level: error;
diagnostic: "Avoid IDs in css selectors";
}
style-value[name=color]:not(:computed) {
level: error;
diagnostic: "Don't use literals in color style values, only our design tokens";
}
compound-selector:has(:nth-child(4)) {
level: warning;
diagnostic: "Complex selector, consider refactoring";
}](https://cdn.masto.host/indiewebsocial/media_attachments/files/115/810/227/053/226/060/original/2c67b0585a32d47b.png)

![A terminal window. The user has run the command `csskit check check.cks style.css` and the result is the following output:
× Avoid prefixed properties
╭─[test.css:3:2]
2 │ color: red;
3 │ -webkit-animation: spin 3s;
· ─────────────┬─────────────
· ╰── Avoid prefixed properties
4 │ }
╰────
× Avoid IDs in css selectors
╭─[test.css:1:1]
1 │ #a {
· ─┬
· ╰── Avoid IDs in css selectors
2 │ color: red;
╰────
× Don't use literals in color style values, only our design tokens
╭─[test.css:2:2]
1 │ #a {
2 │ color: red;
· ─────┬─────
· ╰── Don't use literals in color style values, only our design tokens
3 │ -webkit-animation: spin 3s;
╰────
⚠ Complex selector, consider refactoring
╭─[test.css:6:1]
5 │
6 │ div.b.c.d.e {
· ─────┬─────
· ╰── Complex selector, consider refactoring
7 │ color: var(--red-500);
╰────
Error: 1 files failed check!](https://cdn.masto.host/indiewebsocial/media_attachments/files/115/810/227/892/854/819/original/60539d32a434a390.png)
![A terminal window. The user has run `csskit tree style.css` and the result is the following output:
style-sheet
├─ style-rule:rule
│ ├─ selector-list:size(1)
│ │ ╰─ compound-selector
│ │ ╰─ id
│ ├─ style-value[name=color]:longhand
│ │ ╰─ style-value
│ │ ╰─ color-style-value
│ │ ╰─ color
│ ╰─ style-value[name=-webkit-animation]:unknown:prefixed
│ ╰─ style-value
╰─ style-rule:rule
├─ selector-list:size(1)
│ ╰─ compound-selector
│ ├─ tag
│ │ ╰─ html-tag
│ ├─ class
│ ├─ class
│ ├─ class
│ ╰─ class
╰─ style-value[name=color]:computed
╰─ style-value](https://cdn.masto.host/indiewebsocial/media_attachments/files/115/810/228/143/712/311/original/756b2b350347572a.png)

