social components
inlay.at
atproto
components
sdui
1.content {
2 min-width: 160px;
3 background: var(--bg-popover);
4 backdrop-filter: blur(20px) saturate(1.4);
5 -webkit-backdrop-filter: blur(20px) saturate(1.4);
6 border: 1px solid var(--border-8);
7 border-radius: 10px;
8 box-shadow: var(--shadow-sm);
9 padding: 6px;
10 z-index: 2001;
11 animation: dropdownIn 0.12s ease;
12}
13
14@keyframes dropdownIn {
15 from {
16 opacity: 0;
17 transform: translateY(-4px);
18 }
19 to {
20 opacity: 1;
21 transform: translateY(0);
22 }
23}
24
25.item {
26 display: block;
27 width: 100%;
28 padding: 6px 10px;
29 font-family:
30 "Rubik",
31 -apple-system,
32 sans-serif;
33 font-size: 12px;
34 font-weight: 500;
35 color: var(--fg-1);
36 background: none;
37 border: none;
38 border-radius: 6px;
39 cursor: pointer;
40 text-align: left;
41}
42.item:hover {
43 background: var(--border-8);
44}
45
46.label {
47 padding: 6px 10px;
48 font-family:
49 "Rubik",
50 -apple-system,
51 sans-serif;
52 font-size: 12px;
53 font-weight: 500;
54 color: var(--fg-2);
55 white-space: nowrap;
56 overflow: hidden;
57 text-overflow: ellipsis;
58}
59
60.sep {
61 height: 1px;
62 background: var(--border-8);
63 margin: 4px 0;
64}