margin.at
Write on the margins of the internet. Powered by the AT Protocol.
margin.at
extension
web
atproto
comments
scanash.com
Implement API keys for iOS shortcut, refactor Firehose ingestion to use WebSockets and CBOR, and fix mobile styles.
1.btn {
2 display: inline-flex;
3 align-items: center;
4 justify-content: center;
5 gap: 8px;
6 padding: 10px 20px;
7 font-size: 0.9rem;
8 font-weight: 500;
9 border-radius: var(--radius-md);
10 transition: all 0.15s ease;
11 white-space: pre;
12}
13
14.btn-primary {
15 background: var(--accent);
16 color: white;
17}
18
19.btn-primary:hover {
20 background: var(--accent-hover);
21 transform: translateY(-1px);
22 box-shadow: var(--shadow-md);
23}
24
25.btn-secondary {
26 background: var(--bg-tertiary);
27 color: var(--text-primary);
28 border: 1px solid var(--border);
29}
30
31.btn-secondary:hover {
32 background: var(--bg-hover);
33 border-color: var(--border-hover);
34}
35
36.btn-ghost {
37 color: var(--text-secondary);
38 padding: 8px 12px;
39}
40
41.btn-ghost:hover {
42 color: var(--text-primary);
43 background: var(--bg-tertiary);
44}
45
46.btn-bluesky {
47 background: #0085ff;
48 color: white;
49 display: flex;
50 align-items: center;
51 justify-content: center;
52 gap: 10px;
53 transition:
54 background 0.2s,
55 transform 0.2s;
56}
57
58.btn-bluesky:hover {
59 background: #0070dd;
60 transform: translateY(-1px);
61}
62
63.btn-sm {
64 padding: 6px 12px;
65 font-size: 0.85rem;
66}
67
68.btn-text {
69 background: none;
70 border: none;
71 color: var(--text-secondary);
72 font-size: 0.9rem;
73 padding: 8px 12px;
74 cursor: pointer;
75 transition: color 0.15s;
76}
77
78.btn-text:hover {
79 color: var(--text-primary);
80}
81
82.btn-block {
83 width: 100%;
84 text-align: left;
85 padding: 8px 12px;
86 color: var(--text-secondary);
87 background: var(--bg-tertiary);
88 border-radius: var(--radius-md);
89 margin-top: 8px;
90 font-size: 0.9rem;
91 cursor: pointer;
92 transition: all 0.2s;
93}
94
95.btn-block:hover {
96 background: var(--border);
97 color: var(--text-primary);
98}
99
100.btn-icon-danger {
101 padding: 8px;
102 background: var(--error);
103 color: white;
104 border: none;
105 border-radius: var(--radius-md);
106 cursor: pointer;
107 box-shadow: var(--shadow-md);
108 transition: all 0.15s ease;
109 display: flex;
110 align-items: center;
111 justify-content: center;
112}
113
114.btn-icon-danger:hover {
115 background: #dc2626;
116 transform: scale(1.05);
117}
118
119.action-buttons {
120 display: flex;
121 gap: 8px;
122 flex-wrap: wrap;
123}
124
125.action-buttons-end {
126 display: flex;
127 justify-content: flex-end;
128 gap: 8px;
129}