ligo.at
decentralized and customizable links page on top of atproto
ligo.at
atproto
link-in-bio
python
uv
nauta.one
1@import url(/static/profile/default.css);
2
3:root {
4 --color-alert: #ee0000;
5 --color-background-secondary: #eee;
6 --color-border: #bbb;
7 --color-border-secondary: #ddd;
8 --color-success: #080;
9}
10
11@media (prefers-color-scheme: dark) {
12 :root {
13 --color-background-secondary: #333;
14 --color-border: #555;
15 --color-border-secondary: #333;
16 --color-success: #af2;
17 }
18}
19
20p {
21 text-wrap: pretty;
22}
23
24.wrapper {
25 max-width: 25em;
26}
27
28.wrapper.error p {
29 text-align: center;
30}
31
32h2 {
33 font-size: 1.3em;
34 font-weight: 500;
35}
36
37.link-item.static {
38 flex-grow: 1;
39 box-shadow: none;
40}
41
42.link-item.static:hover {
43 transform: none;
44}
45
46.alert {
47 color: var(--color-alert);
48}
49
50.caption {
51 font-size: 0.8em;
52}
53
54.faded {
55 color: var(--color-text-secondary);
56}
57
58button,
59input {
60 background: var(--color-background-secondary);
61 border: 1px solid var(--color-border);
62 border-radius: 2px;
63 box-sizing: border-box;
64 color: var(--color-text);
65 font: inherit;
66 font-size: 14px;
67 padding: 0.5em;
68 width: 100%;
69}
70
71button,
72input[type="submit"] {
73 font-weight: 600;
74 cursor: pointer;
75 padding: 0.25em;
76}
77
78button.submit:last-of-type,
79input[type="submit"]:last-of-type {
80 margin-top: 1em;
81}
82
83.login .authservers {
84 margin-top: 2em;
85}
86
87.login .authservers .caption {
88 display: block;
89 text-align: center;
90}
91
92.login .authservers form {
93 display: grid;
94 gap: 0.25em;
95 grid-template-columns: 1fr 1fr;
96 margin-top: 0.75em;
97}
98
99.login .authservers button {
100 font-weight: unset;
101}
102
103editor-label {
104 display: block;
105}
106
107editor-label + editor-label {
108 margin-top: 0.25em;
109}
110
111editor-label .label {
112 font-size: 14px;
113 font-weight: 700;
114 text-transform: uppercase;
115}
116
117link-editor-item {
118 display: block;
119 margin-top: 1em;
120 margin-left: -0.25em;
121 margin-right: -0.25em;
122 padding: 0.25em;
123 background: var(--color-background);
124 border: 1px solid var(--color-border-secondary);
125 border-radius: 2px;
126}
127
128link-editor-header {
129 display: flex;
130 flex-direction: row;
131 gap: 0.25em;
132}
133
134link-editor-drag-handle {
135 background: var(--color-background-secondary);
136 display: flex;
137 flex-grow: 0;
138 padding: 2px;
139 line-height: 100%;
140 font-size: 1.5em;
141 align-items: center;
142 cursor: grab;
143}
144
145link-editor-drag-handle:active {
146 cursor: grabbing;
147}
148
149link-editor-buttons {
150 display: flex;
151 flex-direction: row;
152 gap: 0.25em;
153 margin-top: 0.25em;
154}
155
156still-building {
157 background-color: var(--color-background-secondary);
158 border-radius: 2px;
159 display: block;
160}
161
162still-building .title {
163 background: repeating-linear-gradient(
164 45deg,
165 #fc0,
166 #fc0 20px,
167 #333 20px,
168 #333 40px
169 );
170 border-radius: 2px 2px 0 0;
171 color: #fff;
172 display: block;
173 font-size: 1.2em;
174 font-weight: 900;
175 padding: 0.25em;
176 text-align: center;
177 text-transform: uppercase;
178 text-shadow:
179 -1px -1px 0.5px #000,
180 1px -1px 0.5px #000,
181 -1px 1px 0.5px #000,
182 1px 1px 0.5px #000;
183}
184
185still-building p {
186 margin: 0;
187 padding: 0.5em;
188
189 &:not(:first-of-type) {
190 padding-top: 0;
191 }
192}
193
194.htmx-indicator {
195 --height: 2px;
196 height: var(--height);
197 margin: 2px 0;
198 opacity: 0;
199 visibility: none;
200}
201
202.htmx-request .progress {
203 animation: progress-bar 0.5s linear;
204 animation-fill-mode: both;
205 background: var(--color-success);
206 border-radius: calc(var(--height) / 2);
207 display: block;
208 height: var(--height);
209}
210
211@keyframes progress-bar {
212 0% {
213 width: 25%;
214 }
215 100% {
216 width: 100%;
217 }
218}
219
220form[hx-post] {
221 transition: opacity 0.2s;
222}
223
224form[hx-post].htmx-request {
225 opacity: 0.6;
226}