social components
inlay.at
atproto
components
sdui
1.root {
2 display: flex;
3 align-items: center;
4 justify-content: center;
5 width: 18px;
6 height: 18px;
7 padding: 0;
8 background: none;
9 border: 1px solid transparent;
10 border-radius: 4px;
11 font-size: 11px;
12 color: var(--fg-3);
13 cursor: pointer;
14 transition:
15 color 0.1s,
16 border-color 0.1s,
17 background 0.1s;
18}
19.root:hover {
20 color: var(--fg-1);
21 background: var(--bg-2);
22 border-color: var(--border-10);
23}
24.root:disabled {
25 opacity: 0.3;
26 cursor: default;
27}
28.root:disabled:hover {
29 color: var(--fg-3);
30 background: none;
31 border-color: transparent;
32}
33
34.remove:hover {
35 color: var(--error, #c53030);
36}
37
38.add {
39 font-size: 13px;
40 font-weight: 600;
41 margin-left: auto;
42}
43.add:hover {
44 color: var(--accent);
45}
46
47.close {
48 width: auto;
49 height: auto;
50 padding: 2px 4px;
51 font-size: 18px;
52 line-height: 1;
53 border: none;
54}